$(function() {
    if ($(".linsboxen ul.linsboxen-sub-menu") && $(".linsboxen ul.linsboxen-top-menu")) {
        var lens = $(".linsboxen ul.linsboxen-top-menu").find("li[class='active']").attr("title");
        var lensType = $(".linsboxen ul.linsboxen-sub-menu").find("li[class='active']").attr("title");
        getLenses(lens, lensType);
    }

    $(".linsboxen ul.linsboxen-top-menu li").click(function() {
        removeSelectedAttributeTop();
        $(this).addClass('active');

        var lens = $(".linsboxen ul.linsboxen-top-menu").find("li[class='active']").attr("title");
        var lensType = $(".linsboxen ul.linsboxen-sub-menu").find("li[class='active']").attr("title");
        getLenses(lens, lensType);
    });

    $(".linsboxen ul.linsboxen-sub-menu li").click(function() {
        removeSelectedAttributeSub();
        $(this).addClass('active');

        var lens = $(".linsboxen ul.linsboxen-top-menu").find("li[class='active']").attr("title");
        var lensType = $(this).attr('title');

        if (lens != "" && lensType != "") {
            getLenses(lens, lensType);
        }
    });

});

function getLenses(lens, lensType) {
    $.get('/Render/LinsboxenPriceTable?lens=' + lens + '&lensType=' + lensType,
            function(data) {
                $("#linsboxen-table").empty().fadeOut('slow');
                if (data != "") {
                    $(".compare-price").show();
                    $("#linsboxen-table").append(
                        "<table id='lenses' cellpadding='6px'>" +
                            '<thead>' +
                                '<tr>' +
                                    '<th></th>' +
                                    '<th>Antal linser' + '<br />' + 'per månad</th>' +
                                    '<th>Månadsavgift' + '<br />' + 'LinsBoxen</th>' +
			                        '<th></th>' +
                                    '<th>Pris per' + '<br />' + 'förpackning</th>' +
                                    '<th>Antal per' + '<br />' + 'förpackning</th>' +
                                '</tr></thead><tbody>' + data +
                        '</tbody></table>'
                ).hide().fadeIn('slow');

                    $("#linsboxen-table table").tablesorter({
                        sortList: [[0, 0], [2, 0]]
                    });

                    $("#linsboxen-table table").tablesorter({
                        headers: {
                            0: { sorter: false },
                            1: { sorter: false },
                            2: { sorter: false },
                            3: { sorter: false },
                            4: { sorter: false },
                            5: { sorter: false }
                        }
                    }); 

                    styleTable();

                    $("#linsboxen-table").append(
		            "<table class='footer'>" +
			            '<tr><td></td><td></td>' +
				            '<td>' +
            					'I månadsavgiften ingår alla löpande undersökningar och kontroller. Giltig i samtliga våra butiker. Motsvarar 50 kr/månad.' +
			            	'</td><td></td><td></td>' +
			            '</tr>' +
		            '</table>'
		        );
                    styleFooter();
                } else {
                    $(".compare-price").hide();
                    $("#linsboxen-table").append(
			            "<p>Det finns inga linser att visa i denna kategorin."
			            );
                }
            });
}

function removeSelectedAttributeTop() {
    //Remove selected attribute from list items
    $(".linsboxen ul.linsboxen-top-menu li").each(function() {
        if ($(this).is(".active")) {
            $(this).removeClass("active");
        }
    });
}

function removeSelectedAttributeSub() {
    //Remove selected attribute from list items
    $(".linsboxen ul.linsboxen-sub-menu li").each(function() {
        if ($(this).is(".active")) {
            $(this).removeClass("active");
        }
    });
}

