/*
* jquery.contentFlipper.js (version 1.0)
*
* Flips through content blocks with dot navigation.
*
* JavaScript:
* $('#Box').contentFlipper();
*
* Requires: jQuery 1.3.2
*
* I made this. (SmallSharpTools.com - 2009)
*
* License: Creative Commons
*
*/

(function($) {

    $.fn.contentFlipper = function(options) {

        var opts = $.extend({}, $.fn.contentFlipper.defaults, options);

        return this.each(function() {
            var context = $(this);
            var currentIndex = opts.initialIndex;
            var length = $(opts.itemSelector, context).length;
            var delay = 350;
            var isWorking = false;

            $(opts.itemSelector, context).eq(opts.initialIndex).fadeIn(500);

            var showItem = function(index) {
                if (isWorking) {
                    return;
                }
                isWorking = true;
                if (index !== currentIndex && index < length) {
                    currentIndex = index;
                    if ($.isFunction(opts.indexChangedCallback)) {
                        opts.indexChangedCallback(index);
                    }
                    var visible = $(opts.itemSelector + ':visible', context);

                    var showNext = function() {
                        $(opts.dotsSelector, context).removeClass('Active');
                        $(opts.dotsSelector + ':eq(' + index + ')', context).addClass('Active');
                        $(opts.itemSelector + ':eq(' + index + ')', context).fadeIn(delay, function() {
                            $(opts.itemSelector, context).not(':eq(' + currentIndex + ')').hide();
                            isWorking = false;
                        });
                    };

                    if (visible.length > 0) {
                        $(visible).fadeOut(delay, showNext);
                    }
                    else {
                        showNext();
                    }
                }
            };

            var goLeft = function() {
                if (currentIndex > 0) {
                    showItem(currentIndex - 1);
                }
                else {
                    showItem(length - 1);
                }
            };

            var goRight = function() {
                if (currentIndex < (length - 1)) {
                    showItem(currentIndex + 1);
                }
                else {
                    showItem(0);
                }
            };

            $(opts.dotsSelector + ':eq(' + currentIndex + ')', context).addClass('Active');

            $(opts.leftSelector, context).click(function(e) {
                if ('A' === this.nodeName) {
                    $(this).blur();
                }
                goLeft();
                e.preventDefault();
            });

            $(opts.rightSelector, context).click(function(e) {
                if ('A' === this.nodeName) {
                    $(this).blur();
                }
                goRight();
                e.preventDefault();
            });

            $(opts.leftSelector, context).dblclick(function(e) {
                if ('A' === this.nodeName) {
                    $(this).blur();
                }
                showItem(0);
                e.preventDefault();
            });

            $(opts.rightSelector, context).dblclick(function(e) {
                if ('A' === this.nodeName) {
                    $(this).blur();
                }
                showItem(length - 1);
                e.preventDefault();
            });

            var index = 0;
            $(opts.dotsSelector, context).each(function() {
                var i = index;
                $(this).click(function(e) {
                    if ('A' === this.nodeName) {
                        $(this).blur();
                    }
                    showItem(i);
                    e.preventDefault();
                });
                index++;
            });
        });

    };

    // publicly accessible defaults
    $.fn.contentFlipper.defaults = {
        initialIndex: 0,
        itemSelector: 'div.Item',
        leftSelector: 'a.Left',
        rightSelector: 'a.Right',
        dotsSelector: 'div.Dots a',
        indexChangedCallback: function() { }
    };

})(jQuery);