/*
 * menuDropdown.js - implements an dropdown menu based on a HTML list
 * Author: Dave Lindquist (http://www.gazingus.org)
 *
 * Updated by Graeme Humphries (unit3@demoni.ca) to:
 * - open popups on mouseover
 * - close popups on document click
 * - handle multiple menu groups (so-as to have a top menu and side menu)
 */

var currentMenus = new Array();
var groupDisplay = new Array();
var groupOffsetX = new Array();
var groupOffsetY = new Array();
var actAbsolute = new Array();
var actHorizontal = new Array();

if (!document.getElementById) {
  document.getElementById = function() { return null; }
}

function initializeMenu(menuId, actuatorId, menuGroup, abso_bool, horizBool, offsetX, offsetY) {
  var menu = document.getElementById(menuId);
  var actuator = document.getElementById(actuatorId);
  
  if (menu == null || actuator == null) return;
  
  // we need somewhere to pop the old display value from
  groupDisplay[menuGroup] = menu.style.display;
  groupOffsetX[menuGroup] = offsetX;
  groupOffsetY[menuGroup] = offsetY;
  // and somewhere to store whether this is absolutely positioned or not
  actAbsolute[actuatorId] = abso_bool;
  // and somewhere to store if this is a horizontal or vertical popup
  actHorizontal[actuatorId] = horizBool;

  // we need these for referencing in show and hide functions
  actuator.menuGroup = menuGroup;
  actuator.actuatorId = actuatorId;
  
  actuator.onmouseover = function() {
    this.showMenu();
  }
	
	actuator.onmouseout = function() {
		this.hideMenu();
	}

  actuator.onclick = function() {
    if (currentMenus[this.menuGroup] == null) {
      this.showMenu();
    } else {
      this.hideMenu();
    }

    return true;
  }

  actuator.hideMenu = function() {
    // hide the currently visible menu
    if (currentMenus[this.menuGroup] != null) {
      if (groupDisplay[this.menuGroup] != null) {
        currentMenus[this.menuGroup].style.display = groupDisplay[menuGroup];
      } else {
        currentMenus[this.menuGroup].style.display = "none";
      }
      currentMenus[this.menuGroup] = null;
    }
  }

  actuator.showMenu = function() {
    // only do something if we're *changing* the active menu
    if (currentMenus[this.menuGroup] == menu) return;

    // hide anything active in our group!
    this.hideMenu();
    
    // we have some elements which aren't absolutely positioned, so
    // leave them alone!
    if (actAbsolute[this.actuatorId] == true) {
      if (actHorizontal[this.actuatorId] == true) {
        menu.style.top = this.offsetTop + this.parentNode.parentNode.offsetTop + groupOffsetY[this.menuGroup] + "px";
        menu.style.left = this.parentNode.offsetWidth + this.scrollWidth + groupOffsetX[this.menuGroup] + "px";
      } else {
        menu.style.left = (this.offsetLeft + groupOffsetX[this.menuGroup]) + "px";
        menu.style.top = this.offsetHeight + groupOffsetY[this.menuGroup] + "px";
      }
    }

    menu.style.display = "block";
    currentMenus[this.menuGroup] = menu;
	}

  // make the first none-absolutely positioned one visible by default
  if (currentMenus[this.menuGroup] == null){
    if (actAbsolute[this.menuGroup] == false) {
      actuator.showMenu();
    }
  }
}