/**
* To use cItems alone you simply apply two extra params in the array : ,true,[tabName]
* Where true defines that it is the active element and [tabName] is the tab to be displayed
*
*/

function tabMenu(width,id,items,cItems,mPanes,useSideTabs,altWidth,altHeight)
{
	this.id 				= id;
	this.width				= width;
	this.height 				= (eval(altHeight)) ? altHeight : 330;	// Height on the entire tabMenu
	this.root 				= ""; 
	this.openImgResource	= "?OpenImageResource";
	this.useSideTabs	 		= useSideTabs;
	this.currentActive  	= null;
	
	this.items				= items;
	this.customItems		= cItems;
	this.panes	 			= mPanes;
	this.itemWidth			= 170;
	
	
	// in case a customized width is specified
	if(eval(altWidth)) {
	this.itemWidth		= altWidth;
	}


	if( !this.useSideTabs ) {
		this.makeme				= tabMenuConstruct;
		this.elSingleActive  		= tabMenuConstructSingleActiveEl;
		this.elSingleInActive 		= tabMenuConstructSingleInActiveEl;
	} else {
		this.makeme				= tabMenuConstructSide;
		this.elSingleActive  		= tabMenuConstructSingleActiveSideEl;
		this.elSingleInActive 		= tabMenuConstructSingleInActiveSideEl;
	}
	this.bottomSpacer		= tabMenuConstructBottomSpacer;
	
	
	this.elCustom			= tabMenuConstructCustom;
	this.setActive			= tabMenuSetActive;
	
	// create it
	this.makeme();
}

/* This function is the alternative to tabMenuConstruct but it display the tabs on the side not on top */
function tabMenuConstructSide() {
	var activeHasBeenSet = false;
	var str = "";


	str += "<table border='0' cellspacing='0' cellpadding='0' width='770' style='border: solid 2px #202E68;'>";
	str += "<tr>";
       str += "<td bgcolor='#202E68' width='110' valign='top'>";
	/* START TO POPULATE THE MENU */

		for (var i=0; i<this.items.length; i++)
		{
			if(eval(this.items[i])) {
				str += "<div";
				str += " id='tabMenuItem_"+i+"'";
				str += " onmouseover='this.style.cursor=\"pointer\";' ";
				if( i==0 ) {
					this.currentActive = "tabMenuItem_"+i;
					str += " class='tabMenuItem3' ";
				} else {
					str += " class='tabMenuItem4' ";
				}
				str += "onClick='tabMenuSetActive(this,\"" + this.id + "\", \"" + this.items[i] + "\"," + i + ");' ";
				str += ">" + this.items[i][0] + "</div>";
			}
		}
		
		// ADD CUSTOM LINKS
		for (var i=0; i<this.customItems.length; i++)
		{
			if( this.items.length == 0 ) {
				this.currentActive = "tabCustomMenuItem_"+i;
			}
			if(eval(this.customItems[i])) {
				str += "<div";
				str += " id='tabCustomMenuItem_"+i+"'";
				str += " onmouseover='this.style.cursor=\"pointer\";' ";
				if( this.customItems[i][2] ) {
					str += " class='tabMenuItem3' ";
				} else {
					str += " class='tabMenuItem4' ";
				}
			
				str += "onClick='" + this.customItems[i][1] + "' ";
				str += ">" + this.customItems[i][0] + "</div>";
			}
		}

	/* END POPULATING THE MENU */
	str += "</td>";
	str += "<td id='contentFrame' valign='top'>";
	str += "</td>";
       str += "</tr>";
	str += "</table>";

	document.write( str );
	newDiv = document.getElementById('contentFrame');
	
	for( i=0; i<this.items.length; i++) {
		if(eval(this.items[i])) {
			el = document.getElementById( this.items[i][3] );
			el.style.display = 'none';

			newDiv.innerHTML += "<div id='" + el.id + "' style='height: " + this.height +"px; overflow: auto;display: " + ((i==0)?'':'none') + ";'>" + el.innerHTML + "</div>";
			el.id = "_____false" + i;
			el.innerHTML = "";

		}
		//newDiv.innerHTML = newDiv.innerHTML + "<br><br>" + el.innerHTML;
		//el.innerHTML = "";
		
		//el.innerHTML = str + el.innerHTML;		
	}
	
	if( this.items.length == 0 ) {
		active_element_id = 0;
		for( i=0; i<this.customItems.length; i++) {
			if(eval(this.customItems[i])) {
				if( this.customItems[i][2] ) {
					active_element_id = i;
					break;
				}
			}
		}
		// We found the active element, now copy the content of that tab into the newDiv element
		el = document.getElementById( this.customItems[i][3] );
		el.style.display = 'none';
		
		// remove <br> in embedded views
		str = el.innerHTML;
		pos = str.indexOf('<!--REMOVEBR--><BR>');
		if (pos != -1) {
			str1 = str.substr(0,pos);
			str2 = str.substr(pos+19,str.length);
			str = str1 + str2;
		}
		//	pos = str.indexOf('<BR>');
		//	str = str.substr(pos+4,str.length);
		
		newDiv.innerHTML += "<div id='" + el.id + "' style='height: " + this.height +"px; overflow: auto;'>" + str + "</div>";
		el.id = "_____false" + active_element_id;
		el.innerHTML = "";
	}
	
	
}


