var PROPERTY_SEPARATOR = '#';
var VALUE_SEPARATOR = ';';
var VALUE_SEPARATOR_BUDGET = ';';
var inProcess = false;
var otherRequestDemand = false;
var urlHandlerProductList = "/Handlers/ProductResult.ashx";
var urlHandlerProductsToCompare = "/Handlers/ProductsToCompare.ashx";
var urlHandlerPopUpGenerator = "/Handlers/PopUpGenerator.ashx";
var urlHandlerListProductForBrand = "/Handlers/ListProductForBrand.ashx";
var urlHandlerListProductClass = "/Handlers/ListProductClass.ashx";
var timeFadeOut = $.browser.msie ? 0 : 400;
var timeFadeIn = $.browser.msie ? 0 : 200;

var SortDirection = {   ASC:"ASC", DESC:"DESC" };
var currentSortOrder =   { sort: null, sortDirection: null};

var refreshList = function(fullReload) 
{

    var divResults = "#results";
    var divPager = "#pager";
    var divPageSize = "#pageSize";
    var divDisplay = "#display";
    
    

    //Si aucune requete est en court
    if (!inProcess) 
    {
        //On precise qu'on effecture une requete
        inProcess = true;
        //Si c'est un rechargement complet, on va aussi recharger le pager
        if (fullReload)
            $(divPager).fadeOut(timeFadeOut);

        $(divResults).fadeOut(timeFadeOut, function() {
            filters.loadList(divResults, divPager, fullReload);
        });
    }
    else
        otherRequestDemand = true;        
};


var TypeDisplay = { Bloc : "Bloc", Inline : "Inline" };

var CategoryProduct = { Phone : "Phone", Contract : "Contract",Contract3g : "Contract_3g", Accessory : "Accessory",Internet : "Internet", iphoneContract : "iphoneContract", iphone : "iphone", iphoneAccessory : "iphoneAccessory" }



