/*---------------------------------------------------------------------
	JavaScript DOM Dynamic Dropdown Menu JS

	REQUIREMENTS:
		Works in conjunction with /assets/css/widgets/dropdowns.css 
			and related /skins/skin/skin_wdgt_dropdowns.css subfolder
		Utilizes functions found in /assets/js/functions.js
	
	USAGE:
		Make sure function InitMenuDropdowns() is called in the window.onload event 
		
-----------------------------------------------------------------------*/

/*-------------------------------
	general setup
---------------------------------*/

//	Initialization of essential variables
var iMenuWidth = 0;
var iMainNavX = 0; 
var iMainNavY = 0;
var sNavImgPath = "/assets/images/skin/pepc/nav/";

var sOnSuffix = "_on";
var sOverSuffix = "_over";
var sOnParentSuffix = "_on";					//	"_on_arrowright";
var sOverParentSuffix = "_over";				//	"_on_arrowright";

var bHorizontalNav = false;					//	Horizontal or Vertical
var bUseNavImages = true;

//	Initialization of temporary variables
var imgTemp = new Image();

//	Initialization of values when top level has a differnt width than subs.
var bUseDiffImgLevels = false;
var iFirstLevelWidth = 0;					//186;
var iFirstLevelHomeWidth = 0;					//191;

//	Extra Padding can occur when top levels have different widths than subs.
var iExtraPadding = 0;
var iExtraPaddingVal = 0;					//36;
var iExtraPaddingHomeVal = 0;					//41;

//	Menu Shade is a colored background behind rollover sub ULs (First CESI design)
var bUseMenuShade = false;
var bDebugDropdowns = false;


/*-------------------------------
	InitMenuDropdowns() - called from window.onload event
---------------------------------*/
var InitMenuDropdowns = function() {
	if (!document.getElementById) return
	InitMenuDropdownLists();
	
	//	Debug info to be deleted later
	if (bDebugDropdowns) {
		dropdownsDebug();
		addTextToDebug("iMenuWidth = " + iMenuWidth);
		addTextToDebug("iMainNavX = " + iMainNavX);
		addTextToDebug("iMainNavY = " + iMainNavY);
	}
}


/*-------------------------------
	InitMenuDropdownLists()
	
		parse semantic lists; apply classes/rollover functions via DOM
---------------------------------*/
var InitMenuDropdownLists = function() {

	var mainNavRoot = document.getElementById("Nav");

	//	Reset widths and X/Y coords based on main navigation node
	iMenuWidth = mainNavRoot.offsetWidth;
	iMainNavX = GetAbsXPosByNode(mainNavRoot);
	iMainNavY = GetAbsYPosByNode(mainNavRoot);
	
	//alert(iMenuWidth + ", " + iMainNavX + ", " + iMainNavY);
	
	//	Build Menu Shade Container if applicable
	if (bUseMenuShade) {
		oMenuShadeContainer = document.createElement("div");
		oMenuShadeContainer.id = 'MenuShadeContainer';
		mainNavRoot.parentNode.appendChild(oMenuShadeContainer);	// append to NavBlock
	}
						
	//	Set First Level widths and padding if applicable
	if (bUseDiffImgLevels) {
		var oBodyTag = document.getElementsByTagName('body')[0];
		if (oBodyTag.id == 'HomePage') {
			iFirstLevelWidth = iFirstLevelHomeWidth;
			iExtraPaddingVal = iExtraPaddingHomeVal;
		}
	}
	
	//	now that "Nav" is found, dive down and apply styles and events to semantic list menu items.
	oDiveNode = getFirstChild(getFirstChild(mainNavRoot));
	InitMenuDropdownListsDive(oDiveNode, 0);
}

