function GetDataProductOverzicht() {
    //  debugger;
    pasfiltertoe();
    
    //var url = $("#apppath").text() + "/webservice/productendatahandler.ashx?" + "&productcategorie=" + $("#productcategorie").val() + "&productsubcategorie=" + $("#productsubcategorie").val(); 
    //$.getJSON(url, "dummy", ShowProductOverzicht);
    //$.getJSON(url, "dummy", ShowProductFilters);
}

function paskleurfiltertoe(obj, kleur) {

    if ($('#' + obj.id).hasClass('filterkleuroptie_selected')) {
        $('#' + obj.id).removeClass('filterkleuroptie_selected');

    }
    else {
        $('#' + obj.id).addClass('filterkleuroptie_selected');
    }
    pasfiltertoe(false, "");
}

function pasfiltertoe() {
    pasfiltertoe(false,"");
}     

    

function pasfiltertoe(initialload,q) {

    //debugger;
    var kleurfilter = '';
    var prijsfilter = '';
    var onlinefilter = '';
    var materiaalfilter = '';
    var kleuromschrijvingfilter = '';
    var afmetingfilter = '';

    if ($('#divPrijsFilter:visible').length != 0 || initialload) {

        if ($('#Filter_5_Min').length == 1 && $('#Filter_5_Max').length == 1) {

            var prijsmin = $('#Filter_5_Min').val().replace(b2euro, "");
            var prijsmax = $('#Filter_5_Max').val().replace(b2euro, "");

            prijsfilter = "&Filter_5_min=" + prijsmin + "&Filter_5_max=" + prijsmax;
        }
    }

    if ($('#divOnlineFilter:visible').length != 0 || initialload) {
        $('.Filter_4:checked').each(function() {
            onlinefilter = onlinefilter + "&Filter_4=" + $(this).val();
        });
    }

    if ($('#divAfmetingFilter:visible').length != 0 || initialload) {
        if ($('#Filter_3').val() == undefined) {
            afmetingfilter = "&Filter_3=Alle";
        }
        else {
            afmetingfilter = "&Filter_3=" + $('#Filter_3').val();
        }
    }

    if ($('#divKleuromschrijvingFilter:visible').length != 0 || initialload) {
        $('.Filter_6:checked').each(function() {
            kleuromschrijvingfilter = kleuromschrijvingfilter + "&Filter_6=" + $(this).val();
        });
    }

    if ($('#divMateriaalFilter:visible').length != 0 || initialload) {
        $('.Filter_2:checked').each(function() {
            materiaalfilter = materiaalfilter + "&Filter_2=" + $(this).val();
        });
    }

    if ($('#divKleurFilter:visible').length != 0 || initialload) {
        $('.filterkleuroptie').each(function() {
            if ($(this).hasClass('filterkleuroptie_selected')) {
                kleurfilter = kleurfilter + '&Filter_1=' + $(this).attr("id").replace('kleurknop_', '');
            }
        });
    }

    var cultureid = $("#cultureid").text();
    var url = $("#apppath").text() + "webservice/productendatahandler.ashx?productcategorie=" + $("#productcategorie").val() + "&productsubcategorie=" + $("#productsubcategorie").val()  +"&sort=" + $("#sort").val() + prijsfilter + kleurfilter + onlinefilter + kleuromschrijvingfilter + materiaalfilter + afmetingfilter + "&cultureid=" + cultureid + "&q=" + q;
    $.getJSON(url, "dummy", ShowProductOverzicht);
}

function wisfilterkleurfilter() {

    $('.filterkleuroptie').each(function() {
        $(this).removeClass('filterkleuroptie_selected');
    });
    pasfiltertoe();
}

function wisprijsfilter() {
    
    $("#slider_range").slider('destroy');
    initslider();
    pasfiltertoe();
}

function wisfiltercheckbox(id) {
    $(".Filter_" + id).attr('checked', false);
    pasfiltertoe();
}

function wisfilterselect(id) {
    $("#Filter_" + id).val("Alle");
    pasfiltertoe();
}
// -------------------  PRODUCTEN ----------------------------------------------------- //

var currentpage;
var numberofpages;
var aantal_perpagina;
var aantal_producten;
var resultdata;
var tooonalles = false;