var filters =
{

    loadList: function(divResults, divPager, fullReload) {

        if (fullReload)
            filters.makeParameters();

        var currentProduct = null;

        $.ajax({ type: "POST", url: urlHandlerProductList, data: filters.getParameters(fullReload), dataType: "json",
            beforeSend: function() {
                $("#container-list").append($("<div id=\"loading\"><img src=\"/Content/Images/Common/ajax-loader-petit.gif\" alt=\"chargement en cours\" /></div>"));

            },
            error: function(o, errorMessage) {
                $("#loading").remove();
                $("#nbResult").empty();
                $(divResults).empty();
                $(divResults).append("Une erreur s'est produite, veuillez recharger la page ou <a href=\"/\" title=\"retourner à l'accueil\>retourner à l'accueil</a>.<br />Désolé pour la gêne occasionnée. </p>");
                $(divResults).show();
            },
            success: function(j, message) {

                $("#loading").remove();
                $(divResults).empty();
                if (fullReload) {
                    $(divPager).empty();
                    filters.currentPage = 1;
                    $("#nbResult").html(j.NbResult);

                }

                var category = filters.getCategoryEnum();

                if (j.Products.length == 0) {
                    $.ajax({ async: false, type: "GET", url: "/Content/Templates/NoResult.tpl", dataType: "text",
                        success: function(data, message) {
                            $(divResults).append(data);
                            $("#linkComparePage_top, #linkComparePage_bottom ").css("display", "none");
                        }
                    });
                }
                else {

                    var conteneur = $(divResults);
                    var header = '<p><img alt="" src="/Content/Images/ProductList/haut-bloc-produit-ligne.png" /></p>';



                    var ContractTitles = "<div class=\"classement\"><p class=\"sortable operateur\"><span class=\"text\">Opérateur</span><span class=\"fleches\">&nbsp;</span> </p> <p class=\"sortable type\"> <span class=\"text\">Type</span> <span class=\"fleches\">&nbsp;</span> </p> <p class=\"sortable nom\"> <span class=\"text\">Nom</span> <span class=\"fleches\">&nbsp;</span> </p> <p class=\"sortable nb-heures\"> <span class=\"text\">Nombres<br />d'heures</span> <span class=\"fleches\">&nbsp;</span> </p> <p class=\"sortable avantage\"> <span class=\"text\">Avantage</span> <span class=\"fleches\">&nbsp;</span> </p> <p class=\"sortable prix-mois\"> <span class=\"text\">Prix/mois</span> <span class=\"fleches\">&nbsp;</span> </p> <div class=\"comparer\"> <p class=\"txt une-ligne\">Comparer</p> <img src=\"/Content/Images/Products/img-comparer-forfait.gif\" alt=\"\" /> </div> </div>";

                    if (category == CategoryProduct.iphoneContract)
                        ContractTitles = "<div class=\"classement\"><p class=\"sortable operateur\"><span class=\"text\">Opérateur</span><span class=\"fleches\">&nbsp;</span> </p> <p class=\"sortable type\"> <span class=\"text\">Type</span> <span class=\"fleches\">&nbsp;</span> </p> <p class=\"sortable nom\"> <span class=\"text\">Nom</span> <span class=\"fleches\">&nbsp;</span> </p> <p class=\"sortable nb-heures\"> <span class=\"text\">Nombres<br />d'heures</span> <span class=\"fleches\">&nbsp;</span> </p> <p class=\"sortable avantage\"> <span class=\"text\">Avantage</span> <span class=\"fleches\">&nbsp;</span> </p> <p class=\"sortable prix-mois\"> <span class=\"text\">Prix/mois</span> <span class=\"fleches\">&nbsp;</span> </p> <div class=\"comparer\"> <p class=\"txt une-ligne\">Comparer</p> <img src=\"/Content/Images/Themes/iphone/Product/img-comparer-forfait.gif\" alt=\"\" /> </div> </div>";

                    var Contract3gTitles = "<div class=\"classement forfaits-cles3g\"> <p class=\"sortable operateur\"> <span class=\"text\">Opérateur</span> <span class=\"fleches\">&nbsp;</span> </p> <p class=\"sortable nom\"> <span class=\"text\">Nom</span> <span class=\"fleches\">&nbsp;</span> </p> <p class=\"sortable type-offre\"> <span class=\"text\">Type d'offre</span> <span class=\"fleches\">&nbsp;</span> </p> <p class=\"sortable type-conso\"> <span class=\"text\">Type de conso</span> <span class=\"fleches\">&nbsp;</span> </p> <p class=\"sortable nb-heures\"> <span class=\"text\">Nombres d'heures</span> <span class=\"fleches\">&nbsp;</span> </p> <p class=\"sortable debit\"> <span class=\"text\">Débit</span> <span class=\"fleches\">&nbsp;</span> </p> <p class=\"sortable prix-mois\"> <span class=\"text\">Prix/mois</span> <span class=\"fleches\">&nbsp;</span> </p> <div class=\"comparer\"> <p class=\"txt une-ligne\">Comparer</p> <img src=\"/Content/Images/Product/img-comparer-forfait.gif\" alt=\"\" /> </div> </div>";
                    var footer = '<p><img alt="" src="/Content/Images/ProductList/bas-bloc-produit-ligne.png" /></p>';
                    var separator = '<hr class="separateur" />';



                    //Si c'est un affichage en ligne, il y aura des images a ajouter en haut et en bas de la liste de resultats
                    if (filters.display == TypeDisplay.Inline) {
                        $(divResults).append(header);
                        conteneur = $('<div class="milieu-bloc"></div>');
                        if (category == CategoryProduct.Contract || category == CategoryProduct.iphoneContract) //si c'est la page de forfait
                            conteneur.append(ContractTitles);
                        if (category == CategoryProduct.Contract3g) //si c'est la page de forfait 3g
                            conteneur.append(Contract3gTitles);
                    }


                    //Pour chacun des produits, on récupère un template
                    for (var i = 0; i < j.Products.length; i++) {
                        currentProduct = j.Products[i];
                        $.ajax({ async: false, type: "GET", url: "/Content/Templates/" + currentProduct.TemplateFileName, dataType: "text",
                            success: function(data, message) {
                                if (currentProduct != null) {
                                    //On met en forme le produit avec un template
                                    var template = $.template(data);
                                    conteneur.append(template,
                                    {
                                        Id: currentProduct.IdProduct,
                                        Name: currentProduct.Name,
                                        UnitPrice: currentProduct.UnitPrice,
                                        DecimalPrice: currentProduct.DecimalPrice,
                                        FormattedPrice: currentProduct.FormattedContractPrice,
                                        UnitSpecialPrice: currentProduct.UnitSpecialPrice,
                                        DecimalSpecialPrice: currentProduct.DecimalSpecialPrice,
                                        Url: currentProduct.UrlProduct,
                                        DescriptionProperties: currentProduct.DescriptionProperties,
                                        Brand: currentProduct.Brand,
                                        ContractLabel: currentProduct.ContractLabel,
                                        Flag: currentProduct.Flag,
                                        ContractPictoPhone: currentProduct.ContractPictoPhone,
                                        VignetteImageFilename: currentProduct.VignetteImageFilename,
                                        StockStore: currentProduct.StockStore,
                                        StockWeb: currentProduct.StockWeb,
                                        EyeCatcher: currentProduct.EyeCatcher,
                                        Family: currentProduct.Family,
                                        ProductClassName: currentProduct.ProductClassName,
                                        ContractTerm: currentProduct.ContractTerm,
                                        ContractAdvantage: currentProduct.ContractAdvantage,
                                        ContractOperator: currentProduct.ContractOperator,
                                        StockLabel: currentProduct.StockLabel,
                                        StockStoreUrl: currentProduct.StockStoreUrl,
                                        NbMoisRenouvellement: currentProduct.NbMoisRenouvellement,
                                        NbMoisRenouvellement2: currentProduct.NbMoisRenouvellement2,
                                        UnitPrice2: currentProduct.UnitPrice2,
                                        DecimalPrice2: currentProduct.DecimalPrice2,
                                        ContractImage: currentProduct.ContractImage,
                                        ContractOperator2: currentProduct.ContractOperator2,
                                        CategoryUniqueId: currentProduct.CategoryUniqueId
                                    });

                                    if (filters.display == TypeDisplay.Inline && i + 1 < j.Products.length)
                                        conteneur.append(separator);
                                }
                            }
                        });
                    }

                    if (filters.display == TypeDisplay.Inline) {
                        $(divResults).append(conteneur);
                        $(divResults).append(footer);
                    }

                    $("#linkComparePage_top, #linkComparePage_bottom ").css("display", "block");


                }

                //On créé le pager 
                if (j.NbPage > 1)
                    CreatePager(divPager, filters.currentPage, j.NbPage);


                //On met la bonne fleche pour le tri
                $(".classement .sortable").each(function(i, item) {
                    item = $(item);
                    item.find("span.fleches").removeClass("on-gauche");
                    item.find("span.fleches").removeClass("on-droite");

                    if (currentSortOrder.sort != null && currentSortOrder.sortDirection != null && item.hasClass(currentSortOrder.sort)) {
                        if (currentSortOrder.sortDirection == SortDirection.ASC)
                            item.find("span.fleches").addClass("on-droite");
                        else
                            item.find("span.fleches").addClass("on-gauche");
                    }

                });

                $(divResults).fadeIn(timeFadeIn, function() {
                    createSortOrderHeader();
                    initCompareCheckbox();
                    initQuickZoom();

                    //On regle la hauteur de la div contenant la liste de resultats
                    setHeightContainerList();

                });


                if (fullReload)
                    $(divPager).fadeIn(timeFadeIn);

                //On précise que la reque est fini
                inProcess = false;

                if (otherRequestDemand) {
                    otherRequestDemand = false;
                    refreshList(true);
                }

            }
        });
    },

    //Créé la chaine qui sera passée par URL pour le parametre "properties"
    getProperties: function() {
        var property = "";
        for (var i = 0; i < filters.propriete.length; i++) {
            if (filters.propriete[i] != null) {
                property += filters.propriete[i][0] + "=" + filters.propriete[i][1];
                if ((i + 1) < filters.propriete.length)
                    property += PROPERTY_SEPARATOR;
            }
        }
        return property;
    },

    //Créé la chaine qui sera passée par URL pour le parametre "agregation"
    getAgregation: function() {
        var agregat = "";
        for (var i = 0; i < filters.agregat.length; i++) {
            if (filters.agregat[i] != null) {
                agregat += filters.agregat[i];
                if ((i + 1) < filters.agregat.length)
                    agregat += PROPERTY_SEPARATOR;
            }
        }
        return agregat;
    },

    getBudget: function() {
        var budget = "";
        for (var i = 0; i < filters.budget.length; i++) {
            if (filters.budget[i] != null) {
                budget += filters.budget[i];
                if (filters.budget[i + 1] != null)
                    budget += VALUE_SEPARATOR_BUDGET;
            }
        }
        return budget;

    },

    getCategoryProduct: function() {
        var categoryVal = $("input[type='hidden'][class='categoryProduct']");

        if (categoryVal.length == 1)
            filters.categoryProduct = categoryVal.val();

        return filters.categoryProduct;

    },

    getCategoryEnum: function() {
        var categoryVal = $("input[type='hidden'][class='categoryEnum']");

        if (categoryVal.length == 1)
            return categoryVal.val();
        else
            return "phone";

    },

    getIdProduct: function() {
        var select = $("#listProductBrand");
        if (select.length == 1)
            return select.val();
        //Cas pour changer de mobile
        else if ($("input[type='hidden'][id='idProduct']").length == 1)
            return $("input[type='hidden'][id='idProduct']").val();

        return null;
    },

    getIdProductClass: function() {
        var select = $(".slistProductClass");
        if (select.length == 1)
            return select.val();

        return null;
    },

    getPointsNumber: function() {
        var select = $("input[type='hidden'][id='pointsNumber']");
        if (select.length == 1)
            return select.val();
        return null;
    },

    getThemes: function() {
        var result;
        //Teenager
        var sTeenager = $("div.offres-jeunes");
        var hfParentAdo = $("#parentAdo");
        //Theme
        var item = $("#sTheme");
        result = item.val();

        //si pas de theme result à null
        if (result == "-1") {
            result = null;
        }

        if (sTeenager.length > 0) {
            if (result != null)
                result += ";Teenager"
            else
                result = "Teenager";
        }
        else if (hfParentAdo.length > 0) {
            if (result != null)
                result += ";ParentAdos"
            else
                result = "ParentAdos";
        }


        return result;
    },

    //Créé l'objet "parameters" qui sera passé en GET lors de la requete AJAX par JQuery
    getParameters: function(fullReload) {
        var propertyVal = filters.getProperties();
        var agregatVal = filters.getAgregation();
        var budgetVal = filters.getBudget();
        var categoryVal = filters.getCategoryProduct();
        var cultureVal = filters.culture;
        var pageSizeVal = filters.pageSize;
        var currentPageVal = filters.currentPage;
        var displayVal = filters.display;
        var sortVal = filters.sort;

        var themeVal = filters.getThemes();

        var idProductVal = filters.getIdProduct();
        var idProductClassVal = filters.getIdProductClass();
        var pointsNumberVal = filters.getPointsNumber();

        if (budgetVal.length > 0) {
            if (propertyVal.length > 0)
                if (agregatVal.length > 0)
                return { idProductClass: idProductClassVal, idProduct: idProductVal, full: fullReload, sort: sortVal, theme: themeVal, display: displayVal, category: categoryVal, culture: cultureVal, currentPage: currentPageVal, pageSize: pageSizeVal, budget: budgetVal, properties: propertyVal, agregations: agregatVal, pointsNumber: pointsNumberVal };
            else
                return { idProductClass: idProductClassVal, idProduct: idProductVal, full: fullReload, sort: sortVal, theme: themeVal, display: displayVal, category: categoryVal, culture: cultureVal, currentPage: currentPageVal, pageSize: pageSizeVal, budget: budgetVal, properties: propertyVal, pointsNumber: pointsNumberVal };
            else
                if (agregatVal.length > 0)
                return { idProductClass: idProductClassVal, idProduct: idProductVal, full: fullReload, sort: sortVal, theme: themeVal, display: displayVal, category: categoryVal, culture: cultureVal, currentPage: currentPageVal, pageSize: pageSizeVal, budget: budgetVal, agregations: agregatVal, pointsNumber: pointsNumberVal };
            else
                return { idProductClass: idProductClassVal, idProduct: idProductVal, full: fullReload, sort: sortVal, theme: themeVal, display: displayVal, category: categoryVal, culture: cultureVal, currentPage: currentPageVal, pageSize: pageSizeVal, budget: budgetVal, pointsNumber: pointsNumberVal };
        }
        else {
            if (propertyVal.length > 0)
                if (agregatVal.length > 0)
                return { idProductClass: idProductClassVal, idProduct: idProductVal, full: fullReload, sort: sortVal, theme: themeVal, display: displayVal, category: categoryVal, culture: cultureVal, currentPage: currentPageVal, pageSize: pageSizeVal, properties: propertyVal, agregations: agregatVal, pointsNumber: pointsNumberVal };
            else
                return { idProductClass: idProductClassVal, idProduct: idProductVal, full: fullReload, sort: sortVal, theme: themeVal, display: displayVal, category: categoryVal, culture: cultureVal, currentPage: currentPageVal, pageSize: pageSizeVal, properties: propertyVal, pointsNumber: pointsNumberVal };
            else
                if (agregatVal.length > 0)
                return { idProductClass: idProductClassVal, idProduct: idProductVal, full: fullReload, sort: sortVal, theme: themeVal, display: displayVal, category: categoryVal, culture: cultureVal, currentPage: currentPageVal, pageSize: pageSizeVal, agregations: agregatVal, pointsNumber: pointsNumberVal };
            else
                return { idProductClass: idProductClassVal, idProduct: idProductVal, full: fullReload, sort: sortVal, theme: themeVal, display: displayVal, category: categoryVal, culture: cultureVal, currentPage: currentPageVal, pageSize: pageSizeVal, pointsNumber: pointsNumberVal };
        }

    },

    //Récupère toutes les valeurs dans le formulaire
    makeParameters: function() {
        filters.propriete = new Array();
        filters.agregat = new Array();
        filters.budget = new Array();


        var cptProperty = 0;
        var cptAgregat = 0;

        $("#filter div").each(function(i, item) {

            var typeValue = $(item).children("input[type='hidden'][class='type']");
            var keyParameter = $(item).children("input[type='hidden'][class='key']");

            if (typeValue.length > 0) {
                switch (typeValue.val()) {
                    case "Budget":
                        $(item).each(function(iList, itemList) {
                            var cbList = $(itemList).find("input:checked");
                            cbList.each(function(j, jitem) {
                                filters.budget[j] = $(jitem).val();
                            });

                        });
                        break;

                    case "Family":
                    case "FamilyContract":
                    case "FamilyContract3g":
                    case "Property":
                        var property = new Array();
                        property[0] = keyParameter.val();

                        //On récupère la valeur
                        //                        var valueProp = $(item).find("select");

                        //                        else //Liste de checkbox et radioButton
                        //                        {
                        var valueProp = $(item).find("input:checked");
                        if (valueProp.length > 0) {
                            var resultProp = "";

                            valueProp.each(function(iVal, itemVal) {
                                resultProp += $(itemVal).val();
                                if ((iVal + 1) < valueProp.length)
                                    resultProp += VALUE_SEPARATOR;
                            });

                            if (resultProp.length > 0) {
                                property[1] = resultProp;
                                filters.propriete[cptProperty] = property;
                                cptProperty++;
                            }
                        }
                        else {
                            valueProp = $(item).find("select").not(".notParam");
                            if (valueProp.length == 1) //Liste Select
                            {
                                property[1] = valueProp.val();
                                filters.propriete[cptProperty] = property;
                                cptProperty++;
                            }
                        }
                        //}
                        break;

                    case "Agregation":
                        //On récupère la valeur
                        var valueAgre = $(item).find("input:checked");
                        if (valueAgre.length > 0) {
                            var resultAgre = "";
                            valueAgre.each(function(iVal, itemVal) {
                                resultAgre += $(itemVal).val();
                                if ((iVal + 1) < valueAgre.length)
                                    resultAgre += PROPERTY_SEPARATOR;
                            });

                            if (resultAgre.length > 0) {
                                filters.agregat[cptAgregat] = resultAgre;
                                cptAgregat++;
                            }
                        }
                        break;


                    default:
                        break;
                }

            }
        });
    },

    propriete: new Array(),

    agregat: new Array(),

    pageSize: 9,

    display: TypeDisplay.Bloc,

    currentPage: 1,

    categoryProduct: 1,

    budget: new Array(),

    culture: "fr-FR",

    sort: "date",

    theme: "-1"


}    



