var ColorMediaID = 0;
function setVariantImage()
{
	var selectDD = window.document.getElementById("secondDropDown");
	var variantID =  selectDD[selectDD.selectedIndex].value;
	var largeImageID = document.getElementById("LargeImageID");
    var largeImagePath = document.getElementById("LargeImagePath");
    var productImage = document.getElementById("productImageFileName");

	if (variantID != "") 
	{               
		ProductMultipleOptionsWebService.GetVariantImage(variantID, getVariantImageCallback, getSecondOptionError);
	}
	else
	{
        largeImageID.value = document.getElementById("DefaultLargeImageID").value;
        largeImagePath.value = document.getElementById("DefaultLargeImagePath").value;
        productImage.src = document.getElementById("DefaultMedImagePath").value;
	}	
}

function getVariantImageCallback(result)
{       
	var largeImageID = document.getElementById("LargeImageID");
    var largeImagePath = document.getElementById("LargeImagePath");
    var productImage = document.getElementById("productImageFileName");
    var isVariantMedia = document.getElementById("IsVariantMedia");
          
    if(result != null)
    {
        if (result[0] != null)
        {
            if ((result[0].LargeImageID == "") || (result[0].LargeImageFileName == "") || (result[0].MedImageFileName == "")) {
                if (ColorMediaID == 0) {
                    largeImageID.value = document.getElementById("DefaultLargeImageID").value;
                    largeImagePath.value = document.getElementById("DefaultLargeImagePath").value;
                    productImage.src = document.getElementById("DefaultMedImagePath").value;
                }
                isVariantMedia.value = 0;
            }
            else
            {
                largeImageID.value = result[0].LargeImageID;
                largeImagePath.value = result[0].LargeImageFileName;
                productImage.src = result[0].MedImageFileName;
                isVariantMedia.value = 1;
            }
        }
    }
    else
    {
        largeImageID.value = document.getElementById("DefaultLargeImageID").value;
        largeImagePath.value = document.getElementById("DefaultLargeImagePath").value;
        productImage.src = document.getElementById("DefaultMedImagePath").value;
        isVariantMedia.value = 0;
    }
}

function updateSecondDropDown()
{
    var firtDDvalue = document.getElementById("firstDropDown").value;
    var productID = document.getElementById("productIDHidden").value;
    var vehicleID = document.getElementById("vehicleIDHidden").value;
    var attributeType = document.getElementById("attributeTypeHidden").value;
    var returnType = document.getElementById("returnAttributeHidden").value;
    var variantGroupID = document.getElementById("groupIDHidden").value;
    var hasSingleAttribute = document.getElementById("hasSingleAttribute").value;

    // Set Default Images    
	var largeImageID = document.getElementById("LargeImageID");
    var largeImagePath = document.getElementById("LargeImagePath");
    var productImage = document.getElementById("productImageFileName");
    var isVariantMedia = document.getElementById("IsVariantMedia");

    isVariantMedia.value = 0;
    largeImageID.value = document.getElementById("DefaultLargeImageID").value;
    largeImagePath.value = document.getElementById("DefaultLargeImagePath").value;
    productImage.src = document.getElementById("DefaultMedImagePath").value;
    
    if (firtDDvalue != "")
    {
		var inputStringArray = firtDDvalue.split('|');
		var	attributeID = inputStringArray[0];
		var price = "$" + inputStringArray[1];
		var shipDate = inputStringArray[2];
		var variantID = inputStringArray[3];
	}
	else
	{
		var	attributeID = "";
		var price = "";
		var shipDate = "";
		var variantID = "";
	}
     
	if (hasSingleAttribute == "False")
	{
		if (attributeID != "") 
		{               
			ProductMultipleOptionsWebService.GetSecondOption(productID, vehicleID, returnType, attributeID, attributeType, variantGroupID, getSecondOptionCallback, getSecondOptionError);
		} else 
		{
			clearSecondDropDowm();
		}
	} 
	else
	{
	    selectSingleAttributeVariant(variantID, price, shipDate);

	    var largeImageID = document.getElementById("LargeImageID");
	    var largeImagePath = document.getElementById("LargeImagePath");
	    var productImage = document.getElementById("productImageFileName");

	    if (variantID != "") 
	    {
	        ProductMultipleOptionsWebService.GetVariantImage(variantID, getVariantImageCallback, getSecondOptionError);
	    }
	    else {
	        if (ColorMediaID == 0) {
	            largeImageID.value = document.getElementById("DefaultLargeImageID").value;
	            largeImagePath.value = document.getElementById("DefaultLargeImagePath").value;
	            productImage.src = document.getElementById("DefaultMedImagePath").value;
	        }
	    }	
		
	}
}