function ShowProductOverzicht(result) {

    //debugger;
    resultdata = result;
    aantal_producten = result.Producten.length;
    //aantal_perpagina opzoeken, vermenigvuldigen met 1 zodat het een getal wordt
    aantal_perpagina = $("#aantalperpagina").val() * 1;   //$(".productpanel").length;

    if (aantal_producten < aantal_perpagina) {
        aantal_perpagina = result.Producten.length;
    }

    if (aantal_perpagina == 0) {
        $("#divGeenProducten").show();

        // hide progress;
        $("#divProgress").hide();
        $(".panProduct").hide();
        $('.productaantalholder').hide();
    }
    else {

        $("#divGeenProducten").hide();
        $('.productaantalholder').show();

        currentpage = 1;
        if ($("#requestpagina").val() != '') {
            currentpage = $("#requestpagina").val();
            $("#requestpagina").val('');
        }

        numberofpages = Math.ceil(aantal_producten / aantal_perpagina);

        // indien slechts 1 pagina, dan geen paginering
        if (numberofpages == 1) {
            $(".paginering_top_toonalles").hide();
            $(".paginering_top_toondeel").hide();
            $(".pagineringholder").hide();
        }
        else {
            if (tooonalles) {
                // toon alles actief, paginering verbergen
                $(".paginering_top_toonalles").hide();
                $(".paginering_top_toondeel").show();
                $(".pagineringholder").hide();

                // aantallen instellen op toon alles
                aantal_producten = resultdata.Producten.length;
                aantal_perpagina = aantal_producten;

                if (aantal_producten < aantal_perpagina) {
                    aantal_perpagina = result.Producten.length;
                }
            }
            else {
                $(".paginering_top_toonalles").show();
                $(".pagineringholder").show();
            }
        }

        //pagination
        var optInit = jQuery.extend({
            items_per_page: aantal_perpagina,
            num_display_entries: 3,
            current_page: currentpage-1,
            num_edge_entries: 1,
            link_to: "#",
            prev_text: "<div>&laquo;</div>&nbsp;" + vorige_tekst,
            next_text: volgende_tekst + "&nbsp;<div>&raquo;</div>",
            ellipse_text: "...",
            prev_show_always: false,
            next_show_always: false,
            renderer: "defaultRenderer",
            callback: pageselectCallback
        });
        $(".pagineringholder").pagination(aantal_producten, optInit);

        $(".panProduct").next("br").show();
        $(".panProduct:hidden").next("br").hide();
        LoadPageData(currentpage);
    }
        
    ShowProductFilters(result, result.filtersactief);    
}

function pageselectCallback(page_index, jq) {
    LoadPageData(page_index+1);
    return false;
}

function LoadAllPageData() {

    if ($(".paginering_top_toondeel").is(":visible")) {
        $(".paginering_top_toonalles").show();
        $(".paginering_top_toondeel").hide();
        tooonalles = false;
    }
    else {
        $(".paginering_top_toonalles").hide();
        $(".paginering_top_toondeel").show();
        tooonalles = true;
    }
    
    ShowProductOverzicht(resultdata);

}

function LoadDataInPanel(j, iStart, iEnd) {

    //debugger;
    for (i = iStart; i < iEnd; i++) {
        var pp = $(".productpanel").eq(i);
        //$("#panProduct_" + i).show();
     //   debugger;
        pp.show();
        //$("#imgFotoproduct_" + i).attr("src", resultdata.Producten[j + i].AfbeeldingURL);
        $(".imgFotoproduct").eq(i).attr("src", resultdata.Producten[j + i].AfbeeldingURL);
        $(".hlProductFoto").eq(i).attr("href", resultdata.Producten[j + i].NavigatieURL);
        $(".hlProductTitel").eq(i).attr("href", resultdata.Producten[j + i].NavigatieURL);
        $(".hlMeer").eq(i).attr("href", resultdata.Producten[j + i].NavigatieURL);
        
        if (resultdata.Producten[j + i].Rel != '') {
            $(".hlProductFoto").eq(i).attr("rel", resultdata.Producten[j + i].Rel);
            $(".hlProductTitel").eq(i).attr("rel", resultdata.Producten[j + i].Rel);
            $(".hlMeer").eq(i).attr("rel", resultdata.Producten[j + i].Rel);
        }

        $(".hlProductTitel").eq(i).text(resultdata.Producten[j + i].Titel);
        
        if (resultdata.Producten[j + i].StreepPrijs == null) {
            $(".divStreepPrijs").eq(i).hide();
        }
        else {
            $(".divStreepPrijs").eq(i).text(b2euro + ' ' + resultdata.Producten[j + i].StreepPrijs);
            $(".divStreepPrijs").eq(i).show();
        }
        $(".divPrijs").eq(i).text(b2euro + ' ' + resultdata.Producten[j + i].Prijs);


        if (resultdata.Producten[j + i].Online) {
            $(".imgWinkelwagen").eq(i).show();
        }
        else {
            $(".imgWinkelwagen").eq(i).hide();
        }

        if (resultdata.Producten[j + i].ActieLogoURL == null || resultdata.Producten[j + i].ActieLogoURL.length == 0) {
            $(".imgActieLogo").eq(i).hide();
        }
        else {
            $(".imgActieLogo").eq(i).attr("src", resultdata.Producten[j + i].ActieLogoURL);
            $(".imgActieLogo").eq(i).show();
        }
    }
}