function setHeightContainerList()
{
    var height = $("#results").height();
    
    if (filters.display == TypeDisplay.Inline)
        height += 20;
    $("#container-list").css("height", height);
 
}

// Initialise les click sur les loupe pour le QuickZoom
function initQuickZoom()
{
    $(".liste .produit").each(function(i, item)
    {
        item = $(item);
        var idProduct = 0;
        if (item.find("input[type='checkbox']").length > 0)
            idProduct = item.find("input[type='checkbox']").val();
        else
            idProduct = item.find("input[type='hidden']").val();
        
        item.find(".zoom").click(function() 
        {
            var reg = new RegExp("idForfait=[0-9]+","g");
            var regSplit = new RegExp("[=]+","g");
            var value = reg.exec(item.find("h2 a").attr("href"));
            var kvp = new String(value).split(regSplit);
            idContract = 0;
            if(kvp.length > 1)
                idContract = kvp[1];
                
            showPopUp(urlHandlerPopUpGenerator,{ WucType : "QuickLook", IdProduct : idProduct, IdContract : idContract},"POST");
            return false;
        });
    });
}

//Initilise les checkbox de chacune des "petites" fihe produit dans le resultat de la recherche
function initCompareCheckbox()
{
    var idAlreadyInSession = new Array();
    
    var category = filters.getCategoryEnum();

    $.ajax({ type: "POST", url: urlHandlerProductsToCompare, data: { get: true, type: category }, dataType: "json", cache: false, success: function(result, message) {
        if (result != null)
            idAlreadyInSession = result;


        $(".liste .produit input[type='checkbox']").each(function(i, item) {
            item = $(item);
            if (!item.hasClass("designed")) {
                //On check les checkbox qui donc l'id produit est deja en session
                if ((jQuery.inArray(parseInt(item.val()), idAlreadyInSession) != -1) && !item[0].checked)
                    item.click();

                //On change le design des checkbox
                if (category == CategoryProduct.iphone || category == CategoryProduct.iphoneContract) 
                {
                    item.checkize(
                    {
                        checked: "/Content/Images/Themes/iphone/Forms/checkbox-checked.png",
                        unchecked: "/Content/Images/Themes/iphone/Forms/checkbox-not-checked.png"
                    });
                }
                else 
                {                    
                    item.checkize(
                    {
                        checked: "/Content/Images/Forms/Common/checkbox-checked.png",
                        unchecked: "/Content/Images/Forms/Common/checkbox-not-checked.png"
                    });
                }
                item.change(function() {
                    currentItem = $(this);
                    $.ajax({ type: "POST", url: urlHandlerProductsToCompare, data: { idProduct: currentItem.val(), type: category }, dataType: "json", success: function(j, message) {
                        if (j.length > 0) {
                            var position = jQuery.inArray(parseInt(currentItem.val()), j);

                            //Si apres un click, l'id ne figure pas dans la liste, c'est soit il vient d'être supprimé, soit la liste est déjà pleine
                            if (position == -1) {
                                //La liste est deja pleine
                                if (j.length == 4 && currentItem[0].checked) {
                                    alert("Vous ne pouvez pas choisir plus de 4 produits à comparer.");
                                    currentItem.parent().find("img").click();
                                }
                            }
                        }
                    }
                    }); //Fin de getJSON
                }); //Fin de Change
            } //Fin de if
        }
        ); //fin de each        
    }
    });  //FinJson
}

