var products = new Array(); // Tableau contenant les produts a afficher apres filtre
var nbPdtsParPage = 15;  // Nombre de produits par page
var pageActive = 1; // 1ere page selectionnee
var nbMaxPages = 5; // Nombres de pages maximum affichees dans la pagination (>= 5)
var refPrdHero = ''; // Reference du produit hero
var modeMosai = true; // Definit le mode d affichage (mode mosaique par defaut)


/******************************************************************************************************************************************/
// Fonction permettant d afficher les produits heros
function getAffichageProduitHero(tab){
    if (tab.length > 0){
            refPrdHero = tab[0].substr(tab[0].indexOf('_') + 1);
            listeModelesItoolArray.remove(refPrdHero);
            if(getBlocHtml('disponibilite-hero_' + refPrdHero) == '') setBlocByHtml('disponibilite-hero_' + refPrdHero, libStock2);
    }
 }

/**************************************************************************************************************/	
/* Fonction appellee dans le cas ou erep ne repond pas, elle permet d afficher tous les modeles presents dans itool */
function displayFamilyProducts(){
    for(var i=0;i<listeModelesItoolArray.length();i++){
        tabPrd[i] = new Array();
        tabPrd[i][0] = 'product-famille_'+listeModelesItoolArray.get(i);
        tabPrd[i][1] = getBlocHtml('libelleMarque_'+listeModelesItoolArray.get(i));
        tabPrd[i][2] = 0;
        setBlocByHtml('disponibilite-famille_'+listeModelesItoolArray.get(i), '> ' + libStock2);
    }
    typeTri = '';
    
    hideBloc("triPrixAsc");
    hideBloc("triPrixDesc");
    hideBloc("filtrer-prix");
    remplissagePage();
}

/*************************************************************************************************************************************************************************/
/* Fonction permettant de remplir la page  lors de son chargement initial */
function remplissagePage() {
    // Mise en forme du bloc tri
    var selectTri = document.getElementById('trierFamille');
    var labelTri = selectTri.previousSibling;
    var text = labelTri.innerHTML;
    labelTri.innerHTML = text.replace(' ','<br/>');
    if(labelTri.offsetWidth <= 46) labelTri.className = "fix-width";
    labelTri.innerHTML = text.replace('<br/>',' ');
    labelTri.style.visibility = 'visible';
    selectTri.style.visibility = 'visible';

    synchroItoolErep(); // Synchronisation des donnees entre erep et itool
    products = tabPrd; // On initialise les produtis a afficher a : tous les produits
    
    hideBloc("affWait"); // barre de chargement

    // Recuperation des infos gardees dans le cookie famille et affichage des produits
    checkCookieFamille();

    showBlocIfCookieFamille(cookieMagasin) // Remplissage des infos dependant du cookie
    var dateVeille = getDateVeilleEnFonctionDuFormat(formatDate);
    setBlocByHtml("date", " " + dateInfoLegale+" "+dateVeille+".");
}

/**************************************************************************************************************/	
/* Fonction permettant de synchroniser les donnees entre erep et itool pour que le tableau tabPrd ne contienne que les produits presents a la fois dans itool et erep (Intersection des deux tableaux) */
function synchroItoolErep(){
    var tabPrdTemp = new Array;
    var refToFind = '';

    //Parcours du tableau de donnees issu de eRep
    for (var k = 0;k < tabPrd.length;k++){
        refToFind = tabPrd[k][0].substr(tabPrd[k][0].indexOf('_') + 1);
        if (listeModelesItoolArray.contains(refToFind) != -1) tabPrdTemp.push(tabPrd[k]);
    }
    tabPrd = tabPrdTemp;
}

