// This added in to make ie use flexible width menus where needed
(function($) {
	$.fn.ieLongDropdown = function(cln) {
	if (jQuery.browser.msie) { //only IE has problems with long select boxes
		var el = $(this);

		var biggerWidth = 250;
		var currentWidth = el.width();

		if(el.parent('div.ieWideSelect').length == 0){
			el.wrap("<div class='ieWideSelect'></div>");
			el.parent('div.ieWideSelect').append('<div class="ieWideSelectsprite">&nbsp;</div>');
			el.siblings('div.ieWideSelectsprite').hide();
		
			el.parent('div.ieWideSelect').width(currentWidth);

			el.mousedown(function(){
				el.siblings('div.ieWideSelectsprite').show();
				el.width(biggerWidth); 
				return true;
			});
			el.blur(function(){
				el.siblings('div.ieWideSelectsprite').hide();
				el.width(currentWidth); 
				return true;
			});
			el.change(function(){
				el.siblings('div.ieWideSelectsprite').hide();
				el.width(currentWidth);
				return true;
			});
		}
	}
	return this;
	};
})(jQuery);


$( function() {
	
// -------------------- Main wheel selector --------------------	
	$("#makerSelectorMain").change( function() {
		// Set the main maker box to match this one
		$("#makerSelectorLeft").val($("#makerSelectorMain").val());
		
		// Empty the options and create default
		$("#modelSelectorLeft").children().remove().end()
			.append('<option selected value="-">2. Select Model</option>');
		
		$("#modelSelectorMain").children().remove().end()
			.append('<option selected value="-">Select MODEL</option>')

			// Disable both model main and left until loading is complete.
			
			$("#modelSelectorMain").attr("disabled", "true");
			$("#modelSelectorLeft").attr("disabled", "true");
			
			// target must output content-type: text/xml for IE to work
			$.post("/spitxml.php", {
				maker :this.value
			}, function(xml) {
				$("model", xml).each(
					function() {
						var optn = '<option value="'
							+ $(this).find('id').text() + '">'
							+ $(this).find('name').text()
							+ '</option>\n';
						$("#modelSelectorMain").append(optn);
						$("#modelSelectorLeft").append(optn);
					});
				//recalc menu width in ie
				//$('select#modelSelectorLeft').ieLongDropdown();
			});
			$("#modelSelectorMain").removeAttr("disabled");
			$("#modelSelectorLeft").removeAttr("disabled");
			$("#sizeSelectorMain").attr("disabled", "true");
			$("#sizeSelectorLeft").attr("disabled", "true");
	});
	
	
	$("#resetLinkMain").click( function() {
		$("#sizeSelectorLeft").attr('selectedIndex', 0);
		$("#sizeSelectorMain").attr('selectedIndex', 0);
		
		// Set the main maker box to match this one
		$("#makerSelectorMain").attr('selectedIndex', 0);
		$("#makerSelectorLeft").attr('selectedIndex', 0);
		
		//$("#makerSelectorLeft").val($("#makerSelectorMain").val());
		
		// Empty the options and create default
		$("#modelSelectorLeft").children().remove().end()
			.append('<option selected value="-">2. Select Model</option>');
		
		$("#modelSelectorMain").children().remove().end()
			.append('<option selected value="-">Select MODEL</option>')

			// target must output content-type: text/xml for IE to work
			$.post("/spitxml.php", {
				clearcar :1
			}, function(xml) {
				// Do nothing as we are simply asking to clear the "car" session var
			});
			
		//recalc menu width in ie
		//$('select#makerSelectorLeft').ieLongDropdown();
		//$('select#modelSelectorLeft').ieLongDropdown();
		//$('select#sizeSelectorLeft').ieLongDropdown();
	});
	

	$("#modelSelectorMain")
		.change(
			function(i) {
				// Set the left model box to match this one
				$("#modelSelectorLeft").val($("#modelSelectorMain").val());
				//var rewrite = $("#makerSelectorMain option:selected").text().toLowerCase() +
				//' alloy wheels ' + $("#modelSelectorMain option:selected").text().toLowerCase();
				//rewrite = fixUrl(rewrite) + '__M' + $(this).val();
				//window.location.href = rewrite;
				
				
				$("#sizeSelectorMain").children().remove().end()
				.append('<option selected value="-">Select SIZE</option>')
				
				$("#sizeSelectorLeft").children().remove().end()
				.append('<option selected value="-">3. Select Size</option>')
				
				$("#sizeSelectorMain").append('<option value="0">Show All Sizes</option>')
				$("#sizeSelectorLeft").append('<option value="0">Show All Sizes</option>')
				

				$("#sizeSelectorMain").attr("disabled", "true");
				$("#sizeSelectorLeft").attr("disabled", "true");
				
				// target must output content-type: text/xml for IE to work
				$.post("/spitxml.php", {
					modelforsizelookup :this.value
				}, function(xml) {
					$("modelforsizelookup", xml).each(
						function() {
							var optn = '<option value="'
								+ $(this).find('id').text() + '">'
								+ $(this).find('name').text()
								+ '</option>\n';
							$("#sizeSelectorMain").append(optn);
							$("#sizeSelectorLeft").append(optn);
						});
					//recalc menu width in ie
					//$('select#sizeSelectorLeft').ieLongDropdown();
				});
				$("#sizeSelectorMain").removeAttr("disabled");
				$("#sizeSelectorLeft").removeAttr("disabled");				
		});
	
	$("#sizeSelectorMain")
	.change(
		function(i) {
			// Set the main brand box to match this one
			if (0 != $("#brandSelectorMain").val()) {
				$("#brandSelectorLeft").val($("#brandSelectorMain").val());
				//var normalurl = "index.php?cmd=searchbymakermodelsize&maker=" + $("#makerSelectorMain option:selected").val() + "&model=" + $("#modelSelectorMain option:selected").val() + "&size=" + $("#sizeSelectorMain option:selected").val();
				var rewrite = $("#makerSelectorMain option:selected").text().toLowerCase() + ' ' + $("#modelSelectorMain option:selected").text().toLowerCase() + ' ' + $("#sizeSelectorMain option:selected").text().toLowerCase();
				rewrite = fixUrl(rewrite) + "__S" + $("#makerSelectorMain option:selected").val() + "_" + $("#modelSelectorMain option:selected").val() + "_" + $("#sizeSelectorMain option:selected").val();
				window.location.href = rewrite;
			}
		});
	
	$("#sizeSelectorLeft")
	.change(
		function(i) {
			// Set the main brand box to match this one
			if (0 != $("#brandSelectorMain").val()) {
				$("#brandSelectorLeft").val($("#brandSelectorMain").val());
				var rewrite = $("#makerSelectorLeft option:selected").text().toLowerCase() + ' ' + $("#modelSelectorLeft option:selected").text().toLowerCase() + ' ' + $("#sizeSelectorLeft option:selected").text().toLowerCase();
				rewrite = fixUrl(rewrite) + "__S" + $("#makerSelectorLeft option:selected").val() + "_" + $("#modelSelectorLeft option:selected").val() + "_" + $("#sizeSelectorLeft option:selected").val();
				window.location.href = rewrite;
			}
		});
	
// -------------------- Left wheel selector --------------------	
	$("#makerSelectorLeft").change( function() {
		
		// Set the main maker box to match this one
		$("#makerSelectorMain").val($("#makerSelectorLeft").val());
		
		// Empty the options and create default
		$("#modelSelectorLeft").children().remove().end()
			.append('<option selected value="-">2. Select Model</option>');
		
		$("#modelSelectorMain").children().remove().end()
			.append('<option selected value="-">Select MODEL</option>')

			// target must output content-type: text/xml for IE to work
			$.post("spitxml.php", {
				maker :this.value
			}, function(xml) {
				$("model", xml).each(
					function() {
						var optn = '<option value="'
							+ $(this).find('id').text() + '">'
							+ $(this).find('name').text()
							+ '</option>\n';
						$("#modelSelectorMain").append(optn);
						$("#modelSelectorLeft").append(optn);
					});
				//recalc menu width in ie
				//$('select#modelSelectorLeft').ieLongDropdown();
			});
		$("#sizeSelectorMain").attr("disabled", "true");
		$("#sizeSelectorLeft").attr("disabled", "true");
		
		
		return true;
	});
	
	$("#resetLinkLeft").click( function() {
		
		
		$("#sizeSelectorLeft").attr('selectedIndex', 0);
		$("#sizeSelectorMain").attr('selectedIndex', 0);
		
		// Set the main maker box to match this one
		$("#makerSelectorLeft").attr('selectedIndex', 0);
		$("#makerSelectorMain").attr('selectedIndex', 0);
		
		//$("#makerSelectorMain").val($("#makerSelectorLeft").val());
		
		// Empty the options and create default
		$("#modelSelectorLeft").children().remove().end()
			.append('<option selected value="-">2. Select Model</option>');
		
		$("#modelSelectorMain").children().remove().end()
			.append('<option selected value="-">Select MODEL</option>')

			// target must output content-type: text/xml for IE to work
			$.post("/spitxml.php", {
				clearcar :1
			}, function(xml) {
				// Do nothing as we are simply asking to clear the "car" session var
			});
			
		//recalc menu width in ie
		//$('select#makerSelectorLeft').ieLongDropdown();
		//$('select#modelSelectorLeft').ieLongDropdown();
		//$('select#sizeSelectorLeft').ieLongDropdown();
	});
	
	$("#modelSelectorLeft")
	.change(
		function(i) {
			// Set the left model box to match this one
			$("#modelSelectorMain").val($("#modelSelectorLeft").val());
			//var rewrite = $("#makerSelectorMain option:selected").text().toLowerCase() +
			//' alloy wheels ' + $("#modelSelectorMain option:selected").text().toLowerCase();
			//rewrite = fixUrl(rewrite) + '__M' + $(this).val();
			//window.location.href = rewrite;
			
			
			$("#sizeSelectorMain").children().remove().end()
			.append('<option selected value="-">Select SIZE</option>')
			
			$("#sizeSelectorLeft").children().remove().end()
			.append('<option selected value="-">3. Select Size</option>')
			
			$("#sizeSelectorMain").append('<option value="0">Show All Sizes</option>')
			$("#sizeSelectorLeft").append('<option value="0">Show All Sizes</option>')
			
			// target must output content-type: text/xml for IE to work
			$.post("/spitxml.php", {
				modelforsizelookup :this.value
			}, function(xml) {
				$("modelforsizelookup", xml).each(
					function() {
						var optn = '<option value="'
							+ $(this).find('id').text() + '">'
							+ $(this).find('name').text()
							+ '</option>\n';
						$("#sizeSelectorMain").append(optn);
						$("#sizeSelectorLeft").append(optn);
					});
				//recalc menu width in ie
				//$('select#sizeSelectorLeft').ieLongDropdown();
			});
			$("#sizeSelectorMain").removeAttr("disabled");
			$("#sizeSelectorLeft").removeAttr("disabled");
			return true;
	});

	$("#brandSelectorLeft").change(function(i) {
		$.get('/spitxml.php?hideCar',function(){
			var brandId = $("#brandSelectorLeft").val();
			// Set the main brand box to match this one
			if (0 != brandId) {
				$("#brandSelectorMain").val(brandId);
				//var rewrite = $("#brandSelectorMain option:selected").text().toLowerCase() +
				//' alloy wheels from ' + $("#brandSelectorLeft option:selected").text().toLowerCase();
				var rewrite = $("#brandSelectorLeft option:selected").text().toLowerCase() + ' alloy wheels ';
				rewrite = fixUrl(rewrite) + '__B' + brandId;
				window.location.href = rewrite;
			}
		});
		return true;
	});
	
});

function fixUrl(textToFix) {
	var regexp = /[^a-z0-9 \-]|-$/g;
	rewrite = textToFix.replace(regexp, '');
	regexp = / +|-{2,}/g;
	rewrite = rewrite.replace(regexp, "_");
	regexp = /-$/g;
	rewrite = rewrite.replace(regexp, "");
	return rewrite;
}



$(document).ready(function(){
	$('select#makerSelectorLeft').ieLongDropdown();
	$('select#modelSelectorLeft').ieLongDropdown();
	$('select#sizeSelectorLeft').ieLongDropdown();
});