var productArray = new Array();
var styleDropdownArray = new Array();
var sizeDropdownArray = new Array();
var colorDropdownArray = new Array();

function ProductGroupProduct(productId, productGroupId, sku, styleSystemRef, styleDescription, sizeSystemRef, sizeDescription, colorSystemRef, colorDescription, imageLocation, 
unitPrice, unitPriceBV, retailPrice, retailPriceBV, consultantUnitPrice, consultantUnitPriceBV, consultantRetailPrice, consultantRetailPriceBV, 
unitOfMeasure, isProductAvailable, isProductTempUnavailable, isProductBackorder, isProductLimitedAvailable, estimatedAvailabilityDate, allowBackorder, name, currencyCode)
{
    this.productId = productId; 
    this.productGroupId = productGroupId;
    this.sku = sku;
    this.styleSystemRef = styleSystemRef;
    this.styleDescription = styleDescription;
    this.sizeSystemRef = sizeSystemRef;
    this.sizeDescription = sizeDescription;
    this.colorSystemRef = colorSystemRef;
    this.colorDescription = colorDescription;
    this.imageLocation = imageLocation;
    this.unitPrice = unitPrice;
    this.unitPriceBV = unitPriceBV;
    this.retailPrice = retailPrice;
    this.retailPriceBV = retailPriceBV;
    this.consultantUnitPrice = consultantUnitPrice;
    this.consultantUnitPriceBV = consultantUnitPriceBV;
    this.consultantRetailPrice = consultantRetailPrice;
    this.consultantRetailPriceBV = consultantRetailPriceBV;
    this.unitOfMeasure = unitOfMeasure;
    this.isProductAvailable = isProductAvailable;
    this.isProductTempUnavailable = isProductTempUnavailable;
    this.isProductBackorder = isProductBackorder;
    this.isProductLimitedAvailable = isProductLimitedAvailable;
    this.estimatedAvailabilityDate = estimatedAvailabilityDate;
    this.allowBackorder = allowBackorder;
    this.name=name;
    this.currencyCode=currencyCode;
}

function DropDownInfo(id, description)
{
    this.id = id; 
    this.description = description;
}

function Swatch(colorSystemRef, colorDescription, imageLocation)
{
    this.colorSystemRef = colorSystemRef;
    this.colorDescription = colorDescription;
    this.imageLocation = imageLocation;
}

function getSelectedProductStyle() {
	if (document.forms["qtyForm"].elements["productStyle"] === undefined) {
		return "";
	}
	return getSelectListValue("qtyForm", "productStyle");
}

function getSelectedProductSize() {
	if (document.forms["qtyForm"].elements["productSize"] === undefined) {
		return "";
	}
	if (document.forms["qtyForm"].elements["productSize"].options.length <=0) {
		return "";
	}
	return getSelectListValue("qtyForm", "productSize");
}

function getSelectedProductColor() {
	if (document.forms["qtyForm"].elements["productColor"] === undefined) {
		return "";
	}
	if (document.forms["qtyForm"].elements["productColor"].options.length <=0) {
		return "";
	}
	return getSelectListValue("qtyForm", "productColor");
}

function onStyleChange()
{

	buildSizeChoices();
	
	onSizeChange();

}

function onSizeChange()
{
	
	buildColorChoices();
	
    onColorChange();
    
}

function onColorChange() {
	
	setSelectedProductInformation();
    
}

function buildSizeChoices() {

	if (document.forms["qtyForm"].elements["productSize"] === undefined) {
		return;
	}
	
	var objElement = document.forms["qtyForm"].elements["productSize"];
	
	var selectedStyle = getSelectedProductStyle();
	var selectedSize = getSelectedProductSize();
	
	var indexLength = objElement.options.length;
    
    for (var i = indexLength-1; i >= 0; i=i-1)
    {
        var optionChild = objElement.options[i];
        objElement.removeChild(optionChild);
    }

	for (var idxDropDown = 0; idxDropDown < sizeDropdownArray.length; idxDropDown=idxDropDown+1) {
	
        var dropDown = sizeDropdownArray[idxDropDown];
        
        for (var idxProducts = 0; idxProducts < productArray.length; idxProducts=idxProducts+1) {
        
	        var product = productArray[idxProducts];
        
	        if (product.styleSystemRef === selectedStyle && product.sizeSystemRef == dropDown.id) {
        
            	var option = document.createElement('OPTION');
            	option.value = dropDown.id;
            	option.innerHTML = dropDown.description;
            
            	if (product.sizeSystemRef == selectedSize) {
	                option.selected = true;
            	}
            
            	objElement.appendChild(option);
            	
            	break;
            	
        	}
        	
    	}

    }
    
}