function tabMenuConstruct()
{
	var activeHasBeenSet = false;
	var str = "";
		str += "<table border='0' cellspacing='0' cellpadding='0' width='" + this.width + "'>";
		str += "<tr>";


			// \u00F8nsker \u00E5 h\u00F8yrestille faneknappene
			if(this.items.length<3) {
				str += this.bottomSpacer("90%");
			} else {
				str += this.bottomSpacer("50%");
			}

			
			str += this.bottomSpacer(5);
			for (var i=0; i<this.items.length; i++)
			{
				if(this.items[i][2] && activeHasBeenSet==false) {
					str += this.elSingleActive(this.items[i],i);
					activeHasBeenSet = true;
				} else {
					str += this.elSingleInActive(this.items[i],i);
				}
			}
		/*
		if(this.items.length<2) {
		str += this.bottomSpacer("90%");
		} else {
		str += this.bottomSpacer("50%");
		}
		*/
			// custom
			var firstCustom = false;
			for (var i=0; i<this.customItems.length; i++)
			{
				if(!firstCustom) { 
					str += this.bottomSpacer(10);
				}
				firstCustom = true;
				str += this.elCustom(this.customItems[i],20);
			}
			str += this.bottomSpacer(10);

		str += "</tr>";
		str += "</table>";
		
		document.write(str);
}


// returns code for the single bottom spacer
function tabMenuConstructBottomSpacer(iWidth) {
	return "<td style='' width='" + iWidth + "'>&nbsp;</td>";
}

// return a single active element
function tabMenuConstructSingleActiveEl(el,i) {
	this.currentActive = "tabMenuItem_"+i;
	str  = "<td>&nbsp;</td>";
	str += "<td NOWRAP style='' width='" + this.itemWidth + "' class='tabMenuItem1' id='tabMenuItem_"+i+"' ";
	if(this.items.length>1) {
	str += "onMouseOver='this.style.cursor=\"hand\";' ";
	}
	
	str += "onClick='tabMenuSetActive(this,\"" + this.id + "\", \"" + el + "\"," + i + ");'>";
	str += "" + el[0] + "</td>";
	str += "<td>&nbsp;</td>";
	return str;
}

// return a single inactive element
function tabMenuConstructSingleInActiveEl(el,i) {
	str  = "<td>&nbsp;</td>";
	str += "<td NOWRAP style='' width='" + this.itemWidth + "' class='tabMenuItem2' id='tabMenuItem_"+i+"' ";
	str += "onMouseOver='this.style.cursor=\"hand\";' ";
	str += "onClick='tabMenuSetActive(this,\"" + this.id + "\", \"" + el + "\"," + i + ");'>";
	str += "" + el[0] + "</td>";
	str += "<td>&nbsp;</td>";
	return str;
}