/************************************************************************************************************************************************************************/
/* Fonction permettant d'afficher la pagination */
function displayPagination(page) {
    // Format type d un lien vers une page
    var lien = "<a href=\"#\" id=\"pageHaut_$numPage\" onclick=\"displayProducts($numPage,true);gaHmap('hmap_family','pagination_top');return false;\">$numPage</a>";
    page = parseInt(page);
    var ch = "";
    
    // Nombre de pages a afficher
    var nbPdts = products.length;
    if(refPrdHero) nbPdts++; // Si il y a un produit hero, il y a deja un produit affiche
    var nbPages = Math.ceil(nbPdts / nbPdtsParPage);   //Nombre de pages
    
    // Lien precedent
    if(nbPages > 1) {
        ch += "<span class='pagePrecedente' id='pageHaut_precedent'>";
        if(page != 1) {
            var lienPrecedent = lien.substring(lien.indexOf('onclick'),lien.lastIndexOf('$numPage'));
            ch += "<a href='#'" + lienPrecedent.replace(/\$numPage/g,page - 1) + "<</a>";
        }
        else ch += "&nbsp;";
        ch += "</span>";
    }
    
    // 1ere page
    ch += lien.replace(/\$numPage/g,1);
    
    // Nombre de pages avant et apres la page courante
    var nbPagesBefore = page - 2;
    var nbPagesAfter = (nbPages - page) - 1;
    // Nombre de pages max a afficher. on enleve la 1ere page + la page courante + la derniere page
    var nbMax = nbMaxPages - 3; 
    // Nombre de pages max qui peuvent etre presentes avant et apres la page courante. nbMaxBefore sera plus petit que nbMaxAfter dans le cas d un nombre decimal
    var nbMaxBefore = parseInt(nbMax / 2);
    var nbMaxAfter = nbMax - nbMaxBefore;
    
    // Si il y a plus de pages que le max affichable
    if(nbPages > nbMaxPages) {
            if(nbPagesBefore > nbMaxBefore) {
                ch += '<span class="points">...</span>';
                // Calcul du nombre pages a afficher avant la page courante
                var nbToDisplayBefore = nbMaxBefore;

                // Si il n y a pas nbMax pages ou plus a afficher apres, on les affiche avant
                if(nbPagesAfter <= nbMax) nbToDisplayBefore = nbMax - nbPagesAfter;
                
                // Calcul de la premiere page a afficher apres les ...
                var indiceDeb = page - nbToDisplayBefore;
                // La premiere page apres les ... est superieure ou egal a 4
                if(indiceDeb < 4) indiceDeb = 4;
                for(var i = 0; indiceDeb + i < page;i++) ch += lien.replace(/\$numPage/g,indiceDeb + i);
                
                // Page courante
                ch += lien.replace(/\$numPage/g,page);

                // Pages a afficher apres
                if(nbPagesAfter <= nbMax) for(var i = page + 1; i <= nbPages;i++) ch += lien.replace(/\$numPage/g,i);
                else {
                    // Calcul du nombre de pages a afficher apres la page courante
                    var nbToDisplayAfter = nbMaxAfter + (nbMaxBefore - (page - indiceDeb));

                    for(var i = 1; i <= nbToDisplayAfter && page + i < nbPages - 2;i++) ch += lien.replace(/\$numPage/g,page + i);
                    ch += '<span class="points">...</span>' + lien.replace(/\$numPage/g,nbPages);
                }
            }
            else {
                 for(var i = 2; i <= page;i++) ch += lien.replace(/\$numPage/g,i);
                 
                 // Calcul du nombre de pages a afficher avant la page courante
                 var nbToDisplay = nbMaxAfter;
                 // Si il n y a pas nbMaxBefore pages ou plus qui ont ete affichees avant, on les affiche apers
                 if(nbPagesBefore < nbMaxBefore) nbToDisplay += nbMaxBefore - nbPagesBefore;
                 for(var i = 1; i <= nbToDisplay && page + i < nbPages - 2;i++) ch += lien.replace(/\$numPage/g,page + i);
                 // Pages a afficher apres
                ch += '<span class="points">...</span>' + lien.replace(/\$numPage/g,nbPages);
            }
    }
    else for(var i = 2;i <= nbPages;i++) ch += lien.replace(/\$numPage/g,i);
    
    // Lien suivant
    if(nbPages > 1) {
        ch += "<span class='pageSuivante' id='pageHaut_suivant'>";
        if(page != nbPages) {
            var lienSuivant = lien.substring(lien.indexOf('onclick'),lien.lastIndexOf('$numPage'));
            ch += "<a href='#'" + lienSuivant.replace(/\$numPage/g,page + 1) + "></a>";
        }
        else ch += "&nbsp;";
        ch += "</span>";
    }
    
    setBlocByHtml("paginationHaut",ch);
    ch = ch.replace(/pageHaut_/g,'pageBas_');
    ch = ch.replace(/pagination_top/g,'pagination_bottom');
    setBlocByHtml("paginationBas",ch);
}

