/*
* MWOODS
* You will notice some odd notation in this file, where we access divs in the following way:
*   $jq('#largebox div[id=tabs]')
* as opposed to the more natural
*   $jq('#largebox #tabs')
* the reason for this is that IE7 appears to have issues with accessing divs by direct nested id (as in
* the second example), when the nested id exists in more than one place on the page (unavoidable in this
* case, due to the way that we copy pre-loaded ajax content from a hidden div into a lightbox, thus creating
* duplicate ids). The $jq('#largebox div[id=tabs]') notation is our workaround, which IE7 seems to accept.
*/

var contentDivId = '';
var currentSelectedShade;
var currentSelectedShadeOverlayImage;

$jq(document).ready(function() {
    if (typeof(quickview_target) == 'undefined') {
        quickview_target = 'quickview.tmpl';
    }

    $jq.get('/templates/product/' + quickview_target + '?CATEGORY_ID=' + quickview_catid + '&PAGE=' + quickview_pageid, function(returnedMsg) {
        $jq('#quickview_container').html(returnedMsg);
        if ($jq('#largebox').length > 0) {
            delayedLoadContent();
        }
    });

    $jq('.prod_container .prod_image').hover(
        function() {
            $jq('.quickview_button', this).show();
        },
        function() {
            $jq('.quickview_button', this).hide();
        }
    );
});

function delayedLoadContent() {
    if (contentDivId != '') {
        $jq('#' + contentDivId).click();
    } else {
        setTimeout(delayedLoadContent, 1);
    }
}

function handle_tabs(argContentDivId){
    contentDivId = argContentDivId;
    prodid = argContentDivId.replace('quickview_','');
    /*
    * MWOODS
    * Here we have to update the ids of the tab container div, button links
    * and tab content divs, so that they are distinguishable from the hidden
    * equivalents in the quickview_container div, before we call tabs(),
    * else IE7 kicks up a fuss and falls over.
    */
    $jq('#largebox div[id=tabs]').attr('id', 'largeboxtabs');
    $jq('#largeboxtabs .prodTabBtn .tab_button').each(function(){
        $jq(this).attr('href', '#largebox' + $jq(this).attr('href').substr($jq(this).attr('href').indexOf("#") +1));
    });
    $jq('#largeboxtabs div[id^=tabs-]').each(function(){
        $jq(this).attr('id', 'largebox' + $jq(this).attr('id'));
    });

    /*
    * MWOODS
    * In the name of tidiness, we wait until tabs() has
    * completed before displaying the content to the page.
    * This ensures the tab contents do not spill over the largebox
    * when they are first displayed, before tabs() has rearranged them.
    */
    $jq('#largeboxtabs').bind('tabsshow', function(event, ui) {
        loadQuickviewBuy(prodid);
        $jq('#largeboxtabs').show();
        $jq('#largebox').pngFix();
        $jq('#largebox .ui-tabs-panel').bgiframe();
        //Call function to fire CM tags
        eval('fireTags_' + prodid + '()');
        /*
        * MWOODS
        * We now unbind this function, as the tabsshow event is also fired whenever the user
        * changes tab, and we only want to execute this function when tabs() is first called.
        */
        $jq('#largeboxtabs').unbind('tabsshow');
    }).tabs();
}

function select_first_tab() {
    $jq('#largeboxtabs').tabs( 'select' , 0 );
    return true;                      
}

