var hiddenProductId = "ctl00_outerContent_HProductId";
var hiddenBrandId = "ctl00_outerContent_HBrandId";
var hiddenCategoryId = "ctl00_outerContent_HCategoryId";
var option1Id = "ctl00_outerContent_opt1";
var option2Id = "ctl00_outerContent_opt2";
var bigImageId = "ctl00_outerContent_BigImage";
var defaultImageId = "ctl00_outerContent_DefaultImage";
var largeImageId = "ctl00_outerContent_BigImage"

var PackageDealDiscount = 0;

// JavaScript File
function OptionDropDownChanged(optionId,productId)
{
    theProductChanging(optionId,productId);
    swatchClick(optionId);
}

function theProductChanging(optionId,productId) 
{
    if( optionId!="" ){
        var url = '/product/OptionFeed.aspx?ProductID=' + productId + "&Option=" + optionId;
              
        if (window.ActiveXObject) // for IE
            httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
        else if (window.XMLHttpRequest) // for other browsers
            httpRequest = new XMLHttpRequest();
        
        httpRequest.open("GET", url, false);
        httpRequest.onreadystatechange = function() {processRequest('UpdateList'); } ;
        httpRequest.send(null);
    }else{
        getObjById( "ctl00_mainContent_opt2" ).disabled = true;
    }
}

function processRequest(sHandlerName)
{
    if (httpRequest.readyState == 4)
    {
        if(httpRequest.status == 200)
            eval(sHandlerName + '(httpRequest.responseXML);');
    else
        alert("Error loading page\n"+ httpRequest.status +":"+ httpRequest.statusText);
    }
}

function getObjById( id ){
    return ( document.getElementById(id) ? document.getElementById(id):null );
}

function UpdateList(xXML) 
{
    var listObj = getObjById( "ctl00_mainContent_opt2" );
    var hiddenObj = getObjById("ctl00_mainContent_hidden_opt2");
    var hiddenItems = hiddenObj.value.split("*/");
            
    removeAllItems(listObj);

    var root = xXML.getElementsByTagName('Options').item(0);
    
    for (var iNode = 0; iNode < root.childNodes.length; iNode++){
        var node = root.childNodes.item(iNode);
        var id = node.getElementsByTagName("Option2")[0].childNodes[0].nodeValue;
        var stock = (node.getElementsByTagName("StockAvailable")[0].childNodes[0]!=null ? true:false );   
        
        for( var i = 0; i < hiddenItems.length; i++ )
        {
            var tmpId = hiddenItems[i].split("++")[1];
            
            
            if(id==tmpId ){ //&& stock //Add for Stock check
            
                var optn = document.createElement ("OPTION");
                optn.text = hiddenItems[i].split("++")[0];
                optn.value = hiddenItems[i].split("++")[1];
                listObj.options [listObj.length] = optn;
            }
        }
    }
    listObj.disabled = false;
}

function removeAllItems(selectbox){
    var count;
    var max = selectbox.options.length;
    for (count = max ; count > 0 ; count--){
        
        selectbox.remove(count);
    }
}

/// Thumbnail 

function RollIn(img){
    var lrgImage = getObjById(bigImageId);
    lrgImage.src = img;
}

function RollOut(){
    var lrgImage = getObjById(bigImageId);
    var defaultImage = getObjById(defaultImageId);
    lrgImage.src = defaultImage.value;
}

var selectedSwatch;

function swatchClick(id)
{
    var optionId = ( id.indexOf("_")!=-1 ? id.substring( id.indexOf("_")+1 ):id );

    if(selectedSwatch!=null && selectedSwatch!=undefined){
        selectedSwatch.className = "colourOff";
    }
    
    var obj = getObjById( "swatch_"+optionId );
    
    if(obj!=null){
        obj.className = "colourOn"
    }
    selectedSwatch = obj;
            
    //Ajax Call to Set Selected Colour and populate Drop Downs!!
    getObjById(option1Id).selectedIndex = getOptionIndexFromValue( getObjById(option1Id), optionId );
    theProductChanging(optionId,getObjById(hiddenProductId).value);
}

function getOptionIndexFromValue(select, val) {
    for (var i = 0; i < select.options.length; i ++) {
        if (select.options[i].value == val) 
            return i;
    }
    return -1;
}


/* Get Product Item Information - Needs Prototype. */