/**************************************************************************************************************************************************************/
/* Fonction permettant de creer la liste des produits */
function createProducts(n) {
    var contenuAffiche = "";
    var idModele = "";
    var gdbc = products.length + (refPrdHero ? 1 : 0) > 1 ? true : false;
    
    if(!gdbc) {
        changeBlocClass("produitAffiche", "");
        var btnComparerHaut = document.getElementById("btnComparerHaut");
        if(btnComparerHaut) btnComparerHaut.parentNode.removeChild(btnComparerHaut);
        var btnComparerBas = document.getElementById("btnComparerBas");
        if(btnComparerBas) btnComparerBas.parentNode.parentNode.removeChild(btnComparerBas.parentNode);
        var checkBoxs = document.getElementById("produitAffiche").getElementsByTagName("input");
        for(var i = 0;i < checkBoxs.length;i++) checkBoxs[i].parentNode.parentNode.removeChild(checkBoxs[i].parentNode);
    }
    
    if(refPrdHero) {
        contenuAffiche += "<p class='titre-hero' id='titreHeroMosai_" + refPrdHero + "'>" + getBlocHtml('titreHeroMosai_' + refPrdHero) + "</p>";
        contenuAffiche += "<li class='ligne ligne-hero'><ul>";

        var checkBox = document.getElementById("checkbox-hero_" + refPrdHero);
        if (checkBox) {
            if (!gdbc) checkBox.parentNode.removeChild(checkBox);
            else checkBox.style.left = "113px";
        }
    }
    else contenuAffiche += "<li class='ligne'><ul>";

    if(refPrdHero) contenuAffiche += "<li id='product_"+refPrdHero+"' class='hero' style='display:none'>" + getBlocHtml("product_" + refPrdHero) + "</li>";

    var cptPdts = 0;
    if(refPrdHero) cptPdts = 1; // s il y a un produit hero, il faut ajouter une ligne au compteur

    // On additionne l ensemble des blocs pouvant etre affiches
    for (var i = 0; i < products.length; i++) {
        idModele = products[i][0].substring(products[i][0].indexOf("_")+1,products[i][0].length);
        
        // Position des checkboxs en mode mosaique
        var checkBox = document.getElementById("checkbox_" + idModele);
        if (checkBox) {
            if (!gdbc) checkBox.parentNode.removeChild(checkBox);
            else checkBox.style.left = 113 + 226 * ((cptPdts % nbPdtsParPage) % 3) + "px";
        }

        // Ajout d une ligne (pour le mode mosaique)
        if(cptPdts > 0 && (cptPdts % nbPdtsParPage) % 3 == 0) { 
            contenuAffiche += "</ul></li><li class='ligne'><ul>";
        }

        contenuAffiche += "<li id=\""+products[i][0]+"\" style=\"display:none\">" + getBlocHtml(products[i][0]) + "</li>";
        cptPdts++;
    }
    
    for (var i = 0; i < tabPrd.length; i++) {
        if(contenuAffiche.indexOf(tabPrd[i][0]) == -1) {
            idModele = tabPrd[i][0].substring(tabPrd[i][0].indexOf("_")+1,tabPrd[i][0].length);
            
            // Position des checkboxs en mode mosaique
            var checkBox = document.getElementById("checkbox_" + idModele);
            if (checkBox) {
                if (!gdbc) checkBox.parentNode.removeChild(checkBox);
                else checkBox.style.left = 113 + 226 * ((cptPdts % nbPdtsParPage) % 3) + "px";
            }
            
            if(cptPdts > 0 && (cptPdts % nbPdtsParPage) % 3 == 0) {
                contenuAffiche += "</ul></li><li class='ligne'><ul>";
                cptPdts = 0;
            }
                
            contenuAffiche+= "<li id=\""+tabPrd[i][0]+"\" style=\"display:none\">" + getBlocHtml(tabPrd[i][0]) + "</li>";
            cptPdts++;
        }
    }
    
    contenuAffiche += "</ul></li>";
    
    setBlocByHtml("produitAffiche",contenuAffiche);
    
    // Affichage des produits
    displayProducts(n);
}

