// the timeout for the menu
var timeout = 3000;

// window.onload=initMenu;

// creat timeout variables for list item
// it's for avoid some warning with IE
for(var i = 0; i < 100; i++){
	eval("var timeoutli" + i + " = false;");
}

// this fonction apply the CSS style and the event
function initMenu(){     // a test to avoid some browser like IE4, Opera 6, and IE Mac
	if (browser.isDOM1 && !(browser.isMac && browser.isIE) && !(browser.isOpera && browser.versionMajor < 7) && !(browser.isIE && browser.versionMajor < 5)){        // get some element
		var menu = document.getElementById('menu'); // the root element
		var lis = menu.getElementsByTagName('li'); // all the li
		menu.className='menu'; // change the class name of the menu, 
		     
    for(var i = 0; i < lis.length; i++){	// i am searching for ul element in li element
			if(lis.item(i).getElementsByTagName('ul').length > 0){	// is there a ul element ?        
				if(browser.isIE){	// improve IE key navigation
					addAnEvent(lis.item(i),'keyup',show);// link events to list item
				}
				addAnEvent(lis.item(i),'mouseover',show);
				addAnEvent(lis.item(i),'mouseout',timeoutHide);
				addAnEvent(lis.item(i),'blur',timeoutHide);
				addAnEvent(lis.item(i),'focus',show);
				lis.item(i).setAttribute('id',"li"+i);	// add an id to list item
			}
		}
	}
}

function addAnEvent(target, eventName, functionName){
	if(browser.isIE){	    // apply the method to IE
		eval('target.on'+eventName+'=functionName');	//attachEvent dont work properly with this
	}else{	// apply the method to DOM compliant browsers
		target.addEventListener( eventName , functionName , true ); // true is important for Opera7
	}
}
    
function timeoutHide(){	// hide the first ul element of the current element
	eval("timeout" + this.id + " = window.setTimeout('hideUlUnder( \"" + this.id + "\" )', " + timeout + ");");	// start the timeout
}

function hideUlUnder(id){   // hide the ul elements under the element identified by id
	document.getElementById(id).getElementsByTagName('ul')[0].style['visibility'] = 'hidden';
}

function show(){	// show the first ul element found under this element
	this.getElementsByTagName('ul')[0].style['visibility'] = 'visible';	// show the sub menu
	var currentNode = this;
	while(currentNode){
		if(currentNode.nodeName == 'LI'){
			currentNode.getElementsByTagName('a')[0].className = 'linkOver';
		}
		currentNode=currentNode.parentNode;
	}
	eval ("clearTimeout( timeout"+ this.id +");");	// clear the timeout
	hideAllOthersUls(this);
}

function hideAllOthersUls(currentLi){	// hide all ul on the same level of  this list item
	var lis = currentLi.parentNode;
	for(var i = 0; i < lis.childNodes.length; i++){
		if(lis.childNodes[i].nodeName == 'LI' && lis.childNodes[i].id != currentLi.id){
			hideUlUnderLi(lis.childNodes[i]);
		}
	}
}

function hideUlUnderLi(li){	// hide all the ul wich are in the li element
	var as = li.getElementsByTagName('a');
	for(var i = 0; i < as.length; i++){
		as.item(i).className="";
	}
	var uls = li.getElementsByTagName('ul');
	for(var i = 0; i < uls.length; i++){
		uls.item(i).style['visibility'] = 'hidden';
	}
}