function CreatePager(divPager, currentPage, nbPage)
{

    PageClick = function(pageClickedNumber) 
    {
        filters.currentPage = pageClickedNumber;
        var targetOffset = $(".menu").offset().top;
        $('html,body').animate({scrollTop: targetOffset}, 600);


        refreshList(false);
    };
    $(divPager).pager({ pagenumber: filters.currentPage, pagecount: nbPage, buttonClickCallback: PageClick });
}

function createSortOrderHeader()
{
    $(".classement .sortable").css("cursor", "pointer");
    
    //S'il y a une entete colone (page forfait)
    if ($(".classement").length > 0)
    {
        $(".classement .sortable").click(function()
        {
            var sort = $(this).attr("class").replace("sortable ","");
           
            if (currentSortOrder.sort == null)
            {
                currentSortOrder.sort = sort;
                currentSortOrder.sortDirection = SortDirection.ASC;
            }
            else
            {
                if (currentSortOrder.sort == sort)
                {
                    if (currentSortOrder.sortDirection == SortDirection.ASC)
                        currentSortOrder.sortDirection = SortDirection.DESC;
                    else
                        currentSortOrder.sortDirection = SortDirection.ASC;
                }
                else
                {
                    currentSortOrder.sort = sort;
                    currentSortOrder.sortDirection = SortDirection.ASC;
                }
            }
            
            filters.sort  = currentSortOrder.sort + " " + currentSortOrder.sortDirection;
            refreshList(false);
        });
        
    }
}







