//-------------------------
/* Class Menu: This provides the functionality for a table based menu system with a top menu bar 
in one table and optional popup menus each in their own table.  Only one level of popup menu is 
supported.  Each menu table should be in an absolutely div, and the popups should all be hidden.  
Each menu item is an individual table cell, and leaf items open pages in the target frame - specified
when the object is created.  There are different menu item types, and the type is identified 
by the prefix of the item's table cell id as follows:  

main_<XXX>   The item is in the top menu bar and is a leaf node.  Clicking it opens <XXX>.html.
popup_<XXX>  The item is in the top menu bar and it opens the submenu div with id = "menu_<XXX>"
sub_<XXX>    The item is in a submenu and is therefore a leaf node.  Clicking it opens <XXX>.html.

Colours can be modified using the editable constants below.  The left hand position of each submenu 
<div> is hard coded into function Menu_shuffleDIVs() and may be edited there.  shuffleDIVs() also needs to 
be edited if you add, delete or rename a submenu div. 

Attach methods onMenuOver, onMenuOut, onMenuDown and onMenuClick to the <td> declaration for each
menu item - they each take a single menuItem parameter which should usually have 'this' passed to it.  
Attach clearPopups to background mouse over events - including the mouse over events for other frames 
in your document to ensure popups are removed correctly when the mouse is no longer over the popup.

If your document has two distinct menu systems (eg at the top and bottom of the document), call 
setOtherMenu() if you want to clear items from the other menu when an item on this menu is selected.  
setOtherMenu takes two parameters - otherMenuPage should be passed a reference to the page containing 
the other menu (the <frame> id) and otherMenu should be passed the name of the Menu object defined
on that page.  (Method clearMenuItems() is used by one menu to clear the selected item in the other 
menu and there should be no need to call it directly.) */

function Menu(target) {
  new OnyxObject().bequeath(this); //Inherit OnyxObject methods

  //Privately used properties
  this.thisMenuItem = null;    //The menu item corresponding to this page
  this.pageSuffix = "";        //Suffix used for pages
  this.target = target;        //The target window
  this.otherMenuPage = null;   //The window object containing the other menu in a two menu system
  this.otherMenu = "";         //The name of the menu object on otherMenuPage 
  this.selectedItem = null;    //Currently selected menu item
  this.selectedSubItem = null; //Currently selected sub-menu item
  this.selectedPopup = null;   //The popup menu for the this.selectedSubItem
  this.currentPopup = null;    //Currently showing popup menu - needn't be this.selectedPopup
  this.popupParent = null;     //The parent menu item for the current popup
  
  //Public properties
  this.menuDefaultColour = "#222222";   //Colour of main menu bar - NB: you also need to change this value for each of the <td> elements in main menu
  this.submenuDefaultColour = "navy";   //Colour of sub menus - NB: you also need to change this value for each of the <td> elements in every submenu
  this.menuOverColour = "gray";         //Mouse over colour for individual menu items
  this.menuSelectedColour = "#ff9933";  //Selected colour for individual menu items
  
  this.AlwaysShowSelectedSubmenu = true; //If true, submenu for current page remains visible even when mouse not over it
  this.HighlightPopupParent = true;      //If true, top menu bar items with submenus change hover colour just as other nodes do
  
  //Public methods
  this.setThisMenuItem = Menu_recordThisMenuItem;
  this.setPageSuffix = Menu_setPageSuffix;
  this.onMenuOver = Menu_onMenuOver;
  this.onMenuOut = Menu_onMenuOut;
  this.onMenuDown = Menu_onMenuDown;
  this.onMenuClick = Menu_onMenuClick;
  this.clearPopups = Menu_clearPopups;
  this.setOtherMenu = Menu_setOtherMenu;
  this.clearMenuItems = Menu_clearMenuItems;  
}

//-----------------------------
//Note the menu item corresponding to this page.  It is highlight - and the user can't click it.
function Menu_recordThisMenuItem(menuItem)
{
  this.thisMenuItem = menuItem;
  this.onMenuDown(menuItem);
}

//-----------------------------
//Note the suffix used for web pages.
function Menu_setPageSuffix(pageSuffix)
{
  this.pageSuffix = pageSuffix;
}

//-----------------------------
//If menu item brings up a popup, then show it.  Show background colour for the menu item, unless 
//it is already selected, or unless it has brought up a popup and this.HighlightPopupParent is false.  
function Menu_onMenuOver(menuItem){
  if (menuItem == this.thisMenuItem)
  {
    return;
  }
   
  if (menuItem.id.substring(0, 6) == "popup_") { //Show popup menu
    var popupName = "menu_" + menuItem.id.substring(6, menuItem.id.length);
    if (this.currentPopup != null) this.currentPopup.style.visibility = "hidden";
    this.currentPopup = document.getElementById(popupName);
    this.currentPopup.style.visibility = "visible";
    if ((this.popupParent != null) && (this.popupParent != this.selectedItem)) this.popupParent.bgColor = this.menuDefaultColour;
    this.popupParent = menuItem;
  } else if (menuItem.id.substring(0, 5) == "main_") { //Clear any showing popup
    if (this.currentPopup != null) this.currentPopup.style.visibility = "hidden";
    if ((this.popupParent != null) && (this.popupParent != this.selectedItem)) this.popupParent.bgColor = this.menuDefaultColour;
    this.currentPopup = null;
    this.popupParent = null;
  }

  if ((menuItem != this.selectedItem) && (menuItem != this.selectedSubItem) && 
    ((menuItem.id.substring(0, 6) != "popup_") || (this.HighlightPopupParent)))
  { 
    if (menuItem.id.substring(0, 6) != "popup_") menuItem.style.cursor = 'hand'; 
    menuItem.bgColor = this.menuOverColour; 
  } 
} 

