var setTimeoutResizeUpID;//Timer pour resizer le 'UL' (vers le haut)
var setTimeoutResizeDownID; //Timer pour resizer le 'UL' (vers le bas)
var setTimeoutResizeRightID; //Timer pour resizer le 'UL' (vers la droite)
var setTimeoutResizeLeftID; //Timer pour resizer le 'UL' (vers la gauche)

/*
Initialise le menu (par défaut tous les éléments UL sont affiché)
Valeur de retour = aucune
*/
function initMenu()
{
    hideAll();
}

/*
Cache les 'UL' pour que l'on voit que les 'UL' parent
Valeur de retour = aucune
*/
function hideAll()
{
    var obj;
    var arrayNodeUL;

    obj = document.getElementById('menuUl');
    arrayNodeUL = obj.getElementsByTagName('UL');

    var i=0;
    for(i = 0;i< arrayNodeUL.length;i++)
    {
        if(arrayNodeUL[i].previousSibling.previousSibling.className == 'parent')
        {
            slideUpNoAnimation(arrayNodeUL[i].previousSibling.previousSibling.id);
        }
        else
        {
            arrayNodeUL[i].style.display = 'none';
            arrayNodeUL[i].style.position = 'absolute';
            arrayNodeUL[i].style.marginLeft = '166px';
            arrayNodeUL[i].style.marginTop = '-28px';
        }
    } 
}

/*
Recherche tous les éléments d'une classe 
searchClass = nom de la classe à rechercher   Exemple : 'parent'
domNode = un objet 'node' à partir d'où débute la recherche (par défaut la recherche commence à partir du début du document) *Optionnel     Exemple : [object HTMLUListElement]
tagName = le nom de la balise HTML qui est recherché dans une classe spécifié (par défaut tous les balises sont recherché) *Optionnel    Exemple : 'LI'
Valeur de retour = un array d'objet 'node'
*/
function getElementsByClass(searchClass, domNode, tagName) 
{
    if (domNode == null) domNode = document;
    if (tagName == null) tagName = '*';
    var el = new Array();
    var tags = domNode.getElementsByTagName(tagName);
    var tcl = " " + searchClass + " ";

    for (i = 0, j = 0; i < tags.length; i++) 
    {
        var test = " " + tags[i].className + " ";
        if (test.indexOf(tcl) != -1)
        {
            el[j++] = tags[i];
        }
    }
    return el;
}

//-------------------------------------- Section parent et subParent (déroulement vertical) --------------------------------------

/*
Déroule le menu vers le bas
element = l'objet 'node' (la balise <UL>)
Valeur de retour = aucune
*/
function resizeDown(element) 
{
    var originalSize=0;
    var resizeHeight;
    var speed;
    heightAdd = 6;

    if(element.style.display == 'none')
    {
        element.style.display = 'block';
    }

    arrayNodeUL = element.getElementsByTagName('a');
    var i = 0;
    for (i = 0; i < arrayNodeUL.length; i++) 
    {
        if (arrayNodeUL[i].className == 'subParentInvis')
        {
            originalSize += 28; //27px Height + Border 1px
        }
    }

    if ( (element.offsetHeight + heightAdd) >= originalSize)
    {
        resizeHeight = originalSize;
        element.style.height = resizeHeight + 'px';

        var arrayNodeUL2;
        arrayNodeUL2 = element.getElementsByTagName('a');
        var i = 0;
        for (i = 0; i < arrayNodeUL2.length; i++) 
        {
            if (arrayNodeUL2[i].className == 'subParentInvis') 
            {
                arrayNodeUL2[i].className = 'subParent';
            }
        } 
    }
    else if (element.offsetHeight != originalSize) 
    {
        resizeHeight = (element.offsetHeight + heightAdd);
        element.style.height = resizeHeight + 'px';
        setTimeoutResizeDownID = setTimeout(function () { resizeDown(element); }, 10 );
    }
}

/*
Ferme le menu instantanément (donc, sans animation de déroulement)
element = l'objet 'node' (la balise <UL>)
Valeur de retour = aucune
*/
function resizeUpNoAnimation(element)
{

    var arrayNodeUL;
    arrayNodeUL = element.getElementsByTagName('a');
    var i = 0;
    for (i = 0; i < arrayNodeUL.length; i++) 
    {
        if (arrayNodeUL[i].className == 'subParent') 
        {
            arrayNodeUL[i].className = 'subParentInvis';
        }
    }

    element.style.height = '0px';
    element.style.display = 'none';

}
/*
Déroule le menu vers le haut
element = l'objet 'node' (la balise <UL>)
Valeur de retour = aucune
*/
function resizeUp(element)
{
    clearTimeout(setTimeoutResizeDownID); // pour le pas qu'il est resizeUP et resizeDown en même temps

    var resizeHeight;
    var speed;
    heightRemove = 6;

    var arrayNodeUL;
    arrayNodeUL = element.getElementsByTagName('a');   
    var i = 0;
    for (i = 0; i < arrayNodeUL.length; i++) 
    {
        if (arrayNodeUL[i].className == 'subParent') 
        {
            arrayNodeUL[i].className = 'subParentInvis'; 
        }
    }

    if( (element.offsetHeight - heightRemove) <= 0)
    {
        resizeHeight = 0;
        element.style.height = resizeHeight + 'px';
        element.style.display = 'none';
    }
    else if(element.offsetHeight !=0)
    {
        resizeHeight = (element.offsetHeight - heightRemove);
        element.style.height = resizeHeight + 'px';
        setTimeoutResizeUpID = setTimeout(function () { resizeUp(element); }, 10);
    }
}

