/////// SkuSelection Class /////
function SkuSelection(line_id, color_id, size_id, qty, item_id) {
    // a sku is formed by the combination of color & size in an item
    //item instance on screen
    this.line_id             = line_id;
    //current selected color id
    this.color_id            = color_id;
    //current selected size id
    this.size_id             = size_id;
    //current selected qty
    this.qty                 = qty;
    //array(swatch_pad[0] = array(color[0] = array(size[0], size[1]), etc...))s
    this.color_size          = new Array();
    //default values
    this.defaults            = new Array();
    this.defaults['color']   = color_id;
    this.defaults['size']    = size_id;
    this.defaults['qty']     = qty;
    //array with available qty for each sku (array(sku[1] = x, etc...))
    this.available           = new Array();
    //enable/disable backorders
    this.enable_backorders   = false; //no backorders for shopko
    //stores the cartline image container name
    this.imageElementId      = 'thumb_img_';
    //item id
    this.item_id             = item_id;
    //swatches row identifier
    this.swatch_pad          = 0;
    //array to store wheter a sku is in clearance or no (is_clearance = true in sku table)
    this.is_clearance        = new Array();
    //to enable 0 in qty combo (useful for bundle pages)
    this.enable_zero         = false;

    //tells if we need to hide swatches when a swatch_pad has 1 color only
    this.enable_swatches_hiding = true;


    this.add_another         = new Array();

}

/**
 * adds the available qty to be purchased of a sku
 * @param {Object} sku_id
 * @param {Object} qty_available
 * @param {Object} is_clearance
 */
SkuSelection.prototype.addAvailable = function(sku_id, qty_available, is_clearance)
{
    this.available[sku_id] = qty_available;
    this.is_clearance[sku_id] = is_clearance;
}

/**
 * fills in the main array with the colors, sizes (skus) of the item
 * @param {Object} swatch_pad
 * @param {Object} color_id
 * @param {Object} size_id
 * @param {Object} description
 * @param {Object} price
 * @param {Object} sale_price
 * @param {Object} sku_id
 */
SkuSelection.prototype.addSize = function(swatch_pad, color_id, size_id, description, price, sale_price, sku_id)
{
    if (typeof this.color_size[swatch_pad] == 'undefined')
        this.color_size[swatch_pad] = new Array();

    if (typeof this.color_size[swatch_pad][color_id] == 'undefined')
        this.color_size[swatch_pad][color_id] = new Array();

    this.color_size[swatch_pad][color_id][size_id] = new Array();
    this.color_size[swatch_pad][color_id][size_id]['description'] = description;
    this.color_size[swatch_pad][color_id][size_id]['price'] = price;
    this.color_size[swatch_pad][color_id][size_id]['sale_price'] = sale_price;
    this.color_size[swatch_pad][color_id][size_id]['sku_id'] = sku_id;
}

/**
 * modifies the combo to show only the available qty for clearance items
 */
SkuSelection.prototype.setQtyCombo = function()
{
    var sku_id = "";
    if (this.size_id) {
        if(typeof this.color_size[this.swatch_pad][this.color_id][this.size_id] != 'undefined')
            sku_id = this.color_size[this.swatch_pad][this.color_id][this.size_id]['sku_id'];
        else{
            //if we are here it means the item has 1 color 2 sizes with different price each, so there are 2 rows of swatches
            //but they are not displaying and size combo shows the 2 sizes. The user selected the size for the swatch that is not
            //selected and therefore the value stored in this.swatch_pad is not the actual swatch pad
            for(var i = 0; i < this.color_size.length; i ++){
                if (typeof this.color_size[i][this.color_id][this.size_id] != 'undefined') {
                    sku_id = this.color_size[i][this.color_id][this.size_id]['sku_id'];
                    break;
                }
            }
        }
    }
    else 
        if (this.defaults["size"] &&
        typeof this.color_size[this.swatch_pad] != "undefined" &&
        typeof this.color_size[this.swatch_pad][this.color_id] != "undefined" &&
        typeof this.color_size[this.swatch_pad][this.color_id][this.defaults["size"]] != "undefined" &&
        typeof this.color_size[this.swatch_pad][this.color_id][this.defaults["size"]]['sku_id'] != "undefined") {
            sku_id = this.color_size[this.swatch_pad][this.color_id][this.defaults["size"]]['sku_id'];
        }

    var qty = 9;
    if(sku_id != ""){
        if(this.available[sku_id] <= 9) qty = this.available[sku_id];
        this.current_sku_id = sku_id;
    }
    var qtyCmb = document.getElementById('qty_select_' + this.line_id);
    var qty_tag = document.getElementById('qty_text_tag_' + this.line_id);
    if (qty <= 0) {
        qty_tag.style.display = 'none';
        qtyCmb.style.display = 'none';
    }
    else {
        qtyCmb.style.display = '';
        qty_tag.style.display = '';
    }


    while (qtyCmb.options.length > 0) qtyCmb.remove(0);
    var start = 1;
    //sometimes we want to start combo from 0
    if(this.enable_zero == true){
        start = 0;
    }
    for(var i=start; i<=qty; i++)
        addOption(qtyCmb, i, i);
    if (this.qty > qty) 
        this.qty = start;
    else {
        if(this.enable_zero || this.qty == 0)
            qtyCmb.selectedIndex = this.qty;
        else
            qtyCmb.selectedIndex = this.qty-1;
    }
}

