/* =====================================================
	
		navigation.js
		scott brisko (sbrisko@newinteractive.com)
		3/15/2005
		
		Major portions adapted from Danny Goodman's 
		Javascript & DHTML Cookbook item 10.8.
		
		Client side javascript to control the drop down menus
	
	
	====================================================== */


	// Global variables
	var g_isCSS, g_isW3C, g_isIE4, g_isNN4, g_isIE6CSS;
	
	// global holder for the menu information
	var g_menus = new Array();
	
	// Initialize upon load to let all browsers establish content objects
	function initJS() 
	{
	    if (document.images) 
	    {
	        g_isCSS = (document.body && document.body.style) ? true : false;
	        g_isW3C = (g_isCSS && document.getElementById) ? true : false;
	        g_isIE4 = (g_isCSS && document.all) ? true : false;
	        g_isNN4 = (document.layers) ? true : false;
	        g_isIE6CSS = (document.compatMode && document.compatMode.indexOf("CSS1") >= 0) ? true : false;
	    }
	    
	    if(document.getElementById && document.styleSheets)
	    {
	    	setTimeout("initMenus()",5);	
	    }
	}
	
	// Set event handler to initialize API
	window.onload 	= initJS;
	
	function initMenus()
	{
		if(menus.length > 0)
		{
			for(var mcount = 0; mcount < menus.length; mcount++)
			{
				// main menu items to be given event handlers
				var elementArray = new Array('mm_arrow_div_','mm_arrow_img_','mm_text_div_','mm_text_link_');
				for(var eacount = 0; eacount < elementArray.length; eacount++)
				{
					var elementId = elementArray[eacount] + menus[mcount].id;
					document.getElementById(elementId).onmouseover 	= swap;	
					document.getElementById(elementId).onmouseout 	= swap;	
				}
				
				// sub menu items to be given event handlers
				elementArray = new Array('sm_ac_','sm_al_','sm_tc_','sm_tl_');
				for(var subc = 0; subc < menus[mcount].subcount; subc++)
				{
					for(var eacount = 0; eacount < elementArray.length; eacount++)
					{
						var elementId = elementArray[eacount] + menus[mcount].id + '_' + subc;
						document.getElementById(elementId).onmouseover 	= toggleHighlight;	
						document.getElementById(elementId).onmouseout 	= toggleHighlight;	
					}			
				}
			}
		}
		
		if((document.getElementById && document.styleSheets) && !g_isIE6CSS)
		{
			// por la moz
			window.onunload = cancelAll();
		}
	}
	
	// Initialize timer global for show/hides
	var timer;
	
	// called from within mouseovers on menu items to keep mouseout of menubars
	function keepMenu()
	{
		clearTimeout(timer);	
	}
	
	function cancelAll()
	{
		keepMenu();	
	}

	// called from mouseouts to clear out menus with a 1/45 second delay
	function requestHide()
	{
		timer = setTimeout('hideMenus()',250);		
	}
	
	// close all open menus
	function hideMenus()
	{
		var divArray = document.getElementsByTagName("div");
		for(var dacount = 0; dacount < divArray.length; dacount++)
		{
			if(divArray[dacount].className == 'nav_menu')
			{
					divArray[dacount].style.visibility = 'hidden';
			}	
		}	
	}
	
	function getElementPosition(elemID) 
	{
		var offsetTrail = document.getElementById(elemID);
		var offsetLeft = 0;
		var offsetTop = 0;
		while (offsetTrail) 
		{
	    	offsetLeft += offsetTrail.offsetLeft;
	    	offsetTop += offsetTrail.offsetTop;
	    	offsetTrail = offsetTrail.offsetParent;
		}
		if (navigator.userAgent.indexOf("Mac") != -1 && typeof document.body.leftMargin != "undefined") 
		{
	    	offsetLeft += document.body.leftMargin;
	    	offsetTop += document.body.topMargin;
		}
		return {left:offsetLeft, top:offsetTop};
	}

	function showMenu(section_id)
	{
		keepMenu();
		hideMenus();
		var arrowEl				= "mm_arrow_div_" + section_id;
		var menuEl				= "menu_" + section_id;
		var pos 				= getElementPosition(arrowEl);
		var menuDiv				= document.getElementById(menuEl);
		var menuElWidth			= parseInt(menuDiv.style.width);
		menuDiv.style.top 		= (pos.top + 15)+ 'px';
		menuDiv.style.left		= (pos.left - 5)+ 'px';
		if(menuElWidth != 0 && !isNaN(menuElWidth))
		{
			menuDiv.style.visibility= "visible";
		}
	}
	
	function swap(evt)
	{
		evt = (evt) ? evt : ((event) ? event: null);
		if(evt && (document.getElementById && document.styleSheets))
		{
			var elem = (evt.target) ? evt.target : evt.srcElement;
			var splitId 	= elem.id.split('_');
			var sectionId	= splitId[(splitId.length -1)];
			var linkElem = 'mm_text_link_' + sectionId;
			
			if(evt.type == 'mouseover')
			{
				document.getElementById(linkElem).className = 'main_nav_on';
				showMenu(sectionId);	
			}
			else if(evt.type == 'mouseout')
			{
				requestHide();
				document.getElementById(linkElem).className = 'main_nav_off';
			}	
			evt.cancelBubble = true;
		}	
	}
	
	function toggleHighlight(evt)
	{
		/*
			This may need some attention to make it a little more dynamic,
			ala no magic identifiers
		*/
		
		evt = (evt) ? evt : ((event) ? event: null);
		var elem = (evt.target) ? evt.target : evt.srcElement;
		if(elem.nodeType == 3)
		{
			elem = elem.parentNode;	
		}
		var splitEl 		= elem.id.split('_');
		var sectionId		= splitEl[splitEl.length -2];
		var itemId			= splitEl[splitEl.length -1];
		var elementArray 	= new Array('sm_ac_','sm_al_','sm_tc_','sm_tl_');
		for (var eac = 0; eac < elementArray.length; eac++)
		{
			elementArray[eac] = elementArray[eac] + sectionId + '_' + itemId;	
		}
		
		if(evt.type == 'mouseover')
		{
			keepMenu();
			document.getElementById(elementArray[0]).className = 'sub_nav_arrow_box_on';
			document.getElementById(elementArray[1]).className = 'sub_nav_arrow_on';
			document.getElementById(elementArray[2]).className = 'sub_nav_text_box_on';
			document.getElementById(elementArray[3]).className = 'sub_nav_text_on';
		}
		else
		{
			document.getElementById(elementArray[3]).className = 'sub_nav_text_off';
			document.getElementById(elementArray[2]).className = 'sub_nav_text_box_off';
			document.getElementById(elementArray[1]).className = 'sub_nav_arrow_off';
			document.getElementById(elementArray[0]).className = 'sub_nav_arrow_box_off';
			requestHide();	
		}
		evt.cancelBubble = true;
	}