// Remove all models in model list box
// set the selected option to "Select Make First"
function clearMakes()
{
	var vehicleMake = document.getElementById("vehicleMake");
	if (vehicleMake != null)
	{
		vehicleMake.options[0].selected = true;
	}

	var s = new Array();
	s[s.length] = "<select id=\"vehicleModel\">";
	s[s.length] = "<option value=\"\">Select Model</option>";
	s[s.length] = "</select>";

	var vehicleModelList = window.document.getElementById("vehicleModelList");
	if (vehicleModelList != null) 
	{
		vehicleModelList.innerHTML = s.join("");
		vehicleModelList.style["background"] = "none";
	}

	var vehicleYearList = document.getElementById("vehicleYearList");
	if (vehicleYearList != null)
	{
		vehicleYearList.style["background"] = "none";
	}
	
	//disable vehicleModel drop down list
	var vehicleModel = document.getElementById("vehicleModel");
	if (vehicleModel != null)
	{
		vehicleModel.disabled = "true";
	}
}

// Remove all years in year list box
// set the selected option to "Select Model First"
function clearModels()
{
	var vehicleYears = document.getElementById("vehicleYear");
	vehicleYears.options.length = 1;
	vehicleYears.options[0].value = "";
	vehicleYears.options[0].text = "Select Model First";
	
	var s = new Array();
	s[s.length] = "<select name=\"vehicleYear\" id=\"vehicleYear\">";
	s[s.length] = "<option value=\"\">Select Model First</option>";
	s[s.length] = "</select>";
	s[s.length] = "<span id=\"vehicleYearLoading\"></span>";
	window.document.getElementById("vehicleYearList").innerHTML = s.join("");

	document.getElementById("vehicleMakeList").style["background"]	= "none";
	document.getElementById("vehicleModelList").style["background"]	= "none";
	document.getElementById("vehicleYearList").style["background"]	= "none";
	
	var vehicleYear = document.getElementById("vehicleYear");
	if (vehicleYear != null)
	{
		vehicleYear.disabled = "true";
	}
}

// Resets all three vehicle dropdown menus
function resetDropDowns()
{
	clearModels();
	clearMakes();
}

function displayLoading()
{
	document.getElementById("vehicleFormLoading").style["visibility"] = "visible";
}

function hideLoading()
{
	document.getElementById("vehicleFormLoading").style["visibility"] = "hidden";
}

function onError(error)
{
    alert("An error has occured while trying to process your request. Please refresh the browser and try again.");
}

function getVehicleModels(vehicleMakeID)
{
	clearModels();
	if( vehicleMakeID == "" )
	{
		clearMakes();
	}
	else
	{
	    displayLoading();
		VehicleFormMakeModelGuidedNavigationWebService.GetVehicleModels(departmentID, categoryID, vehicleMakeID, getVehicleModelsCallback, onError);
	}
}

function getVehicleModelsCallback(result)
{
    if(result != null)
    {
		var s = new Array();
		s[s.length] = "<select name=\"vehicleModel\" id=\"vehicleModel\" onchange=\"getVehicleYears(" + result[0].VehicleMakeID + ", this.options[selectedIndex].value);\">";
		s[s.length] = "<option value=\"\">Select Model</option>";
		for( var i = 0; i < result.length; i++ )
		{
			s[s.length] = "<option value=\"" + result[i].VehicleModelID + "\">" + result[i].VehicleModelName + "</option>";
		}
		s[s.length] = "</select>";
		s[s.length] = "<span id=\"vehicleModelLoading\"></span>";
		window.document.getElementById("vehicleModelList").innerHTML = s.join("");
		window.document.getElementById("vehicleYear").options[0].text = "Select Model First";
	}
	else
	{
		resetDropDowns();
	}
	hideLoading();
}

function getVehicleYears(vehicleMakeID, vehicleModelID)
{
	if( vehicleModelID == "" )
	{
		clearModels();
	}
	else
	{
	    displayLoading();
		VehicleFormMakeModelGuidedNavigationWebService.GetVehicleYears(departmentID, categoryID, vehicleMakeID, vehicleModelID, getVehicleYearsCallback, onError);
	}
	
	var vehicleYear = document.getElementById("vehicleYear");
	if(vehicleYear != null)
	{
		vehicleYear.disabled = "true";
	}
}

function getVehicleYearsCallback(result)
{
	if(result != null)
    {
		var s = new Array();
		s[s.length] = "<select name=\"vehicleYear\" id=\"vehicleYear\" onchange=\"submitVehicle();\">";
		s[s.length] = "<option value=\"\">Select Year</option>";
		for( var i = 0; i < result.length; i++ )
		{
			s[s.length] = "<option value=\"" + result[i].VehicleYearID + "\">" + result[i].VehicleYearID + "</option>";
		}
		s[s.length] = "</select>";
		s[s.length] = "<span id=\"vehicleYearLoading\"></span>";
		document.getElementById("vehicleYearList").innerHTML = s.join("");
	
	    document.getElementById("vehicleMakeList").style["background"] = "none";
	    document.getElementById("vehicleModelList").style["background"] = "none";
	    document.getElementById("vehicleYearList").style["background"] = "none";
	}
	hideLoading();
}

function submitVehicle()
{
	var vehicleMake = document.getElementById("vehicleMake");
	var vehicleMakeID = vehicleMake.options[vehicleMake.options.selectedIndex].value;
	var vehicleMakeName = vehicleMake.options[vehicleMake.options.selectedIndex].text;
	
	var vehicleModel = document.getElementById("vehicleModel");
	var vehicleModelID = vehicleModel.options[vehicleModel.options.selectedIndex].value;
	var vehicleModelName = vehicleModel.options[vehicleModel.options.selectedIndex].text;
	
	var vehicleYear = document.getElementById("vehicleYear");
	var vehicleYearID = vehicleYear.options[vehicleYear.options.selectedIndex].value;
	
	if( vehicleMakeID != "" && vehicleModelID != "" && vehicleYearID != "" )
	{
		VehicleFormMakeModelGuidedNavigationWebService.SubmitVehicle(departmentID,
		                                                             categoryID,
		                                                             vehicleMakeID, 
		                                                             vehicleMakeName,
		                                                             vehicleModelID, 
		                                                             vehicleModelName,
		                                                             vehicleYearID, 
		                                                             visitID,
		                                                             siloName,
		                                                             templateNumber,
		                                                             submitVehicleCallback, 
		                                                             onError);
	}
	else
	{
	    alert("Please select your vehicle's make, model, and year.");
	}
}

function submitVehicleCallback(result)
{
	if(result != null)
    {
        location.href = result;
	}
}

function setStyle()
{
    //  set the model as the active dropdown if both the model id and year id are 0
    if(typeof(selectedVehicleYearID) != 'undefined' && selectedVehicleYearID != null && selectedVehicleYearID == 0 &&
       typeof(selectedVehicleModelID) != 'undefined' && selectedVehicleModelID != null && selectedVehicleModelID == 0)
    {        
        Sys.UI.DomElement.addCssClass($get('vehicleModelOutline'), 'modelYearDropDownOutline');
    }
    else if(typeof(selectedVehicleYearID) != 'undefined' && selectedVehicleYearID != null && selectedVehicleYearID == 0)
    {
        //  set the year as the active dropdown if the year id is 0
        Sys.UI.DomElement.addCssClass($get('vehicleYearOutline'), 'modelYearDropDownOutline');
    }
}