var delay = 4500;	// miliseconds used as delay between slides

var animationTime = 2500;

var container;

var numSlides; // total number of slides

var currentSlide = 0;


var slider = {
	container : null,

	nextSlide : 0,	// whats the next slide? well for starters allways 0, because the last object is the first image displayed

	numSlides : 0,

	init : function() {
		this.container.find("div.slide").last().addClass("current").css({ 'z-index' : 4 });

		this.container.find("div.slide").not(".current").css({ 'opacity' : 0, 'z-index' : 3 });
	},

	whatsNext : function() {
		if( currentSlide == (numSlides-1) ) {
			this.nextSlide = 0;
		} else {
			this.nextSlide = currentSlide + 1;
		}
	},

	next : function() {
		this.whatsNext();

		allSlides = this.container.find("div.slide").toArray();

		// fade new in
		$(allSlides[ slider.nextSlide ]).stop().animate({ 'opacity' : 1 }, { duration : animationTime, complete : function(){ $(this).css({ 'z-index' : 4 }); } });

		// fade current out
		//this.container.find("div.current").stop().animate({ 'opacity' : 0 }, animationTime).removeClass("current");
		this.container.find("div.current").stop().animate({ 'opacity' : 0 }, { duration : animationTime, complete : function(){ $(this).css({ 'z-index' : 3 }); } }).removeClass("current");

		// new div, current class
		$(allSlides[ slider.nextSlide ]).addClass("current");

		currentSlide = slider.nextSlide;
	}
};


$(document).ready(function(){
	container = $(".slider-container");	// the container with the slider in it
	slider.container = container;	// add reference to the container in the slider object
	
	numSlides = container.find("div.slide").length;	// total number of slides
	slider.numSlides = numSlides;

	currentSlide = (numSlides-1); // the first slide is always the last object

	slider.init();

	slideInterval = setInterval( "slider.next()", delay );

});
