/// <reference name="MicrosoftAjax.js" />

// Global Variables
var resizeTimer = null;
var selectVehicleHoverTimer = null;
var selectVehicleHoverOutTimer = null;


function ConfigureButtons()
{
    var actionType = $get("WhyDontISeeMyVehicleActionType").value;
    var actionLink = $get("WhyDontISeeMyVehicleActionLink").value;
    var vehicleModelName = $get("unfilteredVehicleModelName").value;
    var vehicleMakeName = $get("unfilteredVehicleMakeName").value;
    var pageType = $get("PageType").value;
    var pageTitle = $get("PageTitle").value;
    var imagePath = $get("ImagePath").value;
    var websiteURL = $get("websiteURL").value;
    var pageTitleProductFound = $get("PageTitleProductFound").value;

	if (actionType == "Product") 
	{
        actionLink = $get("WhyDontISeeMyVehicleURL").value;
	}

	// Main Messages
	var sorryMessage = "<strong>" + pageTitle + "</strong> are currently unavailable for your selected vehicle.";
	var foundProductOnParentCategory = "<strong>" + pageTitle + "</strong> are currently unavailable for your <strong>" + vehicleMakeName + " " + vehicleModelName + "</strong>." +
										" However, there are <strong>" + pageTitleProductFound + "</strong> for your <strong>" + vehicleMakeName + " " + vehicleModelName + "</strong>.";
	var congratulationsMessage = "Good News! We have <strong>" + pageTitle + "</strong> for your <strong>" + vehicleMakeName + " " + vehicleModelName + "</strong>.";
	
	// Button Messages
	var VSMMessage = "<p onclick=\"javascript:RedirectPage('" + websiteURL + "/VehicleSiteMap/TypeMakeModelYear.aspx');\">View all products for your <strong>" + vehicleMakeName + " " + vehicleModelName + "</strong>.</p>";
	var ReturnMessage = "<p onclick=\"javascript:ClosePopup(true);\">Return to <strong>" + pageTitle + "</strong>.</p>";
	var ReturnMessageVehicleNotFound = "<p onclick=\"javascript:ClosePopup(false);\">Return to <strong>" + pageTitle + "</strong>.</p>";
	var GoToCategoryMessage = "<p onclick=\"javascript:RedirectPage('" + actionLink + "');\">View all <strong>" + vehicleMakeName + " " + vehicleModelName + "</strong> " + pageTitleProductFound + ".</p>";
	
	// old messages with buttons
//	var VSMMessageHTMLRed = "<p>See <strong>all</strong> products for your <strong>" + vehicleMakeName + " " + vehicleModelName + "</strong>.</p><a class=\"goButton\" href=\"" + websiteURL + "/VehicleSiteMap/TypeMakeModelYear.aspx\"><img src=\"" + imagePath + "/website3/buttons/go_to_vehicle_page.gif\" /></a>";
//	var VSMMessageHTMLBlue = "<p>See <strong>all</strong> products for your <strong>" + vehicleMakeName + " " + vehicleModelName + "</strong>.</p><a class=\"goButton\" href=\"" + websiteURL + "/VehicleSiteMap/TypeMakeModelYear.aspx\"><img src=\"" + imagePath + "/website3/buttons/go_to_vehicle_page_blue.gif\" /></a>";

//	var SorryMessageHTML = "<p>There are no <strong>" + pageTitle + "</strong> currently available for your selected vehicle.</p><a class=\"continueShoppingButton\" href=\"javascript:ClosePopup();\"><img src=\"" + imagePath + "/website3/buttons/continue_shopping_blue.gif\" /></a>";
//    var FoundProductOnParentCategory = "<p>Sorry, there are no <strong>" + pageTitle + "</strong> currently available for your <strong>" + vehicleMakeName + " " + vehicleModelName + "</strong>." +
//										" However, there are <strong>" + pageTitleProductFound + "</strong> for your <strong>" + vehicleMakeName + " " + vehicleModelName + "</strong>.</p><a class=\"goCategoryButton\" href=\"" + actionLink + "\"><img src=\"" + imagePath + "/website3/buttons/go_to_category.gif\" /></a>";
//	
//    var CongratulationsMessageHTML = "<p>Good News! We have <strong>" + pageTitle + "</strong> for your <strong>" + vehicleMakeName + " " + vehicleModelName + "</strong>.</p><a class=\"continueShoppingButton\" href=\"" + actionLink + "\"><img src=\"" + imagePath + "/website3/buttons/continue_shopping_red.gif\" /></a>";
	
	// no products found for the vehicle
    if (actionLink == "")
    {
    	$("div#optionsDescription").html(sorryMessage);
    	$("div#optionLeft").html(ReturnMessageVehicleNotFound);

    	$("div#optionRight").html(VSMMessage);
    }
	// product found on current page
    else if (actionType == pageType)
    {
    	$("div#optionsDescription").html(congratulationsMessage);
    	$("div#optionLeft").html(VSMMessage);
    	$("div#optionRight").html(ReturnMessage);
	}
	// product found on a parent category
    else
    {
    	$("div#optionsDescription").html(foundProductOnParentCategory);
    	$("div#optionLeft").html(VSMMessage);
    	$("div#optionRight").html(GoToCategoryMessage);
	}

	ToggleSelectedVehicle();
}

