/* code for the pop-up menu bar */
function hideHiliteBar()
   {
      
      if (hiliteBar) hiliteBar.visibility = "hide";
      hiliteBar = null;
   }
function hiliteBarOnMouseOut(evnt)
{                       
if (isNav4)
   {
      
      //alert(evnt.type);
      hideHiliteBar();
     
   }

}

/************ DOCUMENT event captures *****************/

/* document level mouse handlers */
function docMouseOver(evnt)
{
 if (isNav4)
  {
   if (evnt.target.id && evnt.target.id.indexOf("menuHead") >= 0) // it is a layer
      {        
         evnt.target.bgColor = "aqua";
         v_menuLayer = evnt.target.parentLayer; // = document.menuBar
         //cancel any hide menu timer
         clearTimeout(v_menuLayer.menuHideTimer);
         // hide the old pop-up layer, if required
         if (v_menuLayer.menuIndex >= 0){
            v_lastPopup = document.layers["menuList" + v_menuLayer.menuIndex];
            if (v_lastPopup) {
               v_lastPopup.visibility = "hide";
               hideHiliteBar();
            }
         }
         v_menuLayer.menuIndex = evnt.target.id.substring(8,9);
         v_thisPopup = document.layers["menuList" + v_menuLayer.menuIndex];
         if (v_thisPopup) {
            v_thisPopup.top = v_menuLayer.top + v_menuLayer.clip.height;
            v_thisPopup.left = v_menuLayer.left + evnt.target.left;
            v_thisPopup.bgColor = "aqua";
            v_thisPopup.visibility = "show";
         }

      } // if evnt.target.name is menuHead*
     
        if (evnt.target.id && evnt.target.id.indexOf("menuList") >= 0)
        {
         v_popUp = evnt.target;
         v_menuLayer = document.layers.menuBar;
         v_menuIndex = v_popUp.id.substring(8,9);
         clearTimeout(v_menuLayer.menuHideTimer);
         v_popUp.visibility = "show"; // just to make sure
         v_menuLayer.layers["menuHead" + v_menuIndex].bgColor = "aqua";
         }

       /* hilite the link if there is a mouseover on a popup*/
           if (evnt.target.parentLayer && evnt.target.parentLayer.id
            && evnt.target.parentLayer.id.indexOf("menuList") >= 0 )
           {

               if (!hiliteBar)
                  hiliteBar = new Layer(evnt.target.parentLayer.clip.width,evnt.target.parentLayer);
               if (evnt.target.text)
                  {  // the evnt.target.text makes sure the mouseOver is over
                     // a link, not over the menuList object
                     hiliteBar.top =
                        evnt.target.y;
                     hiliteBar.left =
                        evnt.target.x;
                     hiliteBar.document.write(
     '<SPAN class="menuList"><A class="simpleLinkRed"  HREF="' + evnt.target.href + '">' + evnt.target.text
                    + '</A></SPAN>');
                     hiliteBar.document.close();
                    // hiliteBar.bgColor = "red";
                     hiliteBar.visibility = "show";
                     hiliteBar.onMouseOut = hiliteBarOnMouseOut;
                  }
           }
    // there are other mouse over handlers
    var retval = routeEvent(evnt);
  
    if (retval == false) 
       return false;
    else 
       return true;
  } /* isNav4*/
  /********************** IE 4 Mouse Over ***********************/
  if (isIE4)
  {
  
 if ((hitLink = event.srcElement).parentElement.id.indexOf("menuHead") >= 0) // it is a layer
      {        
         //be consistent: color-in not the link, but its parent
         hitLink.parentElement.style.backgroundColor = "aqua";
         v_menuLayer = document.all.menuBar;
         //cancel any hide menu timer
         if (v_menuLayer.menuHideTimer)
           clearTimeout(v_menuLayer.menuHideTimer);
         // hide the old pop-up layer, if required
         if (v_menuLayer.menuIndex >= 0){
            v_lastPopup = document.all["menuList" + v_menuLayer.menuIndex];
            if (v_lastPopup) {
               v_lastPopup.style.visibility = "hidden";
            }
         }
        
         
         v_menuLayer.menuIndex = hitLink.parentElement.id.substring(8,9);
         v_thisPopup = document.all["menuList" + v_menuLayer.menuIndex];
         if (v_thisPopup) {
            v_thisPopup.style.pixelTop =
                  v_menuLayer.offsetTop +
                  v_menuLayer.offsetHeight;
            v_thisPopup.style.pixelLeft = v_menuLayer.offsetLeft
              + hitLink.parentElement.offsetLeft;
               
            v_thisPopup.style.backgroundColor = "aqua";
            v_thisPopup.style.visibility = "visible";
         }
       
      } // if evnt.target.name is menuHead*

    /* now, mouse may be over the pop-up menu. In IE4, two elements could
      cause this event: the DIV containing the pop-up, or the links in the
      pop-up. We must cancel the Timeout that will hide the menu due to the
      mouse out */
   if ( event.srcElement.id.indexOf("menuList") >= 0 
       || event.srcElement.id.indexOf("menuItem") >= 0)
      { // the mouse has moved into one of the pop-up menus

         v_menuLayer = document.all["menuBar"];
         v_menuIndex = event.srcElement.id.substring(8,9);
         v_menu = document.all["menuList" + v_menuIndex];
         clearTimeout(v_menuLayer.menuHideTimer);
         v_menu.style.visibility = "visible"; // just to make sure
         // make the menu heading aqua; the mouse out turned off the bg color
         document.all["menuHead" + v_menuIndex].style.backgroundColor = "aqua";
         // now highlight the link where the mouse is
         if (event.srcElement.id.indexOf("menuItem") >= 0)
            {
            //event.srcElement.style.backgroundColor = "red";
            event.srcElement.style.oldColor = event.srcElement.style.color;
            event.srcElement.style.color = "red";
            }
      }


  }
  return true; // Netscape complains otherwise
}
   
   
/******************** MouseOut ********************/
function docMouseOut(evnt)
{ 
   // all mouse out events come here
   // if the mouseOut is over a menuList layer, then hide it
if (isNav4)
 {
   if (evnt.target.name && evnt.target.name.indexOf("menuHead") >= 0)
      {
         //evnt.target.visibility = "hidden";
         evnt.target.bgColor = null;
         v_menuLayer = evnt.target.parentLayer;
         v_thisPopup = document.layers["menuList" + v_menuLayer.menuIndex];
         // keep the pop-up menu visible long enough for the mouseover
         // in the pop-up menu to occur, if this is where the user moved
         // the mouse. 
         if (v_thisPopup) {
            v_menuLayer.menuHideTimer =
               setTimeout('v_thisPopup.visibility = "hide"; hideHiliteBar()',200);
         }

       } // evnt.target.name "menuHead"
   if (evnt.target.name && evnt.target.name.indexOf("menuList") >= 0)
      {
         v_popUp = evnt.target;
         v_menuLayer = document.layers.menuBar;
         v_menuIndex = v_popUp.name.substring(8,9);
         v_popUp.visibility = "hide"; // just to make sure
         hideHiliteBar();
         v_menuLayer.layers["menuHead" + v_menuIndex].bgColor = null;
      }
   
    var retval = routeEvent(evnt);
        if (retval == false) return false;
        else return true;
  } /* isNav4 */
/************************ IE4  mouseout ********************/
 if (isIE4)
  {
   if ((hitLink = event.srcElement).parentElement.id.indexOf("menuHead") >= 0)
      {
         //evnt.target.visibility = "hidden";
         hitLink.parentElement.style.backgroundColor = "";
         v_menuLayer = document.all["menuBar"];
         v_thisPopup = document.all["menuList" + v_menuLayer.menuIndex];
         // keep the pop-up menu visible long enough for the mouseover
         // in the pop-up menu to occur, if this is where the user moved
         // the mouse. 
         if (v_thisPopup) {
            v_menuLayer.menuHideTimer = setTimeout('v_thisPopup.style.visibility = "hidden"',200);
         }

       } // evnt.target.name "menuHead"



   if ((hitLink = event.srcElement).parentElement.id.indexOf("menuHead") >= 0) // it is a layer
      {
         hitLink.parentElement.style.backgroundColor = "";

      }
    
   if (  event.srcElement.id.indexOf("menuList") >= 0 ||
         event.srcElement.id.indexOf("menuItem") >= 0)
      {
         
         v_menuLayer = document.all["menuBar"];
         v_menuIndex = event.srcElement.id.substring(8,9);
         v_menu = document.all["menuList" + v_menuIndex];
         /* now, if the user moves the mouse over the popup menu, jumping from
         one link to another, they will generate mouseOut events.
         To stop the menu flashing "visible" and "hidden" use "toElement" */
         if (event.toElement.id.substring(8,9) != v_menuIndex)
            {
               v_menu.style.visibility = "hidden"; //hide popUp menu
               //unhighlight the menuBar
               document.all["menuHead" + v_menuIndex].style.backgroundColor = "";
            }                      
         if (event.srcElement.id.indexOf("menuItem") >= 0)
            {
            //event.srcElement.style.backgroundColor = "";
            //use a custom property ...
               event.srcElement.style.color = event.srcElement.style.oldColor;
            }
      }



  } /* is IE4 */

  return true;
} /* onMouseOut */


