/**
 * Scroller plugin for jQuery
 *
 * Author: Ivar Larsson
 * © 2011 Krusell International AB
 *
 * Usage:
 * $('#container').scroller({
 * url: '' //Url to ajax resource containing the items
 * }
 */

(function ($){
    $.fn.scroller = function(options) {

        var me = $(this),
            itemWidth,
            itemCurrent = 0,
            itemTotal = 0,
            itemList,
            scrollTimer,
            isScrolling = true;

        var settings = jQuery.extend({
                animate: false,
                url: '',
                itemSelector: '#scroller > div',
                interval: 3000,
                showAllBtnSelector: '#scroller div .showAll',
                showAllCntSelector: '#scroller_showAll',
                itemWidth: 122
            }, options);


            //Pause the feed on mouseover. Resume onleave
        me.hover(function() {
            clearTimeout(scrollTimer);
            me.stop(true, true);
            me.parent().stop(true, true);
        }, function() {
            scrollTimer = setTimeout(scroll_repeatedly, settings.interval);;
        })

        $.ajax({
            url: settings.url,
            success: function( data ) {
                me.html(data);

                itemList = me.find(settings.itemSelector);
                itemList.css('width', settings.itemWidth);
                itemTotal = itemList.length;
                itemWidth = settings.itemWidth; //me.find(settings.itemSelector).outerWidth();
                itemShowAllCnt = $(settings.showAllCntSelector).hide();

                me.find(settings.showAllBtnSelector).click( show_all_toggle );
                scrollTimer = setTimeout(scroll_repeatedly, settings.interval);
                scroll_to(0);
            }
        });

        //Shows a drop down containing the items in the scroller
        function show_all_toggle()
        {
            clearTimeout(scrollTimer);
            var meOffset = me.position();

            if(isScrolling)
            {
                isScrolling = false;

                //Copy the full list, except the active item, to a new div and display it.
                itemShowAllCnt.html('');
                itemShowAllCnt.css('marginTop', itemWidth).css('width', itemWidth);
                itemShowAllCnt.css('top', meOffset.top).css('left', meOffset.left).css('visibility', 'visible');

                for(var i = 0; i < itemTotal; i++)
                {
                    if(i != itemCurrent)
                        itemList.slice(i, i+1).clone().css('clear', 'right').appendTo(itemShowAllCnt);
                }

                itemShowAllCnt.slideDown();
            }
            else
            {
                itemShowAllCnt.slideUp();
                me.animate({ height: itemWidth }, 500, function() {
                    me.find(settings.itemSelector).css('clear', 'none').css('float', 'left');
                    me.find(settings.showAllBtnSelector).show();
                    me.animate( { scrollLeft: (itemCurrent * itemWidth) }, 500 );
                });
                

                isScrolling = true;
                scrollTimer = setTimeout(scroll_repeatedly, settings.interval);
            }
        }

        //Repeatedly shows the content, one at a time
        function scroll_repeatedly()
        {
            if(itemCurrent + 1 >= itemTotal)
                itemCurrent = 0;
            else
                itemCurrent++;

            scroll_to(itemCurrent);

            scrollTimer = setTimeout(scroll_repeatedly, settings.interval);
        }

        function scroll_to()
        {
            if(settings.animate)
            {
                me.animate({ scrollLeft: itemCurrent * itemWidth}, 10, 'linear');//, function() {*/
                me.parent().animate({ height: $(itemList[itemCurrent]).height() + 25 }, 100);
            }
            else
            {
               me.scrollLeft(itemCurrent * itemWidth);
            }
        }
        return this;
    }
})( jQuery );
