$(document).ready(function () {

    

    //Tabs
    $("#tabs").tabs();

    //Paging
    $("ul.paging").quickPager({ pageSize: "6" });

    //Visa alla
    $('.paging_showall').click(function () {
        $("ul.paging li").css("display", "list-item");
        $("ul.simplePagerNav li").removeClass("currentPage");
    });
    $('div#Utrustningsnivaer .paging_showall').hide();

    //Ta bort jämför på alla
    $("ul.tab_menu li a").click(function () {
        $('ul.paging li input.comparebox:').attr('checked', false);
        $("div#Farger ul.paging li").css("display", "none");
        $("div#Handtag ul.paging li").css("display", "none");
        $("div#Frasningar ul.paging li").css("display", "none");
        $("div#Farger ul.paging li:lt(6)").css("display", "list-item");
        $("div#Handtag ul.paging li:lt(6)").css("display", "list-item");
        $("div#Frasningar ul.paging li:lt(6)").css("display", "list-item");
    });


    //Jämför
    $("a#compare").click(function () {
        // loop through each row within the tbody tag
        $('ul.paging li').each(function () {
            // if row contains an input that is not checked, hide or remove row
            if ($(this).find('input.comparebox:not(:checked)').length == 1) {
                $(this).hide(); // to remove, use $(this).remove();
            }
        });
        $('ul.paging li input.comparebox:').attr('checked', false);
    });



    //Byter ut den stora bilden när man klickar på den lilla bilden. 
    $("figure.small_item a").click(function () {
        //Sparar denna färgs exempelkökbilds src som hrefkitchen
        var $hrefkitchen = $(this).parent('figure').parent('li').children('div.kitchen_img').children('img').attr('src');

        //Byter ut Exempelköketstart mot denna färsgs exempelkökbild 
        $('figure#product_kitchen_picture').animate({
            opacity: 0
        }, {
            duration: 200,
            complete: function () {
                $('figure#product_kitchen_picture').children('img').attr({
                    src: $hrefkitchen
                });
                $('figure#product_kitchen_picture').animate({
                    opacity: 1
                }, {
                    duration: 200,
                    complete: function () {

                    }
                }

                );

            }


        });
        //Ta bort class="selected" på alla smallbilder
        $("figure.small_item").removeClass("selected");
        $("figure.big_item").removeClass("selected");
        $("span.choose").show();
        //Lägger till class="selected" på den valda färgen. Detta för att få den blåa ramen runt. 
        $(this).parent('figure.small_item').addClass("selected");
        $(this).children('span.choose').fadeOut();
    });


    //Byter ut den stora bilden 
    $("figure.big_item a").click(function () {
        //Sparar färgbildens src som hrefcolor
        var $hrefcolor = $(this).children('img').attr('src');
        //Sparar denna färgs exempelkökbilds src som hrefkitchen
        var $hrefkitchen = $(this).parent('figure').parent('li').children('div.kitchen_img').children('img').attr('src');

        //Byter ut Exempelköketstart mot denna färsgs exempelkökbild 
        $('figure#product_kitchen_picture').animate({
            opacity: 0
        }, {
            duration: 200,
            complete: function () {
                $('figure#product_kitchen_picture').children('img').attr({
                    src: $hrefkitchen
                });
                $('figure#product_kitchen_picture').animate({
                    opacity: 1
                }, {
                    duration: 200,
                    complete: function () {

                    }
                }

                );

            }


        });
        //Ta bort class="selected" på alla smallbilder
        $("figure.big_item").removeClass("selected");
        $("figure.small_item").removeClass("selected");
        //Lägger till class="selected" på den valda färgen. Detta för att få den blåa ramen runt. 
        $(this).parent('figure.big_item').addClass("selected");
    });

    //Popup
    $('a.popup_iframe').colorbox({ width: "930px", height: "531px", iframe: true, initialWidth: "10px", initialHeight: "10px" });
    //    $('a.popup_data').click(function () {
    //        alert('test');
    //    });
    $('a.popup_data').colorbox({ inline: true, opacity: 0, initialWidth: "10px", initialHeight: "10px" });

    //Click on an ancholink, scroll to the topp
    $(".scroll").click(function (event) {
        //prevent the default action for the click event
        event.preventDefault();

        //get the full url - like mysitecom/index.htm#home
        var full_url = this.href;

        //split the url by # and get the anchor target name - home in mysitecom/index.htm#home
        var parts = full_url.split("#");
        var trgt = parts[1];

        //get the top offset of the target anchor
        var target_offset = $("#" + trgt).offset();
        var target_top = target_offset.top;

        //goto that anchor by setting the body scroll top to anchor top
        $('html, body').animate({ scrollTop: target_top }, 500);
    });
});