/************************ menuShow *************************/
/* gets the menuReady for display */

function menuShow(v_menuLayer,v_bgcolor)
{
   if (isNav4)
   {
      // v_menuLayer is the outer layer for the menu headers
      v_left = 0;
      for (i=0;i<v_menuLayer.layers.length;i++)
      {
         v_menuLayer.layers[i].top = 0;
         v_menuLayer.layers[i].left = v_left;
         v_left += v_menuLayer.layers[i].clip.width + 10;
      }
      v_menuLayer.clip.width = v_left;
      v_menuLayer.bgColor = v_bgcolor;
      v_menuLayer.visibility = "show";

   }
   if (isIE4)
   {
      v_menuLayer.style.backgroundColor = v_bgcolor;
      v_left = 0;
      for (i=0;i<v_menuLayer.children.length;i++)
      {
         if (v_menuLayer.children[i].style)
         {
            v_menuLayer.children[i].style.pixelLeft = v_left;
         /* need the width of the element, to offset for the next one.
            However, if we take the offsetWidth of a <SPAN> or <DIV> we get the
            width of the BODY.
            Instead, take the offset width + offset left of the first child
            (which assumes there is only one child in the DIV, the link )
            */
            v_child = v_menuLayer.children[i];
            if ((v_child.children.length) > 0)
               {
               v_left += v_child.children[0].offsetWidth
                  + v_child.children[0].offsetLeft
                  + 10 ; // + 10 for some space bewteen

               // set the width of this layer to be just as big as the
               // link inside

               v_menuLayer.children[i].style.width =
               v_menuLayer.children[i].children[0].offsetWidth;
               }
            else
               v_left += v_child.offsetWidth + 10;
         }
      } // menuLayer children
      v_menuLayer.style.pixelWidth  = v_left;
      v_menuLayer.style.visibility = "visible";
      // now set up the width for the menuLists
      // for each menuList, loop through the children and choose the widest
      for (i=1;i<=9;i++)
         {
            v_width = 0;
            if (document.all["menuList" + i])
             {
              for (j=0;j<10;j++)
               {
                  if (!document.all["menuItem" + i + j])
                     continue;
                  if (v_width <
                  (v_this_width =
                     document.all["menuItem" + i + j].offsetWidth + 20)
                     )
                  v_width = v_this_width;
                 
               }
              document.all["menuList" + i].style.pixelWidth = v_width;
             } // if document.all["menuList" + i]
         } // loop through all the menuLists

   } // isIE4
}
function assignLayerName(v_layer)
{
     /* this is only for Navigator 4 */
 if (!isNav4) return;
 var i=0;j=0; //make sure they are local
     /* for each link in this layer, assign the new layer property
        (layer is the parent layer of the link) */
     /* I use document.layers because
        document.layers["example"].layers ===
        document.layers["example"].document.layers
        and it works more elegantly */
     {
        
        for (j=0;j<v_layer.document.links.length;j++)
            {
               v_layer.document.links[j].parentLayer =
                  v_layer;
            }                        
     /* this layer may have children layers, so get them too */
        if (v_layer.document.layers && v_layer.document.layers.length > 0)
           for (i=0;i<v_layer.document.layers.length;i++)
              {
                 // recurse: for each array of child layers, run this function
                
                  assignLayerName(v_layer.document.layers[i]);
              }

     }

}
/* initialisation code */
var hiliteBar; //important global
if (isNav4 && document.layers.menuBar) menuShow(document.layers.menuBar,"yellow");
if (isIE4 && document.all.menuBar) menuShow(document.all.menuBar,"yellow");

if (isNav4)
{ 
   /* assign the layer name to all links */
   assignLayerName(window); // recurses through the document


   document.captureEvents(Event.MOUSEOUT|Event.MOUSEOVER);
   document.onMouseOut = docMouseOut;
   document.onMouseOver = docMouseOver;


   /*
   Notes: a layer only raises an event if it is absolute
   */

}

if (isIE4)
   {
       document.onmouseover = docMouseOver;
       document.onmouseout = docMouseOut;
   }