var Slideshow = Class.create();
var currentPicture = 0;

Slideshow.prototype = {
	initialize: function(el, options) {
		this.timer;
		this.timerFade;
		this.setOptions(options);
		this.carouselEl		= $(el);	// Identifiant du carousel
		this.pictures = $A(this.carouselEl.getElementsByClassName(this.options.source_class)); // Recheche des elements
		// Affichage de la premiere page
		this.initPictures();
		this.seePicture(this, 0);
	},
	// Initialise les options si necessaire
	setOptions: function(options) {
		this.options = {
			target:        'carousel_scene',
			source_class:  'carousel_picture',
			idDomEcran:    'slideImage',
			idDomLegend:   'slideLegend',
			idDomCommand:  'slideCommand',
			delai:         4000
		}
		Object.extend(this.options, options || {});
	},
	// Branche le click sur les images
	initPictures: function(){
		if (this.pictures) {
			for(var i=0; i < this.pictures.length; i++){
				Event.observe(this.pictures[i], "click", this.seePicture.bindAsEventListener(this, i));
			}
		}
	},
	// Affiche une image sur la sc�ne � partir d'un num�ro
	seePicture: function(obj, pictureNum){
		this.stopDefile();
		currentPicture = pictureNum;
		this.startDefile();
		
		/*
		var picture = this.pictures[pictureNum];
		var scene = $(this.options.target);
		
		if (picture && scene) {
			this.circlePicture(pictureNum);
			var big_image_src = picture.src.replace("thumbnail/","");
			var legend 		  = picture.alt;
			scene.innerHTML = '<img src="'+big_image_src+'" border="0"><p class="legend">'+legend+'</p>';
		}
		*/
	},
	
	// Affiche l'image courante sur la scene
	seeCurrentPicture: function(){
		var picture = this.pictures[currentPicture];
		var scene = $(this.options.target);
		var ecran 	= $(this.options.idDomEcran);
		var legende = $(this.options.idDomLegend);
		
		appear = new Effect.Appear(ecran, {duration:1, fps:25, from:0.5, to:1.0});		
		if (picture && scene) {
			this.circlePicture(currentPicture);
			var big_image_src = picture.src.replace("thumbnail/","");
			var legend 		  = picture.alt;
			ecran.src = big_image_src;
			legende.innerHTML = legend;
			//scene.innerHTML = '<img src="'+big_image_src+'" border="0"><div class="slideFooter"><p class="legend">'+legend+'</p><a href="void 0;" id="slideCommand" class="pause" title="Pause" onClick="javascript:slideshow.toogleDefile(this);">&nbsp;</a><div class="clear"></div></div>';
		}	
		this.timerFade = window.setTimeout('new Effect.Fade(slideshow.options.idDomEcran, {duration:1, fps:25, from:1.0, to:0.5})',this.options.delai-1000);
		if (currentPicture >= this.pictures.length - 1) currentPicture = 0;
		else currentPicture++;
		
		this.timer = window.setTimeout('slideshow.seeCurrentPicture()',this.options.delai);
	},
/*	
	defile: function(){
		this.timer = window.setTimeout('slideshow.seeCurrentPicture()',5);
	},
*/

	startDefile: function(){
		aCommand = $(this.options.idDomCommand);
		aCommand.className 	= 'pause';		
		aCommand.title		= 'Pause';	
		aCommand.firstDescendant().src = '/images/carousel/pause.gif';	
		this.seeCurrentPicture();
		
	},
	
	stopDefile: function(){
		aCommand = $(this.options.idDomCommand);
		//aCommand = document.getElementById(this.options.idDomCommand);
		aCommand.className = 'play';	
		aCommand.title		= 'Défile';
		aCommand.firstDescendant().src = '/images/carousel/play.gif';
		window.clearTimeout(this.timerFade);
		window.clearTimeout(this.timer);
	},
	
	toogleDefile: function(aCommand){
		if(aCommand.className == 'play'){
			this.startDefile();
			//aCommand.className 	= 'pause';
			//aCommand.title		= 'Pause';
 		}
		else {
			this.stopDefile();
			//aCommand.className = 'play';
			//aCommand.title		= 'Défile';
		}
	},
	
	circlePicture: function(pictureNum){
		for(var i=0; i <this.pictures.length;i++) {
			var picture = this.pictures[i];
			if (i == pictureNum) {
				picture.style.border = "1px solid #FF0000";
			}
			else {
				picture.style.border = "1px solid #EFEBDC";
			}
		}
	}
}