// prevent use of enter key for text fields on this page
var logoArray = new Array(); 
var isEmbroiderable = false;

function noEnter(e)
{
	var keynum;

	if(window.event) // IE
	{
		keynum = e.keyCode;
	}
	else if(e.which) // Netscape/Firefox/Opera
	{
		keynum = e.which;
	}
	return (keynum != 13);
}

function CreateSku(SkuVarString)
{
    if (SkuVarString != "") 
    {               
	    FloorMatsWebService.CreateSku(SkuVarString, CreateSkuCallback, AjaxError);
    }
}

function CreateSkuCallback(result)
{       
    if(result != null)
    {
	    var selectedVariant = document.getElementById("selectedVariant");
		selectedVariant.value = result;
		addToCartButtonHidden.click();
    }
}

function ValidateEmbroideryText(LogoLine1, LogoLine2)
{
	if(LogoLine1 != "" || LogoLine2 != "")
	{
		FloorMatsWebService.ValidateEmbroideryText(LogoLine1, LogoLine2, ValidateEmbroideryTextCallback, AjaxError);
	}
}

function ValidateEmbroideryTextCallback(result)
{
	if(result != 0)
	{
		var selectedVariant = document.getElementById("selectedVariant");
	    
		selectedVariant.value = "invalidEmbroidery";
		
		addToCartButtonHidden.click();
	}
	else
	{	
		AddToCartControlWithEmbroidery_Click(true);
	}
}

function validateFloorMats()
{
    var selectedVariant = document.getElementById("selectedVariant");
    var divCollection = document.getElementsByTagName("input");
	var needSeparator = false;

    for (var i=0; i < divCollection.length; i++) 
    {
        if(divCollection[i].getAttribute("type") == "checkbox") 
        {
            if (divCollection[i].checked)
            {
				return true;
            }
        } 
    }
	alert ("Please select all options before adding to cart.");
	return false;
}

function FillSelectedVariant(matType) 
{
    var isLloydMat = document.getElementById("isLloydMat").value;
    var selectedVariant = document.getElementById("selectedVariant");
	selectedVariant.value = '';
	var needSeparator = false;
	var singleMat = "";

	if (matType == 'EMBORIDERY')
	{
		var startPosition = document.getElementById("EmbroideryMatsToCustomizeSpan");
	}
	else if (matType == 'LOGO')
	{
		var startPosition = document.getElementById("LogoMatsToCustomizeSpan");
	}	
	else if (matType == 'PLAIN')
	{
		var startPosition = document.getElementById("MainFloorMatPage");
		if (isLloydMat == 'LLOYD')
		{
			matType = 'LLOYD_PLAIN';
		}
		else
		{
			matType = 'NON_LLOYD';
		}
	}	

    var divCollection = startPosition.getElementsByTagName("input");
    for (var i = 0; i < divCollection.length; i++) 
    {
        if(divCollection[i].getAttribute("type") == "checkbox") 
        {
			singleMat = '';
			if (matType == 'EMBORIDERY')
			{
				// embroidaryDesc
				var embDesc = "";
				
				singleMat = divCollection[i].value + '|';
				if (divCollection[i].checked)
				{
					singleMat = divCollection[i].value + '|EMBORIDERY|';
					
					// Get Emboridery Color
					var testColor = document.getElementsByName("RadioColor");
					var colorValue = '';
					for (var z=0; z < testColor.length; z++)
					{
						if (testColor[z].checked)
						{
							colorValue =  testColor[z].value;
							embDesc = embDesc + " ("+ testColor[z].id;
						}
					}
					if ( colorValue != '' ) 
					{
						singleMat = singleMat + colorValue + '|0|';
					}
					else
					{
						singleMat = singleMat + '0|0|';
					}
					
					// Get Emboridery Name/ID
					var test = document.getElementsByName("embroideryFont");
					var fontValue = '';
					var fontName = '';
					for (var j=0; j < test.length; j++)
					{
						if (test[j].checked)
						{
							fontName =  test[j].value;
							fontValue = '0';
							embDesc = embDesc +  " " + test[j].getAttribute("prettyName") + ")";
						}
					}
					if ( fontValue != '' ) 
					{
						singleMat = singleMat + fontName + '|' + fontValue + '|';
					}
					else
					{
						singleMat = singleMat + '||';
					}

					// Get Emboridery Text line1 & line2
					var LogoLine1 = document.getElementById("LogoLine1");
					var LogoLine2 = document.getElementById("LogoLine2");
					
					singleMat = singleMat + LogoLine1.value + '|' + LogoLine2.value;
					
					// Set the hiiden embroidary desc to be displayed in cart
					document.getElementById("selectedEmbroidaryDesc").value = 	embDesc;	
				}				
				else
				{
					singleMat = divCollection[i].value + '|LLOYD_PLAIN|0|0||0||';
				}				
			}
			else if (matType == 'LOGO')
			{
				singleMat = divCollection[i].value + '|';
				if (divCollection[i].checked)
				{
					singleMat = divCollection[i].value + '|LOGO|';

					// Get Logo Color
					var logoColorDropDown = document.getElementById("logoColorDropDown");
					if ( logoColorDropDown != null )
					{
						if (logoColorDropDown.value != "" && logoColorDropDown.value != 0) 
						{
							singleMat = singleMat + logoColorDropDown.value + '|';
						}
						else
						{
							singleMat = singleMat + '0|';
						}
					}
					else
					{
						singleMat = singleMat + '0|';
					}

					// Get Logo Name/ID
					var test = document.getElementsByName("chooseLogo");
					var logoValue = '';
					for (var k=0; k < test.length; k++)
					{
						if (test[k].checked)
						{
							logoValue = test[k].value;
						}
					}
					if ( logoValue != "" ) 
					{
						singleMat = singleMat + logoValue + '||0||';				
					}
					else
					{
						singleMat = singleMat + '0||0||';
					}
				}				
				else
				{
					singleMat = divCollection[i].value + '|LLOYD_PLAIN|0|0||0||';
				}				
			}	
			else if (matType == 'LLOYD_PLAIN') 
			{
				if (divCollection[i].checked)
				{
					singleMat = divCollection[i].value + '|' + matType + '|0|0||0||';
				}				
			}			
			else if (matType == 'NON_LLOYD')
			{
				if (divCollection[i].checked)
				{
					singleMat = divCollection[i].value + '|' + matType + '|0|0||0||';
				}				
			}			
			
			if (singleMat != '')
			{
				if (needSeparator == true)
				{
					selectedVariant.setAttribute('value', selectedVariant.value + ',');
				}
				selectedVariant.setAttribute('value', selectedVariant.value + singleMat);
				needSeparator = true;
            }
        }         
    }
	
	CreateSku(selectedVariant.value);
}

