﻿/*
 Usage:
 */
(function($) {
    $.fn.extend({
        shopWindow: function(options) {
            var settings = $.extend($.fn.shopWindow.defaults, options);

            return this.each(function() {

                var $wrapper = $(this);

                var $controls = $wrapper.children('ul.shop_window_controls').show();

                var $content = $wrapper.children('ul.shop_window_content');

                var $LIs = $content.children('li');

                $LIs.each(function() {

                    var $link = $(this).children('a');
                    var $popup = $link.children('span').css({
                        height: settings.imageHeight * (settings.popupHeightPercentage / 100) +1
                    });

                    $link.hover(function() {
                        $popup.stop().css('display', 'block').animate({
                            top: settings.imageHeight * ((100 - settings.popupHeightPercentage) / 100)
                        }, settings.fadeSpeed);
                    }, function() {
                        $popup.stop().animate({
                            top: settings.imageHeight
                        }, settings.fadeSpeed, function() { $(this).hide(); });
                    });
                });

                var $currentLI = $LIs.eq(0);

                var animating = false;

                var changeImage = function($li, direction) {
                    if (!animating) {
                        animating = true;
                        var $img = $li.find('img').css({
                            left: (direction == 1 ? '' : '-') + settings.imageWidth + 'px'
                        });
                        var $text = $li.children('div').css({
                            opacity: 0
                        });
                        $li.css({
                            display: 'list-item',
                            zIndex: 2
                        });
                        $currentLI.css({
                            zIndex: 1
                        }).children('div').fadeTo(settings.fadeOutSpeed, 0, function() {
                            $text.fadeTo(settings.fadeOutSpeed, 1);
                        });
                        $img.animate({
                            left: 0
                        }, settings.fadeOutSpeed * 2, 'swing', function() {
                            $currentLI.hide();
                            $li.css({ zIndex: 0 });
                            $currentLI = $li;
                            animating = false;
                        });
                    }
                }

                $controls.children('li.shop_window_control_previous').bind('click', function() {
                    var index = $LIs.index($currentLI);
                    changeImage($LIs.eq((index + $LIs.length - 1) % $LIs.length), 1);
                });

                $controls.children('li.shop_window_control_next').bind('click', function() {
                    var index = $LIs.index($currentLI);
                    changeImage($LIs.eq((index + 1) % $LIs.length));
                });
            });
        }
    });
    $.fn.shopWindow.defaults = {
        textWidth: 240,
        imageWidth: 724,
        imageHeight: 335,
        fadeSpeed: 300,
        fadeOutSpeed: 600,
        popupHeightPercentage: 10
    }
})(jQuery);


/* Run plugin */

$(document).ready(function() {
    $('div.shop_window_wrapper').shopWindow();
});
