"use strict";

jQuery.fn.promo_slider = function (opts) {
    var animateSpeed = opts.animateSpeed || 1000,
        perPage = opts.perPage || 1,
        itemClass = opts.itemClass || 'slide',
        leftButton = opts.leftButton || '',
        rightButton = opts.rightButton || '',
        pauseButton = opts.pauseButton || '||',
        playButton = opts.playButton || '›',
        obj = this,
        pageWidth = 0,
        showButtons = opts.showButtons || false;


    // SETUP
    var moveTimeOut = null;

    //Group the contents into per-page groups.
    this.canvas = jQuery('<div class="slides"></div>');

    jQuery('.' + itemClass, obj).each(function (i) {
        if (i === 0 || i % perPage === 0) {
            obj.canvas.append(jQuery('<div class="page"></div>'));
        }
        jQuery(this).detach();
        jQuery('div.page:last', obj.canvas).append(jQuery(this));
    });

    jQuery(this).append(obj.canvas);

    jQuery(this).wrapInner('<div class="stage"></div>');

    jQuery(this).addClass('scroller');

    pageWidth = jQuery('.page', obj).outerWidth();

    jQuery('.page', obj).each(function (i) {
        jQuery(this).css({ left: (i * pageWidth) + 'px', position: 'absolute' });
    });

    obj.pages = jQuery('.page', obj).get();

    if ((obj.pages.length > 1) && showButtons) {
        jQuery(this).prepend(jQuery('<a class="pause-button" href="#"><span>Pause</span></a>'));
        jQuery(this).prepend(jQuery('<a class="play-button" href="#"><span>Play</span></a>').hide());
        jQuery(this).prepend(jQuery('<a class="right-button" href="#"<span>' + rightButton + '</span></a>'));
        jQuery(this).prepend(jQuery('<a class="left-button" href="#"<span>' + leftButton + '</span></a>'));
        setScroller();
    }

    function setScroller() {
        moveTimeOut = setInterval(function () {
            obj.movePage(-1);
        }, 8000);
    }

    // FUNCTIONS
    obj.movePage = function (direction) {
        var canvas = jQuery('.slides', obj),
            curLeft = canvas.position().left;

        if (obj.inMotion) {
            return false;
        }

        obj.inMotion = true;

        if (direction === 1) {
            obj.pageRight();
            canvas.animate({ left: (curLeft + (pageWidth * direction)) + 'px' }, { duration: animateSpeed, complete: obj.motionComplete });
        }
        else {
            //obj.pageLeft();
            canvas.animate({ left: (curLeft + (pageWidth * direction)) + 'px' }, { duration: animateSpeed, complete: obj.pageLeft });
        }
        return false;
    };

    obj.motionComplete = function () {
        obj.inMotion = false;
    };

    obj.pageLeft = function () {
        //take leftmost page, move it to the right end.        
        var page = obj.pages.shift(),
            rightMost = jQuery(obj.pages[obj.pages.length - 1]).position();

        jQuery(page).css({ left: (rightMost.left + pageWidth) });
        obj.pages.push(page);
        obj.motionComplete();
    };

    obj.pageRight = function () {
        //take rightmost page, move it to the left end.
        var page = this.pages.pop(),
            leftMost = jQuery(this.pages[0]).position();

        jQuery(page).css({ left: (leftMost.left - pageWidth) });
        this.pages.unshift(page);
    };

    obj.inMotion = false;

    jQuery('.left-button', this).click(function () {
        obj.movePage(1);
        return false;
    });

    jQuery('.right-button', this).click(function () {
        obj.movePage(-1);
        return false;
    });

    jQuery('.pause-button', this).click(function () {
        clearInterval(moveTimeOut);
        $(this).hide();
        jQuery('.play-button').show();
        return false;
    });

    jQuery('.play-button', this).click(function () {
        obj.movePage(-1);
        setScroller();
        $(this).hide();
        jQuery('.pause-button').show();
        return false;
    });
};