function loadQuickviewBuy(prodId) {
    // Show the Add to Bag elements for any browser which has JS enabled
    if ($jq("#largebox .sel_shade span[id=swatch_set]").length > 0) {
        //SHADED ITEM
        //This will call setSelectedShadeQuickview
        $jq('#largebox .sel_shade span[id=swatch_set]:first').click();
    } else {
        //NON-SHADED PRODUCTS
        $jq("#largebox .orig_select1").change(function() {
            if (this.value == '') return false ;
            obj = eval('js_' + this.value);

            //Update the main price / size information
            $jq('#largebox div[id=prod_price]').html( obj.price );
            $jq('#largebox div[id=prod_size]').html( obj.size );

            if (obj.inventory_status) {
                $jq('#largebox div[id=mcurl' + obj.prod_id + ']').hide();
                $jq('#largebox div[id=skuInventoryStatus]').html('<span style="margin-left: 10px; margin-top: 2px; float: left;">' + obj.inventory_status + '</span>');
                $jq('#largebox div[id=skuInventoryStatus]').show();
            } else {
                //Update the add to bag call
                $jq('#largebox div[id=skuInventoryStatus]').hide();
                $jq('#largebox div[id=mcurl' + obj.prod_id + ']').show();
                $jq('#largebox div[id=mcurl' + obj.prod_id + ']').data('sku_id', obj.sku_id );
                $jq('#largebox div[id=mcurl' + obj.prod_id + ']').data('ssid', obj.ssid );
                $jq('#largebox div[id=mcurl' + obj.prod_id + ']').data('product_id', obj.prod_id );
            }
        });

        $jq("#largebox .orig_select2").change(function(){
            var sizeSelect = $jq("#largebox div[id=size_select]");
            if (sizeSelect){
                sizeSelect.html( eval('js_' + this.value) );
                sizeSelect.trigger('change'); 
            }
        });

        if ($jq("#largebox .orig_select1").length > 0) {
            //NON-SHADED ITEM WITH MULTIPLE SIZES/SKIN TYPES
            $jq("#largebox .orig_select1").change();
        } else if ($jq("#largebox div[id=has_status_message]").text() == '1') {
            //NON-SHADED SINGLE SKU WITH STATUS
            //This will call singleSkuWithStatusQuickview
            $jq("#largebox div[id=has_status_message]").click();
        } else {
            //SINGLE NON-SHADED ITEM
            $jq('.addToBag').show();
        }
    }

    // The values below may be changed by other JS methods and allow dynamic 
    // add-to-bag based on the SKU which is selected
    obj = eval('js_' + eval('js_' + prodId + '_default_sku'));
    $jq('#largebox div[id=mcurl' + prodId + ']').data('sku_id', obj.sku_id);
    $jq('#largebox div[id=mcurl' + prodId + ']').data('ssid', obj.ssid);
    $jq('#largebox div[id=mcurl' + prodId + ']').data('product_id', obj.prod_id);

    $jq('#largebox div[id=mcurl' + prodId + ']').click(function () {
        // The values above are now translated into name/value pairs consistent with a regular add-to-cart 
        // Note that this is triggered when the add to bag button has been clicked
        $jq('#largebox div[id=mcurl' + prodId + ']').data('qty-add', 'select-' + $jq('#largebox div[id=mcurl' + prodId + ']').data('product_id') + '-qty-add-common' );
        $jq('#largebox div[id=mcurl' + prodId + ']').data('selprod', 'select-' + $jq('#largebox div[id=mcurl' + prodId + ']').data('product_id') );
        $jq('#largebox div[id=mcurl' + prodId + ']').data('qtyname', $jq('#largebox div[id=mcurl' + prodId + ']').data('ssid') + '~' + $jq('#largebox div[id=mcurl' + prodId + ']').data('sku_id') );
        $jq('#largebox div[id=mcurl' + prodId + ']').data('add_url', quickview_mcurl + '&' + $jq('#largebox div[id=mcurl' + prodId + ']').data('selprod') + '=' + $jq('#largebox div[id=mcurl' + prodId + ']').data('qtyname') + '&skuId=' + $jq('#largebox div[id=mcurl' + prodId + ']').data('sku_id') + '&' + $jq('#largebox div[id=mcurl' + prodId + ']').data('qty-add') + '=' + $jq('#largebox select[id=spp_quantityDd]').val() + '&returnurl=' + quickview_rurl);

        addToCart($jq('#largebox div[id=mcurl' + prodId + ']').data('add_url'));
        $jq.Largebox.finish();
    });
}

function singleSkuWithStatusQuickview(prodId, skuId, inventoryStatus, tos) {
    $jq('#largebox div[id=mcurl' + prodId + ']').hide();
    $jq('#largebox div[id=skuInventoryStatus]').html('<span style="margin-left: 10px; margin-top: 2px; float: left;">' + inventoryStatus + '</span>');
    $jq('#largebox div[id=skuInventoryStatus]').show();
}

function setSelectedShadeQuickview(selectedShadeThumb, hexValue, skuId, inventoryStatus, tos, overlayImage) {
    $jq('#largebox .sel_shade').removeClass('sel_shade');
    activateThumb(selectedShadeThumb);
    setDisplayedShade(hexValue,overlayImage);
    currentSelectedShade = hexValue;
    currentSelectedShadeOverlayImage = overlayImage;

    if (skuId == '') return false ;

    obj = eval('js_' + skuId);

    //Update the main price / shade information
    $jq('#largebox .prod_price').html( obj.price + ' <span class="unit_price">' + obj.unit_price + '</span>' );
    $jq('#largebox div[id=selected_color_name]').html( obj.shade_name ); // MB: this line is the only difference between shaded and non shaded function

    if (inventoryStatus) {
        singleSkuWithStatusQuickview(obj.prod_id, skuId, inventoryStatus, tos);
    } else {
        //Update the add to bag call
        $jq('#largebox div[id=skuInventoryStatus]').hide();
        $jq('#largebox div[id=mcurl' + obj.prod_id + ']').show();
        $jq('#largebox div[id=mcurl' + obj.prod_id + ']').data('sku_id', obj.sku_id );
        $jq('#largebox div[id=mcurl' + obj.prod_id + ']').data('ssid', obj.ssid );
        $jq('#largebox div[id=mcurl' + obj.prod_id + ']').data('product_id', obj.prod_id );
    }
}

