var tabIndex = 0;

function activateTab( tabID , tabImageID )
	{
		document.getElementById( tabID ).bgColor = TAB_COLOR_ACTIVE;
		document.getElementById( tabImageID ).src = document.getElementById( tabImageID ).src.replace( /inactive/, "active" );
	}

function deactivateTab( tabID, tabImageID )
	{
		document.getElementById( tabID ).bgColor = TAB_COLOR_INACTIVE;
		document.getElementById( tabImageID ).src = document.getElementById( tabImageID ).src.replace( /active/, "inactive" );
	}

function generateActiveTab( imageAlt , imageSrc , href , tabText )
	{
		generateTab( TAB_STYLE_ACTIVE , imageAlt , imageSrc , href , tabText );
	}

function generateInactiveTab( imageAlt , imageSrc , href , tabText )
	{
		generateTab( TAB_STYLE_INACTIVE , imageAlt , imageSrc , href , tabText );
	}

function generateTab( tabStyle , imageAlt , imageSrc , href , tabText )
	{
		var tabBGColor = ( tabStyle == TAB_STYLE_ACTIVE ? TAB_COLOR_ACTIVE : TAB_COLOR_INACTIVE );
		var tabID = "tab" + tabIndex;
		var tabImageID = "tabImage" + (tabIndex++);
		document.write( '<td bgcolor="' + tabBGColor + '" class="' + tabStyle + '" id="' + tabID + '"'
										+ ' onclick="location.replace( \'' + href + '\' );"'
										+ ( tabStyle == TAB_STYLE_INACTIVE ? ' onmouseout="deactivateTab( \'' + tabID + '\', \'' + tabImageID + '\' );" onmouseover="activateTab( \'' + tabID + '\', \'' + tabImageID + '\' );"' : '' )
										+ ' nowrap><table><tr><td width="23">'
										+ '&nbsp;<img align="absmiddle" alt="' + imageAlt + '"  id="' + tabImageID + '" src="' + imageSrc + '"></td><td>'
										+ '&nbsp;' + tabText + '&nbsp;</td></tr></table>' +
									'</td>' );
	}