function RedirectPage(location)
{
    window.location = location;
}

function ToggleSelectedVehicle()
{
	if ($("div#vehicleFormUnfiltered").is(":visible"))
	{
		// hide vehicle form and show selected vehicle
		$("div#vehicleFormUnfiltered").animate({ opacity: "toggle" }, 400, 'easeOutExpo', function()
		{
			$("div#vehicleSelected > p").html($get("unfilteredVehicleYear").value + " " + $get("unfilteredVehicleMakeName").value + " " + $get("unfilteredVehicleModelName").value);
			$("div#vehicleSelected").animate({ opacity: "toggle" }, 400, 'easeOutExpo');
			// show options results
			$("div#options").animate({ opacity: "toggle" }, 400, 'easeOutExpo');
		});
	}
	else
	{
		resetDropDowns();
		// hide selected vehicle and show vehicle form
		$("div#vehicleSelected").animate({ opacity: "toggle" }, 400, 'easeOutExpo', function()
		{
			$("div#vehicleFormUnfiltered").animate({ opacity: "toggle" }, 400, 'easeOutExpo');
			// hide options results
			$("div#options").animate({ opacity: "toggle" }, 400, 'easeOutExpo');
		});
	}
}

function ChangeVehicle()
{
	ClearVehicle();
	ToggleSelectedVehicle();
}

function TogglePopupBox()
{
	$("div#options").css({ display: "none" });
	TogglePopup($("div#whyDontISeeMyVehiclePopupBox"));
	ToggleExpose($("div#whyDontISeeMyVehiclePopupExpose"));
}

function ClosePopup(saveVehicle)
{
	// hide the options and show the vehicle selector if the options are still showing
	if ($("div#options").is(":visible"))
	{
		ToggleSelectedVehicle();
	}

	TogglePopupBox();

	if (saveVehicle) 
	{
	    window.location = URL;
    }
    else
    {
        ClearVehicle();
	}
}

function ClearVehicle() 
{
	VehicleFormWebService.DeleteVehicle(visitID);
}

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;

    $get("unfilteredVehicleModelName").value = vehicleModel.options[vehicleModel.options.selectedIndex].text;
    $get("unfilteredVehicleMakeName").value = vehicleMake.options[vehicleMake.options.selectedIndex].text;
    $get("unfilteredVehicleYear").value = vehicleYearID;
    $get("unfilteredVehicleMakeID").value = vehicleMakeID;
    $get("unfilteredVehicleModelID").value = vehicleModelID;

    if (vehicleMakeID != "" && vehicleModelID != "" && vehicleYearID != "")
    {
    	VehicleFormWebService.SubmitVehicle(vehicleMakeID, vehicleModelID, vehicleYearID, visitID, submitVehicleCallback, onError);
    }
    else
    {
    	alert('Please Select a Vehicle');
    }
}

function submitVehicleCallback(result) 
{
    var vehicleYearID = $get("unfilteredVehicleYear").value;
    var vehicleMakeID = $get("unfilteredVehicleMakeID").value;
    var vehicleModelID = $get("unfilteredVehicleModelID").value;
    var siloName = $get("unfilteredVehicleSiloName").value;
    var templateID = $get("unfilteredVehicleTemplateID").value;

    if (vehicleMakeID != "" && vehicleModelID != "" && vehicleYearID != "") 
    {
        VehicleFormWebService.WhyDontISeeMyVehicle(vehicleYearID, vehicleMakeID, vehicleModelID, departmentID, categoryID, productID, siloName, templateID, whyDontISeeMyVehicleCallback, onError);
    }
}