function setDisplayedShade(hexValue, overlayImage) {
    if (hexValue == '#') return false;
    if (typeof(overlayImage) != 'undefined') {
        $jq('#largebox img[id=product_image_bg]').attr('src', overlayImage);
    } else {
        $jq('#largebox li[id=image_small]').css('backgroundColor',hexValue);
    }
    $jq('#largebox td[id=smoosh0]').css('backgroundColor',hexValue);
    return true;
}

function activateThumb(thumbDiv) {
    if ( !$jq(thumbDiv).hasClass('sel_shade') ) {
        $jq(thumbDiv).addClass('sel_shade');
    }
    return true;
}

function deactivateThumb(thumbDiv) { 
    $jq(thumbDiv).removeClass('sel_shade');
}

function canSubmit(){
    var success = true;
    if ( $jq('#largebox input[id=FRIEND_EMAIL_ADDRESS_REQUIRED]').val() == null || $jq('#largebox input[id=FRIEND_EMAIL_ADDRESS_REQUIRED]').val() == '' || !valid_ftaf_email('FRIEND_EMAIL_ADDRESS_REQUIRED') ){
        $jq('#largebox div[id=FRIEND_EMAIL_ADDRESS_REQUIRED_TEXT]').css('color','red');
        success = false;
    } else {
        $jq('#largebox div[id=FRIEND_EMAIL_ADDRESS_REQUIRED_TEXT]').css('color','black');
    }

    if ( $jq('#largebox input[id=EMAIL_ADDRESS_REQUIRED]').val() == null || $jq('#largebox input[id=EMAIL_ADDRESS_REQUIRED]').val() == '' || !valid_ftaf_email('EMAIL_ADDRESS_REQUIRED') ){
        $jq('#largebox div[id=EMAIL_ADDRESS_REQUIRED_TEXT]').css('color','red');
        success = false;
    } else {
        $jq('#largebox div[id=EMAIL_ADDRESS_REQUIRED_TEXT]').css('color','black');
    }

    if ( $jq('#largebox input[id=FULL_NAME_REQUIRED]').val() == null || $jq('#largebox input[id=FULL_NAME_REQUIRED]').val() == '' ) {
        $jq('#largebox div[id=FULL_NAME_REQUIRED_TEXT]').css('color','red');
        success = false;
    } else {
        $jq('#largebox div[id=FULL_NAME_REQUIRED_TEXT]').css('color','black');
    }

    if ( !$jq('#largebox input[id=FRIEND_OPTIN_REQUIRED]').is(':checked') ) {
        $jq('#largebox div[id=FRIEND_OPTIN_REQUIRED_TEXT]').css('color','red');
        success = false;
    } else {
        $jq('#largebox div[id=FRIEND_OPTIN_REQUIRED_TEXT]').css('color','black');
    }

    if (!success){
        $jq('#largebox div[id=required_info_text]').css('color','red');
    } else {
        $jq('#largebox div[id=required_info_text]').css('color','black');
    }

    return success;
}

function valid_ftaf_email(emailAddressId){
    var pattern=/^([a-zA-Z0-9_.-])+@([a-zA-Z0-9_.-])+\.([a-zA-Z])+([a-zA-Z])+/;

    if (!pattern.test($jq('#largebox input[id=' + emailAddressId + ']').val())) {
        return false;
    } else {
        return true;
    }
}

function submitForwardToAFriend(prodid){
    var friendOptin = ($jq('#largebox input[id=FRIEND_OPTIN_REQUIRED]').is(':checked')) ? 'on' : '';
    var sendMeCopy = ($jq('#largebox input[id=SEND_ME_COPY]').is(':checked')) ? 'on' : '';

    $jq.get($jq('#largebox form[id=ftaf_form]').attr('action'),
            {
              FRIEND_EMAIL_ADDRESS_REQUIRED : $jq('#largebox input[id=FRIEND_EMAIL_ADDRESS_REQUIRED]').val(),
              FULL_NAME_REQUIRED : $jq('#largebox input[id=FULL_NAME_REQUIRED]').val(),
              EMAIL_ADDRESS_REQUIRED : $jq('#largebox input[id=EMAIL_ADDRESS_REQUIRED]').val(),
              FRIEND_OPTIN_REQUIRED : friendOptin,
              EMAIL_MESSAGE : $jq('#largebox textarea[id=EMAIL_MESSAGE]').val(),
              SEND_ME_COPY : sendMeCopy,
              PRODUCT_NAME : $jq('#largebox input[id=SHARE_PRODUCT_NAME]').val(),
              CATEGORY_ID : quickview_catid,
              PRODUCT_ID : prodid
            },
            function(returnedMsg) {
        $jq('#largebox div[id=ftaf_content]').html(returnedMsg);
    });
}