var img_container;
var main_img;
var carImage = [];
var lastPhotoIndex = 0;
var city_mpg = 'N/A';
var highway_mpg = 'N/A';

function initCarView()
{
	main_img = document.getElementById('main_img');
	img_container = document.getElementById('img_container');
	for (var i=0; i<car_img.length; i++) {
		carImage[i] = new Image();
		carImage[i].rel="lightbox[car]";
		carImage[i].photoIndex = i;
		carImage[i].onload = function() {
			if (img_container.parentNode.style.display != ''){
				img_container.parentNode.style.display = '';
			}
			var k = this.width/this.height;
			this.style.width = '120px';
			//this.style.height = parseInt(100/k,10) + 'px';
			this.style.height = '90px';
			var a = document.createElement('a');
				a.href = this.src_640;
				a.setAttribute('rel', 'lightbox[car]');
				a.onclick = function () {activeImage = this.photoIndex; myLightbox.start(this); return false;}
				a.appendChild(this);
			img_container.appendChild(a);
		}
		carImage[i].onmouseover = function () {
			main_img.src = this.src_350;
			main_img.parentNode.href = this.src_640;
			carImage[lastPhotoIndex].className = 'car_thumb';
			lastPhotoIndex = this.photoIndex;
			this.className = 'car_thumb car_thumb_selected';
			main_img.parentNode.photoIndex = this.photoIndex;
		}
		carImage[i].className ='car_thumb';
		if (i == 0 ) {
			carImage[i].className +=' car_thumb_selected';
		}
		carImage[i].src_640 = car_img[i].img;
		carImage[i].src = car_img[i].img_120;
		carImage[i].src_350 = car_img[i].img_350;
	}
	myLightbox = new Lightbox();
}

function windowPrint()
{
	setTimeout(wndPrint, 100);	
}

function setMPGFromOpener()
{
	if (parseInt(window.opener.city_mpg) != NaN) {
		city_mpg = window.opener.city_mpg;
	}
	if (parseInt(window.opener.highway_mpg) != NaN) {
		highway_mpg = window.opener.highway_mpg;
	}
	$j('#sr_city_mpg').text(city_mpg);
	$j('#sr_highway_mpg').text(highway_mpg);
	$j('.mpg').show();
}

function wndPrint()
{
	//setMPGFromOpener();
	window.print();
}

function srLoading()
{
	var ids = ['sr_city_mpg', 'sr_highway_mpg'];
	for (var i=0; i<ids.length; i++) {
		$j('#'+ids[i]).text('');
	}
	$j('.mpg').hide();
	$j('.loading_configuration_bar').show();
}

function srGetConfigurationByStyleId(id_style)
{
	srLoading();
	$j.post('vehicle/data', {data:'style', id_style:id_style}, function(data){
		srShowConfiguration(data);
		$j('.loading_configuration_bar').hide();
		$j('.mpg').show();
	}, 'json');
}

function srShowConfiguration(conf)
{
	//City MPG
	$j('#sr_city_mpg').text(getTechnicalSpecificationValue(conf.technicalSpecifications, 6, 14, 26));
	if ($j('#sr_city_mpg').text() == "") {
		$j('#sr_city_mpg').text('N/A');
	}
	city_mpg = $j('#sr_city_mpg').text();

	//Highway MPG
	var mph = getTechnicalSpecificationValue(conf.technicalSpecifications, 6, 14, 27);
	$j('#sr_highway_mpg').text(mph);
	if ($j('#sr_highway_mpg').text() == "") {
		$j('#sr_highway_mpg').text('N/A');
	} else if (parseInt(mph, 10) >= 30){
		$j('#logo_green').show();
	}
	highway_mpg = $j('#sr_highway_mpg').text();
	srShowSpecifications(conf.technicalSpecifications);
}

function srShowSpecifications(ts)
{
	var htmlContent = '<table width="100%">';
	var headerId = 0;
	var index = 0;
	for (var i in ts){
		var doublesClass = 'row0';
		if (index%2 == 0) {
			doublesClass = 'row1';
		}
		if (ts[i].value != '' && ts[i].value != null && ts[i].value != undefined) {
			if (ts[i].headerId != headerId) {
				htmlContent += '<tr><td colspan="2" class="spec_header">' + ts[i].headerName + '</td></tr>';
				headerId = ts[i].headerId;
			}
			htmlContent += '<tr class="'+doublesClass+'">' +
				'<td>' + ts[i].titleName + '</td>' +
				'<td>' + ts[i].value + '</td>' +
			'</tr>';
			index++;
		}
	}
	htmlContent += '</table>'
	$j('#specifications_container').html(htmlContent);
}

function getTechnicalSpecificationValue(ts, groupId, headerId, titleId)
{
	for (var item in ts ){
		if (ts[item].groupId == groupId && ts[item].headerId == headerId && ts[item].titleId == titleId) {
			return ts[item].value;
		}
	}
	return '';
}

function srCarfaxReport(vin, element_name)
{
	if(element_name)
		$j('#' + element_name).load('carfax_report', {'vin': vin});
	else
		$j('#li_carfax').load('carfax_report', {'vin': vin});
}