//Constants
BASE_PRICE = 533;
ADD_ARMS = 96;
ADD_LEATHER_PADS = 36;
ADD_LUMBAR = 44;
ADD_LUMBAR_PF = 79;
ADD_BASE_ALU = 72;
ADD_BASE_ALU_LINK = 217;
ADD_TUXEDO = 20;

BASE_IMG_NAME = "ac";
IMG_EXTENSION = ".png";

MAX_QTY = 10;
EXCEED_MAX_ALERT = "If you require more than 10 chairs please contact us for more details.";
NO_PELLICLE_ALERT = "Please select one of the available pellicle options.";

pellicles = new Array("classiccarbon", "classiclead", "classicnickel", "classicplatinum", "tuxedogreyblack");

//-----------------------------------------------------
//Preloads all the images and shows/hides splash loader
//-----------------------------------------------------
function preloader()
{
	if (document.images)
	{
	    //loading icon
		picload = new Image(16,16);
		picload.src = "img/loading.gif";
		//background
		picbg1 = new Image(400,600);
		picbg1.src="img/bg.jpg";
		picbg2 = new Image(794,11);
		picbg2.src="img/otop.png";
		picbg3 = new Image(794,11);
		picbg3.src="img/obtm.png";
		picbg4 = new Image(773,11);
		picbg4.src="img/itop.png";
		picbg5 = new Image(773,11);
		picbg5.src="img/ibtm.png";
		picbg6 = new Image(773,521);
		picbg6.src="img/bgroom.jpg";
		picbg7 = new Image(773,11);
		picbg7.src="img/itop-room.png";
		picbg8 = new Image(773,11);
		picbg8.src="img/ibtm-room.png";
		
		
		//tabs
		pictab1 = new Image(118,27);
		pictab1.src="img/tabblack.png";
		pictab2 = new Image(121,27);
		pictab2.src="img/tabgreen.png";
		pictab3 = new Image(121,27);
		pictab3.src="img/tabgreenend.png";
		
		//logo
		piclogo = new Image(258,116);
		piclogo.src = "img/logo.png";
				
		//others
		picribbon = new Image(137,116);
		picribbon.src = "img/ribbon.png";
		picsel = new Image(190,21);
		picsel.src = "img/select.gif";
		picprice = new Image(100,42);
		picprice.src = "img/pricebg.png";
		picbtn = new Image(72,25);
		picbtn.src = "img/button1.png";
		
		//chair img
		pic1= new Image(288,369); 
		pic1.src="ac000.png";
		pic2= new Image(288,369); 
		pic2.src="ac001.png";
		pic3= new Image(288,369); 
		pic3.src="ac010.png";
		pic4= new Image(288,369); 
		pic4.src="ac011.png";
		pic5= new Image(288,369); 
		pic5.src="ac020.png";
		pic6= new Image(288,369); 
		pic6.src="ac021.png";
		pic7= new Image(288,369); 
		pic7.src="ac100.png";
		pic8= new Image(288,369); 
		pic8.src="ac101.png";
		pic9= new Image(288,369); 
		pic9.src="ac110.png";
		pic10= new Image(288,369); 
		pic10.src="ac111.png";
		pic11= new Image(288,369); 
		pic11.src="ac120.png";
		pic12= new Image(288,369); 
		pic12.src="ac121.png";
		
		//pellicles
		picp1 = new Image(98,98);
		picp1.src = "img/pellicle/classiccarbon.png";
		picp2 = new Image(98,98);
		picp2.src = "img/pellicle/classiclead.png";
		picp3 = new Image(98,98);
		picp3.src = "img/pellicle/classicnickel.png";
		picp4 = new Image(98,98);
		picp4.src = "img/pellicle/classicplatinum.png";
		picp5 = new Image(98,98);
		picp5.src = "img/pellicle/tuxedogreyblack.png";

        //titles
        pictitle1 = new Image(232,29);
		pictitle1.src="img/abouttitle.png";
	    pictitle2 = new Image(157,28);
		pictitle2.src="img/contacttitle.png";}
	
	//Finished loading everything so hide the cover div
	//document.getElementById("cover").style.display="none";
}


//-----------------------------------------------------
//Initialisation
//-----------------------------------------------------
function init()
{
	setSelectedPellicle(pellicles[0]);
}

//-----------------------------------------------------
//Displays the pellicle preview
//-----------------------------------------------------
function showpreview(file)
{
    showdiv("preview",true);
	document.getElementById("pelliclepreview").src = file;
}

