/**
 * Diaporama Javascript d'images
 * 
 * Pour lancer le diaporama, faire appel à la méthode Diapo.init( id_conteneur, chemin_repertoire_images, duree_timeur, duree_fondu )
 *
 *   /!\ Nécessite la librairie prototype.js
 *     ainsi que le framework scriptaculous.js
 */
var Diapo = {
	
	// Elément conteneur du diaporama
	_container: null,
	
	// Temps en millisecondes avant un changement d'image
	_timerDuration: null,
	
	// Durée en secondes de la fondu entre les images
	_fadeDuration: null,
	
	// Numéro du conteneur de l'image courante (celle affichée) [ 0 ou 1 ]
	_current: null,
	
	// Numéro du conteneur de l'image suivante (prochaine affichée) [ 0 ou 1 ]
	_next: null,
	
	// Vaut true si l'effet de disparistion est en cours, false sinon [ true ou false ]
	_fadeOn: null,
	
	// Vaut true si l'effet d'apparition est en cours, false sinon [ true ou false ]
	_appearOn: null,
	
	// Tableaux des images du diaporama
	_images: null,
	
	// Index indiquant l'image courante dans le tableau _images
	_index: null,
	
	// Timeur
	_timer: null,
	
	
	// Méthode d'initialisation du diaporama
	init: function (container, dir, timerDuration, fadeDuration) {
		this._container = $(container);
		this._timerDuration = timerDuration;
		this._fadeDuration = fadeDuration;
		this._current = 0;
		this._next = 1;
		this._fadeOn = false;
		this._appearOn = false;
		this._images = new Array();
		this._index = 0;
		this.initTimer();
		
		new Ajax.Request('js/util/getImagesDiapo.php', {
			method: 'post',
			postBody: 'dir=' + encodeURIComponent(dir) + '&ajax=1',
			onComplete: function (xhr) {
				if (xhr.status == 200) {
					if (xhr.responseText != '') {
						var files = xhr.responseText.split(';');
						Diapo.preloadImg(files, 0);
					}
					else
						alert('Erreur : aucune image dans le dossier spécifié !');
				}
				else
					alert('Erreur lors du chargement des images du diapo !');
			}
		});
	},
	
	
	// Méthode d'initialisation du timer
	initTimer: function () {
		if (this._timer != null) {
			clearTimeout(this._timer);
		}
	},
	
	
	// Méthode pour le préchargement des images
	preloadImg: function (files, i) {
		var img = new Image();
		
		img.onload = function () {
			Diapo._images.push( {src: img.src, width: img.width, height: img.height} );
			if (i < files.length - 1)
				Diapo.preloadImg(files, ++ i);
			else
				Diapo.displayFirst();
		}
		
		img.src = files[i];
	},
	
	
	// Méthode pour le premier affichage du diaporama
	displayFirst: function () {
		var c = this._container;
		var styles = 'position: absolute; top: 0; left: 50%; display: none;';
		c.innerHTML = '<img alt="" style="' + styles + '" /><img alt="" style="' + styles + '" />';
		//c.style.cssText = 'position: relative; width: 100%; height: 100%; margin: auto;';
		this.setCurrentImg( c.childNodes[this._current] );
		this.setNextImg( c.childNodes[this._next] );
		c.childNodes[this._current].style.display = '';
		
		this._timer = setTimeout('Diapo.next()', this._timerDuration);
	},
	
	
	// Méthode pour le passage à l'image suivante
	next: function () {
		if ( !this._fadeOn && !this._appearOn ) {
			var curImg = this._container.childNodes[this._current];
			var nextImg = this._container.childNodes[this._next];
			var tmp = this._next;
			
			this._fadeOn = true;
			this._appearOn = true;
			this._next = this._current;
			this._current = tmp;
			this.incrementeIndex();
			
			new Effect.Fade( curImg, {duration: Diapo._fadeDuration, afterFinish: function () {
				Diapo.setNextImg(curImg);
				Diapo._fadeOn = false;
			}} );
			new Effect.Appear( nextImg, {duration: Diapo._fadeDuration, afterFinish: function () {
				Diapo.setCurrentImg(nextImg);
				Diapo._appearOn = false;
			}} );
		}
		
		this._timer = setTimeout('Diapo.next()', this._timerDuration);
	},
	
	
	// Méthode pour la modification de l'image courante
	setCurrentImg: function (img) {
		img.src = this._images[this.getCurrentIndex()].src;
		//img.style.marginTop = ( -(this._images[this.getCurrentIndex()].height / 2) ) + 'px';
		img.style.marginLeft = ( -(this._images[this.getCurrentIndex()].width / 2) ) + 'px';
	},
	
	
	// Méthode pour la modification de l'image suivante
	setNextImg: function (img) {
		img.src = this._images[this.getNextIndex()].src;
		//img.style.marginTop = ( -(this._images[this.getNextIndex()].height / 2) ) + 'px';
		img.style.marginLeft = ( -(this._images[this.getNextIndex()].width / 2) ) + 'px';
	},
	
	
	// Méthode pour l'incrémentation de l'index (avec gestion passage fin<->début)
	incrementeIndex: function () {
		if ( ++ this._index >= this._images.length ) this._index = 0;
	},
	
	
	// Méthode retournant l'index courant
	getCurrentIndex: function () {
		return this._index;
	},
	
	
	// Méthode retournant l'index suivant (avec gestion passage fin<->début)
	getNextIndex: function () {
		return (this._index + 1 < this._images.length ? this._index + 1 : 0);
	}
	
}