﻿window.boots = {};
window.boots.promotion = {};
boots.promotion = {
    init: function() {
        var themedPromos = $("div.bootsPromotion");
        var themedCarousels = $("div.bootsPromotionCarousel");
        for (var i = themedPromos.length - 1; i >= 0; i--) {
            boots.promotion.themedPromo = new boots.promotion.ThemedPromo(themedPromos[i], false);
        }
        for (var i = themedCarousels.length - 1; i >= 0; i--) {
            boots.promotion.themedCarousel = new boots.promotion.ThemedPromo(themedCarousels[i], true);
            //boots.promotion.themedCarousel = new boots.promotion.ThemedCarousel(themedCarousels[i]);
        }
    },
    ThemedPromo: function(ThemedPromo, paused) {
        var isPlaying = false;
        var isAnimating = false;
        var isDirect = false;
        var currentItem = 1;
        var nextItem = 2;
        var maxItems = 4;
        var pauseTimer = 3000;
        var animateTimer = 3000;
        var highestZindex = 0;
        var inicatorPositions = ["0", "35px", "58px", "81px", "103px"];
        var init = (function() {
            var promotionHolder = ThemedPromo;
            var promotionHolders = $(ThemedPromo).find(".bootsPromotionHolder ul li.panel");
            maxItems = (promotionHolders.length < maxItems) ? promotionHolders.length : maxItems;
            if ((promotionHolder == null) || (maxItems <= 1)) {
                return;
            } else if (maxItems == 2) {
                $(ThemedPromo).addClass("twoItems");
            }
            $(promotionHolder).prepend("<div class=\"bootsPromotionControls\"></div>");
            $(ThemedPromo).find(".bootsPromotionControls").append("<div class=\"indicator\">&nbsp;</div>");
            $(ThemedPromo).find(".bootsPromotionControls").append("<ul></ul>");
            var count = 1;
            $(promotionHolders).each(function() {
                if (count <= maxItems) {
                    $(ThemedPromo).find(".bootsPromotionControls ul").append("<li><a href=\"#" + count + "\""
						+ ((count == 1) ? " class=\"current\"" : "")
						+ ">" + count + "</a></li>");
                    $(this).css({
                        position: "absolute",
                        top: 0,
                        left: 0,
                        display: ((count == 1) ? "block" : "none"),
                        zIndex: count++
                    });
                } else {
                    $(this).remove();
                }
            });
            $(ThemedPromo).find(".bootsPromotionControls").append("<div class=\"pausePlay Pause\"><strong>Pause</strong><span>&#160;</span></div>");
            $(ThemedPromo).find(".pausePlay").click(pausePlay);
            if (jQuery.browser.opera) {
                $(ThemedPromo).find(".pausePlay").css({ top: "-18px" });
            }
            if (maxItems == 2) {
                $(ThemedPromo).find(".pausePlay").css({ left: "97px" });
            }
            $(ThemedPromo).find(".bootsPromotionControls li a").click(tp_gothere);
            if (paused) {
                $(ThemedPromo).find(".pausePlay").removeClass("Pause").addClass("Play").find("strong").text("Play");
            } else {
                isPlaying = true;
            }
            wait();
        })();
        function pausePlay() {
            var whatAction = $(this).find("strong").text();
            if (whatAction == "Pause") {
                $(this).removeClass("Pause").addClass("Play");
                $(this).find("strong").text("Play");
                pause();
            } else {
                $(this).removeClass("Play").addClass("Pause");
                $(this).find("strong").text("Pause");
                play();
            }
            $(this).blur();
        }
        function play() {
            isPlaying = true;
            animate();
        }
        function pause() {
            isPlaying = false;
        }
        function tp_gothere() {
            var goWhere = $(this).text();
            $(ThemedPromo).find(".pausePlay").removeClass("Pause").addClass("Play");
            $(ThemedPromo).find(".pausePlay").find("strong").text("Play");
            isPlaying = false;
            window.clearTimeout();
            $(ThemedPromo).find(".bootsPromotionHolder ul li.panel").stop();
            $(ThemedPromo).find(".bootsPromotionHolder ul li.panel").css({ opacity: "" });
            $(ThemedPromo).find(".indicator").stop();
            nextItem = $(this).text();
            isDirect = true;
            animate();
            $(this).blur();
            return false;
        }
        function animate() {
            if (!isDirect) {
                if (isAnimating || !isPlaying) {
                    return;
                }
            }
            isDirect = false;
            isAnimating = true;
            $(ThemedPromo).find(".bootsPromotionControls ul li a").removeClass("current");
            $(ThemedPromo).find(".bootsPromotionHolder ul li.panel").each(function() {
                highestZindex = ($(this).css("zIndex") > highestZindex) ? $(this).css("zIndex") : highestZindex;
            });
            var count = 1;
            $(ThemedPromo).find(".bootsPromotionHolder ul li.panel").each(function() {
                if (count++ == nextItem) {
                    $(this).css({
                        zIndex: ++highestZindex
                    }).fadeIn(animateTimer, function() {
                        $(ThemedPromo).find(".bootsPromotionHolder ul li.panel").each(function() {
                            if ($(this).css("zIndex") != highestZindex) {
                                $(this).css({ display: "none" });
                            }
                        });
                        $(ThemedPromo).find(".bootsPromotionControls ul li a").each(function() {
                            if ($(this).text() == nextItem) {
                                $(this).addClass("current");
                            }
                        });
                        nextItem = ((nextItem + 1) > maxItems) ? 1 : ++nextItem;
                        isAnimating = false;
                        if (isPlaying) {
                            wait();
                        }
                    });
                    $(ThemedPromo).find(".indicator").animate({ left: inicatorPositions[nextItem] }, animateTimer);
                }
            });
        }
        function wait() {
            window.setTimeout(animate, pauseTimer);
        }
    },
    ThemedCarousel: function(ThemedCarousel) {
        var isAnimating = false;
        var currentItem = 1;
        var maxItems = 3;
        var animateTimer = 3000;
        var highestZindex = 0;
        $(ThemedCarousel).prepend("<div class=\"bootsPromotionCarouselControls\"></div>");
        $(ThemedCarousel).find(".bootsPromotionCarouselControls").append("<ul><li class=\"back\"><a href=\"#back\"><img src=\"" + boots.common.siteConfig.imageDirectoryURL + "btn_back01.png\" width=\"23\" height=\"42\" alt=\"back\" /></a></li><li class=\"forward\"><a href=\"#forward\"><img src=\"" + boots.common.siteConfig.imageDirectoryURL + "btn_forward01.png\" width=\"23\" height=\"42\" alt=\"forward\" /></a></li></ul>");
        $(ThemedCarousel).find(".back a").click(goBack);
        $(ThemedCarousel).find(".forward a").click(goForward);
        var count = 1;
        $(ThemedCarousel).find(".bootsPromotionHolder ul li.panel").each(function() {
            if (count <= maxItems) {
                $(this).css({
                    position: "absolute",
                    top: 0,
                    left: 0,
                    display: ((count == 1) ? "block" : "none"),
                    zIndex: count++
                });
            } else {
                $(this).remove();
            }
        });

        $(document).pngFix();

        function goBack() {
            if (!isAnimating) {
                currentItem = (currentItem == 1) ? maxItems : currentItem - 1;
                fadeNewItem();
            }
            return false;
        }
        function goForward() {
            if (!isAnimating) {
                currentItem = (currentItem == maxItems) ? 1 : currentItem + 1;
                fadeNewItem();
            }
            return false;
        }
        function fadeNewItem() {
            if (!isAnimating) {
                isAnimating = true;
                $(ThemedCarousel).find(".bootsPromotionHolder ul li.panel").each(function() {
                    highestZindex = ($(this).css("zIndex") > highestZindex) ? $(this).css("zIndex") : highestZindex;
                });
                var count = 1;
                $(ThemedCarousel).find(".bootsPromotionHolder ul li.panel").each(function() {
                    if (count++ == currentItem) {
                        $(this).css({
                            zIndex: ++highestZindex
                        }).fadeIn(animateTimer, function() {
                            $(ThemedCarousel).find(".bootsPromotionHolder ul li.panel").each(function() {
                                if ($(this).css("zIndex") != highestZindex) {
                                    $(this).css({ display: "none" });
                                }
                            });
                            isAnimating = false;
                        });
                    }
                });
            }
            $(ThemedCarousel).find("a").blur();
        }
    }
};
$(document).ready(function() {
    boots.promotion.init();
});


