JavaScript snippet to turn a LightSwitch List into a Slider.

switchtory.lightswitchslider.js

/// <reference path="jquery-1.7.1.js" />
/// <reference path="jquery.mobile-1.1.1.js" />
/// <reference path="msls-1.0.0.js" />

(function ($) {

    $.widget("switchtory.lightswitchSlider", {
        options: {
            timerInterval: 4000
        },

        _create: function () {
        },

        _init: function () {
            this.totalChildren = 0;
            this.currentIndex = 0;
            this.elementsToSlide = undefined;
            this.mainHtmlElement = this.element[0];
            this.visualCollection = undefined;
        },

        destroy: function () {
        },

        bindToList: function (contentItem) {
            if (!contentItem.kind == "Collection") {
                alert('Pass me a contentItem bound to a collection please');
            }
            this.visualCollection = contentItem.value;
        },

        render: function (contentItem) {
            if (!this.visualCollection.isLoaded) {
                alert('Cannot render before the collection is loaded');
            }
            this.currentIndex = 0;

            if (contentItem.value == $(this.visualCollection.data).last()[0]) {
                var slider = this;
                slider.totalChildren = slider.visualCollection.count;
                slider.elementsToSlide = $(slider.mainHtmlElement).children("div").children("ul").children("li");

                slider.elementsToSlide.each(function () { $(this).hide(); });
                slider.elementsToSlide.first().fadeIn('slow', function () { slider._slideToNext(); });
            }
        },


        //recursive function that "slides" to the next sibling 
        _slideToNext: function () {
            var slider = this;
            if (slider.totalChildren != 0) {
                setTimeout(function () {
                    $($(slider.elementsToSlide).get(slider.currentIndex)).fadeOut('slow', function () {
                        slider.currentIndex = ++slider.currentIndex % slider.totalChildren;
                        $($(slider.elementsToSlide).get(slider.currentIndex)).fadeIn('slow');
                    });
                    slider._slideToNext();
                }, slider.options.timerInterval);
            }
        }
    });

}(jQuery));