function LoadPageData(page) {
    //debugger;
    currentpage = page;

    if (page < 1) page = 1;
    if (page > numberofpages) page = numberofpages;
    
    var j = (page - 1) * aantal_perpagina;
    var max_producten = aantal_perpagina;
    if (currentpage == numberofpages && aantal_producten != aantal_perpagina) {
        max_producten = aantal_producten % aantal_perpagina;
        // indien laatste pagina precies vol is, dan levert deling 0 op, wel 27 producten tonen
        if (max_producten == 0) max_producten = 27;
    };

    //debugger;
    var n = 1;
    var iStart = 0;
    var iEnd = max_producten
    if (max_producten > 27) {
        //debugger;
        n = max_producten / 27;
        iEnd = 27; //max_producten;
        numberofpages = 1;
        currentpage = 1;
        
        while( $(".baserow").length * 27 < max_producten ){
            $(".baserow:lt(1)").clone().insertAfter(".baserow:eq(" + ($(".baserow").length - 1) + ")");
        }
        //LoadDataInPanel(j, iStart, iEnd);


        var done = false;

        jQuery.whileAsync({ delay: 10
                      , bulk: 0
                      , test: function() {

                          return !done;
                      }
                      , loop: function() {

                          if (iEnd == max_producten) {
                              done = true;
                          }

                          LoadDataInPanel(0, iStart, iEnd);
                          iStart = iEnd;
                          iEnd = iEnd + 27;
                          //debugger;
                          //$(".baserow:lt(1)").clone().insertAfter(".baserow:eq(" + ($(".baserow").length - 1) + ")");
                          if (iEnd > max_producten) iEnd = max_producten;
                      }
                      , end: function() {

                      }
        })
    }
    else {
        LoadDataInPanel(j, iStart, iEnd);
        
    }
    //debugger;
    for (i = max_producten; i < $(".productpanel").length; i++) {
        $(".panProduct").eq(i).hide();
    }
    //$(".panProduct:gt(" + max_producten - 1  + ")").hide();

    // hide progress;
    $("#divProgress").hide();

    // Tekst aantal producten
    var productaantal_start = j + 1;
    var productaantal_eind = j + aantal_perpagina;
    if (productaantal_eind > aantal_producten) { productaantal_eind = aantal_producten };
    $("#productaantal_start").text(productaantal_start);
    $("#productaantal_eind").text(productaantal_eind);
    $("#productaantal_totaal").text(aantal_producten);

    $(".panProduct").next("br").show();
    $(".panProduct:hidden").next("br").hide();
}

function FinishLoadData(max_producten) {
    
}

// -------------------  FILTERS ----------------------------------------------------- //