function getItem(){
    var productID = $(hiddenProductId).value;
    var brandID = $(hiddenBrandId).value;
    var categoryID = $(hiddenCategoryId).value;
    var option1 = ( !$(option1Id) || $(option1Id).value == ""? 0 : $(option1Id).value);
    var option2 = ( !$(option2Id) || $(option2Id).value == ""? 0 : $(option2Id).value);
    
    new Ajax.Request('/product/Product_Image_Options.aspx',
    {   parameters: {ProductID: productID, BrandID: brandID, CategoryID:categoryID, Option1: option1, Option2:option2},
        method: 'get', contentType:'application/json; charset=utf-8',
        onSuccess: completeTest,
        onFailure: errorTest});
}
  
function completeTest(resp, jsonObj) {
    var xml = resp.responseXML
    var ItemID = getFirstValue( xml, "ItemID" );
    var ProductImage = getFirstValue( xml, "ProductImage1" );
    var RRP = getFirstValue( xml, "RRP" );
    var Price = getFirstValue( xml, "Price" );
    var wasprice = getFirstValue( xml, "wasprice" );
    var StockAvailable = getFirstValue( xml, "StockAvailable" );
    var BasicLoyaltyPoints = getFirstValue( xml, "basicpoints" );
    var BonusLoyaltyPoints = getFirstValue( xml, "bonus" );
    
    ProductItem_Set( { ItemID:ItemID, ProductImage:ProductImage, RRP:RRP, Price:Price, wasprice:wasprice, StockAvailable:StockAvailable, BasicLoyaltyPoints:BasicLoyaltyPoints, BonusLoyaltyPoints:BonusLoyaltyPoints } );
}

function errorTest(error){
    //Do Nothing
}

function getFirstValue( xml, tag ){    
    if( xml.getElementsByTagName(tag)[0].firstChild != null ){
        return xml.getElementsByTagName(tag)[0].firstChild.nodeValue;
    }else{
        return ""
    }
}

function ProductItem_Set( ItemObj ){
   //Set Price
   var currency = "£";
   if($("ctl00_header_btnEuros").className == "active"){currency="€";};
   if($("ctl00_header_btnPounds").className == "active"){currency="£";};
   if($("ctl00_header_btnDollars").className == "active"){currency="$";};
   
    if( $("Price") ){
        $("Price").innerHTML = currency + parseFloat(ItemObj.Price).toFixed(2);
    }
    if( $("Was") ){
        $("Was").innerHTML = currency + parseFloat(ItemObj.wasprice).toFixed(2);
    }
    
    if( $("Percent") ){
        $("Percent").innerHTML = parseInt(((ItemObj.wasprice - ItemObj.Price) / ItemObj.wasprice) * 100);
    }
    
    //change loyalty Points
    if( $("ajLoyaltyPoints") ){
        $("ajLoyaltyPoints").innerHTML = '<div style="float: left; padding-right:3px;">' + parseInt(ItemObj.BasicLoyaltyPoints) + '</div><span style="font-size:9px; font-weight:normal; position:relative;top:-2px;float: left;"><div style="font-size:14px; float:left;">(</div> <div style="font-size:9px; float:left;text-align:center"><div style="position:relative; top:-2px">worth</div> <div style="position:relative; top:-4px">£' + (parseFloat($("redeemvalue").innerHTML) * parseInt(ItemObj.BasicLoyaltyPoints)).toFixed(2) + '</div></div><div style="font-size:14px; float:left">)</div></span>' ;
    }
    
    if( $("ajBonusLoyaltyPoints") && ItemObj.BonusLoyaltyPoints!=0 ){
        $("ajBonusLoyaltyPoints").innerHTML = '<div style="float: left; padding-right:3px;">' + parseInt(ItemObj.BonusLoyaltyPoints) + '</div> <span style="font-size:9px; font-weight:normal;position:relative;top:-2px;float: left;"><div style="font-size:14px; float:left;">(</div><div style="font-size:9px; float:left;text-align:center"><div style="position:relative; top:-2px">worth</div> <div style="position:relative; top:-4px">£' + (parseFloat($("redeemvalue").innerHTML) * parseInt(ItemObj.BonusLoyaltyPoints)).toFixed(2) + '</div></div><div style="font-size:14px; float:left">)</div></span>' ;
    }
    
    
    //Set Default Image (After Roll out) & CurrentImage
    if( $(defaultImageId) ){
        $(defaultImageId).value = "/Gallery/" + ItemObj.ProductImage;
    }
 
    if( $(largeImageId) ){
        $(largeImageId).src = "/Gallery/" + ItemObj.ProductImage;
    }/* */
}