//-----------------------------------------------------
//Hides the pellicle preview
//-----------------------------------------------------
function hidepreview()
{
    showdiv("preview",false);
}
//------------------------------------------------

//-----------------------------------------------------
//Set the selected pellicle option
//-----------------------------------------------------
function setSelectedPellicle(e)
{
    po = document.getElementById("pellicleoption");
	
	if (po.value != "")
	{
		//reset previous selection border color
		document.getElementById(po.value).className = "thumbdiv";
	}
	
	//set new option and border
    po.value = e.id;
	e.className = "thumbsel";
	
	//Recalculate price
	calculate();
}

//-----------------------------------------------------
//Find and return the selected pellicle
//-----------------------------------------------------
function getSelectedPellicle()
{
	if (document.getElementById("10daywrap").style.display != "none")
	{
		//if 10 day then pellicle is fixed
		return pellicles[0];
	}
	else
	{
		for(i=0; i<pellicles.length; i++)
		{
			if (document.getElementById(pellicles[i]).className == "thumbsel")
			{
				return pellicles[i];
			}
		}
	}
	
	return "";
}

//-----------------------------------------------------
//Changes the displayed chair image
//-----------------------------------------------------
function changeimage(img)
{
	document.getElementById("chairimg").src = img;
}


//-----------------------------------------------------
//Calculate price and image for selected options
//-----------------------------------------------------
function calculate()
{
	var price = BASE_PRICE;
	var imgname = BASE_IMG_NAME;

	//20-day
	if (document.getElementById("20daywrap").style.display != "none")
	{
		//Arms
		e = document.getElementById("armoption");
		var armu = document.getElementById("armuoption");
		if (e.options[e.selectedIndex].value == "Fully-adjustable")
		{
			price += ADD_ARMS;
			imgname += "1";
			//enable arm upholstery options
			armu.disabled = false;
			document.getElementById("selectarmuoption").className = "select";
		}
		else 
		{
			imgname += "0";
			
			//disable arm upholstery options
			armu.selectedIndex = 0;	//armu.options[0].selected = true;
			armu.disabled = true;
			
			//set properties of span to look disabled and show correct text item
			armuspan = document.getElementById("selectarmuoption");
			armuspan.className = "selectd";
			armuspan.innerHTML ="Vinyl Armpads";
		}

		//Arm upholstery (no image change)
		e = document.getElementById("armuoption");
		if (e.options[e.selectedIndex].value == "Leather")
		{
			price += ADD_LEATHER_PADS;
		}
			
		//Lumbar option
		e = document.getElementById("lumbaroption");
		switch(e.options[e.selectedIndex].value)
		{
			case "None":
			   imgname += "0";
			break;
			
			case "Adjustable":
				imgname += "1";
				price += ADD_LUMBAR;
			break;
			
			case "Posture-fit":
				imgname += "2";
				price += ADD_LUMBAR_PF;
			break;
		}
		
		//Base finish
		e = document.getElementById("baseoption");
		switch(e.options[e.selectedIndex].value)
		{
			case "Graphite":
				imgname += "0";
			break;
			
			case "Aluminium":
				imgname += "1";
				price += ADD_BASE_ALU;
			break;
			
			case "Aluminium Linkage":
				imgname += "1";
				price += ADD_BASE_ALU_LINK;
			break;
		}
		
		//Pellicle options (no image change) - Only tuxedo grey black effects price
		if (getSelectedPellicle() == "tuxedogreyblack") 
		{
			price += ADD_TUXEDO;
		}
	}
	else if (document.getElementById("10daywrap").style.display != "none")
	{
		//Always has arms
		price += ADD_ARMS;
		imgname += "1";
		//Vinyl armpads, graphite base and pellicle add nothing to price
		
		//Lumbar option
		e = document.getElementById("lumbaroption10");
		switch(e.options[e.selectedIndex].value)
		{
			case "None":
			   imgname += "0";
			break;
			
			case "Adjustable":
				imgname += "1";
				price += ADD_LUMBAR;
			break;
			
			case "Posture-fit":
				imgname += "2";
				price += ADD_LUMBAR_PF;
			break;
		}
		
		//graphite base
		imgname += "0";
	}

	//Change image
	imgname += IMG_EXTENSION;
	changeimage(imgname);
	
	//Change price displayed
	priceText = "&pound;" + price.toFixed(2);
	document.getElementById("chairprice").innerHTML = priceText;
	document.getElementById("chairpriceexcl").innerHTML = "&pound;" + (price/1.2).toFixed(2);
	
}

