/********************************************************************* 
	NOTE: Needs jQuery library as it uses it for node manipulation
**********************************************************************/


var FlyOutMenu = function(_id, _leftAdjust, rootPath)
{
	/*** initialize elements ***/
	var menu_id = _id;
	var menu_selector = "#" + _id;
	var leftAdjust = _leftAdjust;
	var primaryLevel = document.getElementById(menu_id);
	var browser = navigator.userAgent;
	
	AttachLIEvents();	
												
	if(browser.indexOf('MSIE 6') >= 0)
	{	
		FixIE6RoundedCorners();									
	}
	else (browser.indexOf('MSIE') >= 0)
	{
		FixIEWidths(); // for both IE6/7
	}
		
	/*** private methods ***/
	
	/* Goes through all LI's and attach mouseover events to them */
	function AttachLIEvents()
	{
		var listElems = primaryLevel.getElementsByTagName("li");
	
		for(var i=0; i < listElems.length; ++i)
		{			
			AttachMouseOvers(listElems[i]);
			AttachMouseOuts(listElems[i]);		
		}					
	}
	
	function AttachMouseOvers(elem)
	{
		elem.onmouseover = function(event)
		{																			
			ShowChildMenu(this, event);
			SimulateCssLIHover(this, "visible");		
		} 								
	}
	
	function AttachMouseOuts(elem)
	{
		// if mouse out of LI's parent UL, then hide the UL	
		elem.parentNode.onmouseout = function(event)
		{		
			HideULs(this);				

			// to stop event bubbling that causes flickering in FF2 MAC*/
			if(IsMacFirefox2())
			{					
				e = event || window.event; 
				if(e.stopPropagation) {e .stopPropagation() };
			}  			
		}			
		
		// simulate the LI hover in IE6 since it doesnt support hover on LI elements
		elem.onmouseout = function()
		{
			SimulateCssLIHover(this, "hidden");			
		}
	}	
		
	/* shows an item's submenu if it has one. currentElem should be an LI. */
	function ShowChildMenu(currentElem)
	{										
		var hasChildMenu = HasChildMenu(currentElem);		
		var parentElem = currentElem.parentNode;										
		var childElem = currentElem.getElementsByTagName('ul')[0];
				
		if(hasChildMenu)
		{
			// mmw- PositionShadow(childElem, "#shadowDIV");
																				
			if(parentElem.id != menu_id)
			{	
				/* level2's and level3's height has to match.
				   this figures out which is taller and sets height accordingly */														
				if(parentElem.offsetHeight > childElem.offsetHeight)
				{								
					childElem.style.height = parentElem.offsetHeight + "px";																							
				}
				else
				{
					parentElem.style.height = childElem.offsetHeight + "px";
				}	
				
				// positions level3 to the right of level2						
				childElem.style.left = (parentElem.offsetWidth - leftAdjust) + "px";
				// mmw- PositionShadow(childElem, "#shadowDIV2");
			}			
			childElem.style.visibility = "visible";			
		}			
	}
	
	// find position of flyout menu in relation to container_id argument (or window if container not passed in)
	function FindPos(obj, container_id) 
	{
		var curleft = curtop = 0;	
		
		if (obj.offsetParent) 
		{
			do 
			{
				curleft += obj.offsetLeft;
				curtop += obj.offsetTop;
				obj = obj.offsetParent;
				
				// modified so we only return position in relation to this container
				if ((typeof container_id == "string") && (obj.id == container_id))
				{
					break;
				}
			} while (obj);	
		}
		
		return [curleft,curtop];
	}
	
	/* place shadow position in same area as child menu w/ helper function FindPos() */
	function PositionShadow(childElem, id)
	{
		var childElemPos = FindPos(childElem, "center");
		var shadowLeft = childElemPos[0] - 3;
		var shadowTop = childElemPos[1] + 6;
		var shadowWidth = childElem.offsetWidth + 6;
		var shadowHeight =  childElem.offsetHeight;		
		jQuery(id).css("left", shadowLeft + "px");
		jQuery(id).css("top", shadowTop + "px");
		jQuery(id).css("width", shadowWidth + "px");
		jQuery(id).css("height", shadowHeight + "px");
		jQuery(id).css("display", "block");			
		jQuery(id + "bottom").css("width", shadowWidth + "px");
		jQuery(id + "bottom").css("left", shadowLeft + "px");
		jQuery(id + "bottom").css("top", shadowTop + shadowHeight + "px");
		jQuery(id + "bottom").css("display", "block");
		jQuery(id).css("background", "transparent url(/assets/images/nav/nav_rollover_menu.jpg) repeat-x bottom left");
	}	
	
	function HasChildMenu(currentElem)
	{
		var elems = jQuery("ul", currentElem);		
		return (elems.length > 0);		
	}
	
	/* Hides all UL's under given element */
	function HideULs(elem)
	{	
		var ULs = jQuery("ul", elem);
		jQuery(ULs).css("visibility", "hidden");
		jQuery(ULs).css("height", "auto");	
		// mmw- jQuery("#shadowDIV").css("display", "none");	
		// mmw- jQuery("#shadowDIV2").css("display", "none");
		// mmw- jQuery("#shadowDIVbottom").css("display", "none");				
		// mmw- jQuery("#shadowDIV2bottom").css("display", "none");
	}
		
	/* Since IE6 only supports hover on <a> elements and does not support child selectors,
	   we have to simulate the li:hover for maintaining on states
	*/	
	function SimulateCssLIHover(elem, toggleStr)
	{
		if(browser.indexOf('MSIE 6') >= 0)
		{		
			KeepLevel1OnState(elem, toggleStr);		
			KeepLevel2OnState(elem, toggleStr);											
		}										
	}	
	
	/* Keeps the on state for Level 1 under all subnodes */
	function KeepLevel1OnState(elem, toggleStr)
	{
		var anchorElems = elem.getElementsByTagName("a");
														
		if(anchorElems.length > 0)		
		{		
			if(toggleStr == "visible") anchorElems[0].parentNode.style.backgroundPosition = "bottom";
			else anchorElems[0].parentNode.style.backgroundPosition = "top";
		}	
	}
	
	/* Keeps the on state for Level 2 under all subnodes */
	function KeepLevel2OnState(elem, toggleStr)
	{
		var tertiaryLIs = jQuery(menu_selector + " ul ul li");
		
		for(var i=0; i < tertiaryLIs.length; ++i)
		{
			if(tertiaryLIs[i] == elem)
			{
				if(toggleStr == "visible")
				{					
					jQuery(elem.parentNode.parentNode).css("backgroundColor", "white");
					jQuery("> a", elem.parentNode.parentNode).css("color", "#A51E39");
				}
				else
				{
					jQuery(elem.parentNode.parentNode).css("backgroundColor", "");
					jQuery("> a", elem.parentNode.parentNode).css("color", "");			
				}
			}
		}	
	}	
	
	/* fix for IE not knowing (via style) how wide it's UL's are */
	function FixIEWidths()
	{			
		var ulElems = primaryLevel.getElementsByTagName("ul");	
		for(var i=0; i < ulElems.length; ++i)
		{
			var newWidth = (ulElems[i].offsetWidth < 226) ? 225 : ulElems[i].offsetWidth;
			ulElems[i].style.width = newWidth + "px";						
			// ulElems[i].className += " ul_" + i;  // Keep for Debug purposes					
		}	
	}		
	
	/* IE6 can't have LI's absolutely positioned, so we have to use a DIV for IE6 for the bottom rounded corner
	   and remove the original LI node */
	function FixIE6RoundedCorners()
	{	
		// fixes top 
		jQuery(menu_selector + " ul .level2top div").css("backgroundPosition", "top right");	
		
		// fixes bottom
		var liElems = primaryLevel.getElementsByTagName("li");
			
		for(i=0; i < liElems.length; ++i)
		{
			if(liElems[i].className == "level2bottom")
			{
				liElems[i].removeNode();
			}
		}						
	}	
	
	function IsMacFirefox2()
	{
		return ((browser.indexOf("Macintosh") >= 0) && (browser.indexOf("Firefox/2") >= 0));
	}	

	function IsMacSafari()
	{
		return ((browser.indexOf("Microsof") >= 0) && (browser.indexOf("Safari") >= 0));
	}	
	
	function IsPCSafari()
	{
		return ((browser.indexOf("Window") >= 0) && (browser.indexOf("Safari") >= 0));
	}	

	if(IsMacSafari())
	{					
		$("#navElements a").css("font-size", "11px");
	};

	if(IsPCSafari())
	{					
		$("#mainNav > ul > li > a").css("font-size", "10px");
		$("#mainNav").css("padding", "24px 0 0 25px");
	};

}

/* fix for very weird bug in IE6 where UL's that are absolutely positioned take up the rest of the screen. 
   Normal browsers:  
       1) CSS are applied. UL gets absolute positioning 
	   2) determines width based on UL's content because of absolute positioning	   
   IE6:
       1) Browser determines width before CSS are applied. Width determined based on a statically 
	      positioned block level content (default behavior to takes up rest of the space)
       2) CSS then applied (too late)
	   
   We call this function right after opening element so we can set absolute before IE6 prematurely determines width 
*/
function FixULinIE6(_id)
{
	jQuery("#" + _id + " ul").css("position", "absolute");							
}