var MainMenu = Class.create();

Object.extend(MainMenu, {
	currentMenu: null,
	showDropDown: false,

	initialize: function(){
		/* hide the menu when the body is clicked */
		// Event.observe( document.body, 'click', this.deselectMenu.bind(this) );
		Event.observe( document.body, 'mousemove', this.deselectMenu.bind(this) );
				
		var menuItems = $$("#mainMenu a.dropdown");
		for(var i=0; i<menuItems.length; i++){
			var menuItem = menuItems[i];
					
			/* Show the drop down when the top item is clicked */
			//Event.observe(menuItem, 'click', this.selectMenu.bind(this) );
			
			/* Allow hovering over other menus */
			//Event.observe(menuItem, 'mousemove', this.hoverSelectMenu.bind(this) );
			Event.observe(menuItem, 'mousemove', this.selectMenu.bind(this) );
		}
	},
		
	selectMenu: function(event){
		var elm = Event.element(event);
		var a = ((elm.tagName == "SPAN") ? elm.parentNode : elm);
		var li = a.parentNode;
		
		if(li == this.currentMenu) {
			//this.deselectMenu();
			Event.stop(event);
			return;
		}
		
		/* Remove currently selected drop down */
		if(this.currentMenu){
			li.className = (li.className.indexOf("selected")!=-1) ? 'selected levelOne dropdown' : 'levelOne dropdown';
		}
		
		li.className = (li.className.indexOf("selected")!=-1) ? 'selected hover levelOne dropdown' : 'hover levelOne dropdown';
		
		this.currentMenu = li;
		this.showDropDown = true;

		a.blur();
		
		Event.stop(event);
	},
	
	deselectMenu: function(event){
	  var elm = Event.element(event);
	  if (elm.parentNode == $('dd') || elm.parentNode.parentNode == $('dd')) {
	    //alert(elm.parentNode)
	    Event.stop(event);
	    return;
	  }
	  
		this.showDropDown = false;
		if(this.currentMenu){
			this.currentMenu.className = (this.currentMenu.className.indexOf("selected")!=-1) ? 'selected levelOne dropdown' : 'levelOne dropdown';
			this.currentMenu = null;
		}
	},
	
	hoverSelectMenu: function(event){
		var elm = Event.element(event);
		var a = ((elm.tagName == "SPAN") ? elm.parentNode : elm);
		var li = a.parentNode;
		
		if(this.showDropDown == true && a.className == 'levelOne dropdown' && this.currentMenu != li){
			this.deselectMenu(event);
			this.selectMenu(event);
		}
	}
});