/**
 *
 * @param {Object} color_id  clicked color
 * @param {Object} swatch_pad swatchpad where the clicket swatch is
 */
SkuSelection.prototype.selectColor = function(color_id, swatch_pad)
{

    this.color_id  = color_id;
    //sets the imput hidden to the clicked color
    document.getElementById('color_id_' + this.line_id).value = color_id;

    //hide all onmouseover labels
    hideSwatchName(this.line_id);

    //this segment is to clear the row of swatches where the selected swatch was
    var swatch = document.getElementById('swatches_' + this.line_id + "_" + this.swatch_pad);
    var swatches = YAHOO.util.Dom.getElementsByClassName('swatch', 'div', swatch);
    for (var i = 0; i < swatches.length; i++) {
        swatches[i].className = 'swatch';
    }
    
    //now we need to get the row of swatches where the clicked swatch is
    swatch = document.getElementById('swatches_' + this.line_id + "_" + swatch_pad);
    swatches = YAHOO.util.Dom.getElementsByClassName('swatch', 'div', swatch);

    if (swatch_pad == null) { swatch_pad = 0; }
    this.swatch_pad = swatch_pad;

    swatch = document.getElementById('swatch_' + this.line_id + '_' + swatch_pad + '_' + color_id);
    

    if(swatch) swatch.className = 'swatch selected';

    var ddSize = document.getElementById('size_select_' + this.line_id);

    //  + without this check IE6 breaks
    //  if the cart takes long to load, cart line elements in DOM won't be found
    //  so the function won't do the change, without error reporting in IE6
    if (typeof ddSize != 'undefined' && ddSize != null){
       while (ddSize.options.length > 1) ddSize.remove(1);
    }

    //This checks for single swatches (single color) on price ranges, so that all sizes are added to the single
    //size combo.
    //TO-DO check all price ranges so that if one of them has more than one color, do not apply this logic.
    var single_swatch = true;
    if (swatches.length > 1) {
        single_swatch = false;
    }

    if (single_swatch && this.enable_swatches_hiding) {
        for (var swatch_pad in this.color_size) {
            for (var color_id in this.color_size[swatch_pad]) {
                for (var size_id in this.color_size[swatch_pad][color_id]) {
                    if (typeof this.color_size[swatch_pad][color_id][size_id] != 'function' &&
                    (typeof this.color_size[swatch_pad][color_id][size_id] != 'undefined')) {
                        addOption(ddSize, this.color_size[swatch_pad][color_id][size_id]['description'], size_id);
                    }
                }
            }
        }
    }else {
        for (var size_id in this.color_size[swatch_pad][color_id]) {
            if (typeof this.color_size[swatch_pad][color_id][size_id] != 'function' &&
            (typeof this.color_size[swatch_pad][color_id][size_id] != 'undefined')) {
                addOption(ddSize, this.color_size[swatch_pad][color_id][size_id]['description'], size_id);
            }
        }
    }

    //  + only do this stuff if we have a ddSize element to work on...
    if (typeof ddSize != 'undefined' && ddSize != null){

        // if we only have one size, don't display combo, just label (except size = no size for which we don't even display label)
        if (ddSize.length == 2 && (ddSize.options[0].text == "Select Size" || ddSize.options[0].text == "Size")) {
            ddSize.style.display = 'none';
            var size_tag = document.getElementById('size_text_tag_'+this.line_id);
            if (size_tag) size_tag.style.display='none';
            ddSize.selectedIndex = 1;
            this.setSize(ddSize.options[1].value);
            if (this.defaults['size'] == '') {this.defaults['size'] = this.size_id};
            if (ddSize.options[1].value != '0000') {
                document.getElementById('size_alt_text_tag_' + this.line_id).style.display = '';
                document.getElementById('size_alt_text_tag_' + this.line_id).innerHTML = "Size: " + ddSize.options[1].text;
            } else {
                document.getElementById('size_alt_text_tag_' + this.line_id).style.display = 'none';
            }
        }
        else{
            ddSize.style.display = '';
            if(single_swatch == false) document.getElementById('size_alt_text_tag_'+this.line_id).style.display = 'none';
            this.setSize(ddSize.options[0].value);
            if (this.defaults['size'] == '') {this.defaults['size'] = this.size_id};
        }
    }

    try{
        this.selectSize(this.size_id);
    }catch(ex){

    }

    this.replaceImg();
    
}

