/**
 *  Javascript Menu Rollouts
 */

var Menu = {
	idMainMenu: 'header-menu',
	classesSubMenu: { level1: 'popupnav', level2: 'popupnav2', level3: 'popupnav3' },
	openedMenuItem: null,

	// register all items from the mainnav
	init: function() {
		var nav = $(this.idMainMenu);
		this.registerSubMenus(nav);
	},

	// sets methods for entering / leaving list items of the instances
	registerSubMenus: function(menu) {
		var li = menu.getFirst();
		var callback1 = function(event) { Menu.show(event); };
		var callback2 = function(event) { Menu.hide(event); };
		do {
			li.removeEvents();
			li.addEvent('mouseenter', callback1, true);
			li.addEvent('mouseleave', callback2, true);
		} while (li = li.getNext());
	},

	// is used when hovering over a list item
	// when hovered, the respective submenu (if exists) should
	// be displayed
	show: function(evt) {
		var li = (evt && evt.target ? evt.target : null);
		if (li.tagName == 'A') { li = li.parentNode; }
		if (!li) return;

		// take the submenu
		var menu = this.getSubmenu(li);
		if (!menu) return;

		li.addClass('hover');
		this.openedMenuItem = li;

		var coords = li.getCoordinates();
		menu.setStyle('top',  coords.top);
		menu.setStyle('left', coords.left);

		var callback = function(event) { Menu.hide(event); };
		menu.addEvent('mouseleave', callback, true);
		menu.setStyle('display', 'block');
	},

	// this is used when leaving a list item
	hide: function(evt) {
		var li = (evt && evt.target ? evt.target.parentNode : null);
		var nextMenu = (evt && evt.relatedTarget ? evt.relatedTarget : null);
		if (!li || !li.parentNode) return;

		var mainMenu = li.parentNode;
		var mainMenuId = mainMenu.getAttribute('id');
		var nextMenuId1 = (nextMenu) ? nextMenu.getAttribute('id') : false;
		var nextMenuId2 = (nextMenu && nextMenu.parentNode) ? nextMenu.parentNode.getAttribute('id') : false;
		var nextMenuId3 = (nextMenu && nextMenu.parentNode && nextMenu.parentNode.parentNode) ? nextMenu.parentNode.parentNode.getAttribute('id') : false;
		// close all popups if the "entered" target is non of the popup
		if ((!nextMenuId1 || (nextMenuId1 && !nextMenuId1.match(/popupnav/))) && 
		    (!nextMenuId2 || (nextMenuId2 && !nextMenuId2.match(/popupnav/))) &&
		    (!nextMenuId3 || (nextMenuId3 && !nextMenuId3.match(/popupnav/)))) {
			if (this.openedMenuItem) {
				this.openedMenuItem.removeClass('hover');
			}
			this.hideSubmenu(this.classesSubMenu.level1);
		}

	},

	hideSubmenu: function(cls) {
		if ($(cls)) {
			$(cls).setStyle('display', 'none');
		}
	},

	getSubmenu: function(parent) {
		var submenu = parent.getFirst();
		while (submenu) {
			if (submenu.nodeName == 'UL') {
				var m = submenu.clone();
				var cls = submenu.getProperty('class');
				m.setAttribute('id', cls);
				if (!$(cls)) {
					document.body.appendChild(m);
				} else {
					$(cls).replaceWith(m);
				}
				return $(cls);
			}
			submenu = submenu.getNext();
		}
		return null;
	}

}

window.addEvent('domready', function() { Menu.init(); } );
//window.addEvent('load', function() { Menu.init(); } );

