var selectedBrand = null;
var selectedModel = null;
var selectedYear = null;

// AJAX variables
var xmlhttp;
var aDiv = "";

function selectCell(cell) {
	if(cell.className == "dark") {
		cell.className="dark selected";
	} else {
		cell.className="selected";
	}
}

function checkAjax(){
	xmlhttp=GetXmlHttpObject();
	if (xmlhttp==null)	  {
		alert ("Browser does not support HTTP Request");
		return;
	}
}

function sendAJAX(url){
	xmlhttp.onreadystatechange=stateChanged;
	xmlhttp.open("GET",url,true);
	xmlhttp.send(null);
}

function showBrands() {
	checkAjax();	

	
	aDiv = "brands";
	
	var url="getBrands.php?sid="+Math.random();
	
	document.getElementById("models").innerHTML=" ";
	document.getElementById("years").innerHTML=" ";
	document.getElementById("cars").innerHTML=" ";
	
	sendAJAX(url);
}

function showModels(brand,cell) {
	checkAjax();	
	if(selectedBrand != null){
		if(selectedBrand.className == "dark selected") {
			selectedBrand.className="dark";
		} else {
			selectedBrand.className="";
		}
	}
	
	selectCell(cell);
	selectedBrand = cell;
	
	aDiv = "models";
	
	var url="getmodels.php?BRAND_ID=" + brand + "&sid="+Math.random();
	
	document.getElementById("years").innerHTML=" ";
	document.getElementById("cars").innerHTML=" ";
	
	sendAJAX(url);
}

function showYears(brand,model,cell) {
	checkAjax();
	if(selectedModel != null){
		if(selectedModel.className == "dark selected") {
			selectedModel.className="dark";
		} else {
			selectedModel.className="";
		}
	}
	
	selectCell(cell);
	
	selectedModel = cell;
	
	var url="getyears.php?MODEL_NAME=" + model + "&BRAND_ID=" + brand;
	url=url+"&sid="+Math.random();
	
	aDiv = "years";
	
	document.getElementById("cars").innerHTML=" ";
	
	sendAJAX(url);
}

function showCar(model,rating,cell) {
	if(selectedYear != null){
		if(selectedYear.className == "dark selected") {
			selectedYear.className="dark";
		} else {
			selectedYear.className="";
		}
	}
	
	selectCell(cell);
	selectedYear = cell;
	
	aDiv = "cars";
	
	var innerHTML = "<div style='text-align:center;background:#202020;cursor:default'>";
	
	for(var i=0;i<rating;i++){
		innerHTML = innerHTML + "<img src='images/rating.png' alt='*' />"
	}
	
	innerHTML = innerHTML + "</div>";
	
	innerHTML = innerHTML + "<div style='text-align:center;margin-top:10px'>";
	
	innerHTML = innerHTML + "<a href='model.php?id=" + model + "' style='color:white'>view car</a></div>";
	
	document.getElementById(aDiv).innerHTML = innerHTML;
}

function orderChart(str) {
	checkAjax();
	
	var url="fullChart.php";
	url=url+"?order="+str;
	url=url+"&sid="+Math.random();
	
	aDiv = "carChart";
	xmlhttp.onreadystatechange=loadData;
	xmlhttp.open("GET",url,true);
	xmlhttp.send(null);
}

function openModal(aLink,evt) {
	checkAjax();
	var id = "#modal";
	
	$(id).css('top',  mouseY(evt)+"px");
	$(id).css('left',  mouseX(evt)+"px");
	var url = "preview.php?id=" + aLink;
	url=url+"&sid="+Math.random();
	
	//transition effect
	$(id).css('display', "block");
	//$(id).fadeIn(500); 
	
	aDiv = "modal";
	sendAJAX(url);
}


function closeModal(){
	$('#modal').hide();
	removeChildrenFromNode($('#modal')[0]);
	$('#modal').innerHTML="<img src='images/loading.gif' alt='loading...' />";
}

function stateChanged() {
	if (xmlhttp.readyState==4)	{
		document.getElementById(aDiv).innerHTML=xmlhttp.responseText;
	} else {
		document.getElementById(aDiv).innerHTML="<div class='loading'><img src='images/loading.gif' alt='Loading...' /></div>";
	}
}

function loadData() {
	if (xmlhttp.readyState==4)	{
		document.getElementById(aDiv).innerHTML=xmlhttp.responseText;
	} else {
		document.getElementById(aDiv).innerHTML="<div class='loading'><img src='images/loadbar.gif' alt='Loading...' /></div>";
	}
}

function GetXmlHttpObject(){
	if (window.XMLHttpRequest)	  {
		// code for IE7+, Firefox, Chrome, Opera, Safari
		return new XMLHttpRequest();
	}
	if (window.ActiveXObject)	  {
		// code for IE6, IE5
		return new ActiveXObject("Microsoft.XMLHTTP");
	}
	return null;
}

function highlightRow(aCell) {
	var cName = aCell.parentNode.className;
	
	if(cName == "dark"){
		aCell.parentNode.className = "dark highlighted";
	} else {
		aCell.parentNode.className = "highlighted";
	}
}
 
function removeHighlightRow(aCell) {
	var cName = aCell.parentNode.className;
	
	if(cName == "dark highlighted"){
		aCell.parentNode.className = "dark";
	} else {
		aCell.parentNode.className = "";
	}
}


function mouseX(evt) {
	if (evt.pageX) return evt.pageX;
	else if (evt.clientX)
	   return evt.clientX + (document.documentElement.scrollLeft ?
	   document.documentElement.scrollLeft :
	   document.body.scrollLeft);
	else return null;
}

function mouseY(evt) {
	if (evt.pageY) return evt.pageY;
	else if (evt.clientY)
	   return evt.clientY + (document.documentElement.scrollTop ?
	   document.documentElement.scrollTop :
	   document.body.scrollTop);
	else return null;
}

function removeChildrenFromNode(node) {
	if(node.hasChildNodes()) {
		while(node.childNodes.length >= 1 ) {
		node.removeChild(node.firstChild);
		}
	}
}