/**************************************************************************************************************************************************************/
/* Fonction permettant d afficher les produits */
function displayProducts(n, hideOthers) {
    // Pagination : on cache tous les produits avant d afficher ceux de la bonne page
    if(hideOthers) for(var i = 0;i < products.length;i++) {
        hideBloc(products[i][0]);
        document.getElementById(products[i][0]).parentNode.parentNode.style.display = 'none';
    }
    
    if(refPrdHero && n > 1 || !modeMosai) hideBloc("titreHeroMosai_" + refPrdHero);
    else showBloc("titreHeroMosai_" + refPrdHero);
    
    var testFin = 0;
    var testDeb = 0;
    if(refPrdHero) {
        checkInfosToDisplay(refPrdHero,true);
        showBloc("product_" + refPrdHero);
        testFin = 1;
        if(n > 1) testDeb = 1;
    }
    
    // on active seulement les blocs produits pouvant etre affiches
    for (var i = (n-1)*nbPdtsParPage - testDeb; i < products.length && (i + testFin) < n*nbPdtsParPage; i++) {
        idModele = products[i][0].substring(products[i][0].indexOf("_")+1,products[i][0].length);
        
        checkInfosToDisplay(idModele);
        
        // Fin de collection
        //Seulement pour les sites pas PT
        if (products[i][2] == 1 && _siteNumber != '6721215') changeBlocClass("product-famille_"+idModele, "fdc");

        // Si substitution en connecte alors on affiche picto
        if (products[i][4] == true) changeBlocClass("product-famille_"+idModele, "subst");

        if((i + 1) == products.length || (i + 1 + testFin) == n*nbPdtsParPage) {
            var blocPrd = document.getElementById(products[i][0]);
            blocPrd.className += ' der';
            blocPrd.parentNode.parentNode.className += ' ligne-der';
        }
        
        // Affichage du produit
        showBloc(products[i][0],'inline');
        document.getElementById(products[i][0]).parentNode.parentNode.style.display = 'block';
    }

    // il n y a pas de produits
    if(document.forms["formFiltrerPrix"].min.value != '' || document.forms["formFiltrerPrix"].max.value != '') noProduit = filterNoResult;
    if (products.length <= 0 && !refPrdHero) setBlocByHtml("produitAffiche", "<span class =\"aucunProduit\">"+noProduit+"</span>");
    else {
        // Cas ou il n y a que le produit hero a afficher
        if(products.length == 0) document.getElementById("product_" + refPrdHero).parentNode.parentNode.style.display = "block";
        displayPagination(n);
        /*changement de la couleur de l onglet de la page selectionnee*/
        changeBlocClass("pageHaut_"+pageActive,'');
        changeBlocClass("pageBas_"+pageActive,'');
        pageActive = n;
        changeBlocClass("pageHaut_"+pageActive,"active");
        changeBlocClass("pageBas_"+pageActive,"active");
    }
    
    setCookieFamille();
}

/**************************************************************************************************************************************************************/
/* Fonction qui gere la ffichage des differents bloc pour chaque produits selon l etat des switchs */
function checkInfosToDisplay(idModele,hero) {

    // temporaire : les produits Tribord sous le rayon natation changent de marque pour Nabaiji
    if(getBlocHtml("libelleMarque_" + idModele) == 'TRIBORD' && multiLangCatNameRayon == "swimming") {
        var contenu = getBlocHtml("marque_" + idModele);
        contenu = contenu.replace("TRIBORD","NABAIJI");
        setBlocByHtml("marque_" + idModele,contenu);
    }

    // Typologie
    if (getSwitchSite('DESACTIVATION_TYPOLOGIE')) hideBloc("typo-famille_" + idModele);

    // Verification des switchs pour l affichage des avis oxylane
    var titreBlocPassion = 'isPassion-famille_';
    if(typeof hero != 'undefined' && hero) titreBlocPassion = 'isPassion_';
    if(!getSwitchSite('AVIS') || getBlocHtml(titreBlocPassion + idModele) == 'false' && !getSwitchSite('AVIS_AMI')) {
        hideBloc('avisMosai_' + idModele);
        hideBloc('avisListe_' + idModele);
    }
}

/**************************************************************************************************************************************************************/
/* Fonction permettant de creer le cookie famille pour la pagination, les filtres, le mode d affichage, et le tri */
function setCookieFamille() {
    /* Depot du cookie retenant la page courante */
    // Url de la page courante sans # a la fin
    var urlCurrentPage = document.location.href;
    if (urlCurrentPage.indexOf('#') != -1) urlCurrentPage = urlCurrentPage.substring(0, urlCurrentPage.indexOf('#'));
    if (urlCurrentPage.indexOf('?') != -1) urlCurrentPage = urlCurrentPage.substring(0, urlCurrentPage.indexOf('?'));
    // Id magasin du cookie
    var idMagCookie = '';
    if (cookieMagasin != null) idMagCookie = idMagasin;
    var nbProduits = document.getElementById('nbPdtsParPage').value;
    var tri = document.getElementById('trierFamille').value;
    var filtreMarque = '';
    if(document.getElementById("listeMarques")) filtreMarque = document.getElementById("listeMarques").value;
     // n=page courante, nbPdtsParPage=nombre produtis de pages, tri=tri applique, filtreMarque=filtre applique sur une marque, url=url de la famille, idMag=num du magasin du cookie si connecte, vide sinon
    setCookie('famille','n='+pageActive+'&amp;nbPdtsParPage='+nbProduits+'&amp;tri='+tri+'&amp;filtreMarque='+filtreMarque+'&amp;mode='+modeMosai+'&amp;url='+urlCurrentPage+'&amp;idMag='+idMagCookie, null, '/');
}