function AddToCartControlWithEmbroidery_Click(retValue)
{
	if(retValue)
	{
		if ( ValidateEmbroidery() )
		{
			FillSelectedVariant('EMBORIDERY');
			return retValue;
		}
		else
		{
			return false;
		}
	}
	else
	{
		var LogoLine1 = document.getElementById("LogoLine1").value;
		var LogoLine2 = document.getElementById("LogoLine2").value;

		ValidateEmbroideryText(LogoLine1, LogoLine2);	
	}
	
	return retValue;
}

function AddToCartControlWithLogo_Click()
{
	if ( ValidateLogo() )
	{
		FillSelectedVariant('LOGO');
	}
	else
	{
		return false;
	}	
}

function AddToCartControl_Click()
{
	if (! validateFloorMats())
	{
		return false;
	}

	FillSelectedVariant('PLAIN');
	return true;
}

function AddEmbroidery_Click()
{
	if (! validateFloorMats())
	{
		return false;
	}
	
	if(!isEmbroiderable)
	{
		alert("Text and logo embroidery can only be added to front and rear floor mats");
		return false;
	}

    var mainPage = document.getElementById("MainFloorMatPage");
    var embroideryPage = document.getElementById("EmbroideryFloorMatPage");
    var logoPage = document.getElementById("LogoFloorMatPage");

    mainPage.style["display"] = "none";
    embroideryPage.style["display"] = "block";
    logoPage.style["display"] = "none";

	document.location = "#CustomizeMats";

	CreateListOfMatsToCustomize('EMBORIDERY');
}

function BackButton_Click()
{
    var mainPage = document.getElementById("MainFloorMatPage");
    var embroideryPage = document.getElementById("EmbroideryFloorMatPage");
    var logoPage = document.getElementById("LogoFloorMatPage");

    mainPage.style["display"] = "block";
    embroideryPage.style["display"] = "none";
    logoPage.style["display"] = "none";

	document.location = "#CustomizeMats"
	
	return false;
}

