function TabGroup(baseName)
{
	this.baseName = baseName;
	this.tabElms = null;
	this.defaultIndex = 0;
	fixTabHeights(baseName);
}

TabGroup.prototype.setDefaultIndex = function(index)
{
	this.defaultIndex = index;
}

/*
	displayTabItem()
	Switch visible tab item
*/
TabGroup.prototype.displayTabItem = function(index)
{
	if(!document.getElementById) return;
	
	// initialize tabElms object
	if(this.tabElms == null)
	{
		this.tabElms = new TabElms(this.baseName);
		if(!this.tabElms.navColl) return;
		
		// Hide the default visible tab, if it wasn't clicked.
		if(index!=this.defaultIndex)
		{
			var boxEl = document.getElementById(this.baseName + "-box" + this.defaultIndex);
			if(boxEl) boxEl.className = "tab-box-hidden";
			var navEl = this.tabElms.navColl[this.defaultIndex];
			if(navEl) navEl.className = "";
		}
	}
	// Hide currently visible tab
	else
	{
		if(this.tabElms.navEl) this.tabElms.navEl.className = "";
		if(this.tabElms.boxEl) this.tabElms.boxEl.className = "tab-box-hidden";
	}
	// Find and set elements
	var navEl = this.tabElms.navColl[index]; 
		if(navEl) navEl.className = "selected";
	var boxEl = document.getElementById(this.baseName + "-box" + index);
		if(boxEl) boxEl.className = "tab-box-visible";
	// Save to tabsData object
	this.tabElms.navEl = navEl;	
	this.tabElms.boxEl = boxEl;
}

function TabElms(baseName)
{
	this.navColl = document.getElementById(baseName + "-list").getElementsByTagName("li"), 
	this.navEl = null;
	this.boxEl = null;
}

/*
	fixTabHeights()
	Ensures that all tabs are of equal height
	Do not work for tabs hidden on render.
*/
function fixTabHeights(baseName)
{
	if(!document.getElementById) return;
	// get tabs ul-element
	var list = document.getElementById(baseName + "-list");

	if(list)
	{
		// get collection of li-elements
		var liEls = list.getElementsByTagName("li");
		// populate an array with the offsetHeight values of the li-elements
		var hAry = [];
		for(var i=0; i<liEls.length; i++)
		{
			hAry[i] = liEls[i].offsetHeight;
			// selected li will be 1px higher
			if(liEls[i].className == "selected")
				hAry[i] = Math.max(0, hAry[i]-1);
		}
		// sort the array numerically
		hAry.sort(function(a, b){ return a-b;});
		// exit function if first and last position (i.e all positions) are equal
		if(hAry[0] == hAry[hAry.length-1]) return;
		// set the height of all li-elements and their a-element child to the highest value in hAry
		var maxHeight = hAry[hAry.length-1];
		var agent = navigator.userAgent.toLowerCase();
		for(var i=0; i<liEls.length; i++)
		{
			// return the extra pixel to the selected li if it is also the highest element
			if(liEls[i].className == "selected" && liEls[i].offsetHeight-1 == maxHeight)
				var newHeight = maxHeight + 1;
			else
				var newHeight = maxHeight;
			
			// set new height on li-element
			liEls[i].style.height = newHeight + "px";
			
			// set new height on a-element
			var aEl = liEls[i].getElementsByTagName("a")[0];
			
			// hard-coded values, cannot retrieve computed style values in safari
			var vPad = (liEls[i].className == "selected")? 7 : 6; 
			
			/*
				a) set vPad to 0 for IE versions using Microsoft's faulty box model
				b) on all IE-PC versions set an explicit width on the a-element because
					otherwise, for some reason, when we set a height on the a-element the 
					width is set to 100% of the containing element's width.
			*/	 
			if(agent.indexOf("windows") != -1 && agent.indexOf("msie") != -1 && agent.indexOf("opera") == -1)
			{
				var hPad = parseInt(aEl.currentStyle.paddingLeft)+ parseInt(aEl.currentStyle.paddingRight);
				// Using IE's non-standard box model
				if(!document.compatMode || document.compatMode == "BackCompat")
				{
					vPad = 0;
					hPad = 0;
				}
				aEl.style.width = (aEl.offsetWidth - hPad) + "px";
			}
			aEl.style.height = (newHeight - vPad) + "px";
		}
	}
	else
	{
		window.setTimeout("fixTabHeights('" + baseName + "')", 10);
	}
}