/**********************************************************************************************************************************************************************/
/* Fonction permettant d afficher la page famille en reappliquant les differents filtres et tris lors d un rechargement de page */
function checkCookieFamille() {
    // Test du cookie famille
    var cookieFamille = getCookie('famille');
    var tri = '';
    
    // Le cookie existe 
    if (cookieFamille != null) {
        // Url de la page courante sans # a la fin
        var urlCurrentPage = document.location.href;
        if (urlCurrentPage.indexOf('#') != -1) urlCurrentPage = urlCurrentPage.substring(0, urlCurrentPage.indexOf('#'));
        if (urlCurrentPage.indexOf('?') != -1) urlCurrentPage = urlCurrentPage.substring(0, urlCurrentPage.indexOf('?'));
        
        // Num mag du cookie courant si existe
        var idCurrentMagCookie = '';
        if (cookieMagasin != null) idCurrentMagCookie = idMagasin;
        
        // Informations du cookie -> derniere page famille visitee
        var lastPageUrl = getEltFromUrl(cookieFamille,'url');
        var lastIdMagCookie = getEltFromUrl(cookieFamille,'idMag');

        //  On verifie si la page famille du cookie est la page sur laquelle on se trouve et le meme magasin sur lequel on est connecte
        if(lastPageUrl == urlCurrentPage && lastIdMagCookie == idCurrentMagCookie) {
            var n = getEltFromUrl(cookieFamille,'n'); // On retourne la page du cookie
            
            modeMosai = getEltFromUrl(cookieFamille,'mode');
            modeMosai = modeMosai == 'true';
            
            nbPdtsParPage = getEltFromUrl(cookieFamille,'nbPdtsParPage');
            document.getElementById('nbPdtsParPage').value = nbPdtsParPage;

            var filtreMarque = getEltFromUrl(cookieFamille,'filtreMarque');
            if(filtreMarque && document.getElementById('listeMarques')) document.getElementById('listeMarques').value = filtreMarque;

            tri = getEltFromUrl(cookieFamille,'tri');
            if(tri) {
                document.getElementById('trierFamille').value =  tri;
                trierProduits(n);
            }
        }
    }

    if(modeMosai) changeModeAff(document.getElementById('modeMosaique').parentNode, true);
    else changeModeAff(document.getElementById('modeListe').parentNode, false);

    // Si le tri n a pas ete defini
    if(!tri) {
        // cas ou le tri dans itool est par prix
        if (typeTri == 'PRIX') {
            document.getElementById('trierFamille').value =  '3-asc-float';
            trierProduits(1);
        }
        // cas ou le tri dans iTool est manuel
        else triParOrdreItool(1);
    }
}

/**************************************************************************************************************/	
/* Fonction permettant de trier les produits par prix ou par marque, par ordre croissant ou decroissant */
function trierProduits(n) {
    var tri = document.getElementById('trierFamille').value;
    var indice = tri.substring(0,tri.indexOf('-'));
    var order = tri.substring(tri.indexOf('-') + 1,tri.lastIndexOf('-'));
    var type = tri.substr(tri.lastIndexOf('-') + 1);
    trierTableau(tabPrd, indice, order, type);

    if(typeof n == 'undefined' || !n) n = 1;

    // On reapplique le filtre une fois le tri effectue
    if(document.getElementById("listeMarques") && document.getElementById("listeMarques").value != '') getMarqueSelection(n);
    else createProducts(n);
}

/**************************************************************************************************************/	
/* Fonction permettant de trier les produits selon l ordre Itool
La variable globale listeModelesItoolArray contient les ID de modeles selon l ordre Itool */
function triParOrdreItool(n) {
    var refToFind = '';
    var myString = "";
    var tabPrdTemp = new Array;

    // Parcours du tableau de reference Itool
    for (var k = 0;k < listeModelesItoolArray.length();k++){
        refToFind = listeModelesItoolArray.get(k);
    
        // Parcours du tableau de donnees issu de eRep
        for (var j = 0;j < tabPrd.length;j++){
            myString = tabPrd[j][0].substring(tabPrd[j][0].indexOf("_") + 1,tabPrd[j][0].length);
            if (myString == refToFind) tabPrdTemp.push(tabPrd[j]);
        }
    }
    tabPrd = tabPrdTemp;
    products = tabPrd;
    
    // On reapplique le filtre une fois le tri effectue
    if(document.getElementById("listeMarques") && document.getElementById("listeMarques").value != '') getMarqueSelection(n);
    else createProducts(n);
}