/*-------------------------------
	InitMenuDropdownListsDive()
	
		check current node, do appropriate recursion
---------------------------------*/
var InitMenuDropdownListsDive = function(oCurrentNode, iLevel) {

	if (oCurrentNode.nodeName=="UL") {

		if (!cssClassActions('check',oCurrentNode,"SelectedSubs")) {
			cssClassActions('add',oCurrentNode,'MenuListOff');
		}
	}

	if (oCurrentNode.nodeName == "LI") {
		/*	Following onmouseover and onmouseout replace below 2 addEvent() function calls above until I can figure out why 
			IE doesnt get correct LI target when attachEvent is used.
				addEvent(oCurrentNode, 'mouseover', MenuListItemOnMouseOver, false);
				addEvent(oCurrentNode, 'mouseout', MenuListItemOnMouseOut, false);
		*/
		iCurrentY = GetAbsYPosByNode(oCurrentNode);
		oCurrentNode.onmouseover=function() {
			var j = 0;
			for (j=0; j<this.childNodes.length; j++) {
				if (this.childNodes[j].nodeName=="UL") {
					if (this.childNodes[j].className != 'SelectedSubs') {
						this.childNodes[j].className = 'MenuListOver';
						this.childNodes[j].style.top = this.offsetTop + 'px';
						
						//	Set Extra Padding (if applicable)
						if ( (iLevel == 0) && (bUseDiffImgLevels) ) {
							iExtraPadding = iExtraPaddingVal;
						} else {
							iExtraPadding = 0;
						}

						this.childNodes[j].style.left = this.offsetLeft + iExtraPadding + iMenuWidth + 'px';
						/*if (bUseMenuShade) {
							var menuShadeContainerRoot = document.getElementById("MenuShadeContainer");
							var oMenuShade = document.createElement("div");
							var iDist = this.offsetTop - 1000 +  this.childNodes[j].offsetHeight + 30;
							menuShadeContainerRoot.appendChild(oMenuShade);
							oMenuShade.className = 'MenuShade';
							oMenuShade.style.top = iDist + "px";
							oMenuShade.style.left = this.offsetLeft + iExtraPadding + iMenuWidth + 'px';
							this.oMenuShadeRef = oMenuShade;
							menuShadeContainerRoot.style.left = '0px';
						}
						*/
					}
				}
			}
		}
		oCurrentNode.onmouseout=function() {
			var j = 0;
			for (j=0; j<this.childNodes.length; j++) {
				if (this.childNodes[j].nodeName=="UL") {
					if (this.childNodes[j].className != 'SelectedSubs') {
						this.childNodes[j].className = 'MenuListOff';
						/*if (bUseMenuShade) {
							var menuShadeContainerRoot = document.getElementById("MenuShadeContainer");
							menuShadeContainerRoot.style.left = '-10000px';
							menuShadeContainerRoot.removeChild(this.oMenuShadeRef);
						}
						*/
					}
				}
			}
		}
	}


	if (oCurrentNode.nodeName=="A") {

		var iTotalWidth = iMenuWidth;
		oCurrentNode.style.width = iTotalWidth + 'px';
		
		//oCurrentNode.style.margin = '0';
		//oCurrentNode.style.padding = '0';
		//oCurrentNode.style.border = '0';

		if (cssClassActions('check',oCurrentNode,"MenuLink")) {
			addEvent(oCurrentNode, 'mouseover', MenuLinkOnMouseOver, false);
			addEvent(oCurrentNode, 'mouseout', MenuLinkOnMouseOut, false);
		}
		if (cssClassActions('check',oCurrentNode,"NavImg")  && bUseNavImages) {
			addEvent(oCurrentNode, 'mouseover', NavImgOnMouseOver, false);
			addEvent(oCurrentNode, 'mouseout', NavImgOnMouseOut, false);
			if (cssClassActions('check',oCurrentNode,"SelectedNav")) {
				var bHasULSibling = false;
				for (k=0; k < oCurrentNode.parentNode.childNodes.length; k++) {
					if (oCurrentNode.parentNode.childNodes[k].nodeName=="UL") {
						bHasULSibling = true;
					}
				}
				if (bHasULSibling == true) {
					sOn = sOnParentSuffix;
				} else {
					sOn = sOnSuffix;
				}
			} else {
				if (cssClassActions('check',oCurrentNode,"SelectedParent")) {
					sOn = sOnParentSuffix;
				} else {
					sOn = "";
				}
			}
			oCurrentNode.iLevel = iLevel;
			if (bUseDiffImgLevels) {
				sLevel = "L" + iLevel + "/";
			} else {
				sLevel = "";
			}
			oCurrentNode.style.backgroundImage = "url(" + sNavImgPath + sLevel + oCurrentNode.id + sOn + ".gif)";

			if ((bUseDiffImgLevels) && (iLevel == 1)) {
				oCurrentNode.style.width = iFirstLevelWidth + 'px';
				oCurrentNode.style.backgroundPosition = '20px 0';
			}
			
			//	Use letter-spacing image replacement for Win IE 5.0; Use text-indent image replacement for all browsers except Win IE 5.0
			oCurrentNode.style.backgroundRepeat = "no-repeat";
			oCurrentNode.style.letterSpacing = "-1000em";
			oCurrentNode.style.textIndent = "-9000px";
		}
	}


	/*---------------
		Recursion.  Gotta deal with XML whitespace in DOM:
	---------------*/
	if (getFirstChild(oCurrentNode)) {
		InitMenuDropdownListsDive(getFirstChild(oCurrentNode), iLevel + 1);
	}
	if (getNextSibling(oCurrentNode)) {
		InitMenuDropdownListsDive(getNextSibling(oCurrentNode), iLevel);
	}
}