function AddLogo_Click()
{
	if (! validateFloorMats())
	{
		return false;
	}

    var mainPage = document.getElementById("MainFloorMatPage");
    var embroideryPage = document.getElementById("EmbroideryFloorMatPage");
    var logoPage = document.getElementById("LogoFloorMatPage");

    mainPage.style["display"] = "none";
    embroideryPage.style["display"] = "none";
    logoPage.style["display"] = "block";

	document.location = "#CustomizeMats"

	CreateListOfMatsToCustomize('LOGO');

	updateLogoImages();
}

function updateLogoImages()
{
    var vehicleYearID;
    if ( document.getElementById("vehicleYearID") != null )
    {
		vehicleYearID = document.getElementById("vehicleYearID").value;
    }

    var vehicleMakeID;
    if ( document.getElementById("vehicleMakeID") != null )
    {
		vehicleMakeID = document.getElementById("vehicleMakeID").value;
    }

    var vehicleModelID;
    if ( document.getElementById("vehicleModelID") != null )
    {
		vehicleModelID = document.getElementById("vehicleModelID").value;
    }

    if (vehicleMakeID != "") 
    {               
	    FloorMatsWebService.GetFloorMatLogo(vehicleYearID, vehicleMakeID, vehicleModelID, updateLogoImagesCallback, AjaxError);
    } 
}

function updateLogoImagesCallback(result)
{       
    var ImagePath = document.getElementById("ImagePath").value;      
	    
    if(result != null)
    {
        var s = new Array();
        var logoColorDisplay = "";

        for (var i=0; i < result.length; i++)
	    {    
			if (result[i].ColorDescription != "")
			{
				logoColorDisplay = " (" + result[i].ColorDescription + ")";
			}
			else
			{
				logoColorDisplay = "";
			}
			
	        s[s.length] = "<div class=\"logoImageBlock\"><label for=\"" + result[i].LogoName + logoColorDisplay + "\" ><img class=\"radioImage\" src=\"" + ImagePath + result[i].MediaFilename + "\" alt=\"\" /></label><div class=\"radioText\"><input type=\"radio\" id=\"" + result[i].LogoName + logoColorDisplay + "\" name=\"chooseLogo\" value=\"" + result[i].LogoVendorCode + "\"  onclick=\"setLogoColor('" + result[i].ColorVendorCode + "');setLogoColorDesc('" + result[i].LogoName + logoColorDisplay + "');\" /><label for=\"" + result[i].LogoName + logoColorDisplay +"\" >" + result[i].LogoName + logoColorDisplay + "</label></div></div>";
        }		
	    document.getElementById("chooseLogoSpan").innerHTML = s.join(""); 
    }
    
    if (window.document.getElementById("topOptionalBox") != null)
	{
	    fixIE7zIndexBug();
	}
}

function setLogoColorDesc(logoDesc)
{				
	//Set hidden input with logo
	var logoDescObj = document.getElementById("selectedLogoDesc");
	if (logoDescObj != null)
	{
		logoDescObj.setAttribute('value', logoDesc);
	}
}

function setLogoColor(vendorLogoColorCode)
{
	// if logo has no color, don't add color to sku
	if(vendorLogoColorCode == "")
	{
		vendorLogoColorCode = 0;
	}
	window.document.getElementById("logoColorDropDown").value = vendorLogoColorCode;
}


function updateLogoColors(logoID)
{
    if (logoID != "") 
    {               
	    FloorMatsWebService.GetFloorMatLogoColor(logoID, updateLogoColorsCallback, AjaxError);
    } 
}

function updateLogoColorsCallback(result)
{       
    if(result != null)
    {
        var s = new Array();

	    s[s.length] = "<select id=\"logoColorDropDown\" >";
	    s[s.length] = "<option value=\"\">Select Color...</option>";
	    
        for (var i=0; i < result.length; i++)
	    {    
	        s[s.length] = "<option value=\"" + result[i].ColorID + "\">" + result[i].ColorDescription + "</option>";
        }
		s[s.length] = "</select>";
		
	    document.getElementById("logoColorDropDownSpan").innerHTML = s.join(""); 
    }
    
    if (window.document.getElementById("topOptionalBox") != null)
	{
	    fixIE7zIndexBug();
	}
}

