// New tabs use this function (for hotels)
function switchContent(tabsid,elements,number) {
	for(var i = 1; i <= elements; i++) {
		if(i == number) {
			document.getElementById(tabsid + 'Item' + i + 'Lt').className = 'tabOnLt';
			document.getElementById(tabsid + 'Item' + i + 'Txt').className = 'tabOnTxt';
			document.getElementById(tabsid + 'Item' + i + 'Rt').className = 'tabOnRt';
			document.getElementById('content' + i).className = 'content' + i;
		}
		else {
			document.getElementById(tabsid + 'Item' + i + 'Lt').className = 'tabOffLt';
			document.getElementById(tabsid + 'Item' + i + 'Txt').className = 'tabOffTxt';
			document.getElementById(tabsid + 'Item' + i + 'Rt').className = 'tabOffRt';
			document.getElementById('content' + i).className = 'content' + i + ' hide';
		}
	}	
}	
   

function changeContent(container, menuTab, contentBlock, tabIndex, contentBlockCount)
{
	// Refernce to the menu tab element
	var selectedTab       = document.getElementById(menuTab);

	// Reference to the content block DIV
	var content           = document.getElementById(contentBlock);
	var childElements     = document.getElementById(container);
	var styleChanged      = false;

	//IMPORTANT - CHANGE THIS FOR THE NUMBER OF CONTENT AREAS THAT ARE AVAILABLE
	var lengthNumber      = 1;

	// Get the LI tags within the UL block
	childElements = childElements.getElementsByTagName("li");

	// Loop around all of the elements of the UL tag child nodes
	for(var i = 0; i < childElements.length; i ++)
	{
		var childElement = childElements[i];

		// Channge the style to grey initially
		childElement.className = 'btn2-hi1';

		if(contentBlockCount == 2)
			lengthNumber = 0;


		if(i == childElements.length - lengthNumber)
		{
			// If the selected tab is the last in the list set the orange style
			if(childElement.id == menuTab)
			{
				childElement.className = 'btn3-hi3';
				styleChanged = true;
			}
			else
			{
				childElement.className = 'btn3-hi2';
			}
		}
	}

	// If the style hasn't already been changed do it now
	if(styleChanged == false && contentBlockCount == 2)
	{
		selectedTab.className = 'btn3-hi3';
	}
	else if(styleChanged == false && contentBlockCount > 2)
	{
		selectedTab.className = 'btn1-hi1';
	}

	if(tabIndex == 0 && contentBlockCount == 2)
	{
		selectedTab.className = 'btn1-hi1';
	}



	if(tabIndex != 0)
	{
		var childElement2 = childElements[tabIndex - 1];
		childElement2.className = 'btn1-hi2';
	}

	// Hide the content that we're no interested in
	for(var x = 1; x <= contentBlockCount; x++)
	{
		// Get a handle on each of the content areas
		var contentZone = document.getElementById('content' + x)
		contentZone.className = 'content' + x + ' hide';
	}

	// Show the target content
	content.className = contentBlock;
}

function switchTabContent(tabsid,elements,number) {
	for(var i = 1; i <= elements; i++) {
		if(i == number) {
			document.getElementById('hotelbooker' + i).className = 'show';
		}
		else {
			document.getElementById('hotelbooker' + i).className = 'hide';
		}
		
		if(number == 1)
		{
			$j('#pinktab').removeClass('pinktab1');
			$j('#pinktab').addClass('pinktab');
			$j('#orangetab').removeClass('orangetab1');
			$j('#orangetab').addClass('orangetab');
		}
		if(number == 2)
		{
			$j('#pinktab').removeClass('pinktab');
			$j('#pinktab').addClass('pinktab1');
			$j('#orangetab').removeClass('orangetab');
			$j('#orangetab').addClass('orangetab1');
		}
		
	}	
}