﻿// Rotator.js
/// <reference path="../../jQueryIntellisense.js"/>

/*
* jQuery Rotator Plugin
* Caudill Web
*/

(function ($) {

    $.fn.rotator = function (options) {

        this.each(function () {

            var defaults = {}
            var config = $.extend(defaults, options);

            // NAMED ELEMENTS

            var self = this, $self = $(this);
            var $rotatorPanels = $("div.RotatorPanel", $self);
            var panelCount = $rotatorPanels.length;
            var currentIndex = 0;
            var rotationCount = 0;

            // PRIVATE

            function transition(fromIndex, toIndex) {
                currentIndex = toIndex;
                $frame.animate({
                    top: -(toIndex * config.panelHeight) + "px"
                }, config.speed, "swing");
                $buttons.eq(fromIndex).removeClass("On");
                $buttons.eq(toIndex).addClass("On");
            }

            function handleMouse(event) {
                if (!config.ignoreMouse) cancelRotation(event);
            }

            function cancelRotation(event) {
                clearInterval(rotateInterval);
            }

            // INITIALIZATION

            // Wire up rotation
            $self.wrapInner("<div class='RotatorFrame' />");
            $self.wrapInner("<div class='RotatorInner' />");
            var padBottom = config.padBottom || 0;
            $self.css("height", (config.panelHeight + padBottom) + "px");
            var $inner = $("div.RotatorInner", $self)
                .css("height", config.panelHeight + "px")
            var $frame = $("div.RotatorFrame", $self)
                .css("height", (config.panelHeight * panelCount) + "px")
                .css("width", config.panelWidth + "px");
            $rotatorPanels
                .css("height", config.panelHeight + "px")
                .css("width", config.panelWidth + "px")
                .show();
            var rotateInterval = setInterval(function () {
                if (++rotationCount > config.maxCycles * panelCount) {
                    cancelRotation();
                } else {
                    var newIndex = (currentIndex == panelCount - 1) ? 0 : currentIndex + 1;
                    transition(currentIndex, newIndex);
                }
            }, config.delay);

            // Cancel rotation on mouseover or click
            $self.bind("mouseover", handleMouse);
            $(document).bind("click", handleMouse);

            // Add buttons
            var $rotatorButtons = $("<div class='RotatorButtons' />");
            $rotatorPanels.each(function (i, value) {
                var $button = $("<a href='#'><span></span></a>");
                $button.find("span").text(i + 1);
                $rotatorButtons.append($button);
            });
            $self.append($rotatorButtons);
            var $buttons = $rotatorButtons.find("a");
            $buttons.eq(0).addClass("On");
            $buttons.bind("click", function (event) {
                var $button = $(this);
                var newIndex = parseInt($button.text()) - 1;
                transition(currentIndex, newIndex);
                event.preventDefault();
            });

        }); // each

    }; // $.fn.Rotator 

})(jQuery);