/**
 * sets the current SkuSelection size drop down to the current value
 *
 * @param {Object} size_id string with the size to be selected
 * @return boolean true    if the change was successful / false   otherwise
 */
SkuSelection.prototype.selectSize = function(size_id) {
    var ddSize = document.getElementById('size_select_' + this.line_id);

    for (var i  = 0; i < ddSize.length; i++ ) {
        if (ddSize.options[i].value == size_id) {
            ddSize.selectedIndex = i;
            if(size_id == '0000') {
                ddSize.style.display = 'none';
                document.getElementById('size_text_tag_'+this.line_id).style.display='none';
            }
            return true;
        }
    }
    this.size_id = null; // Size not found
    return false;
}

/**
 * sets the current SkuSelection quantity drop down to the current value
 * @param {Object} qty integer, to be selected in the element
 */
SkuSelection.prototype.selectQty = function(qty) {
    var qtyCmb = document.getElementById('qty_select_' + this.line_id);
    setSelectValue('qty_select_' + this.line_id, qty);
    return true;
}

/**
 * sets item size and enables/disables add to cart btns
 * @param {Object} size_id
 */
SkuSelection.prototype.setSize = function(size_id) {
    this.size_id = size_id;
    this.setQtyCombo();
    this.skuAvailableOffline();
    var callback = {
        success: function(o) {
            var response = YAHOO.lang.JSON.parse(o.responseText);
            var atc = document.getElementById('atc');
            var atc_off = document.getElementById('atc_off');
            //in bundle detail page we have two sets of buttons so don't use this there
            var atc1 = document.getElementById('atc1');
            var atc_off1 = document.getElementById('atc_off1');
            if (atc1 == null
                && atc != null
                && typeof atc != undefined
                && atc_off != null
                && typeof atc_off != undefined) {
                if (response.available == "true" && (this.size_id || this.size_id != '')) {
                    atc.style.display = 'inline';
                    atc_off.style.display = 'none';
                }
                else {
                    atc.style.display = 'none';
                    atc_off.style.display = 'inline';
                }
            }
        },
        failure: function(o) {
        }
    };
    postData = 'item=' + this.item_id + '&color=' + this.color_id + '&size=' + this.size_id;
    YAHOO.util.Connect.asyncRequest('POST', '/detail/checkOnlineAvailability', callback, postData);
}

/**
 * sets the item id
 * @param {Object} item_id
 */
SkuSelection.prototype.setItemId = function(item_id) {
    this.item_id = item_id;
}

/**
 * sets the current qty
 * @param {Object} qty
 */