function whyDontISeeMyVehicleCallback(result) 
{
	if (result != null)
	{
		$get("WhyDontISeeMyVehicleActionType").value = result[0];
		$get("WhyDontISeeMyVehicleActionLink").value = result[1];
		$get("PageType").value = result[2];
		$get("PageTitle").value = result[3];
		$get("PageTitleProductFound").value = result[4];
		
		// Write out the links to the Department, Category and/or Product pages.
		ConfigureButtons();
	}   
}

function getVehicleMakes(vehicleYearID) 
{
    clearModels();
    if (vehicleYearID == "") 
    {
        clearMakes();
    }
    else 
    {
        VehicleFormWebService.GetVehicleGeneralMakes(vehicleYearID, getVehicleMakesCallback, onError);
    }
}

function getVehicleMakesCallback(result) 
{
    if (result != null) 
    {
        var VehicleYearID = $get("vehicleYear").options[$get("vehicleYear").options.selectedIndex].value;
        
        var s = new Array();
        s[s.length] = "<select name=\"vehicleMake\" id=\"vehicleMake\" onchange=\"getVehicleModels(" + VehicleYearID + ", this.options[selectedIndex].value);\">";
        s[s.length] = "<option value=\"\">Select Make</option>";
        for (var i = 0; i < result.length; i++) {
            s[s.length] = "<option value=\"" + result[i].VehicleMakeID + "\">" + result[i].VehicleMakeName + "</option>";
        }
        s[s.length] = "</select>";
        s[s.length] = "<span id=\"vehicleMakeLoading\"></span>";
        
        window.document.getElementById("vehicleMakeList").innerHTML = s.join("");
        
        window.document.getElementById("vehicleModel").options[0].text = "Select Model";
    }
}

function getVehicleModels(vehicleYearID, vehicleMakeID)
{
    if (vehicleMakeID == "") 
    {
        clearModels();
    }
    else 
    {
        VehicleFormWebService.GetVehicleGeneralModels(vehicleYearID, vehicleMakeID, getVehicleModelsCallback, onError);
    }
}

function getVehicleModelsCallback(result) 
{
	if (result != null) 
    {
        var s = new Array();
        s[s.length] = "<select name=\"vehicleModel\" id=\"vehicleModel\" onchange=\"submitVehicle();\">";
        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>";
        document.getElementById("vehicleModelList").innerHTML = s.join("");

        document.getElementById("vehicleMakeList").style["background"] = "none";
        document.getElementById("vehicleModelList").style["background"] = "none";
        document.getElementById("vehicleYearList").style["background"] = "none";
    }
    else 
    {
        resetDropDowns();
    }
}

function clearMakes() 
{
    var vehicleYear = document.getElementById("vehicleYear");
    if (vehicleYear != null) 
    {
        vehicleYear.options[0].selected = true;
    }

    var s = new Array();
    s[s.length] = "<select id=\"vehicleMake\">";
    s[s.length] = "<option value=\"\">Select Make</option>";
    s[s.length] = "</select>";

    var vehicleMakeList = window.document.getElementById("vehicleMakeList");
    if (vehicleMakeList != null) 
    {
        vehicleMakeList.innerHTML = s.join("");
        vehicleMakeList.style["background"] = "none";
    }

    var vehicleModelList = document.getElementById("vehicleModelList");
    if (vehicleModelList != null) 
    {
        vehicleModelList.style["background"] = "none";
    }

    //disable vehicleModel drop down list
    var vehicleMake = document.getElementById("vehicleMake");
    if (vehicleMake != null) {
        vehicleMake.disabled = "true";
    }

    //disable vehicleModel drop down list
    var vehicleModel = document.getElementById("vehicleModel");
    if (vehicleModel != null) 
    {
        vehicleModel.disabled = "true";
    }
}

function clearModels() 
{
    var vehicleModels = document.getElementById("vehicleModel");
    vehicleModels.options.length = 1;
    vehicleModels.options[0].value = "";
    vehicleModels.options[0].text = "Select Model";

    var s = new Array();
    s[s.length] = "<select name=\"vehicleModel\" id=\"vehicleModel\">";
    s[s.length] = "<option value=\"\">Select Model</option>";
    s[s.length] = "</select>";
    s[s.length] = "<span id=\"vehicleModelLoading\"></span>";
    window.document.getElementById("vehicleModelList").innerHTML = s.join("");

    document.getElementById("vehicleMakeList").style["background"] = "none";
    document.getElementById("vehicleModelList").style["background"] = "none";
    document.getElementById("vehicleYearList").style["background"] = "none";

    var vehicleModel = document.getElementById("vehicleModel");
    if (vehicleModel != null) 
    {
        vehicleModel.disabled = "true";
    }
}

