// JavaScript Document
// 
// Mara Web User Interface, (c) Geesu 2010, All rights reserved
// Package : popmenus
// Version : 1.0
/* -------------------------------------------------------------------------
	HorizontalTextPopMenuItem
	@Version 0.3
	@param popMenuId : dom element id {String}
	@param popMenuItem : html dom element <li> {DOM Element Object}
	@param popLevelNum : pop level number {int}	
	------------------------------------------------------------------------	
*/
function HorizontalTextPopMenuItem(popMenuId, popMenuItem, popLevelNum) {
	this.popMenuItem = popMenuItem; // dom element <li>
	this.itemLink = this.popMenuItem.getElementsByTagName('a')[0];  // dom element <a>
	this.subPopMenu = this.popMenuItem.getElementsByTagName('ul')[0]; // dom element <ul>	
	this.popMenuItem['__WUI__'] = [];
	this.popMenuItem['__WUI__']['__POPLEVELNUM__'] = popLevelNum; // saving level SubPopMenu in ul item
	this.popMenuItem['__WUI__']['__POPMENUID__'] = popMenuId; // Saving PopMenu ID	
	// Handling on click event for PopMenuItem Link
	this.itemLink.onclick = function() {
		var popMenu = document.getElementById(this.parentNode.__WUI__.__POPMENUID__);
		if(!this.parentNode.__WUI__.__POPLEVELNUM__) {// only for menu level 0
			popMenu.__WUI__.__POPACTIVED__ = true; // we active show onmouseover
			this.onmouseover();
		}		
	}
	// Handling on mouseover event for PopMenuItem Link
	this.itemLink.onmouseover = function () {			
		var subPopMenu = this.parentNode.getElementsByTagName('ul');		
		// checking submenu		
		var popMenu = document.getElementById(this.parentNode.__WUI__.__POPMENUID__);
		if(!this.parentNode.__WUI__.__POPLEVELNUM__) {
			this.className += " " + popMenu.__WUI__.__HOVERSTYLE__; // Styling hover level 0 style
		} else {
			this.parentNode.className = popMenu.__WUI__.__ACTIVESTYLE__; // Styling hover level +1 style
		}
		// Show Only if pop effect actived
		/*if (popMenu.__WUI__.__POPACTIVED__) { */
		
			if(subPopMenu.length > 0) {
				// changing menu style			
				subPopMenu = this.parentNode.getElementsByTagName('ul')[0];					
				if (subPopMenu != null) {				
					this.parentNode.className += " " + popMenu.__WUI__.__ACTIVESTYLE__;
					subPopMenu.style.visibility = 'visible';				
				}
			}
		/*}*/
	}
	// Handling on mouseout event for PopMenuItem Link
	this.itemLink.onmouseout = function () {			
		var subPopMenu = this.parentNode.getElementsByTagName('ul');
		var popMenu = document.getElementById(this.parentNode.__WUI__.__POPMENUID__);
		if(!this.parentNode.__WUI__.__POPLEVELNUM__) {
			// activing level 0 style
			searchClass = popMenu.__WUI__.__HOVERSTYLE__;
			this.className = this.className.replace(searchClass,"");
		} else {
			this.parentNode.className = '';
		}
		if(subPopMenu.length > 0) {
			//this.parentNode.style.backgroundColor = "";						
			subPopMenu = this.parentNode.getElementsByTagName('ul')[0];
			if (subPopMenu != null) {		
			    searchClass = popMenu.__WUI__.__ACTIVESTYLE__;
				this.parentNode.className = this.parentNode.className.replace(searchClass,"");
				subPopMenu.style.visibility = 'hidden';				
			}
		}
	}
	
	// initializing PopSubMenu
	this.initialize = function () {				
		this.subPopMenu = this.popMenuItem.getElementsByTagName('ul')[0];	
		var popMenu = document.getElementById(this.popMenuItem.__WUI__.__POPMENUID__);
		if(this.subPopMenu != null) {
			// styling horizontal or vertical pop style
			if(this.itemLink != null) {
				if (this.popMenuItem.__WUI__.__POPLEVELNUM__) {
					this.itemLink.className += " " + popMenu.__WUI__.__HORIZONTALPOPSTYLE__;
				} else {
					this.itemLink.className += " " + popMenu.__WUI__.__VERTICALPOPSTYLE__;
				}
			}
			// Handling on mouseover - Enable SubPopMenu to show parent
			this.subPopMenu.onmouseover = function () {
				this.style.visibility = 'visible';
				// changing menu style	
				this.parentNode.className = popMenu.__WUI__.__ACTIVESTYLE__;				
			}
			// Handling on mouseout - Enable SubPopMenu to hide itself
			this.subPopMenu.onmouseout = function () {					
				this.style.visibility = 'hidden';
				searchClass = popMenu.__WUI__.__ACTIVESTYLE__;
				this.parentNode.className = this.parentNode.className.replace(searchClass,"");
			}
			
		}		
	}	
}
/*
	------------------------------------------------------------------------------------
	@param popMenuId : Dom element ID
	@param activeStyle : css class {String}
	@param horizontalPopStyle : css class {String}
	@param verticalPopStyle : css class {String}
	------------------------------------------------------------------------------------
*/

function HorizontalTextPopMenu(popMenuId, activeStyle, hoverStyle, horizontalPopStyle, verticalPopStyle) {
	this.popMenuId = popMenuId;	
	this.popMenu = document.getElementById(this.popMenuId);
	this.popMenu['__WUI__'] = []; //  Mara WUI Metadata
	this.popMenu['__WUI__']['__POPACTIVED__'] = true;
	this.popMenu['__WUI__']['__ACTIVESTYLE__'] = activeStyle;	// for actvid popmenu level 0
	this.popMenu['__WUI__']['__HOVERSTYLE__'] = hoverStyle;	 // for actived popmenu level > 0
	this.popMenu['__WUI__']['__HORIZONTALPOPSTYLE__'] = horizontalPopStyle;
	this.popMenu['__WUI__']['__VERTICALPOPSTYLE__'] = verticalPopStyle;
	this.initialize = function () {
		this.popMenu = document.getElementById(this.popMenuId);
		// getting PopMenuItem Level 0
		var menuItems = this.popMenu.childNodes;
		var menuItem = null;
		for (var m = 0; m < menuItems.length; m++) {
			menuItem = menuItems[m];
			if(menuItem.nodeType == 1) { // Dom Element node			
				if(menuItem.tagName.toLowerCase() == "li") { // Dom Element li
					var popMenuItem = new HorizontalTextPopMenuItem(this.popMenuId, menuItem, 0);
					popMenuItem.initialize();
					var subMenuItems = menuItem.getElementsByTagName('li');			
					var subMenuItem = null;
					for (var s = 0; s < subMenuItems.length; s++) {
						subMenuItem = subMenuItems[s];
						// on instancie les menus de niveau > 0
						var subPopMenuItem = new HorizontalTextPopMenuItem(this.popMenuId, subMenuItem, 1);
						subPopMenuItem.initialize();			
					}
				}
			}
		}		

	}
	
}