var SlideShow = Class.create({

	
	
	initialize : function( cfg )
	{
		this.C = $(cfg.containerEl);
		this.slides = this.C.select('.slide');
		this.height = cfg.height;
		this.mouseOver = false;
		this.delay = cfg.delay ? cfg.delay : 5000;
		this.currentSlideIdx = Math.floor( Math.random() * this.slides.length );
		
		
		this.C.setStyle( {
			height: this.height + "px" ,
			overflow: "hidden"

		});
		
		this.slides.each( function(e){
			e.hide();															 
			e.removeClassName('hidden');
//		 	e.setStyle( {display:'block',backgroundColor:"#ffffff"} )

			
		 });
		 
		this.slides[this.currentSlideIdx].show();
		
			setTimeout( this.run.bind(this) , this.delay/2)

	
	},
	
	run : function()
	{
		var current = this.slides[ this.currentSlideIdx++ ];
		if ( this.currentSlideIdx >= this.slides.length ) this.currentSlideIdx = 0;
		var next = this.slides[ this.currentSlideIdx ];
		new Effect.Fade( current, { afterFinish: 
			function(){ 
				new Effect.Appear(next)
			} 
		});
		
		setTimeout( this.run.bind(this) , this.delay)

	}
	
})