/*
    Scrolling widget used on the homepage.
*/
(function ($) {

/**
 * Wrapper around the $.fn.next function that wraps to the first matching 
 * sibling if next doesn't return any results.
 */
$.fn.next_wrap = function (selector) {
    var next = this.next(selector);
    if (!next.length) {
        next = this.siblings(selector + ':first');
    }
    return next;
};

/**
 * Controls the animation
 */
var goto_item = function ($prev, $next, options) {
    if ($prev[0] === $next[0]) {
        return;
    }
    
    $prev.data('link').removeClass(options.active_class);
    $next.data('link').addClass(options.active_class);
    
    $prev.animate({'left': '-=100%'}, function () {
        $(this).css('left', '100%');
    });
    $next.animate({'left': '-=100%'});
};

$.fn.banner = function (options) {
    
    options = $.extend({}, $.fn.banner.defaults, options);
    
    return this.each(function () {
        
        var $this = $(this),
            $nav = $('<div class="banner-nav" />');
        
        $this
            .bind('interval', function () {
                var interval = $(this).data('interval');
                
                if (interval) {
                    window.clearInterval(interval);
                }
                
                interval = window.setInterval(function () {
                    var $old = $current;
                    $current = $old.next_wrap('.banner-item');
                    goto_item($old, $current, options);
                }, options.duration);
                
                $(this).data('interval', interval);
            })
            .delegate('.banner-nav a', 'click', function (e) {
                var $old = $current;
                $current = $(e.target).data('item');
                goto_item($old, $current, options);
                $this.trigger('interval');
            })
            .append($nav);
        
        $this.find('.banner-list')
            .css({
                'position': 'relative',
                'width': 692,
                'height': 332,
                'overflow': 'hidden'
            });
        
        var $current = $this.find('.banner-item')
            .css({
               'position': 'absolute',
               'left': '100%'
            })
            .each(function () {
                var link = $('<a />');
                link.data('item', $(this));
                $(this).data('link', link);
                $nav.append(link);
            })
            .filter(':first');
        
        $current
            .css('left', 0)
            .data('link')
                .addClass(options.active_class);
        
        $this.trigger('interval');
        
        $nav.wrapInner('<div class="banner-nav-inner" />');
    });
};

$.fn.banner.defaults = {
    'duration': 5000,
    'active_class': 'active'
};

$(function () {
    $('#banner-widget').banner({'duration': 4000});
});

})(jQuery);