function switchTab(tEl) {
	var pEl, elList, tabList, i, j;
	
	if(tEl.disabled) {
		return;
	}
	
	tabList = document.getElementsByName(tEl.name);
	for (j = 0; j < tabList.length; j++) {
	
		pEl = tabList[j].parentElement.parentElement.parentElement.parentElement;
		
		elList = pEl.getElementsByTagName("TD");
		for (i = 0; i < elList.length; i++) {
			if ((elList[i].className.toLowerCase() == "tabfaceon") && (!pEl.contains(tEl))) {
				elList[i].className = "tabfaceoff";
				elList[i].style.backgroundColor = tEl.getAttribute('offcolor');
			}
			else if ((elList[i].className.toLowerCase() == "tabfaceoff") && (pEl.contains(tEl))) {
				elList[i].className = "tabfaceon";
				elList[i].style.backgroundColor = tEl.getAttribute('oncolor');
			}
		}
		elList = pEl.getElementsByTagName("A");
		for (i = 0; i < elList.length; i++) {
			if ((elList[i].className.toLowerCase() == "tabtexton") && (!pEl.contains(tEl))) {
				elList[i].className = "tabtextoff";
			}
			else if ((elList[i].className.toLowerCase() == "tabtextoff") && (pEl.contains(tEl))) {
				elList[i].className = "tabtexton";
			}
		}
	}
}

