/*
tab.js 
used on the home page to switch tabs 

variables: 
- whichBox: naming convention, 1st part of the id name of all the tabs & switched elements needs to be the same. ex: switcherTab1, switcherBox1, switcherTab2, switcherBox2 
- whichTab: the tab number that contains the link. ex 1 if tab id switcherTab1 contains the link 
- totalNumTabs: how many tabs (& boxs to switch) are there? 
- shadow: set up a blank spacer tab to the right of the tabs if you want a shawod & name it (whichBox)TabSpacer. use true/false 

to use this on another page: 
- html links (tabs) must be in tabs named: (whichBox)Tab(whichTab), ex: switcherTab1, switcherTab2.
- there should be a shadow spacer tab to make the shadow on the last tab: (whichBox)TabSpacer, ex: switcherTabSpacer 
- html content (divs to be switched) must be in elements named: (whichBox)Box(whichTab), ex: switcherBox1, switcherBox2.

styles must be set up for the tabs: 
- tabOn = highlighted current tab 
- tabOff = non active tab 
- tabShadow = tab with a border-left set to look like a shadow. 
*/



function tab( whichBox, whichTab, totalNumTabs, shadow )
{
	// switch tab style 
	// whichever tab is "on", the tab to the right (one number higher) is in "shadow"
	// and the other tab is "off"
	
		// set all tabs "off" 
		for (i=1; i<=totalNumTabs; i++)
		{
			thisTabName = whichBox + "Tab" + i;
			document.getElementById(thisTabName).className = "tabOff";
		}
		// set spacerTab to "off"
		if (shadow)
		{
			spacerTab = whichBox + "TabSpacer";
			document.getElementById(spacerTab).className = "tabOff";
		}
		
		// passed (whichTab) is "on" 
		thisTabName = whichBox + "Tab" + whichTab;
		document.getElementById(thisTabName).className = "tabOn";
		
		// tab to the right (one number highter) is "shadow", if there is one
		if (whichTab < totalNumTabs)
		{
			thisTabName = whichBox + "Tab" + (whichTab+1);
			document.getElementById(thisTabName).className = "tabShadow";
		} else if (shadow)
		{
			// set the spacer tab to "shadow", if the active tab is the last one on the right 
			spacerTab = whichBox + "TabSpacer";
			document.getElementById(spacerTab).className = "tabShadow";
		}
		
	
	// switch content div 
		
		// set all divs of type "whichBox" to be invisible 
		for (i=1; i<=totalNumTabs; i++)
		{
			thisBoxName = whichBox + "Box" + i;
			document.getElementById(thisBoxName).style.visibility = "hidden";
		}
		
		// show the div that corresponds to the clicked tab 
		thisBoxName = whichBox + "Box" + whichTab;
		document.getElementById(thisBoxName).style.visibility = "visible";
}