/**********************************************************************************************************************************************************************/
/* Fonction de filtre par marque */
function getMarqueSelection(n) {
    /* Recuperation du libelle de la marque selectionnee */
    var laMarque = document.getElementById("listeMarques").value;

    //pas de marque selectionnee   
    if (!laMarque) products = tabPrd;
    else{
        products = new Array();
        for(var i = 0;i < tabPrd.length;i++)
            if(tabPrd[i][1] == laMarque) products.push(tabPrd[i]);
    }

    /* remplissage de la page */
     if(typeof n == 'undefined' || !n) n = 1;
    createProducts(n);
}

/**************************************************************************************************************/	
/* Fonction qui verifie les champs de filtre du prix avant de valider le formualire */
function valideFiltrePrix(){
    var min = document.forms["formFiltrerPrix"].min.value.replace(',','.');
    var max = document.forms["formFiltrerPrix"].max.value.replace(',','.');
    if(min != '') min = parseFloat(min.replace('/ /g',''));
    if(max != '') max = parseFloat(max.replace('/ /g',''));
    
    // Test de la valeur des deux champs
    if(min == '' && max == '' || isNaN(min) || isNaN(max) || min < 0 || (max != '' && min > max))
        showBloc('erreurFiltrePrix');
    else{
        var chMin = min.toString();
        var chMax = max.toString();
        // On arrondi a deux chiffres apres la virgule
        if(chMin.indexOf('.') != -1 && chMin.substring(chMin.indexOf('.') + 1,chMin.length).length > 2) min = min.toFixed(2);
        document.forms["formFiltrerPrix"].min.value = min;
        if(chMax.indexOf('.') != -1 && chMax.substring(chMax.indexOf('.') + 1,chMax.length).length > 2) max = max.toFixed(2);
        document.forms["formFiltrerPrix"].max.value = max;
        
        // Tag
        if (typeof pageTracker != 'undefined') gaHmap('hmap_family','filter_price');
        
        document.forms['formFiltrerPrix'].submit();
    }
}

/**************************************************************************************************************/	
/* Fonction qui modifie le nombre de produits affiches sur une page */
function nbProductsPerPage() {
    var value = document.getElementById('nbPdtsParPage').value;
    if(products.length > nbPdtsParPage || products.length > value) {
        nbPdtsParPage = value;
        createProducts(1);
    }
    else {
        nbPdtsParPage = value;
        setCookieFamille();
    }
}

/**************************************************************************************************************/	
/* Fonction qui modifie le mode d affichage - Mosaique ou Liste */
function changeModeAff(bouton, mode) {
    if(bouton.className == '') { // On verifie que le mode qui a ete clique n est pas le mode deja affiche
        modeMosai = mode;
        setCookieFamille();
        var div = document.getElementById('contenuFamille');
        
        if(modeMosai) {
            div.className += ' mosai';
            setSrc('modeMosaique', '../images/static/btn-aff-mosa-open.gif');
            setSrc('modeListe', '../images/static/btn-aff-liste-out.gif');
            
            document.getElementById('modeMosaique').parentNode.className = 'hover';
            document.getElementById('modeListe').parentNode.className = '';
            
            if (pageActive == 1) showBloc("titreHeroMosai_" + refPrdHero);
        }
        else {
            div.className = div.className = 'contenuFamille';
            setSrc('modeMosaique', '../images/static/btn-aff-mosa-out.gif');
            setSrc('modeListe', '../images/static/btn-aff-liste-open.gif');
            document.getElementById('modeListe').parentNode.className = 'hover';
            document.getElementById('modeMosaique').parentNode.className = '';
            
            hideBloc("titreHeroMosai_" + refPrdHero);
        }
    }
    
    var produitsAComparer = document.getElementsByName('produitCompare');
    for(i = 0; i< produitsAComparer.length; i++) produitsAComparer[i].checked = false;
}

/************************************************************************************************************************/
 // Fonction permettant de lancer le controle des produits
function getComparatifProduit(){
    produitsAComparer = document.getElementsByName('produitCompare') ;
    urlGdbc=urlGdbc.substring(0,urlGdbc.indexOf('=')+1); 
    nbProduitChecked = 0 ;
    for(i=0 ; i<produitsAComparer.length ; i++){
        if(produitsAComparer[i].checked){
            nbProduitChecked++ ;
            urlGdbc = urlGdbc + produitsAComparer[i].value + ";" ;
        }
    }

    if (nbProduitChecked > 4 || nbProduitChecked < 2) alert(gdbcSelection);
    else {
        var urlFamille =  document.location.href ;
        show_filter('filter');
        show_popup('comparatifSelection');
     
        return false;
    }
}

/*##############################################################################################
########################### GDBC MANAGEMENT LIBRARY ########################################### 
/*############################################################################################## */
var gdbcItemsToShow = new ArrayList();  // Liste des produits passes en parametre de l url