// Resets all three vehicle dropdown menus
function resetDropDowns() 
{
    clearModels();
    clearMakes();
}

function onError(error) 
{
    alert("An error has occured while trying to process your request. Please refresh the browser and try again.");
}



/********** JQuery Functionality **********/

$(document).ready(function()
{
	// hide popup on esc key press
	$addHandler(document, "keydown", onKeyDown);

	// Use a timer so that multiple resize events are not queued up
	$(window).bind('resize', function()
	{
		if (resizeTimer) { clearTimeout(resizeTimer); }
		resizeTimer = setTimeout(CenterPopup, 100);
	});

	// setup show link on hover for category/department pages
	if ($("div#vehicleFormCatNav").length > 0)
	{
		HideWhyDontISeeMyVehicleLink();
		HookUpSelectVehicleHover();
	}

	// disable why don't I see my vehicle in ie6
	if (!isValidBrowser())
	{
		$("a#whyDontISeeMyVehicleLink").html = "";
		$("a#whyDontISeeMyVehicleLink").css({ display: 'none' });
	}
	else
	{
		$("a#whyDontISeeMyVehicleLink").css({ display: 'block' });
	}

});

// helper function to check for ie6
function isValidBrowser()
{
	isValid = false;
	if (navigator.appName == 'Microsoft Internet Explorer')
	{
		var ua = navigator.userAgent;

		// ie8 fakes its signature to look like ie6 so we need to use a regex to filter it
		var re = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
		if (re.exec(ua) != null)
		{
			// if browser version > 6 then browser is valid
			if (parseFloat(RegExp.$1) > 6)
			{
				isValid = true;
			}
		}
	}
	else
	{
		// if not ie then valid
		isValid = true;
	}
	return isValid;
}

function ShowWhyDontISeeMyVehicleLink()
{
	$("a#whyDontISeeMyVehicleLink").stop(true, true);
	$("a#whyDontISeeMyVehicleLink").animate({ opacity: 1 }, 300);
}

function HideWhyDontISeeMyVehicleLink()
{
	$("a#whyDontISeeMyVehicleLink").stop(true, true);
	$("a#whyDontISeeMyVehicleLink").animate({ opacity: 0 }, 500);
}

function HookUpSelectVehicleHover()
{
	// product hover function
	$("div#vehicleFormCatNav").hover(function()
	{
		// set show timer
		if (selectVehicleHoverTimer) { clearTimeout(selectVehicleHoverTimer); }
		selectVehicleHoverTimer = setTimeout(ShowWhyDontISeeMyVehicleLink, 800);
	},
	function()
	{
		// set show timer
		if (selectVehicleHoverTimer) { clearTimeout(selectVehicleHoverTimer); }
		selectVehicleHoverTimer = setTimeout(HideWhyDontISeeMyVehicleLink, 1500);
	});
}

// helper function to hide popup when esc key is pressed
function onKeyDown(args)
{
	if (args.keyCode == Sys.UI.Key.esc && $("div#whyDontISeeMyVehiclePopupBox").is(":visible"))
	{
		TogglePopup($("div#whyDontISeeMyVehiclePopupBox"));
		ToggleExpose($("div#whyDontISeeMyVehiclePopupExpose"));
	}
}

function CenterPopup()
{
	$("div#whyDontISeeMyVehiclePopupBox").centerEasing(500, 'easeOutExpo');
	ResizeExpose($("div#whyDontISeeMyVehiclePopupExpose"));
}

function ResizeExpose(exposeDiv)
{
	exposeDiv.css({ height: $(window).height(), width: $(window).width() });
}

function ToggleExpose(exposeDiv)
{
	if (jQuery.browser.msie)
	{
		// don't show if ie - shows up black
	}
	else
	{
		exposeDiv.stop(true, true);

		exposeDiv.animate({ opacity: "toggle" }, 0);
		ResizeExpose(exposeDiv);
	}
}

function TogglePopup(popupBox)
{
	// stop current animation and clear queue
	popupBox.stop(true, true);

	if (popupBox.is(":hidden"))
	{
		popupBox.centerHorizontal();
	}

	// hide the options and show the vehicle selector if the options are still showing
	if ($("div#options").is(":visible"))
	{
		ToggleSelectedVehicle();
	}
	
	if (jQuery.browser.msie)
	{
		popupBox.animate({ opacity: "toggle" }, 0);
	}
	else
	{
		popupBox.animate({ opacity: "toggle" }, 200, 'easeOutExpo');
	}
}