var subNavControl;

/****** SETUP *******
->Your tabs should be created as usual for the state template
->DO NOT include navigate.js
->Include this file
->Set the LI element that is your current website to class="nav_default_on" (required for this to work)
->MUST BE FIRED ON PAGE LOAD
->At the bottom of the page a window.onload is set... if you are using a YUI or some other event
	framework you may want to use that instead if you have trouble, 
	-> IF SO SET _useExternalEvents below to 1 else 0;
*********************/

var _useExternalEvents = 1;

/* California State Template */
/* Alternative to navigate.js */
/* Adds delay to the mouseout event on template subtabs making it easier to navigate to them */
/* Created By - Justin Merz */
function subNavControl(){
	this.navListUL = document.getElementById("nav_list");

	/* @array: [ [Parent Tab <LI>, Sub Tabs <UL>], [Parent Tab, Sub Tabs], ...... ] */
	this.tabs = new Array();

	this.mainSubTab;

	/* show element's (tab) sub-tabs */
	this.show = function(ele){
		// get the tab array id from the element id
		var tabId = parseInt(ele.id.replace("tempTabId_",""));
		// hide all sub-tabs that are not the one we are interested in
		for( var i in subNavControl.tabs ){
			if( i != (tabId-1) ){
				// if the main tab is not the current page tab, then make it "off" color
				// ie... remove the mouse_over from its class name
				if( subNavControl.tabs[i][0].className != "nav_default_on" ){
					subNavControl.tabs[i][0].className = "";
				}
				// actually hide the sub tab
				subNavControl.tabs[i][1].style.visibility = "hidden";
			}
		}
		// show subTabs we are interested in
		subNavControl.tabs[tabId-1][1].style.visibility = "visible";
		// if not the current page tab, add the mouse_over css (color based on template color schema)
		if( subNavControl.tabs[tabId-1][0].className != "nav_default_on" ){
			subNavControl.tabs[tabId-1][0].className = "mouse_over";
		}
		// clear any timeout that is waiting to fire
		// this cancels the action because all tabs are already in a 
		// display state we whish them to be in.
		if( subNavControl.timeoutId ){
			clearTimeout( subNavControl.timeoutId );
		}
	}

	/* this is called on mouseout, basically sets a timeout to return to
	   the current home tab in 1 second.  This is cancelled by a mouseover
	   event on a new tab, for this would no longer be needed */
	this.hide = function(ele){
		var tabId = parseInt(ele.id.replace("tempTabId_",""));
		// set this object timeout ID and set the tab we wish to fire on
		subNavControl.timeoutId = setTimeout( "subNavControl.afterTimeout("+tabId+")", 1000 );
	}

	// notice this loop is part of the class construction.
	/* This loop finds the Main Tabs and the Sub Tabs, stores them in an array
	   and sets up the mouseover and mouseout events.  As well as gives the tabs ids
	   based on their postion the in this classes array. */
	for( var i in this.navListUL.childNodes ){
		// this check is need because some browsers add #text nodes that should be ignored... 
		if( this.navListUL.childNodes[i].tagName && this.navListUL.childNodes[i].tagName.match(/li/i) ){
			// sub tab lists are childs of the parent li so loop through and find them
			for( var j in this.navListUL.childNodes[i].childNodes ){
				// once again check the sub tab list is a UL element and not some other element
				if( this.navListUL.childNodes[i].childNodes[j].tagName && this.navListUL.childNodes[i].childNodes[j].tagName.match(/ul/i) ){
					// set the main sub tab variable, used by afterTimeout to return the main sub tabs to visibility
					if( this.navListUL.childNodes[i].className == "nav_default_on" ){
						this.mainSubTab = this.navListUL.childNodes[i].childNodes[j];
					}
					// add found tabs to the tabs array
					this.tabs.push( new Array( this.navListUL.childNodes[i],  this.navListUL.childNodes[i].childNodes[j] ) );
					// set generic functions to mouseover/mouseout events
					// Note: this method of setting events seems to be the best cross-browser way to go
					this.navListUL.childNodes[i].onmouseover = function(){subNavControl.show(this)};
					this.navListUL.childNodes[i].onmouseout = function(){subNavControl.hide(this)};
					// set tab id .. noticed based on array order
					this.navListUL.childNodes[i].id = "tempTabId_"+this.tabs.length;
					break;
				}
			}
		}
	}

	// called after 1 second of a mouseout of a tab, clears any shown alternative
	// tabs and returns the site to its "main" tab visibile state
	this.afterTimeout = function(tabId){
		// if not main tab (has class nav_defualt_on) hide
		if( this.tabs[tabId-1][0].className != "nav_default_on" ){
			this.tabs[tabId-1][0].className = "";
			this.tabs[tabId-1][1].style.visibility = "hidden";
		}
		// show main tab
		this.mainSubTab.style.visibility = "visible";
		// timeout has fired, so clear objects timeout ID
		this.timeoutId = 0;
	}
}

if( !_useExternalEvents ){
	function addLoadEvent(func) {
	        var oldonload = window.onload;
	        if (typeof window.onload != 'function') {
	                window.onload = func;
	        } else {
	                window.onload = function() {
	                        if (oldonload) {
	                                oldonload();
	                        }
	                        func();
	                }
	        }
	}
	addLoadEvent(function(){
		subNavControl = new subNavControl();
	}); // Add initNavigation to the page onload event handler
} else {
	// Place your external event code here
	YAHOO.util.Event.onDOMReady(function(){
		subNavControl = new subNavControl();
	});
}