/*-------------------------------
	HighlightParents()
	
		Bubble up from oCurrentNode to highlight the parent nodes.
---------------------------------*/
function HighlightParents(oCurrentNode) {
	oParentListItem = oCurrentNode.parentNode.parentNode.parentNode;
	for (k=0; k < oParentListItem.childNodes.length; k++) {
		if (oParentListItem.childNodes[k].nodeName=="A") {
			cssClassActions('swap',oParentListItem.childNodes[k],'MenuLink','MenuLinkOver');
			if (cssClassActions('check',oParentListItem.childNodes[k],"NavImg")) {
				
				if (bUseDiffImgLevels) {
					sLevel = "L"+oParentListItem.childNodes[k].iLevel+"/";
				} else {
					sLevel = "";
				}
				
				var bHasULSibling = false;
				
				for (l=0; l < oParentListItem.childNodes[k].parentNode.childNodes.length; l++) {
					if (oParentListItem.childNodes[k].parentNode.childNodes[l].nodeName=="UL") {
						bHasULSibling = true;
					}
				}
				
				if (bHasULSibling == true) {
					swapCSSBkgdImg(oParentListItem.childNodes[k], sNavImgPath + sLevel + oParentListItem.childNodes[k].id + sOnParentSuffix + '.gif');
				} else {
					swapCSSBkgdImg(oParentListItem.childNodes[k], sNavImgPath + sLevel + oParentListItem.childNodes[k].id + sOverSuffix + '.gif');
				}	
			}
			HighlightParents(oParentListItem.childNodes[k]);
		}
	}
}



/*-------------------------------
	UnHighlightParents()
	
		Bubble up from oCurrentNode to unhighlight the parent nodes.
---------------------------------*/
function UnHighlightParents(oCurrentNode) {
	oParentListItem = oCurrentNode.parentNode.parentNode.parentNode;
	for (k=0; k < oParentListItem.childNodes.length; k++) {
		if (oParentListItem.childNodes[k].nodeName=="A") {
			cssClassActions('swap',oParentListItem.childNodes[k],'MenuLinkOver','MenuLink');
			if (cssClassActions('check',oParentListItem.childNodes[k],"NavImg")) {
				
				if (cssClassActions('check',oParentListItem.childNodes[k],"SelectedNav")) {
					sOn = sOnSuffix;
				} else {
					sOn = "";
				}
				
				if (cssClassActions('check',oParentListItem.childNodes[k],"SelectedParent")) {
					sOn = sOnParentSuffix;
				} else {
					sOn = "";
				}
				
				if (bUseDiffImgLevels) {
					sLevel = "L"+oParentListItem.childNodes[k].iLevel+"/";
				} else {
					sLevel = "";
				}
				swapCSSBkgdImg(oParentListItem.childNodes[k], sNavImgPath + sLevel + oParentListItem.childNodes[k].id + sOn + '.gif');	
			}
			HighlightParents(oParentListItem.childNodes[k]);
		}
	}
}

/*------------------------------------------------------------------------------------------
	Event Functions
------------------------------------------------------------------------------------------*/


/*-------------------------------
	NavImgOnMouseOver()
	
		Mouse Over function for items with NavImg class
---------------------------------*/
function NavImgOnMouseOver(e) {
	//alert('NavImgOnMouseOver ' + TargetObj(e));
	if (bUseDiffImgLevels) {
		sLevel = "L"+TargetObj(e).iLevel+"/";
	} else {
		sLevel = "";
	}
	//addTextToDebug("sLevel = " + sLevel);
	var bHasULSibling = false;
	for (k=0; k < TargetObj(e).parentNode.childNodes.length; k++) {
		if (TargetObj(e).parentNode.childNodes[k].nodeName=="UL") {
				bHasULSibling = true;
		}
	}
	if (bHasULSibling == true) {
		sNewImage =  sNavImgPath + sLevel + TargetObj(e).id + sOnParentSuffix + '.gif';
	} else {
		sNewImage = sNavImgPath + sLevel + TargetObj(e).id + sOverSuffix + '.gif';
	}
	swapCSSBkgdImg(TargetObj(e), sNewImage);
}


