/* GLOBAL VARIABLES */
var totalTab = 0, previousContent = 1;
var tabMax = 1, tabMin = 1, divWidth = 0, previousSelected = "menu_1";
var parent, child;
var bodyLoad = false;
/*
 * Function Name - nonDisplayAll Description - Set the tabMax value. Initiate
 * total number of tab Set the arrow to right of the menu
 */
function tabIntialize(totalRecord) {

	totalTab = totalRecord;
	divWidth = document.getElementById("widget_mainmenu").offsetWidth;
	// alert(divWidth);
	parent = document.getElementById("widget_tapmenu");
	child = parent.getElementsByTagName("li");
	var visibleSize = 0;
	var visibleAllMenuWidth = 0;
	for ( var m = 1; m < child.length; m++) {
		visibleSize = visibleSize + child[m].offsetWidth;
		child[m].style.cursor = "pointer";
	}
	// alert(visibleSize);
	// To find where the arrow mark will get placed...
	var arrowPlaced = 0;
	var offsetValue = 0;

	for ( var m = 1; m <= totalRecord; m++) {
		var liObject = document.getElementById("menu_" + m);
		offsetValue = offsetValue + liObject.offsetWidth;
		// alert(m+"==>"+offsetValue);
		if (offsetValue <= divWidth) {
			arrowPlaced = m;
		}

	}
	tabMax = arrowPlaced;
	if (arrowPlaced == totalRecord) {
		document.getElementById("rightarrow").style.display = "none"; // Hide
																		// the
																		// right
																		// arrow.....
		document.getElementById("rightarrow").style.cursor = "normal"; // Hide
																		// the
																		// right
																		// arrow.....

	}

	bodyLoad = true;

}

/*
 * Function Name - nonDisplayAll Description - this function is used to hide the
 * entire tab
 */
function nonDisplayAll(totalRecord) {

	for ( var nonDisplay = 1; nonDisplay <= totalRecord; nonDisplay++) {
		document.getElementById("menu_" + nonDisplay).style.display = "none";
	}
}

function showNext(totalTab) {
	// To increament the max value when the next button is clicked...
	tabMax = tabMax + 1;
	tabMin = tabMin + 1;
	var visibleSize = 0;
	var lastvisibleSize = 0;
	nonDisplayAll(totalTab);
	var startMenu = tabMax;
	if (tabMax == totalTab) {
		startMenu = tabMin;

	}
	for ( var menuDisplays = startMenu; menuDisplays <= totalTab; menuDisplays++) {
		var ids = "menu_" + menuDisplays;
		var menuobj = document.getElementById(ids);
		menuobj.style.display = "block";
		visibleSize = visibleSize + menuobj.offsetWidth;
		lastvisibleSize = menuobj.offsetWidth;
		lastTab = menuDisplays;

	}
	// To Hide the Right Arrow Button....
	var visibleAllMenuWidth = divWidth - visibleSize;
	// alert(visibleAllMenuWidth);
	// if((visibleAllMenuWidth > 0 ) && (visibleAllMenuWidth <=
	// lastvisibleSize)) {
	if (visibleAllMenuWidth > 0) {
		document.getElementById("rightarrow").style.display = "none"; // Hide
																		// the
																		// right
																		// arrow.....
		document.getElementById("rightarrow").style.cursor = "normal"; // Hide
																		// the
																		// right
																		// arrow.....
	}
	document.getElementById("leftarrow").style.display = "block";
}

/*
 * Function Name - showPrevious Parameter - (totalTab) total number of tab in
 * the menu. Description - This function is used to navigate the next tab
 */
function showPrevious(totalTab) {
	tabMin = tabMin - 1;
	tabMax = tabMax - 1;
	// To show the Right arrow
	document.getElementById("rightarrow").style.display = "block";
	document.getElementById("rightarrow").style.cursor = "pointer"; // Hide the
																	// right
																	// arrow.....
	// To hide the left arrow...
	if (tabMin == 1) {
		document.getElementById("leftarrow").style.display = "none";
	}
	nonDisplayAll(totalTab);
	for ( var menuDisplays = tabMin; menuDisplays <= totalTab; menuDisplays++) {
		var ids = "menu_" + menuDisplays;
		var menuobj = document.getElementById(ids);
		menuobj.style.display = "block";

	}

}

function changeTab(id, max, colorcode) {

	if (bodyLoad && previousContent != id) {

		var highlightedMenu = document.getElementById("menu_" + id);
		// To change the Border color of the content based on the clicked tab
		// color .
		var clickedContent = document.getElementById("content");
		// Change the content div border..
		clickedContent.style.borderColor = colorcode;
		// To change the class which is clicked previously......

		// to hight light the clicked menu..
		document.getElementById(previousSelected).style.height = 37 + "px";
		document.getElementById(previousSelected).style.cursor = "pointer";

		highlightedMenu.style.height = 39 + "px";
		// alert("BEFORE"+highlightedMenu.style.cursor);
		highlightedMenu.style.cursor = "normal";
		// alert("AFTER"+highlightedMenu.style.cursor);
		previousSelected = "menu_" + id;
		showContent(id, max);
		// widvertising integration script - Concentra call-back
		if (document.getElementById("port")) {
			setHeight();
		}
	}
}

function showContent(id, noOfTab) {
	// To display the corresponding content page...
	document.getElementById("d" + id).style.display = "block";
	document.getElementById("d" + previousContent).style.display = "none";
	previousContent = id;
}