function buildColorChoices() {

	if (document.forms["qtyForm"].elements["productColor"] === undefined) {
		return;
	}
	
	var selectedStyle = getSelectedProductStyle();
	var selectedSize = getSelectedProductSize();
    var selectedColor = getSelectedProductColor();
	
	var indexLength = document.forms["qtyForm"].elements["productColor"].options.length;
    
    for (var i = indexLength-1; i >= 0; i=i-1)
    {
        var optionChild = document.forms["qtyForm"].elements["productColor"].options[i];
        document.forms["qtyForm"].elements["productColor"].removeChild(optionChild);
    }

	//console.log("selectedStyle:" + selectedStyle + "|selectedSize:[" + selectedSize + "]");
	
	for (var idxDropDown = 0; idxDropDown < colorDropdownArray.length; idxDropDown=idxDropDown+1) {
	
        var dropDown = colorDropdownArray[idxDropDown];

		//console.log("checking color dropdown, dropDown.id:" + dropDown.id + "|dropDown.description:[" + dropDown.description + "]");
		        
        for (var idxProducts = 0; idxProducts < productArray.length; idxProducts=idxProducts+1) {
        
	        var product = productArray[idxProducts];
        
        	if (product.sizeSystemRef === selectedSize && product.styleSystemRef === selectedStyle && product.colorSystemRef == dropDown.id) {
        
        		//console.log("match found, product.styleSystemRef:" + product.styleSystemRef + "|product.sizeSystemRef:[" + product.sizeSystemRef + "]|COLOR=" + product.colorSystemRef);
        		
            	var option = document.createElement('OPTION');
            	option.value = dropDown.id;
            	option.innerHTML = dropDown.description;
            
            	if (product.colorSystemRef == selectedSize) {
	                option.selected = true;
            	}
            
            	document.forms["qtyForm"].productColor.appendChild(option);
            	
            	break;
            	
        	}
        	
    	}

    }
    
    buildColorSwatches();
    
}

function buildColorSwatches() {

    if (document.forms["qtyForm"].elements["productColor"] == 'undefined') {
		return;
	}

	if (document.getElementById("divSwatches") === null) {
		return;
	}
	
    document.getElementById("divSwatches").style.visibility= "hidden";
    
    var selectedStyle = getSelectedProductStyle();
	var selectedSize = getSelectedProductSize();
    var selectedColor = getSelectedProductColor();

    //colors array contains objects: {img:'', name:'', id:''};
    html = '';          
    html += '<table cellspacing="0" cellpadding="2" border="0" >\n';
    
    var productID;
    var swatchesArray = new Array();    
    for (var i = 0; i < productArray.length; i=i+1)
    {
        var product = productArray[i];
        
        if (product.sizeSystemRef == selectedSize && product.styleSystemRef == selectedStyle) {
            if (!isEmpty(product.imageLocation)) {
                var swatchDetails = new Swatch(product.colorSystemRef, product.colorDescription, product.imageLocation);
                swatchesArray[swatchesArray.length] = swatchDetails;
            }               
        }
    }

    var idxSwatch = 0;
    while (idxSwatch < swatchesArray.length) 
    {
        html += '<tr>\n';
        for (var j = 0; j < 5; j=j+1) 
        {
            if (idxSwatch < swatchesArray.length) 
            {
                html += "<td align='center' valign='top'>";
                html += "<a href=\"javascript:onSelectColorSwatch('" + swatchesArray[idxSwatch].colorSystemRef + "', this)\" >"
                html += "<img id='anchor" + swatchesArray[idxSwatch].colorSystemRef + "' align=\"center\" alt=\"" + swatchesArray[idxSwatch].colorDescription + "\" src=\"" +
                       swatchesArray[idxSwatch].imageLocation + "\" width=\"52\" height=\"22\" border=\"0\"></a>";
                html += "</td>\n";  
            }                                   
            idxSwatch = idxSwatch + 1;
        }
        
        html += '</tr>\n';
    }        
    
    html += '</table>';

    if (swatchesArray.length > 0) {
        document.getElementById("divSwatches").innerHTML = html;
        document.getElementById("divSwatches").style.visibility= "visible";
    }
}   




