var g_allTabContainers = null;

	/**
	* This is a hack to handle hover problem with IE browsers
	*/
	function ieHover()
	{
		var sfEls = document.getElementById("menu").getElementsByTagName("LI");
		for (var i=0; i<sfEls.length; i++)
		{
			sfEls[i].onmouseover=function()
			{
				this.className+=" iehover";
			}
			sfEls[i].onmouseout=function()
			{
				this.className=this.className.replace(new RegExp(" iehover\\b"), "");
			}
		}
	}
	
	/**
	* wahmdrive has no global page header that i can use to add the custom cascading
	* menu. Since wahmdrive does not support server side scripting where including html
	* fragment in a web page would have been ideal, a workaround is being created.
	* I've decided to just place the custom cascading menu into the global page footer and then
	* move them out to the top later on once the page is loaded.
	*/
	function placeMenuOnTop()
	{
		var qasMenu = document.getElementById("qasmenu");
		if ( qasMenu )
		{
			var qasMenuContainer = document.getElementById("qasmenucontainer");
			if ( qasMenuContainer )
			{
				qasMenuContainer.innerHTML = "";
				qasMenuContainer.appendChild(qasMenu);
			}
		}
	}
	
	/**
	* add functions to execution once the document has been loaded.
	*
	*/
	function addLoadListener(fn) 
	{ 
		if (typeof window.addEventListener != 'undefined') 
		{ 
			window.addEventListener('load', fn, false); 
		} 
		else if (typeof document.addEventListener != 'undefined') 
		{ 
			document.addEventListener('load', fn, false); 
		}
		else if (typeof window.attachEvent != 'undefined') 
		{ 
			window.attachEvent('onload', fn); 
		} 
		else 
		{ 
			var oldfn = window.onload; 
			if (typeof window.onload != 'function') 
			{ 
				window.onload = fn; 
			} 
			else 
			{ 
				window.onload = function() 
				{ 
					oldfn(); 
					fn(); 
				}; 
			} 
		} 
	}
	
	/*
	* initialize all tab containers that are present on the page
	*/
	function initAllTabContainers()
	{
		g_allTabContainers = null;
		var allDivs = document.getElementsByTagName("div");
		var tabCounter = 0;
		for (var i = 0; i < allDivs.length; i++)
		{
			var elem = allDivs[i];
			if ( elem.className == "tabContainer" )
			{
				var elemID = elem.id;
				if ( !elemID )
				{
					elemID = "tab" + tabCounter;
					elem.id = elemID;
					tabCounter = tabCounter + 1;
				}

				// if g_allTabContainers is not yet initialized, initialize it.
				if ( !g_allTabContainers ) g_allTabContainers = new Array();

				g_allTabContainers[elemID] = elem;
				initTabContainerLinks(g_allTabContainers[elemID]);
				initTabContainerEvents(g_allTabContainers[elemID]);
			}
		}

	}

	/*
	*
	* @param element initialize the events for the tab container
	*/
	function initTabContainerEvents(tab)
	{

		if ( !tab ) return;

		// Do not process anything if there are no links
		var tabLinks = tab.tabLinks;
		if ( !tabLinks ) return;

		// Assign onclick events to the tab links, and
		// highlight the first tab
		var i = 0;

		for ( var id in tabLinks )
		{
			tabLinks[id].onclick = showTab;
			tabLinks[id].onfocus = function() { this.blur() };
			if ( i == 0 ) tabLinks[id].className = 'selected';
			i++;
		}

		var contentDivs = tab.contentDivs;
		if ( !contentDivs ) return;

		// Hide all content divs except the first
		var i = 0;

		for ( var id in contentDivs )
		{
			if ( i != 0 ) contentDivs[id].className = 'tabContent hide';
			i++;
		}

	}

	/*
	* @param element initialize the links for each tab in the tab container
	*/
	function initTabContainerLinks(tab)
	{
		var tabListItems = null;
		if ( tab )
		{
			var ulTab = tab.getElementsByTagName("ul");
			if ( ulTab )
			{
				tabListItems = ulTab[0].childNodes; //get the first item from the list as this only support one unordered list.
			}
		}

		// Grab the tab links and content divs from the page
		if ( tabListItems )
		{
			tab.tabLinks = new Array();
			tab.contentDivs = new Array();
			for ( var i = 0; i < tabListItems.length; i++ )
			{
				if ( tabListItems[i].nodeName == "LI" )
				{
					var tabLink = getFirstChildWithTagName( tabListItems[i], 'A' );
					var id = getHash( tabLink.getAttribute('href') );

					tab.tabLinks[id] = tabLink;
					tab.contentDivs[id] = document.getElementById( id );
				}
			}
		}
	}

	/*
	* Find the tab container from a list of tab containers based on the id of the selected tab
	* @param String selectedId is the id of the tab being selected
	*/
	function findTabContainer(selectedId)
	{
		for ( var id in g_allTabContainers )
		{
			var tab = g_allTabContainers[id].tabLinks[selectedId];
			if ( tab )
			{
				return g_allTabContainers[id];
			}
		}
		return null;
	}

	/*
	* Show the content of the selected tab and hide all other tabs within the same tab container
	*/
	function showTab()
	{
		var selectedId = getHash( this.getAttribute('href') );
		var tab = findTabContainer(selectedId);
		if ( !tab ) return false;

		// Highlight the selected tab, and dim all others.
		// Also show the selected content div, and hide all others.
		for ( var id in tab.contentDivs )
		{
			var contentDiv = tab.contentDivs[id];
			if ( contentDiv )
			{
				if ( id == selectedId )
				{
					tab.tabLinks[id].className = 'selected';
					contentDiv.className = 'tabContent';
				} else {
					tab.tabLinks[id].className = '';
					contentDiv.className = 'tabContent hide';
				}
			}
		}

		// Stop the browser following the link
		return false;
	}

	/*
	* Based on the tagName, find the first child of the given element.
	* @param element the element to search on
	* @param String tagName is the node name of the child element
	*/
	function getFirstChildWithTagName( element, tagName )
	{
	  for ( var i = 0; i < element.childNodes.length; i++ )
	  {
		if ( element.childNodes[i].nodeName == tagName ) return element.childNodes[i];
	  }
	}

	/*
	* Basically gets the string name based on the url with the slash
	* @param String url is the href url specified in an anchor
	*/
	function getHash( url )
	{
	  var hashPos = url.lastIndexOf ( '#' );
	  return url.substring( hashPos + 1 );
	}