window.addEvent('domready', function() {
		
	$('make').addEvent('change', function(e) {
		e.stop();
		if(e.target.value > 0) {
			req.send({url:'index.php?option=com_wheels&task=getmodel&format=raw&make='+e.target.value, method:'get'});
		}else{
			$('dd2').set('text', '');
			var el   = new Element('select', {'name': 'model', 'id': 'model'});
			el.inject($('dd2'));
			var elos = new Element('option', {'html': '- Model -', 'id': '0'});
			elos.inject($(el), 'inside');
		}
	});
	
	var req = new Request.JSON({
		onRequest: function() {
			nowLoading(true);
		},
		onSuccess: function(jsonObj) {
			buildList(jsonObj.listitems);
			nowLoading(false);
		},
		onFailure: function() {
			//alert('Error loading data, please try again.');
			nowLoading(false);
		}
	});
	
	
	var dd1El 	= $('make');
	var dd2El 	= $('model');
	var dd3El 	= $('inch');
	var dd4El 	= $('manufacturer');
	var ef1 = new Fx.Tween(dd1El, 'background-color', {duration: 500});
	var ef2 = new Fx.Tween(dd2El, 'background-color', {duration: 500});
	var ef3 = new Fx.Tween(dd3El, 'background-color', {duration: 500});
	var ef4 = new Fx.Tween(dd4El, 'background-color', {duration: 500});
	
	$('searchBtn').addEvent('click', function(e) {
		
		if(($(dd1El).getProperty('value') == 0) && ($(dd2El).getProperty('value') == 0) && ($(dd3El).getProperty('value') == 0) && ($(dd4El).getProperty('value') == 0) || ($('title').getStyle('display') != "block")) {
			
			e.stop();
			ef1.start('background-color', '#de0c0c').chain(
				function(){this.start('background-color', '#ffffff');},
				function(){this.start('background-color', '#de0c0c');},
				function(){this.start('background-color', '#ffffff');},
				function(){this.start('background-color', '#de0c0c');},
				function(){this.start('background-color', '#ffffff');}
			)
			ef3.start('background-color', '#de0c0c').chain(
				function(){this.start('background-color', '#ffffff');},
				function(){this.start('background-color', '#de0c0c');},
				function(){this.start('background-color', '#ffffff');},
				function(){this.start('background-color', '#de0c0c');},
				function(){this.start('background-color', '#ffffff');}
			)
			ef4.start('background-color', '#de0c0c').chain(
				function(){this.start('background-color', '#ffffff');},
				function(){this.start('background-color', '#de0c0c');},
				function(){this.start('background-color', '#ffffff');},
				function(){this.start('background-color', '#de0c0c');},
				function(){this.start('background-color', '#ffffff');}
			)
		}
		
	});
	
});

function nowLoading(state)
{
	if(state) {
		$('titleload').setStyle('display', 'block');
		$('title').setStyle('display', 'none');
		$('make').setProperty('disabled', 'disabed');
		$('model').setProperty('disabled', 'disabed');
		$('inch').setProperty('disabled', 'disabed');
		$('manufacturer').setProperty('disabled', 'disabed');
	}else{
		$('titleload').setStyle('display', 'none');
		$('title').setStyle('display', 'block')
		$('make').setProperty('disabled', '');
		$('model').setProperty('disabled', '');
		$('inch').setProperty('disabled', '');
		$('manufacturer').setProperty('disabled', '');
	}
}

function buildList(lists) {
			
	$('dd2').set('text', '');
	var el = new Element('select', {'name': 'model', 'id': 'model'});
	el.inject($('dd2'));
	
	var i = 0;
	lists.each(function(list) {
		if(list.error == 'error') {
			alert(list.msg);
			enablenext = false;
		}else{

			if(i == 0) {
				var elos = new Element('option', {'html': '- Model -', 'id': 0});
				var elo = new Element('option', {'html': list.jmodel, 'value': list.jid});
				elos.inject($(el), 'inside');
				elo.inject($(el), 'inside');
			}else{	
				var elo = new Element('option', {'html': list.jmodel, 'value': list.jid});
				elo.inject($(el), 'inside');
			}
		}
		i++;
	});
	
	$('make').setProperty('disabled', '');
	$('inch').setProperty('disabled', '');
	$('manufacturer').setProperty('disabled', '');

}