var currentPaneStyle = 0;
var currentTab = 0;

function tabstrip()
{
   this.tabs = new Array();
   this.add = addTab;
   this.write = writeTabstrip;
}

function tab(caption,content)
{
  this.setId = setId;
  this.caption = caption;
  this.content = content;
  this.write = writeTab;
  this.writeContent = writePane;
}

function addTab(tab)
{
  tab.setId("tab" + this.tabs.length);
  this.tabs[this.tabs.length] = tab;
}

function setId(id)
{
  this.id = id;
}

function initiate()
{
  var div = document.getElementById("tab0");
  showPane(div);
}

function showPane(div)
{
  if(currentTab != 0)
  {
  	//setCookie("pane_var", 1, 30);
    //currentTab.style.backgroundColor = "#ffffff";
	currentTab.style.color = "#990000";
	currentTab.style.fontWeight = "normal";
	//currentTab.style.backgroundImage = "url(http://www.clickinlove.com/images/profile_tab.jpg)";
	//currentTab.style.fontSize = "14";
  }
  	
  
  //div.style.backgroundColor = "#ffffff";
  div.style.fontsize = "12";
  div.style.color = "#990000";
  div.style.fontWeight = "bold";
  //div.style.backgroundImage = "url(http://www.clickinlove.com/images/profile_tab_highlighted.jpg)";
  //div.style.width = "133";
  //div.style.height = "35";
  currentTab = div;
  setCookie("pane_var", div.id, 30);
  //currentTab.style.fontSize = "14";
  
  //currentTab.style.color = "#993399";
  //currentTab.style.fontWeight = "bold";

  if(currentPaneStyle != 0)
    currentPaneStyle.display = "none";
  var paneId = "pn_" + div.id;
  var objPaneStyle = document.getElementById(paneId).style;
  objPaneStyle.display = "block";
  currentPaneStyle = objPaneStyle;
}

function rollover_pane(div)
{
  currentTab.style.color = "#990000";
  currentTab.style.fontWeight = "normal";
  div.style.fontsize = "12";
  div.style.color = "#990000";
  div.style.fontWeight = "bold";
  currentTab = div;
}

function SubmitForm()
{
   window.alert("Form submitted.  This would normally take you to another page");
   // normally, you would here check the form and submit it.
   // if the form has the name 'tabform', then it is submitted
   // with tabform.submit();
}

function writePane()
{
  if (this.id != 5)
     document.write("<div class='pane_profile' id='pn_" + this.id + "'>" + this.content + "</div>");
  else
     document.write("<div class='pane_profile_photos' id='pn_" + this.id + "'>" + this.content + "</div>");
}

function writeTab()
{
   document.write("<td class='tabs'><div class='tabs' id='" + this.id + "' onclick='showPane(this)' onMouseOver='rollover_pane(this)'>" + this.caption + "</div></td>");
}

function writeTabstrip()
{
  document.write("<table class='tabs' cellspacing=\"0\"><tr>");
  for(var i = 0; i < this.tabs.length; i++)
  {
    this.tabs[i].write();
  }
  document.write("</tr></table>");
  
  for(var k = 0; k < this.tabs.length; k++)
  {
    this.tabs[k].writeContent();
  }
  initiate();
}

function getCookie(Name)
{ //get cookie value
	var re=new RegExp(Name+"=[^;]+", "i"); //construct RE to search for target name/value pair
	if (document.cookie.match(re)) //if cookie found
		return document.cookie.match(re)[0].split("=")[1]; //return its value
	return "";
}

function setCookie(name, value, days)
{ //set cookie value
	var expireDate = new Date();
	//set "expstring" to either future or past date, to set or delete cookie, respectively
	var expstring=expireDate.setDate(expireDate.getDate()+parseInt(days));
	document.cookie = name+"="+value+"; expires="+expireDate.toGMTString()+"; path=/";
}


