/* ********************************************************************************
CREATED 05/05 AXG987 per ER Rqst 10855

The file, tabNavigation.js, contains the JavaScript that makes the tab navigation work.
The tab navigation script basically does two things: it changes the stacking 
order or z-index of the elements and changes the background color and textcolor 
of the tab. This is done by simply changing the style property values of elements.
*********************************************************************************** */

/* The tab navigation script. Always use in conjunction with docobj.js! */

// Set up array of tab element style property strings

/* ARRAYs used 
The data in array position 0 for each array has been set to null. This is just a matter of convenience.
tabArray 
	Array holds the style object text strings that are obtained with 
	the getStyleObj() function, which are used in the tab navigation functions
tabArray
	holds the style property strings for the tab1 through tab-n div elements. 
tabTextArray
	holds the style property strings for the tabmiddle1 through tabmiddle-n td elements. 
*/

var tabArray=new Array(6);
tabArray[0]=null;
tabArray[1]=getStyleObj('tab1');
tabArray[2]=getStyleObj('tab2');
tabArray[3]=getStyleObj('tab3');
tabArray[4]=getStyleObj('tab4');

var tabTextArray = new Array(7);
tabTextArray[0]=null;
tabTextArray[1]=getStyleObj('tabmiddle1');
tabTextArray[2]=getStyleObj('tabmiddle2');
tabTextArray[3]=getStyleObj('tabmiddle3');
tabTextArray[4]=getStyleObj('tabmiddle4');

/*
The variable, active, is used as a holder to see which element is the one on top.
The other variables hold color values and are used to color the tabs and tab text.
*/
var active = null;

var activebgcolor = "#FFFFFF";
var activetextcolor= "#CC6600";
var inactivebgcolor= "#CCCCCC";
var inactivetextcolor = "#000000";
var overbgcolor = "#949494";
var overtextcolor = "#FFFFFF";
/*
orange "#CC6600"
dark orange "#F19929"
peach "#FED88C"
white "#FFFFFF"
black "#000000"
blue "#0000FF"
light gray "#CCCCCC"
dark gray  "#949494"
flesh "#ffcc99"
lavendor "#cc99cc"
purple "#993399"
yellow "#FFFFCC"
kind of a rusty color good for links "#995000"
 "#"
*/
function tabcolor(tabnum, color1, color2)
{	/* This function sets the appearance of the tab
	Three arguments are passed to the function: tabnum, 
	or the number of the tab; color1, which is the background color 
	of the tab; and color2, which is the text color of the tab.	*/
	var tab = eval(tabArray[tabnum]);
	var tabtext = eval(tabTextArray[tabnum]);
	tab.backgroundColor=color1;
	tabtext.color=color2;
	if(document.all){
		tabtext.cursor='hand';
	}
	else{
		tabtext.cursor='pointer';
	}
}
function chooseTabDIV(tabnum)
{	/* the central tab navigation function
	This is the core function that sets the z-index of the
	content divs and tabs. It also calls the tabcolor() function. */
	if(active){
		var activetablayer=eval(tabArray[active]);
		var activetabtext = eval(tabTextArray[active]);
		activetablayer.zIndex=0;
		tabcolor(active,inactivebgcolor,inactivetextcolor);
		divObj = eval('tabDIV' + active);
		divObj.style.display = "none";
	}
	tablayer = eval(tabArray[tabnum]);
	tabtext=eval(tabTextArray[tabnum]);
	tablayer.zIndex=11;
	tabcolor(tabnum,activebgcolor,activetextcolor);
	divObj = eval('tabDIV' + tabnum);
	divObj.style.display = "inline";
	
	divObj.style.border = "1";
	
	divObj.style.borderTopColor = "orange";
	divObj.style.borderTopStyle = "solid";
	divObj.style.borderRigthColor = "orange";
	divObj.style.borderRightStyle = "solid";
	divObj.style.borderLeftColor = "orange";
	divObj.style.borderLeftStyle = "solid";
	divObj.style.borderBottomColor = "orange";
	divObj.style.borderBottomStyle = "solid";
	
	active=tabnum;
}
function tabover(tabnum)
{	/* The tabover() function simply calls the tabcolor() function 
	if the value of tabnum does not equal the value of active 
	(in other words, if the chosen element is not the one currently on top or "active"). 
	The tabover() function is invoked with the mouseover event. */ 
	if(tabnum!=active){
		tabcolor(tabnum,overbgcolor,overtextcolor);
	}
}
function tabout(tabnum)
{	/*	The tabout() is identical to the tabover() function, 
	except that it passes the values of the variables, inactivebgcolor 
	and inactivetextcolor, as arguments. 
	This function is called with the mouseout event */
	if(tabnum!=active){
		tabcolor(tabnum,inactivebgcolor,inactivetextcolor);
	}
}