function styleTable() {
    $("#linsboxen-table table#lenses tr:nth-child(odd)").css("background-color", "#F9F9F9");
    $("#linsboxen-table table#lenses tr:nth-child(odd) td").css("border-bottom", "1px solid #EAEAEA");

    $("#linsboxen-table table#lenses th").css("background-color", "#FFFFFF");

    $("#linsboxen-table table#lenses tr td:first-child").css("width", "291px");

    $("#linsboxen-table table#lenses tr th:nth-child(4)").css("width", "5px");
    
    $("#linsboxen-table table#lenses tr td:nth-child(2)").css("background-color", "#F7CCB3");
    $("#linsboxen-table table#lenses tr td:nth-child(2)").css("border", "none");

    $("#linsboxen-table table#lenses tr td:nth-child(3)").css("background-color", "#F7CCB3");
    $("#linsboxen-table table#lenses tr td:nth-child(3)").css("border", "none");

    $("#linsboxen-table table#lenses tr td:nth-child(5)").css("background-color", "#EEEEEE");
    $("#linsboxen-table table#lenses tr td:nth-child(5)").css("border", "none");

    $("#linsboxen-table table#lenses tr td:nth-child(6)").css("background-color", "#EEEEEE");
    $("#linsboxen-table table#lenses tr td:nth-child(6)").css("border", "none");

    $("#linsboxen-table table#lenses tr:nth-child(odd) td:nth-child(3)").css("background-color", "#EDB497");
    $("#linsboxen-table table#lenses tr:nth-child(odd) td:nth-child(2)").css("background-color", "#EDB497");

    $("#linsboxen-table table#lenses tr:nth-child(odd) td:nth-child(5)").css("background-color", "#E0E1E2");
    $("#linsboxen-table table#lenses tr:nth-child(odd) td:nth-child(6)").css("background-color", "#E0E1E2");

    $("#linsboxen-table table#lenses tr td:nth-child(2), td:nth-child(3), td:nth-child(5), td:nth-child(6)").css("text-align", "center");

    $("#linsboxen-table table#lenses tr th:nth-child(2), th:nth-child(3)").css("background", "url('/content/img/linsboxenTableHeaderBg.gif') repeat-x scroll left top transparent");
    $("#linsboxen-table table#lenses tr th:nth-child(2), th:nth-child(3)").css("color", "#FFFFFF");

    $("#linsboxen-table table#lenses tr th:nth-child(5), th:nth-child(6)").css("background-color", "#C9CACC");

    $(".linsboxen table.compare-price tr td:nth-child(4)").css("width", "22px");
    $(".linsboxen table.compare-price tr td:nth-child(3)").css("width", "280px");

    // BORDER
    //$("#linsboxen-table table#lenses tr td:nth-child(2)").css("border-left", "2px solid #F36F21");
    //$("#linsboxen-table table#lenses tr td:nth-child(3)").css("border-right", "2px solid #F36F21");

    //$("#linsboxen-table table#lenses tr th:nth-child(3)").css("border-right", "2px solid #F36F21");
    //$("#linsboxen-table table#lenses tr th:nth-child(2)").css("border-left", "2px solid #F36F21");
    
    //$("#linsboxen-table table#lenses tr td:nth-child(5)").css("border-left", "2px solid #000000");
    //$("#linsboxen-table table#lenses tr td:nth-child(6)").css("border-right", "2px solid #000000");

    //$("#linsboxen-table table#lenses tr th:nth-child(6)").css("border-right", "2px solid #000000");
    //$("#linsboxen-table table#lenses tr th:nth-child(5)").css("border-left", "2px solid #000000");


    //$(".linsboxen table.compare-price tr td:nth-child(3)").css("border", "2px solid #F36F21");
    //$(".linsboxen table.compare-price tr td:nth-child(3)").css("border-bottom", "none");
    //$(".linsboxen table.compare-price tr td:nth-child(5)").css("border", "2px solid #000000");
    //$(".linsboxen table.compare-price tr td:nth-child(5)").css("border-bottom", "none");
}

function styleFooter() {
    $("#linsboxen-table table.footer tr td:nth-child(4)").css("width", "5px");
    $("#linsboxen-table table.footer tr td:nth-child(3)").css("width", "98px");
    $("#linsboxen-table table.footer tr td:nth-child(1)").css("width", "60px");
    $("#linsboxen-table table.footer tr td:nth-child(2)").css("width", "87px");
    
    $("#linsboxen-table table.footer tr td:nth-child(5)").css("border-top", "none");
    $("#linsboxen-table table.footer tr td:nth-child(3)").css("border-top", "none");        

    // BORDER
    //$("#linsboxen-table table.footer tr td:nth-child(5)").css("border", "2px solid #000000");
    //$("#linsboxen-table table.footer tr td:nth-child(3)").css("border", "2px solid #F36F21");              
}