var SlideShow = Class.create({	
	
	initialize: function(container, options){

		// Ensure container exists
		if (!$(container)) { return false; }

		// Override default options
		this.options = Object.extend({
			delay: 5000
		}, options || {});
		this.container = container;
		
		// Get array of slides
		this.slides = $$('#'+this.container+' li');	
		
		// Stop this slideshow if there is only one slide
		if (this.slides.length<2) return false;
		
		// Set start and end frame
		this.startSlide = 0;
		this.endSlide = this.slides.length-1;
		
		// Hide extra slides
		this.hideSlides();
		
		// Start the slide show
		setTimeout(this.fadeInOut.bind(this,this.startSlide),this.options.delay);		
	},
	
	// Hide all but the first slide
	hideSlides: function() {
		var firstSlide = true;
		this.slides.each( function(slide) {
			if (!firstSlide) { slide.setStyle({ display:'none' }); }
			firstSlide = false;
		});		
	},
	
	// Fade from one frame to the next
	fadeInOut: function(slide) {
		Effect.Puff(this.slides[slide]);				 
		if (slide == this.endSlide) { slide = this.startSlide; } else { slide++; }
		Effect.Grow(this.slides[slide]);
		setTimeout(this.fadeInOut.bind(this,slide), this.options.delay + 1850);
	}		
});





// Global window onload
Event.observe(window,'load',function(){ 

	new SlideShow('box-1');
	new SlideShow('box-2');
	new SlideShow('box-3');		

	
});



// Global DOM onload
document.observe("dom:loaded", function() {


});