// JavaScript Document
// Written for moic requirement
// start date: 18012007
// team: ameera@alnadeem.com, sreeju@alnadeem.com

function TabMenu(name)

{
var leftposition;
var thiswidth = document.body.offsetWidth
var thisheight = window.screen.height

if (window.sidebar) 
{ 
if(thiswidth == 1024 )
{
	leftposition= 740;
}
else if(thiswidth == 1280 && thisheight == 720)
{
	leftposition= 858;
}

else if(thiswidth == 1280 && thisheight == 1024)
{
	leftposition= 866;
}

else if(thiswidth >= 800)
{
	leftposition = 635+ (thiswidth - 800) /2;
	
}
else
{
	leftposition =645
}
}
 



else if (window.external) 
{
if(thiswidth == 1024 )
{
	leftposition= 746;
}
else if(thiswidth == 1280)
{
	leftposition= 832;
}
else if(thiswidth >= 800)
{
	leftposition = 629+ (thiswidth - 800) /2;
	
}
else
{
	leftposition =615
}
}

	this.Name = name;
	this.tabItems = [];
	this.Config = {
		Count : 4,
		theme : "grey",
		PopDiv : {height: "90px"},
		Popleft : {left: leftposition + "px"},
		Image : {file: "/moic/tabmenu/images/section1.gif", width: 47, height: 32}
	}
	this.activeTab = -1;
	
}

function TabItem(id, displayName,title,url, selected, content, popUpContent,parent,image)
{
	this.id = id;
	this.displayName = displayName;
	this.title = title;
	this.url = url;
	this.selected = selected;
	this.content = content;
	this.popUpContent = popUpContent;
	this.parent = parent;
	this.image = image;
	this.PopUps = [];
	this.logo = [];
};

function PopUp(displayName,title, url)
{
	this.displayName = displayName;
	this.title = title;
	this.url = url;
}

function logo(displayName,image)
{
	this.displayName = displayName;
	this.image = image;
}


TabMenu.prototype.AddTabItem = function (id, displayName,title,url, selected, content, popUpContent,parent,image)
{
	this.tabItems[this.tabItems.length] = new TabItem(id,displayName,title,url, selected, content,popUpContent,parent,image);
};

TabItem.prototype.AddPopUp = function(displayName,titlep, url)
{
	this.PopUps[this.PopUps.length] = new PopUp(displayName,titlep, url);
}

TabItem.prototype.Addlogo = function(displayName,image)
{
	this.logo[this.logo.length] = new logo(displayName,image);
}


/* Render Functions */
TabMenu.prototype.toString = function()
{
	this.setActiveStyleSheet(this.Config.theme);
	var str = "";
	str += "<div class=\"TabStage\">";
	str += this.PrepareTabs();
	str += "</div>";
	str += "<div id=\"PopUpContainer\" class=\"TabPopUp\" style=\"left:" + this.Config.Popleft.left + "\"></div>"
	return str;
	
}

TabMenu.prototype.PrepareTabs = function()
{
	this.setActiveStyleSheet(this.Config.theme);
	var strTabContents = "";
	var strPopUpContents = "";
	var strlogoContents = "";
	var str = "<div class=\"TabContainer\">";
	for(var i = 0, tabcounter = 1; i < 	this.tabItems.length && tabcounter<= this.Config.Count; i++)
	{	
		if(this.tabItems[i].parent == -1)
		{
			tabcounter++;
			str += "<div id=\"TabItem" + this.tabItems[i].id + "\" ";
			//alert(this.tabItems[i].selected);
			//alert(this.tabItems[i].selected && (this.activeTab == -1));
			if(this.tabItems[i].selected)
			{
				str += "class=\"TabItemOn\"";
				strPopUpContents = this.tabItems[i].popUpContent;
				strlogoContents = this.tabItems[i].image;
				this.activeTab = this.tabItems[i].id;
			}
			else
			{
				str += "class=\"TabItem\"";
			}
			str += " dir=ltr>";
			
			str += "<a  title=\"" + this.tabItems[i].title + "\" href=\"" + this.tabItems[i].url + "\" onmouseover=\"javascript: " + this.Name + ".ShowTab(" + this.tabItems[i].id + ")\" ";
		
			if(this.tabItems[i].selected)
			{
				str += "class=\"TabItemOnA\"";
			}
			else
			{
				str += "class=\"TabItemA\"";
			}
			str += "><img src='/moic/gif/arrow.gif' width='5' height='5' hspace='2' align='absMiddle' border='0'>";
			str += this.tabItems[i].displayName + "</a>";	 
			str += "</div>";
			str += "<div ";
			if(tabcounter == this.Config.Count+1)
			{
				str += "class=\"TabItemNoSeparator\"";
			}

			else
			{
				str += "class=\"TabItemSeparator\"";
			}
			str += "><img src=\"images/separator-spacer.png\" width=1 />";
			str += "</div>";
			//strTabContents += this.PrepareTabContent(this.tabItems[i]);
		}
	}
	str += "</div>"
	str += "<table width=98% cellpadding=0 cellspacing=0 border=0 align=left dir=ltr><tr>";
	str += "<td valign=top width=501>";
	str += "<div id=\"TabContentContainer1\" class=\"TabSubLevel1\"></div>";
	str += "<div id=\"TabContentSeparator\" class=\"TabSeparator\"><hr class=\"hrline\" /></div>";
	str += "<div id=\"TabContentContainer2\" class=\"TabSubLevel2\"></div>";
	str += "</td>";
	str += "<td width=\"" + this.Config.Image.width + "\"  height=\"" + this.Config.Image.height + "\" valign=top>";
	//str += "<img src=\"" + this.Config.Image.file + "\" width=\"" + this.Config.Image.width + "\" height=\"" + this.Config.Image.   // height + "\" align=top hspace=2 vspace=4/>";
	str += "<div id=\"logocontent\" ></div>";
	str += "</td>";
	str += "</tr></table>";
	return str;
}