SkuSelection.prototype.setQty = function(qty) {
    if(!qty){
        if(this.enable_zero == true)
            qty = 0;
        else
            qty = 1;
    }
    this.qty = qty;
    
    //this is to enable or disable add to cart buttons in bundle
    if(document.getElementById('atc_off1') != null && skuSelect[0] != null){
        //since there is more than 1 atc btn and skuSelect is an array, we are in a bundle
        var activate_btn = false;
        for(var i = 0; i < skuSelect.length; i++){
            if (skuSelect[i].qty > 0) {
                activate_btn = true;
                break;
            }
        }
        var atc = document.getElementById('atc');
        var atc_off = document.getElementById('atc_off');
        var atc1 = document.getElementById('atc1');
        var atc_off1 = document.getElementById('atc_off1');
        if(activate_btn){
            atc.style.display = 'inline';
            atc_off.style.display = 'none';
            if (atc1 != null && atc_off1 != null) {
                atc1.style.display = 'inline';
                atc_off1.style.display = 'none';
            }
        }
        else{
            atc.style.display = 'none';
            atc_off.style.display = 'inline';
            if (atc1 != null && atc_off1 != null) {
                atc1.style.display = 'none';
                atc_off1.style.display = 'inline';
            }
        }
    }
}

/**
 * determines if swatches should be hidden when only one color swatch (when a swatch_pad contains more than 1 color disable swatches hiding)
 */
SkuSelection.prototype.hideSwatchPads = function() {
    if (this.color_size.length == 1) {
        return;
    }

    for (var swatch_pad in this.color_size) {
        for (var color_id in this.color_size[swatch_pad]) {
            if (this.color_size[swatch_pad].length > 1) {
                this.enable_swatches_hiding = false;
                return;
            }
        }
    }
}

/**
 *
 * @param {Object} line_id
 */
SkuSelection.prototype.setDefaults = function(line_id){
    if (line_id == null) {
        line_id = 0;
    }
    this.line_id = line_id;
    this.hideSwatchPads();
    this.selectColor(this.defaults['color'], 0); //select the default color in the first row of swatches
    this.selectSize(this.defaults['size']);
    this.setQtyCombo();
    this.selectQty(this.defaults['qty']);
    this.setQty(this.defaults['qty']);

}

// TODO: Fix me for all image types
/**
 * replaces item image
 */
SkuSelection.prototype.replaceImg = function() {
    var img = document.getElementById(this.imageElementId + this.line_id);
    if (this.imageFunction) {
        this.imageFunction(this.item_id + '_' + this.color_id);
        return;
    }
    if (!img) return;
    img.src = img.src.replace(/[0-9]+_[0-9]+.jpg/, this.item_id + '_' + this.color_id + '.jpg');
}

/**
 * returns either the current item_id, color_id, size_id, or qty
 * @param {Object} var_name
 */
SkuSelection.prototype.getValue = function(var_name){
    var variables = [];
    variables['item_id'] = this.item_id;
    variables['color_id'] = this.color_id;
    variables['size_id'] = this.size_id;
    variables['qty'] = this.qty;
    return variables[var_name];
}

/**
 * adds sku to bag
 */
