// JavaScript for populating and running the make/model selector on home page and build a cover step 2
// John Rau - November 2011

$jx(document).ready(function() {
	// Load the list of manufacturers using AJAX from getmakemodel.php
	$jx.ajax({
		url: '/build/getmakemodel.php?type=make',
		error: function() { // If there's an error, hide everythind and make the user go through the traditional steps to order
			$jx('#mm_selector_form').hide();
		},
		success: function(data){
			// Populate the manufacturers into the <select> dropdown
			var response = eval('(' + data + ')');
			var makes = response.makes;
			$jx('#mm_selector_form #Category').html("<option>Make</option>");
			for (var i = 0; i < makes.length; i++) {
				$jx('#mm_selector_form #Category').append("<option value='" + makes[i].make + "'>" + makes[i].make + "</option>");
			}
		}
	});

	// When the Manufacturer dropdown is changed, load values into the Model dropdown
	$jx('#mm_selector_form #Category').change(function() {
		// Check if they've selected a manufacturer or just the placeholder
		if ($jx('#mm_selector_form #Category').attr('selectedIndex') == 0) { // Placeholder selected
			$jx('#mm_selector_form #SubCat').html('<option>Model</option>');
			$jx('#mm_selector_form #SubCat').attr('disabled',true);
		} else { // Manufacturer selected
			// Load list of models using AJAX from getmakemodel.php
			$jx.ajax({
				url: '/build/getmakemodel.php?type=model&make=' + $jx('#mm_selector_form #Category').val(),
				error: function() { // If there's an error, hide everythind and make the user go through the traditional steps to order
					$jx('#mm_selector_form').hide();
				},
				success: function(data){
					// Populate the model dropdown
					var response = eval('(' + data + ')');
					var models = response.models;
					$jx('#mm_selector_form #SubCat').html("<option>Model</option>");
					for (var i = 0; i < models.length; i++) {
						$jx('#mm_selector_form #SubCat').append("<option value='" + models[i].id + "'>" + models[i].model + "</option>");
					}
					$jx('#mm_selector_form #SubCat').removeAttr('disabled');
				}
			});
		}
	});
	
	// HOMEPAGE ONLY - Add fancybox to the confirm <div>
	if ($jx('#confirm_cover_dimensions').length > 0 ) {
		$jx('#confirm_cover_dimensions').fancybox({
			'centerOnScroll'	:	'true',
			'modal'			:	'true'
		});
	}
	
	// Button proceed handler
	$jx('#mm_selector_form #btnProceed').click(function() {
		// Check if they have selected a make and model
		if ($jx('#mm_selector_form #Category').attr('selectedIndex') != 0 && $jx('#mm_selector_form #SubCat').attr('selectedIndex') != 0) { // Make and model selected
			if ($jx('#confirm_cover_dimensions').length > 0 ) {	// Check for confirmation <div> (this is only present on the home page, not step3.php)
				$jx.ajax({
					// Load dialog box containing confirmation from confirmmakemodel.php
					url: '/build/confirmmakemodel.php?make=' + $jx('#mm_selector_form #Category').val() + '&model=' + $jx('#mm_selector_form #SubCat').val(),
					error: function() { // If there's an error, hide everythind and make the user go through the traditional steps to order
						$jx('#mm_selector_form').hide();
					},
					success: function(data){
						// Load response into div, show fancybox, and add confirm/cancel button handlers
						$jx('#confirm_cover_dimensions').html(data);
						$jx('#confirm_cover_dimensions').show();
						$jx('#confirm_cover_dimensions #confirm_close').click(function() {
							parent.$jx.fancybox.close();
							$jx('#confirm_cover_dimensions').hide();
							return false;					
						});
						$jx('#confirm_cover_dimensions #confirm_proceed').click(function() {
							$jx('#drop_list').submit();	
							return false;				
						});
						$jx('#confirm_cover_dimensions').click();
					}
				});
				return false;
			} else {
				return true;
			}
		} else { // User has not selected make/model
			alert('Please select a Make and Model to continue');
			return false;
		}
	});
});