function ShowProductFilters(result, filter) {
    //debugger;

    $("#divKleurFilter").hide();
    $("#divKleuromschrijvingFilter").hide();
    $("#divMateriaalFilter").hide();
    $("#divAfmetingFilter").hide();
    $("#divOnlineFilter").hide();
    $("#divPrijsFilter").hide();

    if (result.Filters.length > 0) {

        var bFilterAvailable = false;
        
        for (i = 0; i < result.Filters.length; i++) {

            // KLEUR
            if ((result.Filters[i].FilterID == 1) && (result.Filters[i].Visible == true)) {
                $("#spaKleurFilter_Titel").text(result.Filters[i].Naam);
                $("#divKleurFilter").show();
                bFilterAvailable = true;
                //$("#hlKleurFilter_Wis"). iets met de wisknop?
                for (j = 0; j < result.Filters[i].Waarden.length; j++) {
                    $(".filterkleuroptie").each(function() {

                        if ($(this).val() == result.Filters[i].Waarden[j].ID) {
                            if (result.Filters[i].Waarden[j].Beschikbaar) {
                                $(this).show();
                            }
                            else {
                                $(this).hide();
                            }
                            //$(this).enabled = result.Filters[i].Waarden[j].Beschikbaar;
                        }
                    });
                }
                           
            }

            // KLEUROMSCHRIJVING
            if ((result.Filters[i].FilterID == 6) && (result.Filters[i].Visible == true)) {
                $("#spaKleuromschrijvingFilter_Titel").text(result.Filters[i].Naam);
                $("#divKleuromschrijvingFilter").show();
                bFilterAvailable = true;
                //$("#hlMateriaalFilter_Wis"). iets met de wisknop?
                for (j = 0; j < result.Filters[i].Waarden.length; j++) {
                    $(".Filter_" + result.Filters[i].FilterID).each(function() {

                        if ($(this).val() == result.Filters[i].Waarden[j].ID) {
                            $(this).attr('disabled', !result.Filters[i].Waarden[j].Beschikbaar && filter);
                            //$(this).enabled = result.Filters[i].Waarden[j].Beschikbaar;
                        }
                    });
                }

            }

            // MATERIAAL
            if ((result.Filters[i].FilterID == 2) && (result.Filters[i].Visible == true)) {
                $("#spaMateriaalFilter_Titel").text(result.Filters[i].Naam);
                $("#divMateriaalFilter").show();
                bFilterAvailable = true;
                //$("#hlMateriaalFilter_Wis"). iets met de wisknop?
                for (j = 0; j < result.Filters[i].Waarden.length; j++) {
                    $(".Filter_" + result.Filters[i].FilterID).each(function() {

                    if ($(this).val() == result.Filters[i].Waarden[j].ID) {
                        $(this).attr('disabled', !result.Filters[i].Waarden[j].Beschikbaar && filter);
                            //$(this).enabled = result.Filters[i].Waarden[j].Beschikbaar;
                        }
                    });
                }
                
            }

            // AFMETING
            if ((result.Filters[i].FilterID == 3) && (result.Filters[i].Visible == true)) {
                $("#spaAfmetingFilter_Titel").text(result.Filters[i].Naam);
                $("#divAfmetingFilter").show();
                bFilterAvailable = true;
                //$("#hlAfmetingFilter_Wis"). iets met de wisknop?
            }

            // ONLINE
            if ((result.Filters[i].FilterID == 4) && (result.Filters[i].Visible == true)) {
                $("#spaOnlineFilter_Titel").text(result.Filters[i].Naam);
                $("#divOnlineFilter").show();
                bFilterAvailable = true;
                for (j = 0; j < result.Filters[i].Waarden.length; j++) {
                    $(".Filter_" + result.Filters[i].FilterID).each(function() {

                    if ($(this).val() == result.Filters[i].Waarden[j].ID) {
                        $(this).attr('disabled', !result.Filters[i].Waarden[j].Beschikbaar && filter);
                            //$(this).enabled = result.Filters[i].Waarden[j].Beschikbaar;
                        }
                    });
                }
                //$("#hlOnlineFilter_Wis"). iets met de wisknop?
            }

            // PRIJS
            if ((result.Filters[i].FilterID == 5) && (result.Filters[i].Visible == true)) {
                $("#spaPrijsFilter_Titel").text(result.Filters[i].Naam);
                $("#divPrijsFilter").show();
                bFilterAvailable = true;
                //$("#hlPrijsFilter_Wis"). iets met de wisknop?
            }

        }

        // Titel
        if (bFilterAvailable==true) {
            $("#divFilters_Titel").show();
        }
        
    }
}

$.fn.serializeNoViewState = function() {
    return this.find("input,textarea,select,hidden")
               .not("[type=hidden][name^=__]")
               .serialize();
}