TabMenu.prototype.SetPopUpContent = function(tabid)
{
	var t = this.GetTab(tabid);
	var str = "";
	str += "<table class=\"popupTable\" align=center dir=ltr>";
	str += "<tr><td height=5></td></tr>";
	for(var i=0; i< t.PopUps.length; i++)
	{
	
		str += "<tr>";
		str += "<td class=\"popupTd\">";
		if (i==0)
		{
		str += "<a title=\"" +t.PopUps[i].title + "\"  href=\"" +t.PopUps[i].url + "\" class=\"popupLink\">";
		
		}
		else
		{
		str += "&nbsp;&nbsp;<img src=/moic/gif/arrow.gif  hspace=5 align=absMiddle><a title=\"" +t.PopUps[i].title + "\"  href=\"" +t.PopUps[i].url + "\" class=\"popupLinksmall\">";
		
		}
		str += t.PopUps[i].displayName ;
		str += "</a>";
		str += "</td>";
		str += "</tr>";
		str += "<tr><td height=1 bgcolor=#E2E2E2></td></tr>";
	}
	str += "</table>";
	document.getElementById("PopUpContainer").innerHTML = str;
}


TabMenu.prototype.SetlogoContent = function(tabid)
{
	var t = this.GetTab(tabid);
	
	document.getElementById("logocontent").innerHTML = "<img src=\"" + t.image + "\">";
	var t = this.GetTab(tabid);
	var str = "";
	for(var i=0; i< t.logo.length; i++)
	{
	
		//str = "<img src=\"" + t.logo[i].image + "\" width=\"" + this.Config.Image.width + "\" height=\"" + this.Config.Image.height + "\" align=top hspace=2 vspace=4/>";
		
	}
	document.getElementById("logocontent").innerHTML = str;
	
}




TabMenu.prototype.MakeSubTabContent = function(tabid)
{
	this.GetSubTabContent(tabid,1);
	//this.GetSubTabContent(this.GetSelectedTab(tabid),2);
	this.SetPopUpContent(tabid);
	this.SetlogoContent(tabid);
}
TabMenu.prototype.ClearSubTabContent = function(level)
{
	var layer = "TabContentContainer" + level;
	if(document.getElementById(layer) != null)
	{
		document.getElementById("TabContentSeparator").style.display = "none";
		document.getElementById(layer).innerHTML = "";
		
		
	}
}
TabMenu.prototype.GetSubTabContent = function(tabid, level)
{
	var str = "";
	var image="";
	var x=0;
	
	for(var i =0 ; i < 	this.tabItems.length; i++)
	{
	
		if(this.tabItems[i].parent == tabid)
		{
		
		if(level==1)
			{
			
				if (((x % 3) == 0) && (x != 0))
		      { 
			  
		         str +="<br /><br />" ;
				
		      }
			  x=x+1;
			}
			
		
			str +="<a  title=\"" + this.tabItems[i].title + "\" id=\"TabContent" + this.tabItems[i].id + "\"";
			str += " href=\"" + this.tabItems[i].url + "\" "
			str += "onMouseover=\"javascript: " + this.Name + ".GetSubTabContent(" + this.tabItems[i].id + "," + (parseInt(level)+1) +  ");\" "
			if(this.tabItems[i].selected)
			{
				 str += "class=\"TabItemSubLevel" + level + "\"";
				
			}
			else
			{
				str += "class=\"TabItemSelectedSubLevel" + level + "\"";
			}
			str += "><img src='/moic/gif/arrow1.gif' width='5' height='5' hspace='2' align='absMiddle' border='0'>";
			str += this.tabItems[i].displayName;
			str += "</a>";
			
		}
	}
	//return str;
	var layer = "TabContentContainer" + level;
	if(document.getElementById(layer) != null)
	{
		if(level == 2)
		{
			// if showing the level 2 item show the separator
			document.getElementById("TabContentSeparator").style.display = "block";
		}
		document.getElementById(layer).innerHTML = str;
		
		
	}
	this.SetPopUpContent(tabid);
	this.SetlogoContent(tabid);
}



