var LiSwitcher = function() {}
LiSwitcher.prototype = {
    initialize: function(VIEWPORT) {
        this.VIEWPORT = VIEWPORT;
        this.ITEMS = $(this.VIEWPORT).children("ul").children("li");
        this.INTERVAL = 5000;
        this.index = 0;
        var Scope = this;
        this.timer = setInterval(function() { Scope.nextImage(); }, this.INTERVAL);
        this.jsActive(this.CONTROLS, this.ITEMS);
        this.eventHandlers(this.PREVIOUS, this.NEXT);
    },
    
    jsActive: function(CONTROLS, ITEMS) {
        $(CONTROLS).show();
        $(ITEMS).not(":first").hide();
    },
    
    fadeIn: function(index) {
        this.ITEMS.eq(index).fadeIn(3000);
    },

    fadeOut: function(index) {
        this.ITEMS.eq(index).fadeOut(3000);
    },
    
    hide: function(index) {
        this.ITEMS.eq(index).hide();
    },    
    
    nextImage: function() {
        this.fadeOut(this.index);
        this.index++;
        if(this.index >= this.ITEMS.length) {
            this.index = 0;
        }
        this.fadeIn(this.index);
    },
    
    previousImage: function() {
        this.hide(this.index);
        this.index--;
        if(this.index <= -1) {
            this.index = this.ITEMS.length - 1;
        }
        this.fadeIn(this.index);
    
    },
    
    eventHandlers: function(PREVIOUS, NEXT) {
        var Scope = this;
        $(PREVIOUS).bind("click",function() {
            Scope.previousImage();
            clearInterval(Scope.timer);
            return false;
        });
        $(NEXT).bind("click",function() {
            Scope.nextImage();
            clearInterval(Scope.timer);
            return false;
        });
    }

};


var liSwitcher = new LiSwitcher();
var liSwitcher2 = new LiSwitcher();
$(function() {
	liSwitcher2.initialize("div.liSwitcher-large");
});