function Tab(){}
	//Set default Tab properties
	Tab.prototype.label = "";
	Tab.prototype.type = "";
	Tab.prototype.action = "";
	Tab.prototype.target = "";
	Tab.prototype.status = "off";
	Tab.prototype.name = "";
	Tab.prototype.id = "";
	Tab.prototype.accesskey = "";
	Tab.prototype.tooltip = "";
	Tab.prototype.CSS = "";
	Tab.prototype.disabled = "0";
	Tab.prototype.disabledby = "";
	Tab.prototype.disabledvalue = "";
	Tab.prototype.oncolor = "";
	Tab.prototype.offcolor = "";
	
	//Render the Tab
	Tab.prototype.render = function() {
		var strHTML = this.returnHTML();
		document.write(strHTML)
	}
	
	//Return HTML to build the Tab
	Tab.prototype.returnHTML = function() {
		if (this.oncolor == "") {
			for (var j = 0; j < document.styleSheets.length; j++) {
				var rules = document.styleSheets[j].rules;
				var len = rules.length;
				for (var i = 0; i < len; i++) {
				  if ('.tabFaceOn' == rules[i].selectorText) {
				     this.oncolor = rules[i].style.backgroundColor;
				     break;
				  }
				}
			}
		}
	
		if (this.offcolor == "") {
			for (var j = 0; j < document.styleSheets.length; j++) {
				var rules = document.styleSheets[j].rules;
				var len = rules.length;
				for (var i = 0; i < len; i++) {
				  if ('.tabFaceOff' == rules[i].selectorText) {
				     this.offcolor = rules[i].style.backgroundColor;
				     break;
				  }
				}
			}
		}

		var strHTML = "<span style='height: 1px;'><table style='" + this.CSS + "' border='0' cellspacing='0' cellpadding='0'>";
		 			strHTML += "<tr>";
			 			strHTML += "<td width='1' height='1'><img width='1' height='1'></td>";
			 			strHTML += "<td width='1' height='1'><img width='1' height='1'></td>";
			 			strHTML += "<td width='1' height='1'><img width='1' height='1'></td>";
			 			strHTML += "<td height='1' class='tabLowlight'><img width='1' height='1'></td>";
			 			strHTML += "<td width='1' height='1'><img width='1' height='1'></td>";
			 			strHTML += "<td width='1' height='1'><img width='1' height='1'></td>";
			 			strHTML += "<td width='1' height='1'><img width='1' height='1'></td>";
		 			strHTML += "</tr>";
		 			strHTML += "<tr>";
			 			strHTML += "<td width='1' height='1'><img width='1' height='1'></td>";
			 			strHTML += "<td width='1' height='1'><img width='1' height='1'></td>";
			 			strHTML += "<td width='1' height='1' class='tabLowlight'><img width='1' height='1'></td>";
			 			strHTML += "<td height='1' class='tabHighlight'><img width='1' height='1'></td>";
			 			strHTML += "<td width='1' height='1' class='tabShadow'><img width='1' height='1'></td>";
			 			strHTML += "<td width='1' height='1'><img width='1' height='1'></td>";
			 			strHTML += "<td width='1' height='1'><img width='1' height='1'></td>";
		 			strHTML += "</tr>";
		 			strHTML += "<tr>";
			 			strHTML += "<td width='1' height='1'><img width='1' height='1'></td>";
			 			strHTML += "<td width='1' height='1' class='tabLowlight'><img width='1' height='1'></td>";
			 			strHTML += "<td width='1' height='1' class='tabHighlight'><img width='1' height='1'></td>";
			 			
						strHTML += "<td height='1' ";
				 			switch(this.status.toLowerCase()){
				 				case 'on':
					 				strHTML += "class='tabFaceOn' style='background-color: " + this.oncolor + "'";
									break;
				 				case 'off':
					 				strHTML += "class='tabFaceOff' style='background-color: " + this.offcolor + "'";
									break;
				 				default:
					 				strHTML += "class='tabFaceOff' style='background-color: " + this.offcolor + "'";
				 			}
				 			strHTML += "><img width='1' height='1'></td>";
				 
			 			strHTML +=  "<td width='1' height='1' class='tabLowlight'><img width='1' height='1'></td>";
			 			strHTML +=  "<td width='1' height='1' class='tabShadow'><img width='1' height='1'></td>";
			 			strHTML +=  "<td width='1' height='1'><img width='1' height='1'></td>";
		 			strHTML +=  "</tr>";
		 			strHTML +=  "<tr>";
			 			strHTML +=  "<td width='1' class='tabLowlight'><img width='1' height='1'></td>";
			 			strHTML +=  "<td width='1' class='tabHighlight'><img width='1' height='1'></td>";
			 			
						strHTML +=  "<td height='1' ";
				 			switch(this.status.toLowerCase()){
				 				case 'on':
					 				strHTML += "class='tabFaceOn' style='background-color: " + this.oncolor + "'";
									break;
				 				case 'off':
					 				strHTML += "class='tabFaceOff' style='background-color: " + this.offcolor + "'";
									break;
				 				default:
					 				strHTML += "class='tabFaceOff' style='background-color: " + this.offcolor + "'";
				 			}
				 			strHTML += "><img width='1' height='1'></td>";
				 
			 			strHTML += "<td "
							switch(this.status.toLowerCase()){
				 				case 'on':
					 				strHTML += "class='tabFaceOn' style='background-color: " + this.oncolor + "'";
									break;
				 				case 'off':
					 				strHTML += "class='tabFaceOff' style='background-color: " + this.offcolor + "'";
									break;
				 				default:
					 				strHTML += "class='tabFaceOff' style='background-color: " + this.offcolor + "'";							
							}
				 			strHTML += " align='center' nowrap>";
							
						switch(this.type.toLowerCase()){
							case 'form':
								strHTML += "<a style='width: 100%;' target='" + this.target + "' name='" + this.name + "' id='" + this.id + "' accesskey='" + this.accesskey + "' title='" + this.tooltip + "' enabledhref='javascript:document." + this.action + ".submit()' disabledhref='' oncolor='" + this.oncolor + "' offcolor='" + this.offcolor + "' onclick='switchTab(this);' disabledby='" + this.disabledby + "' disabledvalue='" + this.disabledvalue + "'";
								if (this.disabled == "1") {
									strHTML += " disabled";
								}
								else {
									strHTML += " href='javascript:document." + this.action + ".submit()'";
								}
								switch(this.status.toLowerCase()){
									case 'on':
										strHTML += " class='tabTextOn'";
										break;
									case 'off':
										strHTML += " class='tabTextOff'";
										break;
									default:
										strHTML += " class='tabTextOff'";
								}
								strHTML += ">" + this.label + "</a>&nbsp;&nbsp;</td>";
								break;
							case 'url':
								strHTML += "<a style='width: 100%;' target='" + this.target + "' name='" + this.name + "' id='" + this.id + "' accesskey='" + this.accesskey + "' title='" + this.tooltip + "' enabledhref='" + this.action + "' disabledhref='' oncolor='" + this.oncolor + "' offcolor='" + this.offcolor + "' onclick='switchTab(this);' disabledby='" + this.disabledby + "' disabledvalue='" + this.disabledvalue + "'";
								if (this.disabled == "1") {
									strHTML += " disabled";
								}
								else {
									strHTML += " href='" + this.action + "'";
								}
								switch(this.status.toLowerCase()){
									case 'on':
										strHTML += " class='tabTextOn'";
										break;
									case 'off':
										strHTML += " class='tabTextOff'";
										break;
									default:
										strHTML += " class='tabTextOff'";
								}
								strHTML += ">" + this.label + "</a>&nbsp;&nbsp;</td>";
								break;	
							case 'javascript':
								strHTML += "<a style='width: 100%;' target='" + this.target + "' name='" + this.name + "' id='" + this.id + "' accesskey='" + this.accesskey + "' title='" + this.tooltip + "' enabledhref='javascript:" + this.action + "' disabledhref='' oncolor='" + this.oncolor + "' offcolor='" + this.offcolor + "' onclick='switchTab(this);' disabledby='" + this.disabledby + "' disabledvalue='" + this.disabledvalue + "'";
								if (this.disabled == "1") {
									strHTML += " disabled";
								}
								else {
									strHTML += " href='javascript:" + this.action + "'";
								}
								switch(this.status.toLowerCase()){
									case 'on':
										strHTML += " class='tabTextOn'";
										break;
									case 'off':
										strHTML += " class='tabTextOff'";
										break;
									default:
										strHTML += " class='tabTextOff'";
								}
								strHTML += ">" + this.label + "</a>&nbsp;&nbsp;</td>";
								break;
							default:
								strHTML += "<a style='width: 100%;' target='" + this.target + "' name='" + this.name + "' id='" + this.id + "' accesskey='" + this.accesskey + "' title='" + this.tooltip + "' enabledhref='javascript:void(0)' disabledhref='' oncolor='" + this.oncolor + "' offcolor='" + this.offcolor + "' onclick='switchTab(this);' disabledby='" + this.disabledby + "' disabledvalue='" + this.disabledvalue + "'";
								if (this.disabled == "1") {
									strHTML += " disabled";
								}
								else {
									strHTML += " href='javascript:void(0)'";
								}
								switch(this.status.toLowerCase()){
									case 'on':
										strHTML += " class='tabTextOn'";
										break;
									case 'off':
										strHTML += " class='tabTextOff'";
										break;
									default:
										strHTML += " class='tabTextOff'";
								}
								strHTML += ">" + this.label + "</a>&nbsp;&nbsp;</td>";				
						}
						
						strHTML += "<td width='1' "
				 			switch(this.status.toLowerCase()){
				 				case 'on':
					 				strHTML += "class='tabFaceOn' style='background-color: " + this.oncolor + "'";
									break;
				 				case 'off':
					 				strHTML += "class='tabFaceOff' style='background-color: " + this.offcolor + "'";
									break;
				 				default:
					 				strHTML += "class='tabFaceOff' style='background-color: " + this.offcolor + "'";
				 			}
				 			strHTML += "><img width='1' height='1'></td>";
							
						strHTML += "<td width='1' class='tabLowlight'><img width='1' height='1'></td>";
			 			strHTML += "<td width='1' class='tabShadow'><img width='1' height='1'></td>";
		 			strHTML += "</tr>";
	 			strHTML += "</table></span>";

		return strHTML;
}