TabMenu.prototype.GetPopUpContent = function(tabid)
{
	for(var i=0; i< i <this.tabItems.length &&  i < this.Config.Count; i++)
	{
		if(tabid == this.tabItems[i].id)
		{
			return this.tabItems[i].popUpContent;
		}
	}
	return "";
}


TabMenu.prototype.GetlogoContent = function(tabid)
{
	for(var i=0; i< i <this.tabItems.length &&  i < this.Config.Count; i++)
	{
		if(tabid == this.tabItems[i].id)
		{
			return this.tabItems[i].image;
		}
	}
	return "";
}


/* Navigation Functions */

TabMenu.prototype.ShowTab = function(tabid)
{
		//alert(this.activeTab);
		if(this.activeTab == tabid)
		{
			this.ClearSubTabContent(2);
			return;
		}
		this.ClearSubTabContent(2);
		for(var i = 0; i < 	this.tabItems.length ; i++)
		{
			if(this.tabItems[i].parent == -1)
			{
				var mainTab = "TabItem" + this.tabItems[i].id;
				this.SelectTab(mainTab, 0);
			}
		}	
		this.activeTab = -1;
		//make current tab selected
		if(tabid != -1)
		{
			var mainTab = "TabItem" + tabid;
			this.SelectTab(mainTab, 1);
			this.activeTab = tabid;
			this.MakeSubTabContent(this.activeTab)
			
			//document.getElementById("divsubch").innerHTML="";
		}
		
};



TabMenu.prototype.GetTab = function(tabid)
{
	for(var i = 0; i < 	this.tabItems.length; i++)
	{
		if(this.tabItems[i].id == tabid)
		{
			return this.tabItems[i];
		}
	}
}
TabMenu.prototype.SelectTab = function(objid, flag)
{
	if(document.getElementById)
	{
		if(flag == 1)
		{
			document.getElementById(objid).className = "TabItemOn";
		}
		else
		{
			document.getElementById(objid).className = "TabItem";
		}
	}
};

TabMenu.prototype.SelectContent = function(objid, flag)
{
	if(document.getElementById)
	{
		if(flag == 1)
		{
			document.getElementById(objid).style.display = "block";
		}
		else
		{
			document.getElementById(objid).style.display = "none";
		}
	}
}

TabMenu.prototype.GetSelectedTab = function(tabid)
{
	// this function will return the selected tab under the tabid, if nothing is selected, it will return the first item selected
	var rTab = "";
	for(var i =0 ; i < 	this.tabItems.length; i++)
	{
		if(this.tabItems[i].parent == tabid)
		{
			if(rTab == "" ) 
			{
				rTab = this.tabItems[i].id;
			}
			if(this.tabItems[i].selected)
			{
				rTab = this.tabItems[i].id;
			}
		}
	}
	return rTab;
}

/* stylesheet switching functions */
/* style sheet selecting*/
TabMenu.prototype.setActiveStyleSheet = function(title) 
{
	title = this.Name + title;
	var i, a, main;
	for(i=0; (a = document.getElementsByTagName("link")[i]); i++) 
	{
		if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) 
		{
			if(a.getAttribute("title").indexOf(this.Name) == 0)
			{
				a.disabled = true;
				if(a.getAttribute("title") == title){ a.disabled = false;}
			}
		}
	}
}

TabMenu.prototype.ShowTabcontent = function(tabcontent,eservicescontent)
{
this.tabcontent = tabcontent;
this.eservicescontent = eservicescontent;
//tabcontent = tabcontent.replace(/&quot;/g, "\"");
//tabcontent = tabcontent.replace(/<br>/g, "\n");
if (tabcontent != "0") {
document.getElementById("divsubch").innerHTML=tabcontent;
}
if (eservicescontent !="0") 
 {

document.getElementById("PopUpContainer").style.height = this.Config.PopDiv.height;
document.getElementById("PopUpContainer").innerHTML = eservicescontent;
//Effect.BlindDown(document.getElementById("PopUpContainer"));
}

}
//General Functions
function customAlert(str)
{
  if(document.getElementById("tempalert") != null)
  {
	document.getElementById("tempalert").value = str;  
  }
}