/* ------------------------------ slideShow object ------------------------------ */
function Slideshow(slides, element, firstSlide){
	this.name=element.id
	this.slides=slides  
	this.element=$(element)
	this.firstSlide=(firstSlide && firstSlide!='')?firstSlide:Math.ceil(Math.random()*this.slides.length-1); //define the first element to be displayed
	this.rotatingInterval=5000 //define the interval between 2 elements in ms (by defaut: 5000ms)
	this.currentSlide=this.firstSlide
	this.fadeDuration=500 //define the duration of the fade effect interval in ms
	this.pictureElement
	this.indexesElement
	this.playElement
	this.rotatingTimer  
	this.autoPlay
	
	this.init() 
};
 
Slideshow.prototype.init = function(){
	var strOutput='<div id="'+this.name+'_picture" align="center"><br />'+this.slides[this.currentSlide]+'</div>'
	strOutput+='<br /><p align="center"><a href="javascript: '+this.name+'.rotate(-1);"><img src="images/slide/slide_previous.gif" border="0"></a>&nbsp;'
	strOutput+='<a id="'+this.name+'_play" href="javascript: '+this.name+'.setAutoPlay(true);"><img src="images/slide/slide_play.gif" border="0"></a>&nbsp;'
	strOutput+='<a href="javascript: '+this.name+'.rotate(1);"><img src="images/slide/slide_next.gif" border="0"></a>&nbsp;&nbsp;'
	strOutput+='<span id="'+this.name+'_indexes" style="font-size: 1em; color: #F8991D; margin-bottom: 5px;">'+(this.currentSlide+1)+'/'+(this.slides.length)+'</span>'
	//strOutput+='<span id="progress"><span class="bar"></span></span>'
	strOutput+='</p>'
	this.element.innerHTML=strOutput
	this.pictureElement=$(this.name+'_picture')
	this.indexesElement=$(this.name+'_indexes')
	this.playElement=$(this.name+'_play')
	/*bar = $E('#progress .bar')
	bar.setStyle('width', 10).setHTML(1 + ' / ' + this.slides.length);*/
	this.show()
}
  
Slideshow.prototype.setAutoPlay = function(newValue){
	if(newValue){
		this.autoPlay=true
		this.playElement.href="javascript: "+this.name+".setAutoPlay(false);"
		this.playElement.innerHTML='<img src="images/slide/slide_stop.gif" border="0">'
		this.show()
	} else {
		window.clearTimeout(this.rotatingTimer)
		this.autoPlay=false
		this.playElement.href="javascript: "+this.name+".setAutoPlay(true);"
		this.playElement.innerHTML='<img src="images/slide/slide_play.gif" border="0">'
	}
}
 
Slideshow.prototype.show = function(){
	window.clearTimeout(this.rotatingTimer)
	this.pictureElement.innerHTML=this.slides[this.currentSlide]
	this.indexesElement.innerHTML=(this.currentSlide+1)+'/'+(this.slides.length)
	new Fx.Style(this.pictureElement, 'opacity', {duration: this.fadeDuration, wait: false} ).start(1);  
	if(this.autoPlay) this.rotatingTimer=setTimeout("eval('"+this.name+".rotate(1)')", this.rotatingInterval)   		
}
 
Slideshow.prototype.hide = function(){
	var myName=this.name
	new Fx.Style(this.pictureElement, 'opacity', {duration: this.fadeDuration, wait: false} ).start(0).addEvent('onComplete', function() {eval(myName+'.show()')});
}

Slideshow.prototype.rotate = function(offSet){ 
	window.clearTimeout(this.rotatingTimer)
	var myNewSlide = eval(this.currentSlide+'+'+offSet); 
	if (myNewSlide < 0) myNewSlide = this.slides.length - 1 
	if (myNewSlide == this.slides.length) myNewSlide = 0 
	this.currentSlide = myNewSlide
	this.hide()
}
/* ------------------------------ slideShow object ------------------------------ */