/* Cree la page gdbc en y inserant les produits de la liste gdbcItemsToShow. Si aucun modele, tout est affiche */
function createGdbcProducts(){
    // Recuperation des id modeles passes par url qui seront a afficher. Si aucun modele, tout est affiche
    var gdbcQuery = window.location.search;
    gdbcQuery = gdbcQuery.split("=");
    if (gdbcQuery.length > 1) {
        if (gdbcQuery[1] != "") {
            gdbcQuery = gdbcQuery[1].split(";");
            for (var i = 0; i < gdbcQuery.length; i++) gdbcItemsToShow.add(gdbcQuery[i]);
            }
        }
        
    // Si aucune ref passee en url, on elargit la largeur de la fenetre d affichage pour ne pas casser la mise en page
    if (gdbcItemsToShow.length() < 1) {
        var oCont = document.getElementById("gdbc-conteneur");
        oCont.style.width = "5000px";
        oCont = document.getElementById("comparerproduits");
        oCont.style.width = "5000px";
    }
    
    // Construction de la liste HTML des modeles, sans les prix, base sur l objet gdbcModeles (alimente par Itool)
    gdbcShowBu(oGmodeles, gdbcItemsToShow);
}
    
/**
 * BU Object
  */
function gdbcBu(libelle, valeur, etoile, etoile_valeur, name_image1) {
    this.libelle = libelle;
    this.valeur = valeur;
    this.etoile = etoile;
    this.etoile_valeur = etoile_valeur;
    this.name_image1 = name_image1;
}

gdbcBu.prototype.getLibelle = function () {
    return this.libelle;
}

gdbcBu.prototype.getValeur = function () {
    return this.valeur;
}

gdbcBu.prototype.getEtoile = function () {
    return this.etoile;
}

gdbcBu.prototype.getEtoileValeur = function () {
    return this.etoile_valeur;
}

gdbcBu.prototype.getNameImage1 = function () {
    return this.name_image1;
}

/********************************************************************/
/**
 * Modele Object
  */
  
 /**
 * Object constructor
 * sId : commercial model ID
  */
function gdbcModele(sId) {
    this.sId = sId;
    this.aBu = new Array();
}

/**
 * Used to retrive model ID
 */
gdbcModele.prototype.getId = function () {
    return this.sId;
}

/**
 * Used to add model BU
 * oBU : BU to add (object)
  */
gdbcModele.prototype.addBu = function (oBu) {
    this.aBu.push(oBu);    
}

/**
 * Used to retrive specified BU by BU libelle
 * sBuLibelle : BU name
  */
gdbcModele.prototype.getBu = function (sBuLibelle) {
    for (var k = 0; k < this.aBu.length; k++) {
        if (this.aBu[k].getLibelle() == sBuLibelle) return this.aBu[k];
    }
    
    return -1;
}

/**
 * Used to retrive specified BU by index
 * sBuLibelle : BU name
  */
gdbcModele.prototype.getBuByIndex = function (iIndex) {
    if(this.aBu[iIndex]) return this.aBu[iIndex] ;    
    else return -1;
}

/**
 * Used to retrive number of BU
   */
gdbcModele.prototype.lengthBu = function () {
    return this.aBu.length;
}

/********************************************************************/
/**
 * Modeles Object
  */
  
 /**
 * Object constructor
 * sId : commercial model ID
  */
function gdbcModeles() {
    this.aModeles = new Array();
}

/**
 * Used to add model
 * oModele : Model to add (object)
  */
gdbcModeles.prototype.addModele = function (oModele) {
    this.aModeles.push(oModele);    
}

/**
 * Used to retrive model
 * iIndex : Index number in array
 */
gdbcModeles.prototype.getModeleByIndex = function (iIndex) {
    if (this.aModeles[iIndex]) return this.aModeles[iIndex];
    else return "";
}

/**
 * Used to retrive model
 * iModelId : model ID
 */
gdbcModeles.prototype.getModele = function (iModelId) {
    for (var i = 0; i < this.aModeles.length; i++) {
        var oMod = this.getModeleByIndex(i);
        if (oMod) {
            if (oMod.getId() == iModelId) return oMod;
        }
    }
    return "";
}

/**
 * Used to retrive number of models
 */
gdbcModeles.prototype.length = function () {
    return this.aModeles.length;    
}


/********************************************************************/
/**
 * This function is used to display modele s BU on GDBC popup
  */
