//shows an object from the given id
function showObject(id){
	if(object = document.getElementById(id)){
		object.style.display = 'block';	
	}
}

//hides an object from the given id
function hideObject(id){
	if(object = document.getElementById(id)){
		object.style.display = 'none';	
	}
}

//takes an object id and content and replaces the html of the object with the new content
function changeHTML(object,content){
	document.getElementById(object).innerHTML = content;
}

function changeClass(object,newClass){
	if(document.getElementById(object)){
		document.getElementById(object).className=newClass;
	}
}








//swapTab takes a object class name and swaps the tab over, some rules need to be followed tho
//the content area must be called xxxxxx|Area|zz where xxxxxx is object class and zz is objectID
function swapTab(objectClass,objectID){
  var objectList = new Array();
  var count = 1;
  var tab;
  
  //loop through all the other tabs and make them the original class
  while(tab = document.getElementById(objectClass+count)){
    changeClass(objectClass+'Area'+count, objectClass+"Area");
	changeClass('span'+objectClass+count, 'span'+objectClass);
    tab.className=objectClass;
    count ++;
  }
  
  changeClass(objectClass+'Area'+objectID, objectClass+"AreaCurrent");
  changeClass(objectClass+objectID, objectClass+'Current');
  changeClass('span'+objectClass+objectID, 'span'+objectClass+'Current');
}

//function addTab takes the tabClass and a new tab name and content for the new tab, then creates and adds the new tab
//and switches the user to that new tab straight away.
function addTab(objectClass,tabName,areaContent){
	var count = 1;
	while(tab = document.getElementById(objectClass+"TabButton"+count)){
		if(tab.innerHTML == tabName){
			swapTab(objectClass,count);
			return false;
		}
		count ++;
	}
	
	var currentTabs = document.getElementById(objectClass+'_TabContainer').innerHTML;
	var newTab =  "<div class='"+objectClass+"' id='"+objectClass+count+"'><a id='"+objectClass+"TabButton"+count+"' class='tabButton' href='#' onclick=\"swapTab('"+objectClass+"','"+count+"')\">"+tabName+"</a>";
	newTab +=  "<a class='closeButton' href='#' onclick=\"closeTab('"+objectClass+"','"+count+"')\"></a></div>";
	
	var currentAreas = document.getElementById(objectClass+'_AreaContainer').innerHTML;
	var newArea = "<div class='"+objectClass+"Area' id='"+objectClass+"Area"+count+"'>"+areaContent+"</div>";
	
	changeHTML(objectClass+'_TabContainer',currentTabs+newTab);
	changeHTML(objectClass+'_AreaContainer',currentAreas+newArea);
	
	swapTab(objectClass,count);
	return true;
}

function closeTab(objectClass, tabID){
	var count = 1;
	var tabCount = 1;
	var currentTabs = "";
	var currentAreas = "";
	while(tab = document.getElementById(objectClass+count)){
		if(tabID != count){

			var linkHTML = document.getElementById(objectClass+"TabButton"+count).innerHTML;
			currentTabs += "<div class='"+objectClass+"' id='"+objectClass+tabCount+"'><a id='"+objectClass+"TabButton"+tabCount+"' class='tabButton' href='#' onclick=\"swapTab('"+objectClass+"','"+tabCount+"')\">"+linkHTML+"</a>";
			currentTabs +=  "<a class='closeButton' href='#' onclick=\"closeTab('"+objectClass+"','"+tabCount+"')\"></a></div>";
			
			var areaContent = document.getElementById(objectClass+"Area"+count).innerHTML;
			currentAreas += "<div class='"+objectClass+"Area' id='"+objectClass+"Area"+tabCount+"'>"+areaContent+"</div>";

			tabCount ++;
			count ++;
		}else{
			count ++;
		}
	}
	
	changeHTML(objectClass+'_TabContainer',currentTabs);
	changeHTML(objectClass+'_AreaContainer',currentAreas);
	
	if(tabID == 1){
		if(document.getElementById(objectClass+tabID)){
			swapTab(objectClass,1);
		}
	}else{
		swapTab(objectClass,(tabID-1));
	}
}

