jQuery.fn.extend({
    /**
    * Creates a carousel for all matched elements.
    *
    * @example $("#mymarguee").marguee();
    * @before <div id='mymarguee'><ul><li>First item</li><li>Second item</li></ul></div>
    * @result
    *   <div id='mymarguee'>
    *     <ul><li>First item<span>&bull;</span></li><li>Second item<span>&bull;</span></li></ul>
    *     <ul class='second'><li>First item<span>&bull;</span></li><li>Second item<span>&bull;</span></li></ul>
    *   </div>
    *
    * @name marguee
    * @type jQuery
    * @param Hash o A set of key/value pairs to set as configuration properties.
    * @cat marguee
    */
    marguee: function(o) {
        return this.each(function() {
            new jQuery.marguee(this, o);
        });
    }
});


jQuery.extend({
    /**
    * The jCarousel object.
    *
    * @constructor
    * @private
    * @name jQuery.marguee
    * @param Object e The element to create the marguee for.
    * @param Hash o A set of key/value pairs to set as configuration properties.
    * @cat marguee
    */
    marguee: function(e, o) {
        // Private methods/variables
        var priv = {
            o: {
                scrollSpeed: 100,
                shiftPixels: 5,
                separator: '&bull;'
            },
            movePixels: 0,

            init: function(e, o) {
                if (o)
                    jQuery.extend(priv.o, o);

                //TODO: impliment
                //$(e).after('<div id="ticker-right"></div><div id="ticker-left"></div>'); // divs to hold ticker fading

                var firstList = $(e).find('ul:first');
                priv.movePixels = priv.o.shiftPixels;

                var tickerWidth = 0;

                firstList.find('li').each(function() {
                if (priv.o.separator.length > 0) {
                        // using append() doesn't calculate correct width in Safari
                        $(this).html($(this).html() + '<span>&bull;</span>');
                    }
                    tickerWidth += $(this).outerWidth(true) +2;
                });


                var secondListHtml = '<ul class="second">' + firstList.html() + '</ul>';
                firstList.after(secondListHtml);

                var secondList = $(e).find('ul:last');
                var bothLists = $(e).find('ul');

                secondList.css({ left: tickerWidth })
                bothLists.css({ width: tickerWidth });

                $(e).hover(function() {
                    priv.movePixels = Math.round(priv.o.shiftPixels / 2);
                }, function() {
                    priv.movePixels = priv.o.shiftPixels;
                });

                setInterval(function() {
                    bothLists.each(function() {
                        var newLeft = $(this).position().left - priv.movePixels + 'px';
                        $(this).css({ left: newLeft });

                        var left = $(this).position().left;
                        if (left < tickerWidth * -1) {
                            // reset left if the ticker has finished
                            $(this).css({ left: tickerWidth });
                        }
                    });
                }, priv.o.scrollSpeed);

            }   // init
        }   // priv

        // Initialize the carousel
        priv.init(e, o);
    }
});