/// <reference path="../Intellisense.js" />

Agility.RegisterNamespace("Microscan.HomeBanner");

(function(HomeBanner) {

    HomeBanner._getChild = function(idSuffix) {
        return $("#" + this._containerID + "_" + idSuffix);
    };

    HomeBanner.init = function(containerID, rotationInterval, bannerItemList) {
        this._containerID = containerID;
        this._scrollTime = rotationInterval;
        this._items = bannerItemList;
        this._itemIndex = 0;
        this._rotationInterval = null;
        this._carousel = null;
        // constants
        this.CONTROL_WIDTH = function() {
            return 28;
        };
        this.MODULE_WIDTH = function() {
            return 980;
        };
        this.IMAGE_WIDTH = function() {
            return 980;
        };
        this.IMAGE_HEIGHT = function() {
            return 275;
        };
        
        if (this._items.length > 1) {
            this._addControls();
            this._adjustControlsPosition();
			this._initCarousel();
            this.start();
        }
    };

    HomeBanner._addControls = function() {
        var controls = this._getChild("Controls");
        
        controls.setTemplateURL(Agility.ResolveUrl("~/ClientTemplates/SlideshowRotatorControls.html"));
        controls.processTemplate(this._items);
    };

    HomeBanner._bindControls = function(carousel) {
        var rotator = this,
			controls = this._getChild("Controls"),
            pauseButton = $(".PauseButton", controls),
            playButton = $(".PlayButton", controls),
            pages = $(".Page", controls);

		this._carousel = carousel;
			
        $(".PrevButton", controls).click(function () { rotator.prev(); });
        $(".NextButton", controls).click(function () { rotator.next(); });
        pauseButton.click(function () {
            rotator.stop();
            pauseButton.hide();
            playButton.show();
        });
        playButton.click(function () {
            rotator.start();
            playButton.hide();
            pauseButton.show();
        });
        pages.click(function () {
            var index = pages.index(this);
            rotator.moveTo(index, "scroll");
        });
        pages.hover(function () {
            var index = pages.index(this);
            rotator._showDescription(index, this);
        }, function () {
            rotator._hideDescription();
        });
    };

    HomeBanner._showDescription = function(index, page) {
        var text = this._items[index].Description,
            descriptionPopup = this._getChild("DescriptionPopup"),
            descriptionPopupTextContainer = $(".DescriptionPopup", descriptionPopup),
            containerPosition = this._getChild("Controls").position(),
            pagePosition = $(page).position();
        descriptionPopupTextContainer.html(text);
        descriptionPopup.css({
            top: containerPosition.top - descriptionPopup.height() - 7,
            left: containerPosition.left + pagePosition.left - descriptionPopup.width() / 2 + this.CONTROL_WIDTH() / 2
        });
        descriptionPopup.show();
    };

    HomeBanner._hideDescription = function() {
        var descriptionPopup = this._getChild("DescriptionPopup"),
            descriptionPopupTextContainer = $(".DescriptionPopup", descriptionPopup);
        descriptionPopup.hide();
        descriptionPopupTextContainer.text("");
    };

    HomeBanner._adjustControlsPosition = function() {
        var moduleWidth = this.MODULE_WIDTH(),
            controlWidth = this.CONTROL_WIDTH(),
            controls = this._getChild("Controls"),
            numControls = $(".Control", controls).length,
            totalControlWidth = numControls * controlWidth;
        controls.show();
    };

    HomeBanner._initCarousel = function() {
		var rotator = this;
		$(".SlideshowRotator").jcarousel({
			animation: "slow",
			initCallback: function(carousel) {
				rotator._bindControls(carousel);
			},
			scroll: 1,
			wrap: "circular"
		});
	};

	HomeBanner.start = function() {
        var rotator = this;
        _rotationInterval = setInterval(function () { rotator.next(); }, this._scrollTime * 1000);
    };

    HomeBanner.stop = function() {
        clearInterval(_rotationInterval);  
        _rotationInterval = null;
    };

    HomeBanner._resetRotationTime = function() {
        this.stop();
        this.start();
    };

    HomeBanner.next = function() {
        var currentIndex = this._itemIndex,
            itemCount = this._items.length,
            newIndex = (currentIndex + 1 < itemCount) ? currentIndex + 1 : 0;
        this.moveTo(newIndex, "next");
    };

    HomeBanner.prev = function() {
        var currentIndex = this._itemIndex,
            maxIndex = this._items.length - 1,
            newIndex = (currentIndex - 1 >= 0) ? currentIndex - 1 : maxIndex;
        this.moveTo(newIndex, "prev");
    };

    HomeBanner.moveTo = function(index, action) {
        if (index == this._itemIndex) return;
		
        this._itemIndex = index;
        //this._updateImageAndLink();
        this._resetRotationTime();

        var controls = this._getChild("Controls"),
			carousel = this._carousel,
            pages = $(".Page", controls),
            activePage = pages.eq(index);
			
        pages.removeClass("ActivePage");
        activePage.addClass("ActivePage");
		
		if (action == "scroll") {
			carousel.scroll(index + 1, true);		
		} else if (action == "next") {
			carousel.next();
		} else if (action == "prev") {
			carousel.prev();
		}
    };

    HomeBanner._updateImageAndLink = function() {
        var image = this._getChild("Image"),
			viewer = this._getChild("Viewer"),
            link = this._getChild("Link"),
            index = this._itemIndex,
            item = this._items[index];
			
		link.append($('<img />').attr('width', this.IMAGE_WIDTH()).attr('height', this.IMAGE_HEIGHT())
				.attr('src', item.Image.URL).attr('alt', item.Image.Label));
		
		viewer.animate({
			left: "-=" + this.IMAGE_WIDTH()
			}, {
			duration: 2500,
			queue: true,
			complete: function() {
				$('img:first', link).remove();
				viewer.css('left', '0px');
			}
		});
		
        link.attr("href", Agility.ResolveUrl(item.LinkUrl));
        link.attr("target", item.Target);
    };
}(Microscan.HomeBanner));