/**
 *  Javascript Menu Rollouts
 *  Created for STEG.de by Benjamin Mack on 2007-10-04
 */

var Menu = {

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

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

	// 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.parentNode : null);
		if (!li) return;

		// close all other submenus
		if (li.parentNode.hasClass('popupnav')) {
			this.hideSubmenu('popupnav2');
			this.hideSubmenu('popupnav3');
		} else if (li.parentNode.hasClass('popupnav2')) {
			this.hideSubmenu('popupnav3');
		}

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

		this.registerSubMenus(menu);

		var coords = li.getCoordinates();
		if (menu.hasClass('popupnav')) {
			menu.setStyle('top',  coords.top + 42);
			menu.setStyle('left', coords.left);
		} else if (menu.hasClass('popupnav2') || menu.hasClass('popupnav3')) {
			menu.setStyle('top',  coords.top);
			menu.setStyle('left', coords.left + coords.width + 1);
		}

		var cb = function(event) { Menu.hide(event); };
		menu.addEvent('mouseleave', cb, 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) return;
		var menu = li.parentNode;
		var menuId = menu.getAttribute('id');
		var nextMenuId1 = nextMenu.getAttribute('id');
		var nextMenuId2 = nextMenu.parentNode.getAttribute('id');
		var nextMenuId3 = nextMenu.parentNode.parentNode.getAttribute('id');
		// close all popups if the "entered" target is non of the popup
		if ((!nextMenuId1 || !nextMenuId1.match(/popupnav/)) && 
		    (!nextMenuId2 || !nextMenuId2.match(/popupnav/)) &&
		    (!nextMenuId3 || !nextMenuId3.match(/popupnav/))) {
			this.hideSubmenu('popupnav');
			this.hideSubmenu('popupnav2');
			this.hideSubmenu('popupnav3');
		}
	},

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

	getSubmenu: function(parent) {
		var submenu = parent.getFirst();
		do {
			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();
		} while (submenu);
		return null;
	}
}

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