/// <reference path="jquery-1.4.2.js" />

$(function() {
    ProductDetails.init();
});

var ProductDetails = {
    fancyDefaultConfig: {
        'transitionIn': 'elastic',
        'transitionOut': 'fade',
        'speedIn': 600,
        'speedOut': 200,
        'overlayShow': true,
        'padding': 0
    },
    fancyAjaxConfig: {
        'hideOnOverlayClick': false,
        'autoDimensions': false
    },
    init: function () {
        $('div.btnBack a').click(
            function () {
                history.back();
                return false;
            }
        );

        $('div#productDetailsContainer div#rightColumn div.size-list div.size')
            .hover(
                function () {
                    $(this).addClass('hover');
                },
                function () {
                    $(this).removeClass('hover');
                }
            )
            .click(function () {
                $('div#productDetailsContainer div#rightColumn div.size-list div.size.active').removeClass('active');
                $(this).addClass('active');
            });

        $('div#productDetailsContainer div#leftColumn div#mainImage a')
                .fancybox($.extend({},
                    ProductDetails.fancyDefaultConfig,
                    { 'type': 'image', 'padding': 0, 'titleShow': false }
                ));

        $('div#productDetailsContainer div#leftColumn div#imageList div.image').click(function () {
            $('div#productDetailsContainer div#leftColumn div#imageList div.image.active').removeClass('active');
            $(this).addClass('active');
            $('div#productDetailsContainer div#leftColumn div#mainImage div.image-large.active').removeClass('active');
            var id = $(this).attr('title');
            $('div#productDetailsContainer div#leftColumn div#mainImage div.image-large[title=' + id + ']').addClass('active');
        });

        $('div#productDetailsContainer div#rightColumn div.btn-cart div.preloader div.preloader-bg').css('opacity', 0.6);

        $('div#productDetailsContainer div#rightColumn div.btn-cart a').click(ProductDetails.addToCart);

        // related products hover
        $('div#relatedProducts div.product').hover(
            function () {
                $(this).find('.bg-layer2').fadeIn('fast');
                $(this).animate({ backgroundColor: "#ff4600", color: "#ffffff" }, 'fast');
                $(this).find('.price').animate({ color: "#242424" }, 'fast');
                $(this).find('.price span.price-value').animate({ color: "#ffffff" }, 'fast');
            },
            function () {
                $(this).find('.bg-layer2').fadeOut('fast');
                $(this).animate({ backgroundColor: "#242424", color: "#a4a4a4" }, 'fast');
                $(this).find('.price').animate({ color: "#666666" }, 'fast');
                $(this).find('.price span.price-value').animate({ color: "#a4a4a4" }, 'fast');
            }
        );

        $('div.tabs > ul > li > a').click(function () {
            $('div.tabs > ul > li > a.active').removeClass('active');
            $('div.tabs > div.expandable.active').removeClass('active');
            $link = $(this);
            $link.addClass('active');
            $($link.attr('href')).addClass('active');
            return false;
        });

        $('div.btn-expand > a').click(function () {
            var content = $(this).parents('.expandable').children('.content');
            if (content.is('.expanded')) {
                content.animate({ 'height': 110 }, 'normal');
                content.removeClass('expanded');
                $(this).html('Rozwiń opis')
            }
            else {
                content.animate({ 'height': content.children('.content-inner').outerHeight(true) }, 'normal');
                content.addClass('expanded');
                $(this).html('Zwiń opis')
            }
            return false;
        });
    },
    addToCart: function () {
        var url = $(this).attr('href');
        var productId = $('input#ProductId').val();
        var sizeId = $('.size-list .size.active input.size-id').val();
        var ctx = $('div#bottomBar div.wrapper div.cart');

        if (sizeId) {
            ProductDetails.showPreloader();
            ProductDetails.ajaxRequest(url, productId, sizeId, ctx, ProductDetails.ajaxSuccess, ProductDetails.ajaxError);
        }
        else {
            // show size choice option!
            var html = $('#sizeModalChoice').html();
            $.fancybox($.extend({},
                    ProductDetails.fancyDefaultConfig,
                    ProductDetails.fancyAjaxConfig,
                    {
                        'width': 420,
                        'height': 'auto',
                        'content': html,
                        'onComplete': function () {
                            $('#fancybox-inner #sizeModalChoiceContent div.size')
                                .hover(
                                    function () {
                                        $(this).addClass('hover');
                                    },
                                    function () {
                                        $(this).removeClass('hover');
                                    }
                                )
                                .click(function () {
                                    sizeId = $(this).find('input.size-id').val();

                                    $('#fancybox-inner #sizeModalChoiceContent').hide('fast');


                                    ProductDetails.showFancyPreloader();

                                    ProductDetails.ajaxRequest(url, productId, sizeId, ctx, ProductDetails.ajaxFancySuccess, ProductDetails.ajaxFancyError);

                                    /*
                                    $('#sizeModalChoiceContent div.size.active').removeClass('active');
                                    $(this).addClass('active');
                                    */
                                });
                        }
                    }
            ));
        }
        //alert('url: ' + url + ' prod: ' + productId + ' size: ' + sizeId);
        return false;
    },
    ajaxRequest: function (url, productId, sizeId, ctx, successHandler, errorHandler) {
        var data = 'productId=' + productId + '&sizeId=' + sizeId;
        $.ajax({
            type: 'POST',
            url: url,
            data: data,
            dataType: 'json',
            success: successHandler,
            error: errorHandler,
            context: ctx
        });
    },
    ajaxSuccess: function (result) {
        ProductDetails.hidePreloader();
        if (result.Success) {
            var result_target = $(this);
            result_target.setTemplateElement('cartDisplayTemplate');
            result_target.processTemplate(result.Cart);

            BottomBar.bindCartFancy();

            $.fancybox($.extend({},
                    ProductDetails.fancyDefaultConfig,
                    ProductDetails.fancyAjaxConfig,
                    {
                        'width': 420,
                        'height': 130,
                        'content': $('#cartAddSuccessMessage').html()
                    }));
        }
        else {
            var errorHolder = $('#cartAddErrorMessage');
            //errorHolder.find('.message').html(result.Message);

            $.fancybox($.extend({},
                    ProductDetails.fancyDefaultConfig,
                    ProductDetails.fancyAjaxConfig,
                    {
                        'width': 300,
                        'height': 50,
                        'content': errorHolder.html()
                    }));
        }
    },
    ajaxError: function () {
        ProductDetails.hidePreloader();
    },
    ajaxFancySuccess: function (result) {
        ProductDetails.hideFancyPreloader();
        if (result.Success) {
            var result_target = $(this);
            result_target.setTemplateElement('cartDisplayTemplate');
            result_target.processTemplate(result.Cart);

            BottomBar.bindCartFancy();

            //$('#fancybox-inner #sizeModalChoiceContent').remove();

            $('#fancybox-inner .cart-add-success').show('fast');

            //$.fancybox.resize();
        }
        else {
            var errorHolder = $('#fancybox-inner .cart-add-error');
            //errorHolder.find('.message').html(result.Message);
            errorHolder.show('fast');
        }
    },
    ajaxFancyError: function () {
        ProductDetails.hideFancyPreloader();
    },
    showPreloader: function () {
        $('div#productDetailsContainer div#rightColumn div.btn-cart div.preloader').addClass('active');
    },
    hidePreloader: function () {
        $('div#productDetailsContainer div#rightColumn div.btn-cart div.preloader').removeClass('active');
    },
    showFancyPreloader: function () {
        $.fancybox.showActivity();
        /*
        var fancy = $('#fancybox-inner');
        $('#fancybox-inner div.preloader div.preloader-bg').css('opacity', 0.6);
        var loader = $('#fancybox-inner div.preloader');
        var loaders = $('#fancybox-inner div.preloader, #fancybox-inner div.preloader div');
        loaders.width(fancy.outerWidth());
        loaders.height(fancy.outerHeight());
        loader.addClass('active');*/
    },
    hideFancyPreloader: function () {
        $.fancybox.hideActivity();
        //$('#fancybox-inner div.preloader').removeClass('active');
    }
};