/*
Après qu'une balise <a> parent à été cliqué, cette fonction définit si elle doit se dérouler vers le haut ou vers le bas
parentID = le ID du parent qui vient d'être cliqué
Valeur de retour = aucune
*/
function slide(parentID)
{

    obj = document.getElementById(parentID);
    children = obj.nextSibling.nextSibling;

    if(children.style.display == 'none')
    {
        slideDown(parentID);
    }
    else if (children.style.display == 'block')
    {
        slideUp(parentID);
    }
}

/*
Ferme le menu instantanément (donc, sans animation de déroulement)
parentID = le ID du tag <a> parent
Valeur de retour = aucune
*/
function slideUpNoAnimation(parentID) 
{
    var obj;
    var children;

    obj = document.getElementById(parentID);
    children = obj.nextSibling.nextSibling; /* UL */

    resizeUpNoAnimation(children);
}

/*
À partir du parent spécifié, cette fonction retrouve le tag <ul> et l'envoie à 'resizeUP' pour le dérouler.
parentID = le ID du tag <a> parent
Valeur de retour = aucune
*/
function slideUp(parentID)
{
    var obj;
    var children;

    obj = document.getElementById(parentID);
    children = obj.nextSibling.nextSibling;/* UL */

    resizeUp(children);
}

/*
À partir du parent spécifié, cette fonction retrouve le tag <ul> et l'envoie à 'resizeDown' pour le dérouler.
parentID = le ID du tag <a> parent
Valeur de retour = aucune
*/
function slideDown(parentID)
{
    var obj;
    var children;

    obj = document.getElementById(parentID);
    children = obj.nextSibling.nextSibling; /* UL */

    resizeDown(children);
}

//-------------------------------------- Section subCategory (déroulement horizontal) --------------------------------------

/* Non utilisé et non testé
Ferme les sous menu instantanément (donc, sans animation de déroulement)
element = l'objet 'node' (la balise <UL>)
Valeur de retour = aucune

function resizeLeftNoAnimation(element) 
{
    var arrayNodeUL;
    arrayNodeUL = element.getElementsByTagName('a');
    var i = 0;
    for (i = 0; i < arrayNodeUL.length; i++) 
    {
        if (arrayNodeUL[i].className == 'subCategory') 
        {
            arrayNodeUL[i].className = 'subCategoryInvis';
        }
    }

    element.style.width = '0px';
    element.style.display = 'none';

}
*/

/*
Après qu'une balise à été 'onmouseover', cette fonction définit si elle doit se dérouler vers la droite ou se fermer
subID = le ID de la balise qui vient d'être 'onmouseover'
direction = 
Valeur de retour = aucune
*/
function sideSlide(element,direction) 
{
    if(direction == 'right')
    {
        if(element.lastChild.nodeName == 'UL')//Internet Explorer
        {
            element.lastChild.style.display = 'block';
        }
        else if(element.lastChild.previousSibling.nodeName == 'UL')//Firefox et tous les autres
        {
            element.lastChild.previousSibling.style.display = 'block';
        }
        //resizeRight(element.getElementsByTagName('UL')[0]);
    }
    else if(direction == 'left')
    {
        if (element.lastChild.nodeName == 'UL')//Internet Explorer
        {
            element.lastChild.style.display = 'none';
        }
        else if (element.lastChild.previousSibling.nodeName == 'UL')//Firefox et tous les autres
        {
            element.lastChild.previousSibling.style.display = 'none';
        }
        //resizeLeft(element.getElementsByTagName('UL')[0]);
    }
}

/* Non utilisé et bugger
Déroule le menu vers la gauche (Marche à moitier)
element = l'objet 'node' (la balise <UL>)
Valeur de retour = aucune

function resizeLeft(element) 
{
    clearTimeout(setTimeoutResizeRightID); // pour le pas qu'il est resizeLeft et resizeRight en même temps

    var resizeWidth;
    var speed;
    widthRemove = 6;

    if ((element.offsetWidth - widthRemove) <= 0) 
    {
        resizeWidth = 0;
        element.style.width = resizeWidth + 'px';
        element.style.display = 'none';
    }
    else if (element.offsetWidth != 0) 
    {
        resizeWidth = (element.offsetWidth - widthRemove);
        element.style.width = resizeWidth + 'px';
        clearTimeout(setTimeoutResizeLeftID); // réinitialiser 
        setTimeoutResizeLeftID = setTimeout(function () { resizeLeft(element); }, 10);
    }
*/

/* Non utilisé et bugger
Déroule le menu vers la droite  (Marche à moitier)
element = l'objet 'node' (la balise <UL>)
Valeur de retour = aucune
*/
function resizeRight(element) 
{
    clearTimeout(setTimeoutResizeLeftID); // pour le pas qu'il est resizeLeft et resizeRight en même temps

    var originalSize = 166; // Dans le CSS il est spécifié que le 'width' est 166px
    var resizeWidth;
    var speed;
    widthAdd = 6;

    if (element.style.display == 'none') 
    {
        element.style.display = 'block';
    }

    if ((element.offsetWidth + widthAdd) >= originalSize)
    {
        resizeWidth = originalSize;
        element.style.width = resizeWidth + 'px';
    }

    else if (element.offsetWidth != originalSize) 
    {
        resizeWidth = (element.offsetWidth + widthAdd);
        element.style.width = resizeWidth + 'px';
        clearTimeout(setTimeoutResizeRightID); // réinitialiser 
        setTimeoutResizeRightID = setTimeout(function () { resizeRight(element); }, 10);
    }
}