/**
 * This scripts provides three jobs related to dynamic dropdown
 * menus.  It drives a dynamic navigation of dropdown menus.
 * Each menu is opened when the user
 * drive his mouse on a related label, say the menu
 * opener, say a link with an "onmouseover" event.
 *
 * By opening a menu, an eventually precendtyl opened one
 * have to be close.
 *
 * The menu is closed if the user just drive the mouse on
 * the opener element, then out.
 *
 */

// element id sent in a time out function
var tid;

// number of menu
var numOfMenus = 4;

// general function that returns an element object
function $(id) {
    return document.getElementById(id);
}

function common_close(n) {
    $(n).style.visibility = 'hidden';
    $(n).style.display = 'none';
}

function common_open(n) {
    $(n).style.visibility='visible';
    $(n).style.display='block';
}

function common_hide(n, timeout) { 
    tid = setTimeout("common_close('" + n + "')", timeout);
}

function common_show(n) {
    clearTimeout(tid);
    common_open(n);
}

function common_drive(n) {
    var state = $(n).style.visibility;

    for(i = 1; i <= numOfMenus; i++) {
        if((state == 'visible') && (i != n)) {
            common_close(i, 1000);
        }
    }
}

function common_keep(n) {
    var state = $(n).style.visibility;
    if (state == "visible") {
        clearTimeout(tid);
    }
}

function common_closeAll() {
    var state = "";
    for(i = 1; i <= numOfMenus; i++) {
        common_close(i, 20);
    }
}

function common_driveElementDisplay(cookieName, elemId, n) {
    var operation = "";
    var state = $(elemId).style.visibility;

    if (state == "hidden") {
        $('cat_' + n + '_drive').style.backgroundImage=
            'url(../tpl/img/less.png)';
        common_open(elemId);
        operation = "open";
    }
    else  {
        $('cat_' + n + '_drive').style.backgroundImage=
            'url(../tpl/img/more.png)';
        common_close(elemId);
        operation = "close";
    }

    common_updateViewStateCookie(cookieName, operation, n);
}

function common_updateViewStateCookie(cookieName, operation, n) {
    oldState  = (cookies_getCookieByName(cookieName) ?
                 cookies_getCookieByName(cookieName) * 1 : 0);

    elemValue = Math.pow(2, (n)) * (operation == "open" ? 1 : -1);

    newState = (oldState + elemValue) - 0;

    cookies_storeCookie(cookieName, newState, "/");
}

function common_highlight_option(n, FWROOT) {
    var imgFolder = FWROOT + "tpl/img/";
    var opt       = $("opt_" + n);
    var optLeft   = $("optLeft_" + n);
    var optRight  = $("optRight_" + n);
    var aTagOpt   = $("aTagOpt_" + n);

    opt.style.cursor='pointer';
    opt.className ='horizontalCurrentOption';

    optRight.style.cursor='pointer';
    optRight.className ='horizontalCurrentOptionRight';

    optLeft.style.cursor='pointer';
    optLeft.className ='horizontalCurrentOptionLeft';

    // aTagOpt.style.color = '#f66';
    aTagOpt.style.color = '#fff';
}

function common_reset_option(n) {
    var opt       = $("opt_" + n);
    var optLeft   = $("optLeft_" + n);
    var optRight  = $("optRight_" + n);
    var aTagOpt   = $("aTagOpt_" + n);

    opt.style.cursor='pointer';
    opt.className ='horizontalOption';

    optRight.style.cursor='pointer';
    optRight.className ='horizontalOptionRight';

    optLeft.style.cursor='pointer';
    optLeft.className ='horizontalOptionLeft';

    aTagOpt.style.color = '';
}

/* The following 3 functions drives the layout of a given vertical
   option. A vertical option is made with a div tag, containing
   an a Tag. The color of the link is set by the function
   common_set_childElement_color(parent, fgColor) */
function common_highlight_vertical_option(elem, bgColor, fgColor) {
     elem.style.cursor = 'pointer';
     elem.style.backgroundColor= bgColor;
     common_set_childElement_color(elem, fgColor);
}

function common_reset_vertical_option(elem) {
     elem.style.cursor = '';
     elem.style.backgroundColor= '';
     common_set_childElement_color(elem, '');
}

function common_set_childElement_color(parent, fgColor) {
     var i;
     for (i = 0; i < parent.childNodes.length; i++) {
         if (parent.childNodes[i].nodeType == 1) {
             parent.childNodes[i].style.color=fgColor;
             break;
         }
     }
}