// JavaScript Document
var xmlHttp;

//function to return an xmlhttp object
function getObject()
{
var xmlHttpObject;
try
  {  xmlHttpObject = new XMLHttpRequest();  }
catch (e)
  { try {    xmlHttpObject = new ActiveXObject("Msxml2.XMLHTTP");    }
  catch (e)
  {    try  { 	xmlHttpObject = new ActiveXObject("Microsoft.XMLHTTP");      }    
	catch(e) { xmlHttpObject = null;}
	
	} 
}
return xmlHttpObject;
}


//function to handle a change of car make
function changeMake(newMake)
{

	strMake = newMake;
	
	//display design elements associated with make
	switch(strMake)
	{
	case "Aston Martin":
		document.getElementById("leftimage1").innerHTML = "<img src=\"images/browser/astonleft1.jpg\" width=\"410\" height=\"12\" border=\"0\" alt=\"\" />";
		document.getElementById("leftimage2").className = "astonMartin";
		document.getElementById("leftimage2").innerHTML = "<span class=\"style4\">&nbsp;&nbsp;Aston Martin</span>";
		document.getElementById("leftimage3").innerHTML = "<img src=\"images/browser/astonleft3.jpg\" width=\"410\" height=\"176\" border=\"0\" alt=\"\" />";
		document.getElementById("rightimage").innerHTML = "<img src=\"images/browser/astonright.jpg\" width=\"190\" height=\"274\" border=\"0\"alt=\"\" />";
	break;
	
	case "Audi":
		document.getElementById("leftimage1").innerHTML = "<img src=\"images/browser/audileft1.jpg\" width=\"410\" height=\"12\" border=\"0\" alt=\"\" />";
		document.getElementById("leftimage2").className = "audi";
		document.getElementById("leftimage2").innerHTML = "<span class=\"style4\">&nbsp;&nbsp;Audi</span>";
		document.getElementById("leftimage3").innerHTML = "<img src=\"images/browser/audileft3.jpg\" width=\"410\" height=\"176\" border=\"0\" alt=\"\" />";
		document.getElementById("rightimage").innerHTML = "<img src=\"images/browser/audiright.jpg\" width=\"190\" height=\"274\" border=\"0\"alt=\"\" />";
	break;
	
	case "Bentley":
		document.getElementById("leftimage1").innerHTML = "<img src=\"images/browser/bentleyleft1.jpg\" width=\"410\" height=\"12\" border=\"0\" alt=\"\" />";
		document.getElementById("leftimage2").className = "bentley";
		document.getElementById("leftimage2").innerHTML = "<span class=\"style4\">&nbsp;&nbsp;Bentley</span>";
		document.getElementById("leftimage3").innerHTML = "<img src=\"images/browser/bentleyleft3.jpg\" width=\"410\" height=\"176\" border=\"0\" alt=\"\" />";
		document.getElementById("rightimage").innerHTML = "<img src=\"images/browser/bentleyright.jpg\" width=\"190\" height=\"274\" border=\"0\"alt=\"\" />";
	break;
	
	case "BMW":
		document.getElementById("leftimage1").innerHTML = "<img src=\"images/browser/bmwleft1.jpg\" width=\"410\" height=\"12\" border=\"0\" alt=\"\" />";
		document.getElementById("leftimage2").className = "bmw";
		document.getElementById("leftimage2").innerHTML = "<span class=\"style4\">&nbsp;&nbsp;BMW</span>";
		document.getElementById("leftimage3").innerHTML = "<img src=\"images/browser/bmwleft3.jpg\" width=\"410\" height=\"176\" border=\"0\" alt=\"\" />";
		document.getElementById("rightimage").innerHTML = "<img src=\"images/browser/bmwright.jpg\" width=\"190\" height=\"274\" border=\"0\"alt=\"\" />";
	break;
	
	case "Ferrari":
		document.getElementById("leftimage1").innerHTML = "<img src=\"images/browser/ferrarileft1.jpg\" width=\"410\" height=\"12\" border=\"0\" alt=\"\" />";
		document.getElementById("leftimage2").className = "ferrari";
		document.getElementById("leftimage2").innerHTML = "<span class=\"style4\">&nbsp;&nbsp;Ferrari</span>";
		document.getElementById("leftimage3").innerHTML = "<img src=\"images/browser/ferrarileft3.jpg\" width=\"410\" height=\"176\" border=\"0\" alt=\"\" />";
		document.getElementById("rightimage").innerHTML = "<img src=\"images/browser/ferrariright.jpg\" width=\"190\" height=\"274\" border=\"0\"alt=\"\" />";
	break;
	
	case "Jaguar":
		document.getElementById("leftimage1").innerHTML = "<img src=\"images/browser/jagleft1.jpg\" width=\"410\" height=\"12\" border=\"0\" alt=\"\" />";
		document.getElementById("leftimage2").className = "jaguar";
		document.getElementById("leftimage2").innerHTML = "<span class=\"style4\">&nbsp;&nbsp;Jaguar</span>";
		document.getElementById("leftimage3").innerHTML = "<img src=\"images/browser/jagleft3.jpg\" width=\"410\" height=\"176\" border=\"0\" alt=\"\" />";
		document.getElementById("rightimage").innerHTML = "<img src=\"images/browser/jagright.jpg\" width=\"190\" height=\"274\" border=\"0\"alt=\"\" />";
	break;
	
	case "Lamborghini":
		document.getElementById("leftimage1").innerHTML = "<img src=\"images/browser/lamleft1.jpg\" width=\"410\" height=\"12\" border=\"0\" alt=\"\" />";
		document.getElementById("leftimage2").className = "lamborghini";
		document.getElementById("leftimage2").innerHTML = "<span class=\"style4\">&nbsp;&nbsp;Lamborghini</span>";
		document.getElementById("leftimage3").innerHTML = "<img src=\"images/browser/lamleft3.jpg\" width=\"410\" height=\"176\" border=\"0\" alt=\"\" />";
		document.getElementById("rightimage").innerHTML = "<img src=\"images/browser/lamright.jpg\" width=\"190\" height=\"274\" border=\"0\"alt=\"\" />";
	break;
	
	case "Lotus":
		document.getElementById("leftimage1").innerHTML = "<img src=\"images/browser/lotusleft1.jpg\" width=\"410\" height=\"12\" border=\"0\" alt=\"\" />";
		document.getElementById("leftimage2").className = "lotus";
		document.getElementById("leftimage2").innerHTML = "<span class=\"style4\">&nbsp;&nbsp;Lotus</span>";
		document.getElementById("leftimage3").innerHTML = "<img src=\"images/browser/lotusleft3.jpg\" width=\"410\" height=\"176\" border=\"0\" alt=\"\" />";
		document.getElementById("rightimage").innerHTML = "<img src=\"images/browser/lotusright.jpg\" width=\"190\" height=\"274\" border=\"0\"alt=\"\" />";
	break;
	
	case "Maserati":
		document.getElementById("leftimage1").innerHTML = "<img src=\"images/browser/masleft1.jpg\" width=\"410\" height=\"12\" border=\"0\" alt=\"\" />";
		document.getElementById("leftimage2").className = "maserati";
		document.getElementById("leftimage2").innerHTML = "<span class=\"style4\">&nbsp;&nbsp;Maserati</span>";
		document.getElementById("leftimage3").innerHTML = "<img src=\"images/browser/masleft3.jpg\" width=\"410\" height=\"176\" border=\"0\" alt=\"\" />";
		document.getElementById("rightimage").innerHTML = "<img src=\"images/browser/masright.jpg\" width=\"190\" height=\"274\" border=\"0\"alt=\"\" />";
	break;
	
	case "Mercedes":
		document.getElementById("leftimage1").innerHTML = "<img src=\"images/browser/mercleft1.jpg\" width=\"410\" height=\"12\" border=\"0\" alt=\"\" />";
		document.getElementById("leftimage2").className = "mercedes";
		document.getElementById("leftimage2").innerHTML = "<span class=\"style4\">&nbsp;&nbsp;Mercedes Benz</span>";
		document.getElementById("leftimage3").innerHTML = "<img src=\"images/browser/mercleft3.jpg\" width=\"410\" height=\"176\" border=\"0\" alt=\"\" />";
		document.getElementById("rightimage").innerHTML = "<img src=\"images/browser/mercright.jpg\" width=\"190\" height=\"274\" border=\"0\"alt=\"\" />";
	break;
	
	case "Mini Cooper":
		document.getElementById("leftimage1").innerHTML = "<img src=\"images/browser/minileft1.jpg\" width=\"410\" height=\"12\" border=\"0\" alt=\"\" />";
		document.getElementById("leftimage2").className = "miniCooper";
		document.getElementById("leftimage2").innerHTML = "<span class=\"style4\">&nbsp;&nbsp;Mini Cooper</span>";
		document.getElementById("leftimage3").innerHTML = "<img src=\"images/browser/minileft3.jpg\" width=\"410\" height=\"176\" border=\"0\" alt=\"\" />";
		document.getElementById("rightimage").innerHTML = "<img src=\"images/browser/miniright.jpg\" width=\"190\" height=\"274\" border=\"0\"alt=\"\" />";
	break;
	
	case "Porsche":
		document.getElementById("leftimage1").innerHTML = "<img src=\"images/browser/porscheleft1.jpg\" width=\"410\" height=\"12\" border=\"0\" alt=\"\" />";
		document.getElementById("leftimage2").className = "porsche";
		document.getElementById("leftimage2").innerHTML = "<span class=\"style4\">&nbsp;&nbsp;Porsche</span>";
		document.getElementById("leftimage3").innerHTML = "<img src=\"images/browser/porscheleft3.jpg\" width=\"410\" height=\"176\" border=\"0\" alt=\"\" />";
		document.getElementById("rightimage").innerHTML = "<img src=\"images/browser/porscheright.jpg\" width=\"190\" height=\"274\" border=\"0\"alt=\"\" />";
	break;
	
	case "Range Rover":
		document.getElementById("leftimage1").innerHTML = "<img src=\"images/browser/rangeleft1.jpg\" width=\"410\" height=\"12\" border=\"0\" alt=\"\" />";
		document.getElementById("leftimage2").className = "rangeRover";
		document.getElementById("leftimage2").innerHTML = "<span class=\"style4\">&nbsp;&nbsp;Range Rover</span>";
		document.getElementById("leftimage3").innerHTML = "<img src=\"images/browser/rangeleft3.jpg\" width=\"410\" height=\"176\" border=\"0\" alt=\"\" />";
		document.getElementById("rightimage").innerHTML = "<img src=\"images/browser/rangeright.jpg\" width=\"190\" height=\"274\" border=\"0\"alt=\"\" />";
	break;
	
	case "TVR":
		document.getElementById("leftimage1").innerHTML = "<img src=\"images/browser/tvrleft1.jpg\" width=\"410\" height=\"12\" border=\"0\" alt=\"\" />";
		document.getElementById("leftimage2").className = "tvr";
		document.getElementById("leftimage2").innerHTML = "<span class=\"style4\">&nbsp;&nbsp;TVR</span>";
		document.getElementById("leftimage3").innerHTML = "<img src=\"images/browser/tvrleft3.jpg\" width=\"410\" height=\"176\" border=\"0\" alt=\"\" />";
		document.getElementById("rightimage").innerHTML = "<img src=\"images/browser/tvrright.jpg\" width=\"190\" height=\"274\" border=\"0\"alt=\"\" />";
	break;
	}
	
	//display data of first car of select make
	xmlHttp = getObject();
	xmlHttp.onreadystatechange = xmlStateChanged;
	xmlHttp.open("GET","inc/change_make.php?make="+strMake+"&r="+Math.random(),true);
	xmlHttp.send(null);
		
}


//function to skip through the models of a given make
function changeModel(carID)
{
	strID = carID;
	
	xmlHttp = getObject();
	xmlHttp.onreadystatechange = xmlStateChanged;
	xmlHttp.open("GET","inc/change_model.php?id="+strID+"&r="+Math.random(),true);
	xmlHttp.send(null);
}


function xmlStateChanged()
{
	if(xmlHttp.readyState == 4)
	{
		document.getElementById("browsertable").innerHTML = xmlHttp.responseText;
	}
}