function ValidateLogo()
{
	var startPosition = document.getElementById("LogoBody");
    var divCollection = startPosition.getElementsByTagName("input");
	var matsChecked = false;
    for (var i=0; i < divCollection.length; i++) 
    {
        if (divCollection[i].getAttribute("type") == "checkbox") 
        {
            if (divCollection[i].checked)
            {
                matsChecked = true;
            }
        } 
    }
	if ( matsChecked == false )
	{
		alert('At least one mat needs to be selected.');
		return false;
	}

	var test = document.getElementsByName("chooseLogo");
	var fontValue = '';
	for (var i=0; i < test.length; i++)
	{
		if (test[i].checked)
		{
			fontValue = test[i].value;
		}
	}
	if ( fontValue == '' ) 
	{
		alert('Please select a logo for your mat.');
		return false;
	}

	var logoColorDropDown = document.getElementById("logoColorDropDown");
	if ( logoColorDropDown != null )
	{
		if ( logoColorDropDown.value == "" ) 
		{
			alert('Please select your logo color.');
			return false;
		}
	}
	
	return true;
}

function ValidateEmbroidery()
{
	var startPosition = document.getElementById("EmbroideryBody");
    var divCollection = startPosition.getElementsByTagName("input");
	var matsChecked = false;
    for (var i=0; i < divCollection.length; i++) 
    {
        if (divCollection[i].getAttribute("type") == "checkbox") 
        {
            if (divCollection[i].checked)
            {
                matsChecked = true;
            }
        } 
    }
	if ( matsChecked == false )
	{
		alert('At least one mat needs to be selected.');
		return false;
	}

	var test = document.getElementsByName("embroideryFont");
	var fontValue = '';
	for (var i=0; i < test.length; i++)
	{
		if (test[i].checked)
		{
			fontValue = test[i].value;
		}
	}
	if ( fontValue == '' ) 
	{
		alert('Please select a font for your mat.');
		return false;
	}

	var testColor = document.getElementsByName("RadioColor");
	fontValue = '';
	for (var i=0; i < testColor.length; i++)
	{
		if (testColor[i].checked)
		{
			fontValue = testColor[i].value;
		}
	}
	if ( fontValue == '' ) 
	{
		alert('Please select a color for your mat.');
		return false;
	}
	
	var LogoLine1 = document.getElementById("LogoLine1");
	var LogoLine2 = document.getElementById("LogoLine2");
	if ( LogoLine1.value == '' && LogoLine2.value == '' ) 
	{
		alert('Please enter text for your mat.');
		return false;
	}
	return true;
}

function CreateListOfMatsToCustomize(pageType)
{
	var htmlOut;
	var startPosition = document.getElementById("MainFloorMatPage");
    var divCollection = startPosition.getElementsByTagName("input");
	
	if (pageType == 'LOGO')
	{
		MatsToCustomizeSpan = document.getElementById("LogoMatsToCustomizeSpan");
	}
	else
	{
		MatsToCustomizeSpan = document.getElementById("EmbroideryMatsToCustomizeSpan");
	}	
	
	htmlOut = '<ul>';
    for (var i=0; i < divCollection.length; i++) 
    {
        if (divCollection[i].getAttribute("type") == "checkbox") 
        {
            if (divCollection[i].checked)
            {
                if(divCollection[i].name.indexOf("Front") > -1 || divCollection[i].name.indexOf("Rear") > -1)
                {
					htmlOut += '<li><input type="checkbox" id="ChooseMatsCheckbox" value="' + divCollection[i].value + '" Checked />' + divCollection[i].name + ' (+$20 per line of text, +$25 for logo)  </li>';
				}
				else
				{
					htmlOut += '<li><input type="checkbox" disabled="disabled" id="ChooseMatsCheckbox" value="' + divCollection[i].value + '" Unchecked />' + divCollection[i].name + ' (No embroidery available)</li>';
				}
            }
        } 
    }
	htmlOut += '</ul>';
	
	MatsToCustomizeSpan.innerHTML = htmlOut;
}

function Checkbox_Click(groupID, groupIndicator, productID)
{
    var firstDropDown = document.getElementById("firstDropDown" + groupIndicator);
    var checkboxClicked = document.getElementById("checkbox" + groupIndicator);
    
    if(checkboxClicked.checked == false)
    {
		if (firstDropDown.length == 2)
		{
			firstDropDown.selectedIndex = 1;
			firstDropDown.value = firstDropDown.options[1].value;
			//firstDropDown.disabled = true;
			clearSecondDropDown(groupIndicator);
			updateSecondDropDown(groupID, groupIndicator, productID)
		}
		else
		{
			firstDropDown.selectedIndex = 0;
			clearSecondDropDown(groupIndicator);
		}
	}
}