SkuSelection.prototype.addToBag = function() {
    if (!this.checkSizeQty()) return;
    if (this.enable_backorders && !this.checkAvailable()) return;

    var postData = 'i=' + this.item_id + '&c=' + this.color_id + '&s=' + this.size_id + '&q=' + this.qty;
    postData += this.addAnotherPost();

    var sUrl = "/cart/ajaxadd";

    outerThis = this;
    var callback = {
        success:function(o) {
            if (typeof weAreInCart != "undefined" && weAreInCart == true) {
                window.location.reload();
                return;
            }
            if (o.responseText == undefined) return;
            if (typeof wait != 'undefined') wait.hide();

            //check if item was added or there was an availability change
            var add_success = o.responseText.match(/<br \//i);
            var availability = o.responseText.match(/exceeds the available/);
            if(add_success){
                responses = o.responseText.split('<br />');
                open_header_cart(responses[0]);
                document.getElementById('shopping_bag_counter').innerHTML = responses[1];
                //outerThis.clearAddAnother();
                updateRecent();
            }
            else if(availability) {
                var instance = o.argument.extvar;
                //we've requested more than the available qty
                var availableQty = o.responseText.match(/<span style="display: none;">(.*)<\/span>/i);
                var sku_id = instance.color_size[instance.swatch_pad][instance.color_id][instance.size_id]['sku_id'];
                instance.available[sku_id] = availableQty[1];
                instance.setQtyCombo();
                instance.selectQty(availableQty[1]);
                instance.qtyChangeMsg(o.responseText);
            }

            var restriction_limit = o.responseText.match(/<span style=\"display: none;\">restriction_limit<\/span>/);
            if(restriction_limit){

                var instance = o.argument.extvar;
                //we've requested more than the available qty
                responses = o.responseText.split('<span style="display: none;">restriction_limit</span>');
                instance.qtyChangeMsg(responses[1]);
            }
        },
        failure:function(o) {
            if (o.responseText == undefined) return;
            open_header_cart("There was an error while adding the item to your bag.");
        },
        argument: { extvar: this}
    };

    return YAHOO.util.Connect.asyncRequest('POST', sUrl, callback, postData);
}

/**
 * sends a notification about qty being changed in cart because there's no enought stock to cullfill clients order
 * @param {Object} content
 */
SkuSelection.prototype.qtyChangeMsg = function(content) {
    confirm_bo = new YAHOO.widget.Panel("confirmbo", {
          width:"286px",
          fixedcenter: true,
          close:false,
          draggable:false,
          zindex:101,
          modal:true,
          visible:false,
          underlay:'none',
          constraintoviewport: true,
          iframe:false
    });

    body = content;
    confirm_bo.setBody("<div id='popup_message'><div id='backorder_msg'><a href='#' onclick='closePopup();return false'>"+
                "<img src='/images/popup_close.jpg' alt='Close'/></a></div>"+body+"</div>");
    confirm_bo.render(document.body);

    //hide quantity and size combos
        e = document.getElementById('combos_qs');
    if(e){
        e.style.display = 'none';
    }

    confirm_bo.show();

    var underlay = document.getElementById('confirmbo_mask');
    if(underlay)
        YAHOO.util.Event.addListener(underlay, "click", function(){closePopup();});
}

/**
 * This function closes the confirm_bo panel and display again the hiden inputs.
 */
function closePopup() {
    confirm_bo.hide();
    //display quantity and size combos
    e = document.getElementById('combos_qs');
    e.style.display = 'block';

    return false;

}

/**
 * opens the window where the user can print the item details
 */
SkuSelection.prototype.printPopup = function() {
    var sUrl = "/detail/print";
    var params = '/' + this.item_id + '/' + this.color_id;
    if(this.size_id && this.qty)
        params += '/' + this.size_id + '/' + this.qty
    popup(sUrl+params, 'print', 820, 761, true);
}

/**
 * shows the send details pop up
 */
SkuSelection.prototype.showSendDetails = function() {
    var callback = {
        success: function(o) {
            send_details = new YAHOO.widget.Panel("send_details", {
                width:"514px",
                x: (document.documentElement.clientWidth - 514)/2,
                y: 145,
                close:false,
                zindex:101,
                visible:false,
                draggable:false,
                modal:true,
                underlay: 'none'
            });

            send_details.setBody(o.responseText);

            send_details.render(document.body);
            if (typeof quickViewPanel != 'undefined') {
                quickViewPanel.hide();
            };
            hide_selects();
            scroll(0,0);
            send_details.show();

            var underlay = document.getElementById('send_details_mask');
            if (underlay) YAHOO.util.Event.addListener(underlay, "click", function(){show_selects();send_details.hide();});
            return false;
        },
        failure: function (o) {}
    };

    YAHOO.util.Connect.asyncRequest(
        'POST',
        '/detail/sendDetailsToFriend/',
        callback,
        'item=' + this.item_id + '&color=' + this.color_id
    );
}

/**
 * determines in current sku is available in "My Store" (My store must have been set previously)
 */
SkuSelection.prototype.availableInLocalStore = function(){
    if(document.getElementById("local_store_info_"+this.line_id) == null) return;
    var cookie = getCookie("local_store");
    if (!cookie) {
        document.getElementById("local_store_info_"+this.line_id).style.display = "none";
        return;
    }
    var local_store = cookie.split("_");

        var callback = {
            success: function(o) {
                var skuSelection = o.argument.extvar;
                var response = YAHOO.lang.JSON.parse(o.responseText);
                if(response.error)
                    return;
                var output = "";
                var availability;
                //var more_stores = document.getElementById("more_stores_"+skuSelection.line_id);
                for (var i = 0, len = response.length; i < len; ++i) {
                    availability = "<span class='out_stock'>Out of Stock</span>";
                    if(response[i].availability > 0)
                        availability = "<span class='in_stock'>In Stock</span>";
                    if(response[i].store_number == local_store[1]){
                        document.getElementById("local_store_availability_"+skuSelection.line_id).innerHTML = availability;
                        document.getElementById("local_store_name_"+skuSelection.line_id).innerHTML = "<a href='/locator/showstore/"+local_store[1]+"' target='_blank'>"+local_store[2]+"</a>";
                        document.getElementById("local_store_info_"+skuSelection.line_id).style.display = "";
                    }
                    else{

                    }
                }

            },
            failure: function (o) {},
            argument: { extvar: this}
        };
        YAHOO.util.Connect.asyncRequest(
            'POST',
            '/detail/checkClosestStoresAvailability',
            callback,
            'item=' + this.item_id + '&color=' + this.color_id + '&size=' + this.size_id + "&zip=" + local_store[0] + "&sn=" + local_store[1]
        );
        document.getElementById("zip_"+this.line_id).value = local_store[0];
}

/**
 * determines if the sku is available in the near stores (My Store must have already been selected)
 */
SkuSelection.prototype.skuAvailableOffline = function(){
    if(!document.getElementById('fis_btn_'+this.line_id)) return;
    var callback = {
        success: function(o) {
            var skuSelection = o.argument.extvar;
            if(o.responseText == "available"){

                var av_btn = document.getElementById('fis_btn_'+skuSelection.line_id).style.display="inline";
                var av_btn = document.getElementById('zip_'+skuSelection.line_id).disabled=false;
                var av_btn = document.getElementById('fis_btn_off_'+skuSelection.line_id).style.display="none";
                skuSelection.availableInLocalStore();
            }
            else{
                var av_btn = document.getElementById('fis_btn_'+skuSelection.line_id).style.display="none";
                var av_btn = document.getElementById('zip_'+skuSelection.line_id).disabled=true;
                var av_btn = document.getElementById('fis_btn_off_'+skuSelection.line_id).style.display="inline";
                document.getElementById('local_store_info_'+skuSelection.line_id).style.display="none";
            }

        },
        failure: function (o) {
            var skuSelection = o.argument.extvar;
            var av_btn = document.getElementById('fis_btn_'+skuSelection.line_id).style.display="none";
            var av_btn = document.getElementById('zip_'+skuSelection.line_id).disabled=true;
            var av_btn = document.getElementById('fis_btn_off_'+skuSelection.line_id).style.display="inline";
            document.getElementById('local_store_info_'+skuSelection.line_id).style.display="none";
        },
        argument: { extvar: this}
    };
    YAHOO.util.Connect.asyncRequest(
        'POST',
        '/detail/checkAvailability',
        callback,
        'item=' + this.item_id + '&color=' + this.color_id + '&size=' + this.size_id
    );

}

/**
 * enable qty = 0
 * @param {Object} value
 */
SkuSelection.prototype.enableZero = function(value)
{
    this.enable_zero = value;
}

/**
 * Checks if the qty/size are selected, if not, it sets the size_id as the default size.
 */
SkuSelection.prototype.checkSizeQty = function() {
    if ((!this.size_id && this.countProps(this.color_size[this.swatch_pad][this.color_id]) > 1) || !this.qty) {
        var errTxt = "Please select the following:\r\n";
        errTxt += !this.size_id ? " - Size\r\n" : "";
        errTxt += !this.qty ?  " - Quantity\r\n" : "";
        alert(errTxt);
        return false;
    }

    // if a size is required it's caught above.  consequently, if we make it here and there is no size, use the default size
    if ( !this.size_id ) {
        this.size_id = this.defaults['size'];
    }

    return true;
}

/**
 * TO-DO define what this function does. It gets called by addToBag
 */
SkuSelection.prototype.addAnotherPost = function() {
    var post = '';
    for (var i = 0; i < this.add_another.length; i++) {
        var x = this.add_another[i];
        if (this.add_another[x] == 0) continue;
        post = post + '&sa[' + x + ']=' + this.add_another[x];
    };
    return post;
}

/**
 * this sets the name of a function used in pdp to set the flash zoom
 * @param {Object} func
 */
SkuSelection.prototype.setImageFunction = function(func) {
    this.imageFunction = func;
}

/**
 * redirects from the quickviw to the pdp carying the currently selected item attributes
 * @param string item_desc
 */
SkuSelection.prototype.goToPDP = function(item_desc) {
    var color_id  = this
    var href = "/detail/" + item_desc + "/" + this.item_id + "/" + this.color_id
             + "/" + this.size_id + "/" + this.qty;
    window.location = href;
}