/*-------------------------------
	NavImgOnMouseOut()
	
		Mouse Out function for items with NavImg class
---------------------------------*/
function NavImgOnMouseOut(e) {
	//alert('NavImgOnMouseOut ' + TargetObj(e));
	if (cssClassActions('check',TargetObj(e),"SelectedNav")) {
		var bHasULSibling = false;
		for (k=0; k < TargetObj(e).parentNode.childNodes.length; k++) {
			if (TargetObj(e).parentNode.childNodes[k].nodeName=="UL") {
					bHasULSibling = true;
			}
		}
		if (bHasULSibling == true) {
			sOn = sOnParentSuffix;
		} else {
			sOn = sOnSuffix;
		}
	} else {		
		if (cssClassActions('check',TargetObj(e),"SelectedParent")) {
			sOn = sOnParentSuffix;
		} else {
			sOn = "";
		}
	}	
	if (bUseDiffImgLevels) {
		sLevel = "L"+TargetObj(e).iLevel+"/";
	} else {
		sLevel = "";
	}
	swapCSSBkgdImg(TargetObj(e), sNavImgPath + sLevel + TargetObj(e).id + sOn + '.gif');
}


/*-------------------------------
	MenuLinkOnMouseOver()
	
		Mouse Over function for items with MenuLink class
---------------------------------*/
function MenuLinkOnMouseOver(e) {
	//alert('MenuLinkOnMouseOver ' + TargetObj(e));
	cssClassActions('swap',TargetObj(e),'MenuLink','MenuLinkOver');
	HighlightParents(TargetObj(e));
}


/*-------------------------------
	MenuLinkOnMouseOver()
	
		Mouse Out function for items with MenuLink class
---------------------------------*/
function MenuLinkOnMouseOut(e) {
	//alert('MenuLinkOnMouseOut ' + TargetObj(e));
	cssClassActions('swap',TargetObj(e),'MenuLinkOver','MenuLink');
	UnHighlightParents(TargetObj(e));
}


/*-------------------------------
	MenuListItemOnMouseOver()
	
		Mouse Over function for Menu List Items
---------------------------------*/
function MenuListItemOnMouseOver(e) {
	//alert('MenuListItemOnMouseOver ' + TargetObj(e).nodeName);
	//addTextToDebug('<'+TargetObj(e).nodeName+'> = ' + TargetObj(e).id)
	for (k=0; k < TargetObj(e).childNodes.length; k++) {
		
		if (TargetObj(e).childNodes[k].nodeName=="UL") {
			if (!cssClassActions('check',TargetObj(e).childNodes[k],"SelectedSubs")) {
				cssClassActions('swap',TargetObj(e).childNodes[k],'MenuListOff','MenuListOver');
				TargetObj(e).childNodes[k].style.top = TargetObj(e).offsetTop + 'px';
				TargetObj(e).childNodes[k].style.left = TargetObj(e).offsetLeft + iMenuWidth + 'px';
			}
		}
	}	
}


/*-------------------------------
	MenuListItemOnMouseOut()
	
		Mouse On function for Menu List Items
---------------------------------*/
function MenuListItemOnMouseOut(e) {
	//alert('MenuListItemOnMouseOut ' + TargetObj(e));
	for (k=0; k < TargetObj(e).childNodes.length; k++) {
		if (TargetObj(e).childNodes[k].nodeName=="UL") {
			if (!cssClassActions('check',TargetObj(e).childNodes[k],"SelectedSubs")) {
				cssClassActions('swap',TargetObj(e).childNodes[k],'MenuListOver','MenuListOff');
			}
		}
	}
}


/*-------------------------------
	dropdownsDebug()
	
		Debug functions for dropdowns
---------------------------------*/
function dropdownsDebug() {
	if (bDebugDropdowns) {
		debugInfoRoot = document.getElementById("DebugInfo");

		/*---------------
			Use DOM to add debug information to <div id="DebugInfo"></div>
		---------------*/

		oDebugTag = document.createElement("p");
		oDebugStrongTag = document.createElement("strong");
		oDebugStrongText = document.createTextNode("Main Nav Width: ");
		oDebugStrongTag.appendChild(oDebugStrongText);
		oDebugTag.appendChild(oDebugStrongTag);
		oDebugText = document.createTextNode(iMenuWidth);
		oDebugTag.appendChild(oDebugText);
		
		addNodeToDebug(oDebugTag);

		oDebugTag = document.createElement("p");
		oDebugStrongTag = document.createElement("strong");
		oDebugStrongText = document.createTextNode("Main Nav Coordinates: ");
		oDebugStrongTag.appendChild(oDebugStrongText);
		oDebugTag.appendChild(oDebugStrongTag);
		oDebugText = document.createTextNode("(" + iMainNavX + ", " + iMainNavY + ")");
		oDebugTag.appendChild(oDebugText);
		addNodeToDebug(oDebugTag);
	}
}

/*---------------
	Add to window.onload event
---------------*/
addEvent(window, 'load', InitMenuDropdowns, false);

/*---------------------------------------------------------------------
	end NSS Dynamic Dropdown Menu JS
-----------------------------------------------------------------------*/