//-----------------------------------------------------
//Show or hide a div
//-----------------------------------------------------
function showdiv(id,show)
{
	obj=document.getElementById(id);
	obj.style.display=(show==true)? "block" : "none";
}

//-----------------------------------------------------
//Control function for displaying correct chair tab
//-----------------------------------------------------
function showelements(id)
{
	if (id==1)
	{
		//hide the 20 day elements
		showdiv("20daywrap",false);
		showdiv("10daywrap",true);
	}
	else if (id==2)
	{
		//hide the 10 day elements
		showdiv("10daywrap",false);
		showdiv("20daywrap",true);
	}
}


//-----------------------------------------------------
//CHange the displayed chair tab
//-----------------------------------------------------
function changeactivetab(i,j)
{
    //check if clicked on active tab
	tabname = "leftcoltab"+i;
	if (document.getElementById(tabname).className == "cactive")
	{
		//do nothing
	}
	else
	{
		//set this tab active
		document.getElementById(tabname).className = "cactive";
				
		//set other tab inactive
		tabname2 = "leftcoltab"+j;
		document.getElementById(tabname2).className = "cinactive";
		
		showelements(i);
		
		//Recalculate prices and image displayed
		calculate();
	}
}

//-----------------------------------------------------
//Click handler for tab links
//-----------------------------------------------------
function tabclick(i,j)
{
	changeactivetab(i,j);
}

//-----------------------------------------------------
//Validate and populate form data
//-----------------------------------------------------
function validate(theform)
{
	//Check a pellicle has been selected
	if (getSelectedPellicle() == "")
	{
		alert(NO_PELLICLE_ALERT);
		return false;
	}
	else
	{
		//Check qty doesn't exceed maximum
		var qty = parseInt(document.getElementById("qtyfield").value);
		if (qty > MAX_QTY)
		{
		  alert(EXCEED_MAX_ALERT);
		  document.getElementById("qtyfield").value = '1';
		  return false;
		}
		else
		{
			//Get price
			var priceText = document.getElementById("chairprice").innerHTML.substr(1);
			
			//Multiply by qty
			var total = parseInt(priceText) * qty;
			
			//Set price
			theform.amount.value = ""+total;
			theform.amountexcl.value = ""+(total/1.2).toFixed(2);
			
			//set image filename and qty
			theform.M_imgFilename.value = document.getElementById("chairimg").src;
			theform.M_qty.value = ""+qty;
			
			//Set chair option fields
			if (document.getElementById("20daywrap").style.display != "none")
			{
				theform.M_delivery.value = "25day";
				
				e = document.getElementById("armoption");
				theform.M_armoption.value = e.options[e.selectedIndex].value;
				
				if (e.options[e.selectedIndex].value != "None")
				{
					e = document.getElementById("armuoption");
					theform.M_armuoption.value = e.options[e.selectedIndex].value;
				}
				else
				{
					theform.M_armuoption.value = "N/a";
				}
				
				e = document.getElementById("lumbaroption");
				theform.M_lumbaroption.value = e.options[e.selectedIndex].value;
				
				e = document.getElementById("baseoption");
				theform.M_baseoption.value = e.options[e.selectedIndex].value;
				
				theform.M_pellicle.value = getSelectedPellicle();
			}
			else if (document.getElementById("10daywrap").style.display != "none")
			{
				theform.M_delivery.value = "15day";
				theform.M_armoption.value = "Fully-adjustable";
				theform.M_armuoption.value = "Vinyl";
				
				e = document.getElementById("lumbaroption10");
				theform.M_lumbaroption.value = e.options[e.selectedIndex].value;
				
				theform.M_baseoption.value = "Graphite";
				theform.M_pellicle.value = "classiccarbon";
			}
					
			return true;
		}
	}
}


//-----------------------------------------------------
//Open Terms and Conditions window
//-----------------------------------------------------
function openTerms()
{
	window.open ("termsandconditions.html","termswindow","location=0,status=0,toolbar=0,menubar=0,scrollbars=1,width=600,height=500");
	return false;
}

//-----------------------------------------------------
//Change virtual page
//-----------------------------------------------------
function showPage(pg, noOfPages)
{
    //hide all pages but the one to show
	for (i=1; i<=noOfPages; i++)
	{
		if (i!=pg)
		{
			showdiv("page"+i, false);
			document.getElementById("page"+i+"link").className = "virtualpagelink";   
		}
	}
	
	//show the requested page (and make link active style)
	showdiv("page"+pg, true);
	document.getElementById("page"+pg+"link").className = "virtualpagelink vpactive";
	
	return false;
}