//========================================================================
// Description: TabControlHelper: Provides client side management for tabs
//								
//========================================================================

var ActiveTabControlHelper;

function TabControlHelper(id,maxTabCount)
{
	this.mID = id;
	this.mSelectedTabIndex = -1;
	this.mImageIDs = new Array(maxTabCount);
	this.mLayerIDs = new Array(maxTabCount);
	this.mStandardImages = new Array(maxTabCount);
	this.mHoverImages = new Array(maxTabCount);
	this.mSelectedImages = new Array(maxTabCount);
	this.mLastTabIndex = -1;
}

//========================================================================
// TabControlHelper.AddTab
// Description: Adds a tab to the system
//========================================================================
TabControlHelper.prototype.AddTab = function(imageID,layerID,standardImage,hoverImage,selectedImage) 
{
	// verify that the tab exists
	if(document.getElementById(imageID) == null)
	{
		return;
	}
	
	// add the tab
	this.mLastTabIndex ++;
	this.mImageIDs[this.mLastTabIndex] = imageID;
	this.mLayerIDs[this.mLastTabIndex] = layerID;
	this.mStandardImages[this.mLastTabIndex] = standardImage;
	this.mHoverImages[this.mLastTabIndex] = hoverImage;
	this.mSelectedImages[this.mLastTabIndex] = selectedImage;
	
	if(this.mSelectedTabIndex == -1)
	{
		this.SelectTab(0);
	}
	
	// Add handlers
	document.getElementById(imageID).onmouseover = function(){return ActiveTabControlHelper.MouseOver(this); };
	document.getElementById(imageID).onmouseout = function(){return ActiveTabControlHelper.MouseOut(this); };
	document.getElementById(imageID).onclick = function(){return ActiveTabControlHelper.MouseClick(this); };
}

//========================================================================
// TabControlHelper.MouseOver
// Description: Handles mouse events for tabs
//========================================================================
TabControlHelper.prototype.MouseOver = function(source) 
{

	var sourceIndex = this.GetTabIndex(source);
	
	// If this tab is currently selected, do nothing
	if(sourceIndex == this.mSelectedTabIndex)
	{
		return;
	}
	
	// Change image to mouseover image
	document.getElementById(this.mImageIDs[sourceIndex]).src = this.mHoverImages[sourceIndex];
	
}

//========================================================================
// TabControlHelper.MouseOut
// Description: Handles mouse events for tabs
//========================================================================
TabControlHelper.prototype.MouseOut = function(source) 
{

	var sourceIndex = this.GetTabIndex(source);
	
	// If this tab is currently selected, do nothing
	if(sourceIndex == this.mSelectedTabIndex)
	{
		return;
	}
	
	// Change image to standard image
	document.getElementById(this.mImageIDs[sourceIndex]).src = this.mStandardImages[sourceIndex];
}

//========================================================================
// TabControlHelper.MouseClick
// Description: Handles mouse events for tabs
//========================================================================
TabControlHelper.prototype.MouseClick = function(source) 
{

	var sourceIndex = this.GetTabIndex(source);
	
	// If this tab is currently selected, do nothing
	if(sourceIndex == this.mSelectedTabIndex)
	{
		return;
	}
	
	//  select the tab
	this.SelectTab(sourceIndex);	
}

//========================================================================
// TabControlHelper.SelectTab
// Description: displays the selected tab and de-selects the others
//========================================================================
TabControlHelper.prototype.SelectTab = function(index) 
{
	this.mSelectedTabIndex = index;
	
	for (i=0;i<=this.mLastTabIndex;i++)	
	{		
		if (i == index)
		{			
			document.getElementById(this.mImageIDs[i]).src = this.mSelectedImages[i];
			document.getElementById(this.mLayerIDs[i]).style.display = "block";
		}
		else
		{			
			document.getElementById(this.mImageIDs[i]).src = this.mStandardImages[i];	
			document.getElementById(this.mLayerIDs[i]).style.display = "none";
		}
	}
	
}


//========================================================================
// TabControlHelper.GetTabIndex
// Description: retrurns the tab index based on the supplied image id
//========================================================================
TabControlHelper.prototype.GetTabIndex = function(source) 
{
	for (i=0;i<=this.mLastTabIndex;i++)
	{
		if (source.id == this.mImageIDs[i])
		{
			return i;
		}
	}
	
	return - 1;	
}