function gdbcShowBu(oModelsBu, aItemsToShow) {
    var gdbcBuListe = new Array();

    // Construction de la liste des BU a afficher
    // Une liste de modeles est imposee : on recupere les BU qui ont des donnees pour au moins un des modeles de la liste
    if (aItemsToShow.length() > 0) {
        for (var i = 0; i < aItemsToShow.length(); i++) {
            var oMod = oModelsBu.getModele(aItemsToShow.get(i));
            if (oMod) gdbcBuListe = _gdbcCreateBuListe(oMod, gdbcBuListe);
        }    
    }
    else {
        // AUCUNE liste de modeles n est imposee : on recupere les BU qui ont des donnees pour au moins un des modeles
        for (var i = 0; i < oModelsBu.length(); i++) {
            var oMod = oModelsBu.getModeleByIndex(i);
            if (oMod) gdbcBuListe = _gdbcCreateBuListe(oMod, gdbcBuListe);
        }
    }

    // Parcours de tous les modeles dispos a la comparaison
    var blocBu = document.getElementById("modele_bu");
    var blocBuTitre = document.getElementById("modele_bu_titre");
    
    // Parcours de tous les modeles
    for (var i = 0; i < oModelsBu.length(); i++) {
        var modId = oModelsBu.getModeleByIndex(i).getId();
        
        oDivColMod = document.createElement('div');
        oDivColMod.id = "modele_bu_"+ modId;
        oDivColMod.className = "gdbc-colmodele";
        
        // Pour chacun des BU (liste complete), on affiche les donnees du modele
        for (var j = 0; j < gdbcBuListe.length; j++) {
       
            // Creation de la cellule contenant la BU
            oDivBu = document.createElement('div');
            oDivBu.className = "zonetexte gdbc-cellht2";
    
            // Recuperation des infos BU
            var oBu = oModelsBu.getModeleByIndex(i).getBu(gdbcBuListe[j]);
            if (oBu != -1) {
                // On a une BU, on affiche les infos
                // Image
                var sNameImage = oBu.getNameImage1();
                if (sNameImage) {
                    oImg = document.createElement('img');
                    oImg.src = gdbcImagesAssetsPath+"/"+sNameImage;
                    oImg.alt = oBu.getLibelle();
                    oDivBu.appendChild(oImg);
                }
                // Valeur du texte
                var sValeur = oBu.getValeur();
                if (sValeur) {
                    oVal = document.createTextNode(sValeur);
                    oDivBu.appendChild(oVal);
                }
                // Etoile
                var sEtoileVal = oBu.getEtoileValeur();
                if (sEtoileVal) {
                    oEtoile = document.createElement('img');
                    oEtoile.src = gdbcImagesStaticPath+"/etoiles/"+sEtoileVal+"-star.gif";
                    oEtoile.alt = oBu.getLibelle();
                    oEtoile.height = "15";
                    oEtoile.width = "75";
                    oDivBu.appendChild(oEtoile);
                }
            }
            else {
                // Pas de BU, creation d une cellule vide
                oTexteBu = document.createTextNode('');
                oDivBu.appendChild(oTexteBu);
            }
                
            // Ajout du BU dans la colonne du modele
            oDivColMod.appendChild(oDivBu);
                
            // Affichage du titre de la BU (premier modele uniquement)
            if (i < 1) {
                oDivCtitre = document.createElement('div');
                oDivCtitre.className = "gdbc-titreligne gdbc-cellht2 gdbc-cellborder";
                oSpanCtitre = document.createElement("span");
                var myTitle = gdbcBuListe[j];
                var myReg=new RegExp("/", "g");
                myTitle = myTitle.replace(myReg," / ");
                oTexteCtitre = document.createTextNode(myTitle);
                    
                oSpanCtitre.appendChild(oTexteCtitre);
                oDivCtitre.appendChild(oSpanCtitre);
                blocBuTitre.appendChild(oDivCtitre);
            }

        }

        // Ajout des donnes modele a la div du bloc
        blocBu.appendChild(oDivColMod);
    }

}

/********************************************************************/
/**
 * This function is used to create BU liste
 * _oMod : models list (obj gdbcModeles)
 * _aBuListe : array containing BU liste
  */
function _gdbcCreateBuListe(_oMod, _aBuListe) {
    for (var j = 0; j < _oMod.lengthBu(); j++) {
        var trouve = false;
        var oBu = _oMod.getBuByIndex(j);
        if (oBu != -1) {
            if (oBu.getValeur() != '' || oBu.getEtoileValeur() != '' || oBu.getNameImage1() != '') {
                for (var k = 0; k < _aBuListe.length; k++) if (_aBuListe[k] == oBu.getLibelle()) trouve = true;
                if (!trouve) _aBuListe.push(oBu.getLibelle());
            }
        }
    }

    return _aBuListe;
}