// JavaScript Document - dropMenu.js

//Add the function initDropMenu() to your JavaScript. This function sets a global event handler to hide any visible menus 
// whenever the visitor clicks anywhere on the screen. Findkey allows user to type N, C, or S for menu instead of click

function initDropMenu () {
//	alert ('initDropMenu ' + numDropMenu);
     document.onclick = hideDropMenu;
     for (i=1; i<=numDropMenu; i++) {
//	alert (i);
        menuName = 'dropMenu' + i;
        navName = 'navMenu' + i;
//	alert (i +' menuName ' + menuName +' navName ' + navName);
        objDropMenu = document.getElementById(menuName);
        objNavMenu = document.getElementById(navName);
        objDropMenu.style.visibility = 'hidden';
        objNavMenu.onmouseover = menuHover;
        objNavMenu.onmouseout = menuOut;
        objNavMenu.onclick = showDropMenu;
     }
     objNavMenu = null;
     return;
} 

//Whenever the mouse is over a menu header, this function is used to disable the global menu hiding set above.
function menuHover(e) {
//	alert ('menuHover');
     document.onclick = null;
     hoverObjNavMenu = document.getElementById(this.id);
     if (hoverObjNavMenu != objNavMenu) {
        hoverObjNavMenu.style.color = linkHover;
        hoverObjNavMenu.style.backgroundColor = bgLinkHover;
     }
} 

//This function reinstates the global menu hiding event handler when the visitor moves the mouse pointer out of a menu header.
function menuOut(e) {
//	alert ('menuOut');
     document.onclick = hideDropMenu;
     outObjNavMenu = document.getElementById(this.id);
     if (outObjNavMenu != objNavMenu) {
        outObjNavMenu.style.color = linkColor;
        outObjNavMenu.style.backgroundColor = bgLinkColor;
     }
} 

//This function is triggered when the visitor clicks a menu header. It first hides the menu currently showing (prevObjDropMenu) using the hideDropMenu() below. It sets the style for the menu header option so that it looks selected (white text on a black background) and positions and shows the appropriate menu.
function showDropMenu(e) {
//	alert ('showDropMenu ' + this.id.substring(3,this.id.length));
     menuName = 'drop' + this.id.substring(3,this.id.length);
     objDropMenu = document.getElementById(menuName);
//	alert ('showDropMenu ' + menuName);
//	alert ('objDropMenu ' + objDropMenu);
//	alert ('prevObjDropMenu ' + prevObjDropMenu);
     if (prevObjDropMenu == objDropMenu) {
        hideDropMenu();
        return;
     }

     if (prevObjDropMenu != null)
        hideDropMenu();

     objNavMenu = document.getElementById(this.id);

     if ((prevObjDropMenu != objDropMenu) || (prevObjDropMenu == null)) {
        objNavMenu.style.color = linkActive;
        objNavMenu.style.backgroundColor = bgLinkActive;
     }

     if (objDropMenu){
        xPos = objNavMenu.offsetParent.offsetLeft + objNavMenu.offsetLeft;
        yPos = objNavMenu.offsetParent.offsetTop + objNavMenu.offsetParent.offsetHeight;

        if (isIE) {
           yPos -= 1;
           xPos -= 6;
        }
//	alert ('showDropMenu ' + xPos + ' ' + yPos);
        objDropMenu.style.left = xPos + 'px';
        objDropMenu.style.top = yPos + 'px';
        objDropMenu.style.visibility = 'visible';
        prevObjDropMenu = objDropMenu;
        prevObjNavMenu = objNavMenu;
     }
} 

// This function disables the global onclick event and then hides any menus that are showing and sets the menu header style to its normal state 
function hideDropMenu() {
//	alert ('hideDropMenu' + prevObjDropMenu);
     document.onclick = null;
     if (prevObjDropMenu) {
        prevObjDropMenu.style.visibility = 'hidden';
        prevObjDropMenu = null;
        prevObjNavMenu.style.color = linkColor;
        prevObjNavMenu.style.backgroundColor = bgLinkColor;
     }
     objNavMenu = null;
}