function onSelectColorSwatch(colorSystemRef, anchorObj) {
	
	document.forms["qtyForm"].elements["productColor"].value = colorSystemRef;
	
	onColorChange();
	
}

function setSelectedProductInformation() {

    var selectedStyle = getSelectedProductStyle();
	var selectedSize = getSelectedProductSize();
    var selectedColor = getSelectedProductColor();

    var product = getSelectedProduct();

   	document.forms["qtyForm"].elements["itemSku"].value=product.sku;
    
    document.getElementById("divUnitPrice").innerHTML = '$' + product.unitPrice;;
    document.getElementById("divRetailPrice").innerHTML = '$' + product.retailPrice;
    
    if (product.unitPrice < product.retailPrice) {
		document.getElementById("divRetailPrice").style.visibility="visible";
		document.getElementById("divRetailPrice").style.display="block";
    } else {
        document.getElementById("divRetailPrice").style.visibility="hidden";
        document.getElementById("divRetailPrice").style.display="none";
    }
            
    if (document.getElementById("divConsultantRetailPrice") != null) {
    
    	document.getElementById("divConsultantUnitPrice").innerHTML = '$' + product.consultantUnitPrice;
    	document.getElementById("divConsultantRetailPrice").innerHTML = '$' + product.consultantRetailPrice;
    
    	if (product.consultantUnitPrice < product.consultantRetailPrice) {
	        document.getElementById("divConsultantRetailPrice").style.visibility="visible";
        	document.getElementById("divConsultantRetailPrice").style.display="block";
    	} else {
	        document.getElementById("divConsultantRetailPrice").style.visibility="hidden";
        	document.getElementById("divConsultantRetailPrice").style.display="none";
    	}
    	
    }
            
    if (product.isProductAvailable && ((product.isProductBackorder && product.allowBackorder) || !product.isProductBackorder)) {
        document.getElementById("divAddToOrder").style.visibility="visible";
        document.getElementById("divAddToOrder").style.display="block";
    } else {
        document.getElementById("divAddToOrder").style.visibility="hidden";
        document.getElementById("divAddToOrder").style.display="none";
    }
           
    //if (product.isProductTempUnavailable) {
        //document.getElementById("divItemTemporarilyUnavailable").style.visibility="visible";
        //document.getElementById("divItemTemporarilyUnavailable").style.display="block";
    //} else {
        //document.getElementById("divItemTemporarilyUnavailable").style.visibility="hidden";
        //document.getElementById("divItemTemporarilyUnavailable").style.display="none";
    //}
    
    if (product.isProductBackorder) {
        document.getElementById("divBackorder").style.visibility="visible";
        document.getElementById("divBackorder").style.display="block";
        document.getElementById("divBackorderDateAvailable").innerHTML = product.estimatedAvailabilityDate;
    } else {
        document.getElementById("divBackorder").style.visibility="hidden";
        document.getElementById("divBackorder").style.display="none";
    }
    
    if (product.isProductLimitedAvailable && !product.isProductBackorder) {
        document.getElementById("divLimitedAvailability").style.visibility="visible";
        document.getElementById("divLimitedAvailability").style.display="block";
    } else {
        document.getElementById("divLimitedAvailability").style.visibility="hidden";
        document.getElementById("divLimitedAvailability").style.display="none";
    }
    
}

function getSelectedProduct() {
    
    var selectedStyle = getSelectedProductStyle();
	var selectedSize = getSelectedProductSize();
    var selectedColor = getSelectedProductColor();
    
    for (var idxProducts = 0; idxProducts < productArray.length; idxProducts=idxProducts+1)
    {
        var product = productArray[idxProducts];
        if (product.styleSystemRef === selectedStyle) {
        	if (product.sizeSystemRef === selectedSize) {
	            if (product.colorSystemRef === selectedColor){
	                return product;
            	}
          	}
        }
    }

}