/* submenu.js 

This script will provide dropdown menus
Requires prototype.js

need to:
* foreach submenu
* get coordinates of parent menu item
* find height of parent element
* set coordinates of child menu to: left value of parent, and top + height of parent.

*/

function Menu(button,menu) {
	this.button = button;
	this.menu = menu;
}

Menu.prototype.initialize = function() {
	var thisMenu = this;
		thisMenu.button.onmouseover = function () {
			thisMenu.showMenu();
		}
		thisMenu.button.onmouseout = function () {
			thisMenu.rollOff();
		}
		if (this.menu != null) {
			thisMenu.menu.onmouseover = function () {
				thisMenu.cancelTimer();
			}
			thisMenu.menu.onmouseout = function () {
				thisMenu.rollOff();
			}
		}
}

Menu.prototype.cancelTimer = function () {
	clearTimeout(this.timer);
}

Menu.prototype.rollOff = function () {
	var closeMenu = "menuObjects["+this.id+"].hideMenu()";
	this.timer = setTimeout(closeMenu,1000);
}

Menu.prototype.showMenu = function () {
	for (i=0;i<menuObjects.length;i++) {
		menuObjects[i].hideMenu();
		menuObjects[i].cancelTimer();
	}
	if (this.menu != null) {
	this.menu.style.display = "block";
	this.button.className += " hover";
	}
}

Menu.prototype.hideMenu = function () {
	if (this.menu != null) {
	this.menu.style.display = "none";
	this.button.className = "dropdown";
	}
}


// initialize menus //

var menuObjects = new Array();

Event.observe(window, 'load', function() {
	var menus = $$("a.dropdown");
	for (var y=0; y < menus.length; y++) {
		var submenuID = "dropdown-"+menus[y].id;
		var submenu = $(submenuID);
		menuObjects[y] = new Menu(menus[y],submenu);
		menuObjects[y].id = y;
		menuObjects[y].initialize();
		var position = menus[y].positionedOffset();
		menuObjects[y].left = position[0];
		menuObjects[y].top = position[1];
		menuObjects[y].height = menus[y].getHeight();
		//menuObjects[y].width = menus[y].getWidth();
		submenu.style.top = (menuObjects[y].top + menuObjects[y].height)+"px";
		submenu.style.left = menuObjects[y].left + "px";
		//submenu.style.width = menuObjects[y].width + "px";
	}
});