/**
 *----------------------------------------------------------
 * File: webtab.js - TabArray class container
 * Copyright 1999-2004 WebDialogs, Inc
 * All Rights Reserved
 *
 * Viewing the proprietary source code contained herein
 * is prohibited without signed written authorization from
 * WebDialogs, Inc., Billerica, MA
 *----------------------------------------------------------
 */


var g_oTabs = null;
var spc = "_space";

function TabItem(id, num, imgd, imgds, imgx, imgs, imgh, imgax, imgas, tooltip, eventhandle, width, selected)
{
	this.id = id;
	this.num = num;
	this.imgd = imgd;
	this.imgds = imgds;
	this.imgx = imgx;
	this.imgs = imgs;
	this.imgh = imgh;
	this.imgax = imgax;
	this.imgas = imgas;
	this.tooltip = tooltip;
	this.eventhandle = eventhandle;
	this.width = width;
	
	this.cell = null;
	this.currentImage = null;
	
	this.selected = false;
	this.animated = false;
	this.enabled = false;
	
	this.Create = Create;
	this.Select = Select;
	this.HighlightOn = HighlightOn;
	this.HighlightOff = HighlightOff;
	this.Activate = Activate;
	this.Enable = Enable;
	this.UpdateTab = UpdateTab;
		  
	this.Create();

	function Create() {
		
		var oCell = document.createElement('td');
		var tabContent = document.createElement('div');

		oCell.style.width = this.width;
		oCell.id = this.id;
		oCell.title = this.tooltip;

		tabContent.id = this.id + "_a";
		
		if (this.imgx == "") {
			tabContent.appendChild(document.createTextNode(this.num));
			
		} else {
			
			var ospan = document.createElement('span');
			ospan.id = this.id + "_num";
			ospan.appendChild(document.createTextNode(this.num));
			
			var oimgd = document.createElement('img');
			oimgd.src = this.imgd;
			oimgd.id = this.id + "_imgd";
			oimgd.border = "0";
			
			var oimgds = document.createElement('img');
			oimgds.src = this.imgds;
			oimgds.id = this.id + "_imgds";
			oimgds.border = "0";
			
			var oimgx = document.createElement('img');
			oimgx.src = this.imgx;
			oimgx.id = this.id + "_imgx";
			oimgx.border = "0";
			
			var oimgs = document.createElement('img');
			oimgs.src = this.imgs;
			oimgs.id = this.id + "_imgs";
			oimgs.border = "0";
			
			var oimgh = document.createElement('img');
			oimgh.src = this.imgh;
			oimgh.id = this.id + "_imgh";
			oimgh.border = "0";
			
			var oimgax = document.createElement('img');
			oimgax.src = this.imgax;
			oimgax.id = this.id + "_imgax";
			oimgax.border = "0";
			
			var oimgas = document.createElement('img');
			oimgas.src = this.imgas;
			oimgas.id = this.id + "_imgas";
			oimgas.border = "0";
			
			tabContent.appendChild(oimgd);
			tabContent.appendChild(oimgds);
			tabContent.appendChild(oimgx);
			tabContent.appendChild(oimgs);
			tabContent.appendChild(oimgh);
			tabContent.appendChild(oimgax);
			tabContent.appendChild(oimgas);
			tabContent.appendChild(ospan);
		}
		
		oCell.appendChild(tabContent);
		oCell.unselectable = true;
		this.cell = oCell;
		
		this.Select(selected);
	}
	
	function Select(bSelect) {
		
		this.selected = bSelect;
		
		if (bSelect) {
			
			this.eventhandle();
			this.cell.onmouseout = null;
			this.cell.onmouseover = null;
			this.cell.onclick = null;
			this.cell.className = "tabbutton_selected";

			try {
				var oimgd = document.getElementById(this.id + "_imgd");
				var oimgds = document.getElementById(this.id + "_imgds");
				var oimgx = document.getElementById(this.id + "_imgx");
				var oimgs = document.getElementById(this.id + "_imgs");
				var oimgh = document.getElementById(this.id + "_imgh");
				var oimgax = document.getElementById(this.id + "_imgax");
				var oimgas = document.getElementById(this.id + "_imgas");
				
				oimgd.style.display = "none";
				oimgds.style.display = "none";
				oimgx.style.display = "none";
				oimgs.style.display = "";
				oimgh.style.display = "none";
				oimgax.style.display = "none";
				oimgas.style.display = "none";
				
				var o = document.getElementById(this.id + "_num");
				o.style.color = "#39577A";
				
			} catch (e) {
			
			}
		} else {
		
			this.cell.onmouseout = function(tab) {
				return function() {
					tab.HighlightOff();
				};
			}(this);
			
			this.cell.onmouseover = function(tab) {
				return function() {
					tab.HighlightOn();
				};
			}(this);
			
			this.cell.onclick = this.Activate;
			this.cell.className = "tabbutton";

			try {
				var oimgd = document.getElementById(this.id + "_imgd");
				var oimgds = document.getElementById(this.id + "_imgds");
				var oimgx = document.getElementById(this.id + "_imgx");
				var oimgs = document.getElementById(this.id + "_imgs");
				var oimgh = document.getElementById(this.id + "_imgh");
				var oimgax = document.getElementById(this.id + "_imgax");
				var oimgas = document.getElementById(this.id + "_imgas");
				
				oimgd.style.display = "none";
				oimgds.style.display = "none";
				oimgx.style.display = (this.animated)? "none" : "";
				oimgs.style.display = "none";
				oimgh.style.display = "none";
				oimgax.style.display = (this.animated)? "" : "none";
				oimgas.style.display = "none";
				
				var o = document.getElementById(this.id + "_num");
				o.style.color = "#FFFFFF";
				
			} catch (e) {
				
			}
		}
	}
	
	function Enable(bEnable) {
		
		this.enabled = bEnable;
		
		var oCell = document.getElementById(this.id);
		
		var oimgd = document.getElementById(this.id + "_imgd");
		var oimgds = document.getElementById(this.id + "_imgds");
		var oimgx = document.getElementById(this.id + "_imgx");
		var oimgs = document.getElementById(this.id + "_imgs");
		var oimgh = document.getElementById(this.id + "_imgh");
		var oimgax = document.getElementById(this.id + "_imgax");
		var oimgas = document.getElementById(this.id + "_imgas");
		
		oimgd.style.display = "none";
		oimgds.style.display = "none";
		oimgx.style.display = "none";
		oimgs.style.display = "none";
		oimgh.style.display = "none";
		oimgax.style.display = "none";
		oimgas.style.display = "none";
		
		if (!bEnable) {
			
			oCell.onclick = null;
			
			if (this.selected) {
				oimgds.style.display = "";
			} else {
				oimgd.style.display = "";
			}
			
		} else {
			
			oCell.onclick = this.Activate;
			
			if (this.selected) {
				if (this.animated) {
					oimgas.style.display = "";
				} else {
					oimgs.style.display = "";
				}
			} else {
				if (this.animated) {
					oimgax.style.display = "";
				} else {
					oimgx.style.display = "";
				}
			}
		}
		
		var o = document.getElementById(this.id + "_num");
		o.style.color = (this.selected)? "#39577A" : "#FFFFFF";
		o.style.verticalAlign = "bottom";
		
		if (this.num == -1) {
			o.style.display = "none";
		}
	}
	
	function UpdateTab(n, all) {
		
		if (all <= 0) {
			this.Enable(false);
		} else {
			this.Enable(true);
		}
		
		try {
			var o = document.getElementById(this.id + "_num");
			o.innerHTML = n;
		} catch (e) {
			
		}
	}
	
	function Activate() {
		g_oTabs.SelectItem(this.id);
	}
	
	function HighlightOn() {
		
		if ((this.enabled) && (!this.animated)) {
			
			var oimgx = document.getElementById(this.id + "_imgx");
			var oimgs = document.getElementById(this.id + "_imgs");
			var oimgh = document.getElementById(this.id + "_imgh");
			
			this.currentImage = (this.selected)? oimgs : oimgx;
			
			this.currentImage.style.display = "none";
			oimgh.style.display = "";
			hover(this.id, true);
		}
	}
	
	function HighlightOff() {
		
		if ((this.enabled) && (!this.animated)) {
			
			var oimgh = document.getElementById(this.id + "_imgh");
			
			this.currentImage.style.display = "";
			oimgh.style.display = "none";
			hover(this.id, false);
		}
  	}
}

