/****** eggMenu 1.0 by Stefano N. Roncari <eggsist ltd> *****
	Notes:
	1) CLASS of the menu <A> item must be the same as ID of submenu <UL>.
	2) it's NECESSARY to set class="sel" for the default menu <LI> in the HTML.
	3) it's recommended to set class="on" for a submenu <UL> item in the HTML. It will avoid temporary invisibility until "document.onLoad".
	4) clearTimemout(hideTimer) is called when mouseover: menus, submenus, pointer.
******/

function menuInit()
{
	/* 1) Initialize global vars */
	menuOver = false;
	myMenuDiv = document.getElementById('menu');
	if (myMenuDiv) { //some pageStyles have submenu but not menu
		myMenuDiv.getElementsByClassName=getElementsByClassName;
		defaultMenu = myMenuDiv.getElementsByClassName('sel')[0].getElementsByTagName('a')[0];
		/* 2) Initialiaze Main Menus */
		menuA = myMenuDiv.getElementsByTagName('a');
		for (i=0; i<menuA.length; i++)
		{
			menuA[i].menuSwitch=menuSwitch; //prepare method for later
			menuA[i].findPos=findPos; //prepare method for later
			addEvent(menuA[i],'mouseover',menuSwitch);
			addEvent(menuA[i],'mouseout',restoreDefault);
		}
		/* 3) Initialize subMenus */
		subMenuDiv = document.getElementById('subMenus');
		addEvent(subMenuDiv,'mouseover',function(){clearTimeout(hideTimer)}); //any value is ok. but not 'defaultMenu'
		addEvent(subMenuDiv,'mouseout',restoreDefault);
		/* 4) Initialize pointer */
		pointer = document.getElementById('menuPoint');
		pointer.moveMe = moveMe;
		addEvent(pointer,'mouseover',function(){clearTimeout(hideTimer)}); //any value is ok. but not 'defaultMenu'
		/* 5) Start! (show default pointer) */
		restoreDefault();
	}
}

function menuSwitch()
{
	/* THIS is the "a" object of each Main Menu */
	subMenusDiv = document.getElementById('subMenus');
	subMenusULs = subMenusDiv.getElementsByTagName('ul');
	for (a=0; a<subMenusULs.length; a++) { 
		subMenusULs[a].className = ''; //hide all subMenus
		theId = subMenusULs[a].id;
		theParent = document.getElementsByClassName(theId)[0];
		if (theParent && theParent!=defaultMenu) {theParent.style.color='#000';} //turn off all Main Menus
	}
	reqSubMenu = document.getElementById(this.className);
	reqSubMenu.className='on'; //show the requested subMenu
	/* Change subMenus' colors and position */
	if (this==defaultMenu) {
		subMenusDiv.style.background='#efefef';
		pointer.style.background='#efefef';
	}
	else {
		this.style.color='#ff9900'; //turn on the related Main Menu
		subMenusDiv.style.background='#f9f399';
		pointer.style.background='#f9f399';
		reqSubMenu.style.paddingLeft=0; //reset padding (we need to check the width later!)
		newLeft = this.parentNode.offsetLeft + 130 - (reqSubMenu.offsetWidth/2); //supposed position
		newLeft = (newLeft>0) ? newLeft : 0;
		availWidth = this.parentNode.parentNode.offsetWidth; //room actually available (total width of the menu UL)
		reqSubMenu.style.paddingLeft = (newLeft+reqSubMenu.offsetWidth<availWidth) ? newLeft+"px" : availWidth-reqSubMenu.offsetWidth+80+"px";
	}
	menuOver=this;
	clearTimeout(hideTimer);
	pointer.moveMe();
}

function restoreDefault()
{
	hideTimer = setTimeout("defaultMenu.menuSwitch();",250);
}

function moveMe()
{
	/* THIS is the pointer div. It is positioned according to the 'menuOver'. */
	menuOver.findPos(); //we gotta call it everytime, coz the window may be resized
	this.style.display='block';
	this.style.left=menuOver.posLeft+ "px";
	this.style.top=menuOver.posTop+23+ "px";
}

addEvent(window,'load',menuInit);