function SetSelectedVariantForGroup(groupID, variantID)
{
    var checkboxForGroup = document.getElementById("checkbox" + groupID);
    var secondDropDownForGroup = document.getElementById("secondDropDown" + groupID);
    var firstDropDownForGroup = document.getElementById("firstDropDown" + groupID);
    var ProductID = document.getElementById("ProductID" + groupID);

    if (checkboxForGroup != null)
    {
		if (variantID = 0)
		{
			checkboxForGroup.setAttribute('value', '');
		}
		else
		{
			checkboxForGroup.setAttribute('value', secondDropDownForGroup.value + '|' + firstDropDownForGroup.value + '|' + ProductID.value);
        }
    }
}

function displayVariantPopup(groupNumber, largeImageID, productID)
{
    window.open("../GenericPages/ProductImage.aspx?IsVariantMedia=1&GroupID=" + groupNumber + "&ImageID=" + largeImageID + "&ProductID=" + productID, "large_image");
}

function ChangeProductImage(imageUrl, imagePath, largeImageMediaID)
{
	if(imagePath != "")
	{
		var productImage = document.getElementById("productImageFileName");
		productImage.src = imageUrl + imagePath;
	    
		var largeImageID = document.getElementById("LargeImageID");
		largeImageID.value = largeImageMediaID;
	}
}  

function SchemaImageMouseout(groupID, imageUrl)
{
    var groupSchemaImage = document.getElementById("VariantGroupMainImage" + groupID);
    groupSchemaImage.src = document.getElementById("VariantGroupMainImageMouseout").value;
    
    var groupSchemaImageDesc = document.getElementById("VariantGroupMainImageDesc" + groupID);
    groupSchemaImageDesc.innerHTML = document.getElementById("VariantGroupMainImageDescMouseout").value;
}

function SchemaImageMouseover(groupID, imageUrl, imageDesc)
{
    var groupSchemaImage = document.getElementById("VariantGroupMainImage" + groupID);
    document.getElementById("VariantGroupMainImageMouseout").value = groupSchemaImage.src;

    var groupSchemaImageDesc = document.getElementById("VariantGroupMainImageDesc" + groupID);
    document.getElementById("VariantGroupMainImageDescMouseout").value = groupSchemaImageDesc.getAttribute("innerHTML");

    groupSchemaImageDesc.innerHTML = imageDesc;
    groupSchemaImage.src = imageUrl;
}  

function updateContent(variantID, groupIndicator)
{
    var vehicleID = document.getElementById("firstDropDown" + groupIndicator).value;
    var variantGroupID = document.getElementById("GroupID" + groupIndicator).value;
    var isLloydMat = document.getElementById("isLloydMat").value;

    FloorMatsWebService.GetContent(isLloydMat, variantID, vehicleID, groupIndicator, variantGroupID, updateContentCallback, AjaxError);
    
}

function updateContentCallback(result)
{       
    if(result != null)
    {
	    document.getElementById("contentSpan" + result.GroupIndicator).innerHTML = result.Content; 
        
		var isLloydMat = document.getElementById("isLloydMat").value;
		var secondDropDown = window.document.getElementById("secondDropDown" + result.GroupIndicator);
		var variantID = secondDropDown.value;
		var mediaFile = "";
		
		if ( variantID != "" )
		{
			if ( isLloydMat == "LLOYD" ) 
			{
				var mediaFileHiddenInputForm = window.document.getElementById("media_file_" + variantID);
				//Making sure the media form exists
				if (mediaFileHiddenInputForm != null)
				{
					mediaFile = mediaFileHiddenInputForm.getAttribute("value");
				}
				if (mediaFile != "")
				{
					document.getElementById("VariantGroupMainImage" + result.GroupIndicator).src = mediaFile;
				}
			}
			else
			{
				if (result.MediaFilename != undefined)
				{
					document.getElementById("VariantGroupMainImage" + result.GroupIndicator).src = result.MediaFilename;
				}        

				var groupSchemaImageDesc = document.getElementById("VariantGroupMainImageDesc" + result.GroupIndicator);
				groupSchemaImageDesc.innerHTML = result.MediaDesc;
			}
        }
    }
}