function TabArray(id) {
	
	// vars
	this.id = id;
	this.row = null;
	this.tbody = null;
	this.spacecell = id + spc;
	this.tabs = new Array();
	
	// methods
	this.Create = Create;
	this.AddItem = AddItem;
	this.InsertItem = InsertItem;
	this.SelectItem = SelectItem;
	this.DeleteItem = DeleteItem;
	this.startAnimation = startAnimation;
	this.stopAnimation = stopAnimation;
	
	this.Create();

    function getSpacer(id){
        var spacer = document.createElement('td');
        spacer.id = id || "";
        spacer.className = "tabspace";
        spacer.appendChild(document.createTextNode("\xA0"));
        
        return spacer;
    }
	
	function Create() {
		oTbody = document.getElementById(this.id);

		if (!oTbody) {
			alert("Tab table is invalid!");
			return;
		}

		this.tbody = oTbody;

		var oTr1 = document.createElement("tr");
		this.spacecell = getSpacer(this.spacecell);
	    this.spacecell.style.width = "auto";//guarantee that the final spacer uses the remaining space in the table
		oTr1.appendChild(this.spacecell);
		this.row = oTr1;

		oTbody.appendChild(oTr1);
	}

	function AddItem(oTabItem)
	{
		this.row.insertBefore(getSpacer(oTabItem.id + spc), this.spacecell);
		this.row.insertBefore(oTabItem.cell, this.spacecell);
		this.tabs[this.tabs.length] = oTabItem;
	}
	
	function InsertItem(oTabItem, successor) {
		if (this.tabs.length == 0) {
			this.AddItem(oTabItem);
		} else {
			try {
				var spacer = document.getElementById(this.tabs[successor].id + spc)
				this.row.insertBefore(getSpacer(oTabItem.id + spc), spacer);
				this.row.insertBefore(oTabItem.cell, spacer);
			} catch (e) {
				alert("Invalid array index: " + e.description);
				return;
			}

			for ( var tabs=this.tabs, i = tabs.length; i > successor; --i) {
				tabs[i] = tabs[i - 1];
			}

			this.tabs[successor] = oTabItem;
		}
	}

	function DeleteItem(indx) {
        if (idx >= this.tabs.length || idx < 0) {
            alert("Invalid index");
            return;
        }

        var tab = document.getElementById(this.tabs[idx].id);
        
        for (var i = idx + 1, tabs=this.tabs, len = tabs.length; i < len; ++i) {
            tabs[i - 1] = tabs[i];
        }
        
        tab.parentNode.removeChild(document.getElementById(tab.id + spc));
        tab.parentNode.removeChild(tab);
        --this.tabs.length;
	}
  	
	function SelectItem(id) {
		for ( var i = 0, tabs = this.tabs, l=tabs.length; i < l; ++i) {
			tabs[i].Select(tabs[i].id == id);
		}
	}
	
	function startAnimation(id) {
		
		for (var i=0, length=this.tabs.length; i<length; ++i) {
			
			if (this.tabs[i].id == id) {
				
				var tab = this.tabs[i];
				
				if (!tab.animated) {
					
					if (tab.selected) {
						document.getElementById(tab.id + "_imgs").style.display = "none";
						document.getElementById(tab.id + "_imgas").style.display = "";
					} else {
						document.getElementById(tab.id + "_imgx").style.display = "none";
						document.getElementById(tab.id + "_imgax").style.display = "";
					}
					
					tab.animated = true;
				}
			}
		}
	}
	
	function stopAnimation(id) {
		
		for (var i=0, length=this.tabs.length; i<length; ++i) {
			
			if (this.tabs[i].id == id) {
				
				var tab = this.tabs[i];
				
				if (tab.animated) {
					
					if (tab.selected) {
						document.getElementById(tab.id + "_imgas").style.display = "none";
						document.getElementById(tab.id + "_imgs").style.display = "";
					} else {
						document.getElementById(tab.id + "_imgax").style.display = "none";
						document.getElementById(tab.id + "_imgx").style.display = "";
					}
					
					tab.animated = false;
				}
			}
		}
	}
	
	/*
    *Update tab by setting the display property on both the spacer and the tab
    *
    *@param String id - the ID name of the desired object 
    *@param String display - a CSS display value
    */
   this.updateItem = function(id, display){
       for (var i=0, tabs = this.tabs, l=tabs.length; i < l; ++i) {
           if (tabs[i].id == id) {
               document.getElementById(id + spc).style.display = display;
               tabs[i].cell.style.display = display;
               return;
           }
       }
   };
   
   /*
    * Show the tab
    * 
    * @param String id - the ID name of the desired object
    */
   this.ShowItem = function(id){
       this.updateItem(id, "");
   };
   
   /*
    * Hide the tab
    * 
    * @param String id - the ID name of the desired object
    */
   this.HideItem = function(id){
       this.updateItem(id, "none");
   };
	
	
}