function getSecondOptionCallback(result)
{       
	var firstAttrLable = document.getElementById("firstAttrLable").value;
    var secondAttrLable = document.getElementById("secondAttrLable").value;
    var selectedVariant = document.getElementById("selectedVariant").title;      
          
     if(result != null)
    {
        var s = new Array();
	    s[s.length] = "<select id=\"secondDropDown\"\" onchange=\"setAvailabilityPMO();setVariantImage();\" >";
	    s[s.length] = "<option value=\"\">" + secondAttrLable + "</option>";
	    
        for(var i = 0; i < result.length; i++ )
	    {    
	        s[s.length] = "<option value=\"" + result[i].VariantID + "\">" + result[i].AttributeDesc + " " + result[i].SalePrice + "</option>";
        }
        
		s[s.length] = "</select>";
		
		for(var i = 0; i < result.length; i++ )
	    {    
			s[s.length] = "<input type=\"hidden\" id=\"shipdate_" + result[i].VariantID + "\" value=\"" + result[i].ShippingDate + "\" / >";
        }
        
        for(var i = 0; i < result.length; i++ )
	    {    
			s[s.length] = "<input type=\"hidden\" id=\"saleprice_" + result[i].VariantID + "\" value=\"" + result[i].SalePrice + "\" / >";
        }
        
        for(var i = 0; i < result.length; i++ )
	    {    
			s[s.length] = "<input type=\"hidden\" id=\"media_" + result[i].VariantID + "\" value=\"" + result[i].MediaID + "\" / >";
        }
        
        for(var i = 0; i < result.length; i++ )
	    {    
			s[s.length] = "<input type=\"hidden\" id=\"media_file_" + result[i].VariantID + "\" value=\"" + result[i].MediaFilename + "\" / >";
        }
        
	    document.getElementById("secondDD").innerHTML = s.join(""); 
    }
    
    setAvailabilityPMO ();	   
    
    if (window.document.getElementById("topOptionalBox") != null)
	{
		    fixIE7zIndexBug();
	}
	
	// set color to match currently selected color swatch
	var defaultOption = document.getElementById("secondDropDown");
	if(defaultOption.disabled != true && selectedVariant != "")
	{
		for(var i = 1; i < defaultOption.length; i++)
		{
			if(defaultOption.options[i].text.indexOf(selectedVariant) != -1)
			{
				defaultOption.selectedIndex = i;
				setAvailabilityPMO ();
			}
		}
	}
}

function fixIE7zIndexBug()
{
	window.document.getElementById("topOptionalBox").style["display"] = "none";
	window.document.getElementById("topOptionalBox").style["display"] = "block";
}
		
function clearSecondDropDowm()
{
    var s = new Array();
    s[s.length] = "<select id=\"secondDropDown\" disabled>";
    s[s.length] = "<option value=\"\">Please Select...</option>"; 
	s[s.length] = "</select>";
    document.getElementById("secondDD").innerHTML = s.join("");
    document.getElementById("selectedVariant").value = "";
    window.document.getElementById('availability').innerHTML= "Select options below for availability";
}

function setAvailabilityPMO ()
{		
	variantID = window.document.getElementById("secondDropDown").value;
	isMap = window.document.getElementById("isMap").value;

	if (variantID != "")
	{
		//Also set hidden input w/ variantId to add to cart
		var selectedVariant = window.document.getElementById("selectedVariant");
		
		if (selectedVariant != null)
		{
			selectedVariant.value = variantID;
		}
		
		var shipdate_id = "shipdate_" + variantID;
		var availabilityDate = window.document.getElementById(shipdate_id).getAttribute("value");	
		
		setPrice(variantID);
		selectSwatch(variantID);
	} 
	else
	{
		//Set everything back to default state (reset)
		var availabilityDate = "Select options below for availability";
		document.getElementById("selectedVariant").value = "";
		// Only change price if its not map
		if (isMap != "True")
		{
			window.document.getElementById('AutoAnythingPriceLable').innerHTML= document.getElementById("defaultPrice").value;
		}
	}
	
	window.document.getElementById('availability').innerHTML= availabilityDate;
	
	if (window.document.getElementById("topOptionalBox") != null)
	{
        fixIE7zIndexBug();
	}
}

function selectVariant(variantID){}

function selectSwatch(variantID)
{
	var mediaInputID = "media_" + variantID;
	var mediaFileInputID = "media_file_" + variantID;
	
	var mediaID = window.document.getElementById(mediaInputID).getAttribute("value");
	var mediaFilename = window.document.getElementById(mediaFileInputID).getAttribute("value");
	
	var selectDD = window.document.getElementById("secondDropDown");
	var colorDesc =  selectDD[selectDD.selectedIndex].text.split(' $')[0];

	if (mediaID != 0) {
	    ColorMediaID = mediaID;
	    //Select Main Image
	    ChangeProductImage("http://images.autoanything.com/images/", mediaFilename, mediaID);
	    //Set Color Desc
	    document.getElementById("availableColorDesc").innerHTML = "Available Colors (" + colorDesc + ")";
	}
	else {
	    ColorMediaID = 0;
	}
}

function setPrice(variantID)
{
	var saleprice_id = "saleprice_" + variantID;
	var salePrice = window.document.getElementById(saleprice_id).getAttribute("value");
	
	window.document.getElementById("AutoAnythingPriceLable").innerHTML = salePrice;
}

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

function selectSingleAttributeVariant(variantID, price, shipDate )
{
	isMap = window.document.getElementById("isMap").value;
	
	if (variantID != "")
	{
		var selectedVariant = window.document.getElementById("selectedVariant");
		if (selectedVariant != null)
		{
			selectedVariant.value = variantID;
		}
		
		window.document.getElementById('availability').innerHTML= shipDate;
		if (isMap != "True")
		{
			window.document.getElementById('AutoAnythingPriceLable').innerHTML= price;
		}
	}
	else
	{
		//Set everything back to default state (reset)
		window.document.getElementById('availability').innerHTML= "Select options below for availability";
		// Only change price if its not map
		if (isMap != "True")
		{
			window.document.getElementById('AutoAnythingPriceLable').innerHTML= document.getElementById("defaultPrice").value;
		}
		document.getElementById("selectedVariant").value = "";
	}
}