// return a single active element for the side tabs
function tabMenuConstructSingleActiveSideEl(el,i) {
	this.currentActive = "tabMenuItem_"+i;
	/*
	str += "<div style='' id='tabMenuItemSide_"+i+"' ";
	if(this.items.length>1) {
	str += "onMouseOver='this.style.cursor=\"hand\";' ";
	}
	
	str += "onClick='tabMenuSetActive(this,\"" + this.id + "\", \"" + el + "\"," + i + ");'>";
	str += "" + el[0] + "</div>";
	*/
	str += "" + el[0] + "<br>";
	return str;
}

// return a single inactive element for the side tabs
function tabMenuConstructSingleInActiveSideEl(el,i) {
	/*
	str += "<div id='tabMenuItemSide_"+i+"' ";
	str += "onMouseOver='this.style.cursor=\"hand\";' ";
	str += "onClick='tabMenuSetActive(this,\"" + this.id + "\", \"" + el + "\"," + i + ");'>";
	str += "" + el[0] + "</div>";
	*/
	str += "" + el[0] + "<br>";
	return str;
}

// returns code for a custom icon
function tabMenuConstructCustom(el,iWidth) {
	str = "<td style='' width='" + iWidth + "'><a href=\"" + el[1] + "\" target=\"" + el[3] +"\"></a></td>";
	return str;
}

function tabMenuSetActive(ref,oTab,el,i)
{


	if(el.indexOf("tabBrands")!=-1)
		alert("Denne funksjonen er ikke tilgjengelig forel\u00F8pig. Vennligst kontakt din 'Gule Sider' forhandler for mer informasjon.");
	if(eval(oTab)) {
		var obj = eval(oTab);
		if(eval(ref)) {
			var element = explodeString(el);
			// both ok, do something only if an unactive element has been clicked
			if(obj.currentActive!=ref.id) {
				// change state on the inactive
				var img1 = document.getElementById("tabMenuItem_" + i + "a");
				var img2 = document.getElementById("tabMenuItem_" + i + "b");
				var img3 = document.getElementById(obj.currentActive + "a");
				var img4 = document.getElementById(obj.currentActive + "b");
				/*
				// exchange the right image
				temp = img1.src;
				img1.src = img3.src;
				img3.src = temp;
				// exchange the left image
				temp = img2.src;
				img2.src = img4.src;
				img4.src = temp;
				*/
				var obj2 = eval(ref);
				var obj3 = document.getElementById(obj.currentActive);
				var tempBack = obj2.style.backgroundImage;
				obj2.style.backgroundImage = obj3.style.backgroundImage;
				obj2.className = (obj.useSideTabs) ? "tabMenuItem3" : "tabMenuItem1";
				
				// change state on the active
				obj3.style.backgroundImage = tempBack;
				obj3.className = (obj.useSideTabs) ? "tabMenuItem4" : "tabMenuItem2";
				obj.currentActive = ref.id;
				
				// eval javascript, and launch hyperlinks
				var myString = element[1].substring(0,11);
				
				//alert(element[3]);
				
				if(myString=="showTabPane")
				{
					// hide all other panes
					hideAllPanes(obj.panes)
					showTabPane(element[3]);
				} else {
					var myWindow = window.open(element[1],element[3]);
						myWindow.focus();
				}
			} 
		}
	}
}

// explodes "hei,sann" into an array with [0]=hei [1]=sann
function explodeString(myString) {
  return myArray = myString.split(',');
}

// sPane is a String
function showTabPane(sPane)
{
	var obj = document.getElementById(sPane);
	if(eval(obj)) {
		obj.style.display = "";
	}
}

// aList is an array
function hideAllPanes(aList)
{
	for (var i=0; i<aList.length; i++)
	{
		var obj = document.getElementById(aList[i]);
		if(eval(obj)) {
			obj.style.display = "none";
		}
	}
}