menu_timer = false;
Event.observe(window, "load", function() {	
	Event.observe($('top_menu'), "mouseout", function(event) {
		menu_timer = setTimeout(function() { hide_menu() }, 1000);
	});
	
	Event.observe($('top_menu'), "mouseover", function(event) {
		var elt = $(Event.element(event)); 
			
		if(elt.nodeName != 'LI') {
			elt.ancestors().each(function(n) {
				if(n.nodeName == 'LI') {
					elt = n;
					throw $break;
				}
			});
		}		
		
		if(elt && elt.descendantOf($('top_menu')) && elt.nodeName == 'LI') {				
			Event.stop(event);
									
			if(menu_timer) {
				clearTimeout(menu_timer);
				menu_timer = false;
			}
			
			var its = $$('.selected_item').findAll(function(e){
				return !elt.descendantOf(e) && !e.descendantOf(elt) && e != elt
			});
			
			elt.addClassName("selected_item");		

			its.each(function(e){ e.select("ul").invoke('hide') });		
			
			its.invoke("removeClassName", "selected_item");
			its.invoke("removeClassName", "leaf");
			
			var ul = elt.childElements().find(function(e) { return e.nodeName == 'UL'; });
			if(ul) {
				lis = ul.immediateDescendants('li');
				lis[0].addClassName('first');
				lis[lis.length - 1].addClassName('last');								
				
				if(ul.style.display != 'block') {
					ul.setOpacity(0);
					ul.setStyle({"display":"block"});
					
					ul.setStyle({ marginLeft: '' });					
					
					if(ul.getWidth() + ul.cumulativeOffset().left > document.viewport.getWidth()) {
						margin_left = ul.getStyle('margin-left');
						ul.setStyle({
							marginLeft: '-' + margin_left
						});
					}				
						
					new Effect.Opacity(ul, { from: 0, to: 1, duration: 0.25, queue: 'end' });
				}
			} else
				elt.addClassName('leaf');	
		}		
	});
});

function hide_menu() {
	var its = $$('.selected_item');	
	
	its.each(function(e){ 
		e.select("ul").invoke('hide');
		e.removeClassName('selected_item');
		e.removeClassName('leaf');
	});
}