$(document).ready(function() {

    //On stylise les select
    $(".body select").selectbox();

    //Cache le bouton de validation si le JS est activé
    $(".no-js").each(function(i, item) { $(item).css("display", "none"); });


    //On récupère le nombre de résultat par page courant
    if ($("#pageSize").length > 0)
        filters.pageSize = $("#pageSize input.actif").val();

    //On récupère le type d'affichage s'il existe
    filters.display = $("#display input:hidden").val();


    //On met en place les évenements pour les changements qui interviennent dans la liste des filtres
    $("#filter input[type='radio'].cbCommon").change(function() { refreshList(true); });
    $("#filter input[type='checkbox']").change(function() { refreshList(true); });


    //lorsque l'on clique sur l'un des boutons pour changer d'affichage
    $("#display .picto-lignes").click(function() {
        if (filters.display != TypeDisplay.Inline) {
            filters.display = TypeDisplay.Inline;
            $("#display .picto-colones").removeClass("actif");
            $(this).addClass("actif");
            refreshList(false);
        }
        return false;
    });

    $("#display .picto-colones").click(function() {
        if (filters.display != TypeDisplay.Bloc) {
            $("#display .picto-lignes").removeClass("actif");
            $(this).addClass("actif");
            filters.display = TypeDisplay.Bloc;
            refreshList(false);
        }
        return false;
    });

    //Lorsque l'on clique sur un bouton pour changer le nombre de résultats par page
    $("#pageSize input").click(function() {
        if (filters.pageSize != $(this).val()) {
            $("#pageSize input").each(function() {
                $(this).removeClass("actif");
            });

            $(this).addClass("actif");

            filters.pageSize = $(this).val();

            refreshList(true);
        }
        return false;
    });




    //On rend les colonne triable
    createSortOrderHeader();

    //On donne l'evenement sur le changement de valeur du select pour le tri
    $("#sSort").change(function() {
        var item = $(this);
        filters.sort = item.val();
        refreshList(true);
    });


    $("#sTheme").change(function() {
        var item = $(this);
        filters.theme = item.val();
        refreshList(true);

    });

    //On cache les boutons compare s'il n'y a pas de résultats
    if ($("p.comparer, td.comparer").length == 0)
        $("#linkComparePage_top, #linkComparePage_bottom ").css("display", "none");

    //On met en forme le selecteur de couleur
    colorSelector("#filter .couleurs");


    //On créé le pager uniquement si le change input en hidden est présent
    if ($("#pager input:hidden").length > 0)
        CreatePager("#pager", filters.currentPage, $("#pager input:hidden").val());

    var category = filters.getCategoryEnum();

    //Affiche des CheckBox et RadioButton personnalisées (design)
    if (category == CategoryProduct.iphone || category == CategoryProduct.iphoneContract ) 
    {
        $("#filter .cbCommon").checkize(
        {
            checked: "/Content/Images/Themes/iphone/Forms/checkbox-checked.png",
            unchecked: "/Content/Images/Themes/iphone/Forms/checkbox-not-checked.png"
        });
        $("#filter .rblBrand input[type='radio']").checkize(
        {
            checked: "/Content/Images/Themes/iphone/Forms/checkbox-checked.png",
            unchecked: "/Content/Images/Themes/iphone/Forms/checkbox-not-checked.png"
        });
    
    }
    else 
    {                    
        $("#filter .cbCommon").checkize(
        {
            checked: "/Content/Images/Forms/Common/checkbox-checked.png",
            unchecked: "/Content/Images/Forms/Common/checkbox-not-checked.png"
        });
        $("#filter .rblBrand input[type='radio']").checkize(
        {
            checked: "/Content/Images/Forms/Common/checkbox-checked.png",
            unchecked: "/Content/Images/Forms/Common/checkbox-not-checked.png"
        });
    
    
    }
    //Regle la haute de la du conteneur pour évité de voir le pager remonté pendant un chargement
    setHeightContainerList();

    //Pour la page accessoire, dans le filter on a 1 select qui permet de récupérer la liste des mobile pour une marque donnée
    $("#filter .ddlBrand").change(function() {
        var item = $(this);
        var newSelect = $("<select id=\"listProductBrand\"></select>");
        var linkPopup = $("<p><a class=\"pointer\" id=\"linkPopupListModel\">Voir les modèles en image</a></p>");
        if (item.val() != -1) {
            $.ajax({ type: "POST", url: urlHandlerListProductForBrand, data: { brand: item.val(), category: 1, culture: filters.culture }, dataType: "json", cache: false, success: function(result, message) {
                //On supprime la div si elle existe deja
                $("#listProductBrand").remove();
                $("#llistProductBrand").remove();
                $("#linkPopupListModel").remove();

                if (result != null && result.length > 0) {

                    newSelect.append("<option value=\"-1\">Votre téléphone</option>");
                    for (var i = 0; i < result.length; i++) {
                        newSelect.append("<option value=\"" + result[i].IdProduct + "\">" + result[i].Name + "</option>");
                    }
                    item.after(newSelect);
                    linkPopup.click(function(e) {
                        e.preventDefault();
                        showPopUp(urlHandlerPopUpGenerator, { WucType: "ViewListMobileModel", BrandName: item.val() }, "POST");
                        return false;

                    });
                    $("#listProductBrand").after(linkPopup);
                }
                else {
                    var newLabel = $("<label id=\"llistProductBrand\" class=\"question\">Pas de mobile disponible pour cette marque</label>");
                    item.after(newLabel);
                }

                $("#listProductBrand").change(function() {
                    if ($(this).val() != -1)
                        refreshList(true);
                    else {
                        $("#listMobile").remove();
                        $("#listProductBrand").remove();
                        $("#llistProductBrand").remove();
                        $("#linkPopupListModel").remove();
                    }

                });
            } 
            });
        }
        else {
            $("#listMobile").remove();
            $("#listProductBrand").remove();
            $("#llistProductBrand").remove();
            $("#linkPopupListModel").remove();
            refreshList(true);
        }
    });

    //For the iphone boutique
    $("#listProductBrand").change(function() {
        if ($(this).val() != -1)
            refreshList(true);
        else {
            /*$("#listMobile").remove();
            $("#listProductBrand").remove();
            $("#llistProductBrand").remove();
            $("#linkPopupListModel").remove();*/
        }

    });

    //Pour la page accessoire, Filtre famille/Sous famille
    $(".ddlProductClass").change(function() {
        var item = $(this);
        var newDiv = $("<div id=\"dlistProductClass\" class=\"filter-item\"></div>");
        var hfType = $("<input name=\"hfType\" type=\"hidden\" id=\"hfTypeFamily\" class=\"type\" value=\"Property\" />");
        var hfKey = $("<input name=\"hfKey\" type=\"hidden\" id=\"hfKeyFamily\" class=\"key\" value=\"IdProductClass\" />");
        newDiv.append(hfType).append(hfKey);

        var newSelect = $("<select class=\"slistProductClass\"></select>");
        var newLabel = $("<label id=\"llistProductClass\" for=\"slistProductBrand\" class=\"question\"></label>");
        if (item.val() != -1) {
            $.ajax({ type: "POST", url: urlHandlerListProductClass, data: { Family: item.val(), category: 1, culture: filters.culture }, dataType: "json", cache: false, success: function(result, message) {
                //On supprime la div si elle existe deja
                $("#dlistProductClass").remove();

                if (result != null && result.length > 0) {
                    newSelect.append("<option value=\"-1\">Choisissez</option>");
                    for (var i = 0; i < result.length; i++) {
                        newSelect.append("<option value=\"" + result[i].Value + "\">" + result[i].Text + "</option>");
                    }
                    newLabel.append("Précisez votre recherche:");
                    newDiv.append(newLabel);
                    newDiv.append(newSelect);
                }

                $("#filter .filter-item.productClass:first").after(newDiv);
                $(".slistProductClass").change(function() {
                    if ($(this).val() != -1)
                        refreshList(true);
                });
            } 
            });
        }
        else {
            $("#dlistProductClass").remove();
            refreshList(true);
        }
    });

    if ($(".slistProductClass").length > 0) {
        $(".slistProductClass").change(function() {
            if ($(this).val() != -1)
                refreshList(true);
        });
    }


    //Si la liste de résultat vient du cacheNavigateur
    //    var lastTime = $("input[type='hidden'].refresList");
    //    if (lastTime.length > 0)
    //    {
    //        lastTime = $(lastTime).val();
    //        var date = new Date();
    //        var currentTime= date.getSeconds();
    //        var diff = Math.abs(currentTime - parseInt(lastTime));
    //        if ( diff > 5)
    //            refreshList(true);
    //    } 
    //        else {
    //        $("input[type='hidden'].refresList")
    //        }
});