function updateSecondDropDown(variantGroupID, groupIndicator, productID)
{
    var vehicleID = document.getElementById("firstDropDown" + groupIndicator).value;
    var isLloydMat = document.getElementById("isLloydMat").value;
    
    if (vehicleID != "") 
    {               
		FloorMatsWebService.GetFloorMatSecondOption(productID, vehicleID, variantGroupID, groupIndicator, isLloydMat, getSecondOptionCallback, AjaxError);
    } 
    else 
    {
	    clearSecondDropDown(groupIndicator);
    }
}

function updateSecondDropDownWithPreset(variantGroupID, groupIndicator, productID)
{
    var vehicleID = document.getElementById("firstDropDown" + groupIndicator).value;
    var isLloydMat = document.getElementById("isLloydMat").value;
    
    if (vehicleID != "") 
    {               
	    FloorMatsWebService.GetFloorMatSecondOption(productID, vehicleID, variantGroupID, groupIndicator, isLloydMat, getSecondOptionCallbackWithPreset, AjaxError);
    } 
    else 
    {
	    clearSecondDropDown(groupIndicator);
    }
}

function getSecondOptionCallbackWithPreset(result)
{
    getSecondOptionCallback(result);
    
     if(result != null)
    {
        var groupIndicator = result[0].GroupIndicator;
        var variantGroupID = result[0].VariantGroupID;
        var secondDropDown = window.document.getElementById("secondDropDown" + groupIndicator);
        
        if (secondDropDown.length == 2)
        {
            secondDropDown.selectedIndex = 1;
            secondDropDown.value = secondDropDown.options[1].value;
            setAvailabilityWithoutCheckbox(groupIndicator);
        }
    }    
}

