// Script to create tabbed content
//
// Currently supports implementation using:
// - Data List (DL) markup (DT for tabs, DD for content)

var debug = false;
//alert('debug is ' + (debug ? 'on' : 'off'));

function trace(str)
{
	if (debug) alert(str);
}

var defaultTab; // tab that will display on page load ***
var activeTab;

// element containing tabs and content ***
var contentTabsID;
// element containing an external menu for tabbed content (jump-to links) ***
var externalLinksID;

// *** MUST BE SET IN HEAD SECTION OF HTML PAGE

// choose implementation model
var dataListModel = true;

// display tab and content of tab
function makeTabActive(id)
{
	if (activeTab != id && activeTab != null) 
	{
		trace('call makeTabInactive("' + activeTab + '")');
		makeTabInactive(activeTab);
	}
	activeTab = id;

	trace('make ' + id + ' active');
	var tab = getObject(id);
	trace('object tagName is ' + tab.tagName);
	
	setTabClass(tab, 'active');
}

function makeTabInactive(id)
{
	trace('make ' + id + ' inactive');
	var tab = getObject(id);
	trace('object tagName is ' + tab.tagName);
		
	setTabClass(tab, '');
}

function setTabClass(tab, classLabel)
{
	if (dataListModel)
	{	
		// set dd as active
		var ddTab = tab.parentNode;
		trace('ddTab tag = ' + ddTab.tagName);
		ddTab.className = classLabel;
		
		// find dt tab sibling (with title tab in)
		var dtTab = ddTab.previousSibling;
		var foundDT = false;
		while (dtTab && !foundDT)
		{
			if (dtTab.tagName)
			{
				if (dtTab.tagName == 'DT') foundDT = true;
				else dtTab = dtTab.previousSibling;
			}
			else dtTab = dtTab.previousSibling;
		}
		dtTab.className = classLabel;
	}
}

// create array of tab links
var tabLinks = new Array();
// fill array
function getTabLinks(tabAreaID)
{
	var tabDiv = getObject(tabAreaID);
	
	if (dataListModel)
	{
		// get dts containing tab links
		var dts = tabDiv.getElementsByTagName('dt');
		// get links
		for (var i = 0; i < dts.length; i++)
		{
			var linkText = stripToID(dts[i].childNodes[1].hash);
			
			// put id in tabLinks array
			tabLinks[i] = linkText;
			// set click listener for link
			setOnClickLink(dts[i].childNodes[1], linkText, true);
		}
		
		// print for debug
		if (debug)
		{
			var temp = '';
			for (var k = 0; k < tabLinks.length; k++)
			{	temp += tabLinks[k] + '\n'; }
			trace(temp); 
		}
	}
}

// set onclick listeners for external links (must be called after getTabLinks)
function setExternalLinks(menuID)
{
	if (tabLinks.length == 0)
	{
		trace('Call to set external links with no Tabs set'); 
		return;
	}
	var menu = getObject(menuID);
	// get menu links
	var links = menu.getElementsByTagName('a');
	for (var i = 0; i < links.length; i++)
	{
		// if link is pointing to tabbed content
		var link = stripToID(links[i].hash);
		if (isInArray(link, tabLinks))
		{
			// set onclick listener
			setOnClickLink(links[i], link, false);
		}
	}
}

// strip link markup to get div ID
function stripToID(linkText)
{
	// remove preceding hash symbol '#'
	if (linkText.charAt(0) == '#') 
	{	trace('first character of ' + linkText + ' is #');
		linkText = linkText.substring(1);
	}
		
	// remove '-link' suffix
	var linkTextSplit = linkText.split('-');
	linkText = '';
	
	for (var j = 0; j < (linkTextSplit.length - 1); j++)
	{	linkText += linkTextSplit[j]; 
		// replace hyphens not delimiting the '-link' suffix
		if (j < linkTextSplit.length - 2) linkText += '-';
	}
	return linkText;
}

// set an onClick listener for object which sets div with id == targetID as active tab
// if it's a link as part of the tabbed interface, we need to return false to prevent a page shift
// else (external link) return true to allow the browser to jump to the relevant place
function setOnClickLink(object, targetID, isTabLink)
{
	object.onclick = function () {
				makeTabActive(targetID);
				return !isTabLink;
			};
}

// return true if object in array, false otherwise
function isInArray(value, array)
{
	for (var i = 0; i < array.length; i++)
	{
		if (array[i] == value) return true;
	}
	return false;
}

// basic defensive function to get object
function getObject(id)
{
	if (document.getElementById)
	{
		//alert('document.getElementById exists');
		if (document.getElementById(id))
		{	
			return document.getElementById(id);
		}
		else
		{
			trace('Element with id = ' + id + ' does not exist');
		}
	}
	else
	{
		trace('getElementbyId not supported');
	}
}
function InitalizeTabs() 
{            
    makeTabActive(defaultTab);
	getTabLinks(contentTabsID);
	setExternalLinks(externalLinksID);			
};
		
// Ensure default tab is loaded (default tab can be overridden in html file)
window.onload = function() 
{            
    makeTabActive(defaultTab);
	getTabLinks(contentTabsID);
	setExternalLinks(externalLinksID);			
};