/**
 * nav.js
 * 
 * Makes the menu happen.  Assumes the following structure, id's, and classes:
 * 	<ul id="navigation" .. >
 *		<li [class="active"]>
 *			...
 *			<ul class="sub_navigation">
 *				<li [class="active"]>
 *					...
 *				</li>
 *				...
 *			</ul>
 *		</li>
 *		...
 *	</ul>
 * It is assumed that one or no top level <li> is classed with "active".
 * To set a sub menu item as the active page, make sure to class the parent
 * nav item as well.
 */

 	/**
	 * Globals
	 */
	var activeItem = null;			// a reference to the top level active nav item
	var subNavs = new Array();		// holds references to sub nav <ul>'s
									// in order to set their css left property

	/**
	 * Sets the global menu x position.
	 * Called during initialization and on window resize events.
	 */
	function setMenuXPos ()
	{
		var nav = document.getElementById('navigation');
		var body = document.getElementsByTagName('body');
		var menuXPos = 0;

		// Determine the menu's left x value
		body = body[0];
		menuXPos = Math.floor((body.offsetWidth - nav.offsetWidth) / 2);

		// loop through the global array of all the sub navs and set the x position
		for (var i = 0; i < subNavs.length; i++)
		{
			subNavs[i].style.left = menuXPos + 'px';
		}
		// ensure's the active item's sub menu is visible onload
		if ((activeItem != null) && (activeItem.subNav != null))
		{
			activeItem.subNav.style.display = 'block';
		}
	}

	/**
	 * createMenu
	 * 
	 * Creates the navigation menu 
	 * Assumes some set id's and classes.
	 */
	function createMenu() 
	{
		if (!document.getElementById) 
		{
			return;		// old browser bail out
		}

		navRoot = document.getElementById('navigation');

		for (i = 0; i < navRoot.childNodes.length; i++) 
		{
			navItem = navRoot.childNodes[i];
			if (navItem.nodeName.toLowerCase() == 'li') 
			{
				if (navItem.className.indexOf('active') > -1)
				{
					activeItem = navItem;
				}

				setSubNav(navItem);

				navItem.onmouseover = setNavItemOver;
				navItem.onmouseout = setNavItemOut;
			}
		}
		//var msg = 'set ' + navItems.length + ' nav items\n';
		//msg += 'set ' + subNavs.length + ' sub navs\n';
		//alert(msg);
		setMenuXPos();
	}
	// Event handlers for nav items (<li>'s)
	function setNavItemOver (e) { setMenuOver(this, this.subNav); }
	function setNavItemOut (e) { setMenuOut(this, this.subNav); }

	/**
	 * setSubNav
	 * 
	 * Given a parent <li> representing a navigation list item, 
	 * this function will register the mouseover/mouseout
	 * events for the sub navigation <ul> element
	 * This also adds the following references:
	 *	navItem.subNav - a quick reference to the sub menu <ul>
	 *	subNav.parentNavItem - a quick reference to the parent <li>
	 */
	function setSubNav (navItem)
	{
		var ul;
		var uls = navItem.getElementsByTagName('UL');

		// No sub nav ul element for this nav item
		if (uls.length < 1)
		{
			return;
		}
		ul = uls[0];
		navItem.subNav = ul;		// create a quick referency
		ul.parentNavItem = navItem;
		subNavs.push(ul);
		ul.onmouseover = setSubNavOver;
		ul.onmouseout = setSubNavOut;
	}	
	// Event handlers for sub nav menus (<ul>'s)
	function setSubNavOver (e) { setMenuOver(this.parentNavItem, this); }
	function setSubNavOut (e) { setMenuOut(this.parentNavItem, this); }


	/**
	 * setMenuOver
	 *
	 * Clears the active menu item and shows the menu item and sub menu
	 * that is currently receiving the mouse over event.
	 * See above comment for setting the active menu item.
	 */
	function setMenuOver (navItem, subNav)
	{
		if (activeItem != null)
		{
			activeItem.className = '';
			if (activeItem.subNav != null)
			{
				activeItem.subNav.style.display = 'none';
			}
		}

		navItem.className = 'over';
		if (subNav != null)
		{
			subNav.style.display = 'block';
		}
	}

	/**
	 * setMenuOut
	 *
	 * Clears menu items and shows the active menu item.
	 * See above comment for setting the active menu item.
	 */
	function setMenuOut (navItem, subNav)
	{
		if (activeItem == null)
		{
			navItem.className = '';
			if (subNav != null)
			{
				subNav.style.display = 'none';
			}
			return;
		}
		// If this is the active 'always on' nav item, drop out
		if (activeItem.id == navItem.id)
		{
			return;
		}

		// Reset the active 'always on' nav item
		if (activeItem != null)
		{
			activeItem.className = 'active';
			// if this nav item has a sub menu, make sure it's displayed too
			if (activeItem.subNav != null)
			{
				activeItem.subNav.style.display = 'block';
			}
		}
		else
		{
			alert('here');
		}

		// finally, hide the moused out nav and sub menu
		navItem.className = ''; 
		if (subNav != null)
		{
			subNav.style.display = 'none';
		}
	}

	/**
	 * clearGlobals
	 *
	 * Clears global references.
	 */
	function clearGlobals ()
	{
		activeItem = null;
		subNavs = null;
		setMenuXPos = null;
	}

	// Register event handlers
	YAHOO.util.Event.addListener(window, 'load', createMenu);
	YAHOO.util.Event.addListener(window, 'unload', clearGlobals);
	YAHOO.util.Event.addListener(window, 'resize', setMenuXPos);

	// Select all the text in the search box so the first input from 
	// the user will erase it
	YAHOO.util.Event.addListener(window, 'load', clearSearchOnFocus);
	function clearSearchOnFocus ()
	{
		YAHOO.util.Event.addListener(document.getElementById('search_terms'), 'focus', 
			function() { if (this.value == 'Search BCHD') { this.value = ''; }  });
		YAHOO.util.Event.addListener(document.getElementById('search_terms'), 'blur', 
			function() { if (this.value == '') { this.value = 'Search BCHD'; }  });
	}