function getSecondOptionCallback(result)
{       
    var secondAttrLabel = document.getElementById("secondAttributeLabel").value;      
    var ImagePath = document.getElementById("ImagePath").value;      
    
     if(result != null)
    {
        var groupIndicator = result[0].GroupIndicator;
        var variantGroupID = result[0].VariantGroupID;
        var s = new Array();

	    s[s.length] = "<select id=\"secondDropDown" + groupIndicator + "\"\" onchange=\"setAvailability(" + groupIndicator + ");\" >";
	    s[s.length] = "<option value=\"\">" + secondAttrLabel + "</option>";
        for (var i=0; i < result.length; i++)
	    {    
			if(result[i].AttributeDesc != null)
			{
			    //  Display the price if it is not a map product (Minimum Advertised Price Policy)
			    if(typeof(isMapProduct) != 'undefined' && isMapProduct != null && !isMapProduct)
			    {
			        s[s.length] = "<option value=\"" + result[i].VariantID + "\">" + result[i].AttributeDesc + " - " + result[i].SalePrice + "</option>";
			    }
			    else
			    {
			        s[s.length] = "<option value=\"" + result[i].VariantID + "\">" + result[i].AttributeDesc + "</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 + "\" / >";
			s[s.length] = "<input type=\"hidden\" id=\"saleprice_" + result[i].VariantID + "\" value=\"" + result[i].SalePrice + "\" / >";
			s[s.length] = "<input type=\"hidden\" id=\"media_" + result[i].VariantID + "\" value=\"" + result[i].MediaID + "\" / >";
			if (result[i].MediaFilename == "")
			{
				s[s.length] = "<input type=\"hidden\" id=\"media_file_" + result[i].VariantID + "\" value=\"\" / >";
			}
			else
			{
				s[s.length] = "<input type=\"hidden\" id=\"media_file_" + result[i].VariantID + "\" value=\"" + ImagePath + result[i].MediaFilename + "\" / >";
			}
        }
	    document.getElementById("secondDropDownSpan" + groupIndicator).innerHTML = s.join(""); 
    
		var vehicleID = document.getElementById("firstDropDown" + groupIndicator).value;
		updateContent(0, groupIndicator);
    }
    
    if (window.document.getElementById("topOptionalBox") != null)
	{
		    fixIE7zIndexBug();
	}
}

function fixIE7zIndexBug()
{
	window.document.getElementById("topOptionalBox").style["display"] = "none";
	window.document.getElementById("topOptionalBox").style["display"] = "block";
}
		
function clearSecondDropDown(variantGroupID)
{
    var secondAttributeLabel = window.document.getElementById("secondAttributeLabel").getAttribute("value");	

    var s = new Array();
    s[s.length] = "<select id=\"secondDropDown" + variantGroupID + "\" disabled>";
    s[s.length] = "<option value=\"\">" + secondAttributeLabel + "&nbsp</option>"; 
	s[s.length] = "</select>";
    document.getElementById("secondDropDownSpan" + variantGroupID).innerHTML = s.join("");
    
    setAvailability(variantGroupID);
}

function setAvailabilityWithoutCheckbox(variantGroupID)
{
	var variantID = window.document.getElementById("secondDropDown" + variantGroupID).value;
	var vehicleID = window.document.getElementById("firstDropDown" + variantGroupID).value;
	var salePriceFromID = "saleprice_" + variantID;
    var availabilityDate = window.document.getElementById("shipdate_" + variantID).getAttribute("value");	
    var salePrice = window.document.getElementById(salePriceFromID).getAttribute("value");
    
    updateContent(variantID, variantGroupID);
    SetSelectedVariantForGroup(variantGroupID, variantID);
    document.getElementById("checkbox" + variantGroupID).disabled=false;

	if (availabilityDate != "")
	{
	    var shipdate = window.document.getElementById('shippingDate' + variantGroupID);
        if (shipdate != null)
        {
	        shipdate.innerHTML = availabilityDate;
	    }
	}
	window.document.getElementById('variantGroupPrice' + variantGroupID).innerHTML = salePrice;
	
	if (window.document.getElementById("topOptionalBox") != null)
	{
	    fixIE7zIndexBug();
	}
}

function setIsEmbroiderable(variantGroupID)
{
	// check if selected floormat is front or rear
	var variantGroupName = document.getElementById("VariantGroupName" + variantGroupID);
	var frontMat = variantGroupName.value.indexOf("Front");
	var rearMat = variantGroupName.value.indexOf("Rear");
	
	if(frontMat > -1 || rearMat > -1)
	{
		isEmbroiderable = true;
	}
}

function setAvailability(variantGroupID)
{
    var secondDDFromID = "secondDropDown" + variantGroupID;
    var secondDropDown = window.document.getElementById(secondDDFromID);
    var firstDDFromID = "firstDropDown" + variantGroupID;
    var firstDropDown = window.document.getElementById(firstDDFromID);
    var checkbox = window.document.getElementById("checkbox" + variantGroupID);
	var variantID = secondDropDown.value;
	var vehicleID = firstDropDown.value;
	var salePriceFromID = "saleprice_" + variantID;
	
	setIsEmbroiderable(variantGroupID);

	if (variantID != "" && vehicleID != "")
	{
	    var availabilityDate = window.document.getElementById("shipdate_" + variantID).getAttribute("value");	
	    var salePrice = window.document.getElementById(salePriceFromID).getAttribute("value");

        updateContent(variantID, variantGroupID);
        SetSelectedVariantForGroup(variantGroupID, variantID);
        checkbox.checked = true;
        document.getElementById("checkbox" + variantGroupID).disabled=false;
	}
	else
	{
		var availabilityDate = "<em>Select options to see availability.</em>";
	    var salePrice = window.document.getElementById("shippingPriceDefault" + variantGroupID).getAttribute("value");
		var groupSchemaImage = document.getElementById("VariantGroupMainImage" + variantGroupID);
        var groupSchemaImageDesc = document.getElementById("VariantGroupMainImageDesc" + variantGroupID);
        
        checkbox.checked = false;
        document.getElementById("checkbox" + variantGroupID).disabled=true;
	    document.getElementById("contentSpan" + variantGroupID).innerHTML = ""; 
        groupSchemaImage.src = document.getElementById("DefaultImageFilename" + variantGroupID).value;
        groupSchemaImageDesc.innerHTML = document.getElementById("DefaultImageDesc" + variantGroupID).value;
        SetSelectedVariantForGroup(variantGroupID, 0);
	}
	
	if (availabilityDate != "")
	{
	    var shipdate = window.document.getElementById('shippingDate' + variantGroupID);
        if (shipdate != null)
        {
	        shipdate.innerHTML = availabilityDate;
	    }
	}
	window.document.getElementById('variantGroupPrice' + variantGroupID).innerHTML = salePrice;
	
	if (window.document.getElementById("topOptionalBox") != null)
	{
	    fixIE7zIndexBug();
	}
}

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