/// <reference path="../../Chrome/Scripts/jquery-1.3.2-vsdoc.js">

(function($) {
    var defaultOptions = { timeout: 5000, initialDelay: 3000, delay: 1500, effectTime: 500 };

    $.fn.dynamicBanner = function(options) {
        options = $.extend({}, defaultOptions, options);
        this.data("options", options);
        this.each(function() {
            var t = $(this);
            setUpInfoTab.call(t);
            setUpImages.call(t);
            t.hover(stopSlideShow, startSlideShow);
            setUpButtons.call(t);
            startSlideShow.call(t);
            showSlide.call(t, 0);
        });
    }

    function setUpButtons() {
        this.append("<div class=\"selectors\"></div>");
        var selectors = this.children(".selectors");
        var images = this.find("li img");
        for (i = 0; i < this.find("li img").length; i++) {
            selectors.prepend("<div class=\"selectorButton\"></div>");
            var btn = selectors.children().eq(0);
            btn.data("index", i);
            btn.click(function() {
                showSlide.call($(this).parents(".dynamicBanner"), $(this).data("index"));
            });
        }
        this.find(".selectorButton:last").addClass("selected");
    }

    function setUpImages() {
        this.find("li").css("display", "block").removeClass("selected");
        this.find("li img").hide(0);
        this.find("li:first img").show(0);
        this.data("selectedIndex", 0);
    }

    function setUpInfoTab() {
        var infoTab = this.find("li:first .imageInfo").clone();
        var tabs = this.find("li .imageInfo");
        tabs.each(function() {
            var tab = $(this);
            var img = tab.parent().children("img");
            img.data("title", tab.find(".title").html());
            img.data("description", tab.find(".description").text());
            img.data("name", tab.find(".name").text());
            tab.remove();
        });
        this.append(infoTab);
        var selectedImage = this.find("li:first img");
        setTabText(infoTab, selectedImage);
        infoTab.hover(showInfoTab, hideInfoTab);
        infoTab.oneTime(this.data("options").initialDelay, "tabHide", function() {
            infoTab.animate({ marginLeft: -infoTab.width() - 11 }, 500, "swing");
        });
    }

    function startSlideShow() {
        var obj = $(this);
        obj.everyTime(obj.data("options").timeout, "slideShowTimer", function() {
            var obj = $(this);
            var selectedIndex = obj.data("selectedIndex");
            var images = obj.find("li img");
            if (selectedIndex < images.length - 1) {
                selectedIndex++;
            } else {
                selectedIndex = 0;
            }
            showSlide.call(obj, selectedIndex);
        });
    }

    function showSlide(index) {
        var obj = $(this);
        var selectedIndex = obj.data("selectedIndex");
        if (selectedIndex == index) {
            return;
        }
        var images = obj.find("li img");
        images.eq(selectedIndex).fadeOut(obj.data("options").effectTime);
        images.eq(index).fadeIn(obj.data("options").effectTime);
        obj.data("selectedIndex", index);
        setTabText(obj.find(".imageInfo"), images.eq(index));
        var buttons = obj.find(".selectorButton");
        buttons.eq((buttons.length - 1) - selectedIndex).removeClass("selected");
        buttons.eq((buttons.length - 1) - index).addClass("selected");
    }

    function stopSlideShow() {
        $(this).stopTime("slideShowTimer");
    }

    function setTabText(infoTab, image) {
        infoTab.find(".title").html(image.data("title"));
        infoTab.find(".description").text(image.data("description"));
        infoTab.find(".name").text(image.data("name"));
    }

    function showInfoTab() {
        var infoTab = $(this);
        infoTab.stop();
        infoTab.stopTime("tabHide");
        infoTab.animate({ marginLeft: "0px" }, infoTab.parent().data("options").effectTime, "swing");
    }

    function hideInfoTab() {
        var infoTab = $(this);
        infoTab.oneTime(infoTab.parent().data("options").delay, "tabHide", function() {
            infoTab.animate({ marginLeft: -infoTab.width() - 11 }, 500, "swing");
        });
    }
})(jQuery);