﻿var MAIN_IMAGE_ZOOM = "";

function ProductDetails_OnLoad(mainImageZoomID)
{
    MAIN_IMAGE_ZOOM = document.getElementById(mainImageZoomID);
}

ProductDetails_OnResponseEnd = function(sender, arguments) {
    trace('ProductDetails_OnResponseEnd');

    // see which action it was
    try {
        var eventTarget = arguments.EventTarget; trace(typeof eventTarget);
        if (typeof eventTarget == 'string') {
            if (/lbAddToCart/i.test(eventTarget)) { addToCart(); }
        //lbAddToCart should be 'Buy now' button ID
        }
    } catch (e) {
        trace(e);
    }
};

addToCart = function() {
    trace('addToCart');

    // find the big product image and move it to somewhere
    // jquery ui animation transfer -> puff
    //ID of cart image
    var CART_ID = '#mycart';
    //id of main product image
    var PRODUCT_IMG_ID = '#zoom1';
    var CLONED_PRODUCT_IMG_ID = generateUniqueElementId(PRODUCT_IMG_ID);

    var IMG_ANIMATE_DURATION = 1500;
    var IMG_DISAPPEAR_DURATION = 500;
    var CART_PULSATE_DURATION = 500;

    try {
        $('#zoom1')
        .clone()
        .attr('id', CLONED_PRODUCT_IMG_ID)
        .css({
            'visibility': 'visible',
            'display': 'block',
            'position': 'absolute',
            'left': $(PRODUCT_IMG_ID).offset().left + 'px',
            'top': $(PRODUCT_IMG_ID).offset().top + 'px'
        })
        .appendTo('body')
        .animate({
            'left': '+=' + ($(CLONED_PRODUCT_IMG_ID).offset().left - $(CART_ID).offset().left) + 'px',
            'top': '+=' + ($(CLONED_PRODUCT_IMG_ID).offset().top - $(CART_ID).offset().top) + 'px'
        }, IMG_ANIMATE_DURATION, 'swing', function() {
            $(this).effect('scale', { percent: 0 }, IMG_DISAPPEAR_DURATION, function() {
                $(this).remove(); $(CART_ID).effect('pulsate', {}, CART_PULSATE_DURATION, function() {
                    // open the overlay
                    $('button[rel*=overlay]').trigger('click');
                });
            });
        });
    } catch (e) {
        trace(e);
    }
};

generateUniqueElementId = function(id) {
    if (typeof id != 'string') throw 'argument specified is wrong: id';
    return id + Math.floor(Math.random() * 99999);
};

$(function() {
    // load tabs
    //$("#tabs").tabs();

    // load overlays
   // $("button[rel*=overlay]").overlay({
   //     expose: '#fff'
   //});
});

function setMainImage(mainImageAnchor, anchorURL, imageURL)
{
    //Img1ImageURL ID keeps changing dynamically on page, so MAIN_IMAGE_ZOOM is set on body load to point to element to access it
    var MainImageAnchor = document.getElementById(mainImageAnchor);
       
    if (MainImageAnchor)
        MainImageAnchor.href = anchorURL;
    if (MAIN_IMAGE_ZOOM)
        MAIN_IMAGE_ZOOM.src = imageURL;
        
}