//-----------------------------
//Restore usual menu item colour when mouse moves away.  If the item is a popup menu parent, however,
//leave it alone while the popup is still visible.
function Menu_onMenuOut(menuItem){
  if (menuItem == this.thisMenuItem)
  {
    return;
  }
   
  menuItem.style.cursor = 'default';
  
  if (menuItem.id.substring(0, 4) == "sub_") {
    if (menuItem != this.selectedSubItem) menuItem.bgColor = this.submenuDefaultColour; 
  } else {
    if ((menuItem != this.selectedItem) && (menuItem != this.popupParent)) menuItem.bgColor = this.menuDefaultColour; 
  }
} 

//-----------------------------
//Note down click, by displaying selected colour - will be removed onMouseOut unless click event occurs
function Menu_onMenuDown(menuItem){ 
  if (menuItem.id.substring(0, 6) == "popup_") return; //Can't select popup menu items
  menuItem.style.cursor = 'default'; 
  menuItem.bgColor = this.menuSelectedColour; 
} 

//-----------------------------
//Menu item click: note the click and load appropriate page
function Menu_onMenuClick(menuItem){ 
var pageName = ""; //The name of the HTML page to bring up, if any

  if (menuItem == this.thisMenuItem)
  {
    return;
  } 

  if (menuItem.id.substring(0, 4) == "sub_") {
    if (this.selectedSubItem != null) this.selectedSubItem.bgColor = this.submenuDefaultColour;
    this.selectedSubItem = menuItem;
    if (this.AlwaysShowSelectedSubmenu) this.selectedPopup = this.currentPopup;    
    this.selectedSubItem.bgColor = this.menuSelectedColour; 

    if (this.popupParent != null) {
      if (this.selectedItem != null) this.selectedItem.bgColor = this.menuDefaultColour;
      this.selectedItem = this.popupParent;
      this.selectedItem.bgColor = this.menuSelectedColour; 
    }
    
    pageName = menuItem.id.substring(4, menuItem.id.length) + this.pageSuffix;
  } else { //Main menu
    if (menuItem.id.substring(0, 6) == "popup_") return; //Can't select popup menu items
    
    if (this.selectedItem != null) this.selectedItem.bgColor = this.menuDefaultColour;
    this.selectedItem = menuItem;
    this.selectedItem.bgColor = this.menuSelectedColour; 
    
    if (this.selectedSubItem != null) {
      this.selectedSubItem.bgColor = this.submenuDefaultColour;
      this.selectedSubItem = null;
      this.selectedPopup = null;
    }
    
    pageName = menuItem.id.substring("main_".length, menuItem.id.length) + this.pageSuffix;
  }
  
  if (pageName != "") {
    this.target.location = pageName;

    if ((this.otherMenuPage != null && this.otherMenuPage[this.otherMenu])) {
      this.otherMenuPage[this.otherMenu].clearMenuItems();
    }
  }
}

//-----------------------------
//Clear current popup - if a popup item is currently selected, then show it.
function Menu_clearPopups() {
  if ((this.currentPopup != null) && (this.currentPopup != this.selectedPopup)) {
    this.currentPopup.style.visibility = "hidden";
    if ((this.popupParent != null) && (this.popupParent != this.selectedItem)) this.popupParent.bgColor = this.menuDefaultColour;
    this.currentPopup = null;
    this.popupParent = null;
  } 

  if ((this.currentPopup == null) && (this.selectedPopup != null)) {
    this.selectedPopup.style.visibility = "visible";
    this.currentPopup = this.selectedPopup;
    parentPopup = null; //No longer known - if we need it, we'll get it when user next selects the item
  }  
}

//-----------------------------
//Record reference to the other menu in a two menu system.
function Menu_setOtherMenu(otherMenuPage, otherMenu) {
  this.otherMenuPage = otherMenuPage; 
  this.otherMenu = otherMenu;         
}

//-----------------------------
//Clear the currently selected items - both in the main menu and any submenu.  This is used
//in a two menu system, by one menu to clear the other.
function Menu_clearMenuItems() {
  if (this.selectedItem != null) {
    this.selectedItem.bgColor = this.menuDefaultColour;
    this.selectedItem = null;
  }
  
  if (this.selectedSubItem != null) {
    this.selectedSubItem.bgColor = this.submenuDefaultColour;
    this.selectedSubItem = null;
    this.selectedPopup = null;
  }
  
  this.clearPopups();
}