// ***************************************************************************
// ** Paramètres de l'animation                                             **
// ***************************************************************************
var delaiChangerImage = 1500; // Delai en miliseconde entre chaque transition
var vitesseTransition = 15; // Vitesse de la transition (nombre petit = vite)
var nbDegreOpaciteAPasser = 70; // Nombre de degré d'opacités à passer - 0 à 100
                                // (nombre petit = vite)
// ***************************************************************************

var nbImages = 0; // Nombre d'images ajoutées (méthode ajouterImage)
var posImageCourante = 0; // Position de l'image courante dans le Array "images"
var images = new Array();

var enTransition = false;
var opaciteImageCourante = nbDegreOpaciteAPasser;
var opaciteProchaineImage = 0;
var imageCourante; // Objet image courant
var prochaineImage; // Objet de la prochaine image
var typeDeNavigateur;

// Ajoute une image à la suite de la transition 
// param idImage  id de l'image sur la page web
function ajouterImage(idImage) {
	var image;
 	if (document.layers)
		image = document.layers[idImage];
	else if (document.all)
		image = document.all[idImage];
	else if (document.getElementById)
		image = document.getElementById(idImage);
 
 	if (image != null) {
		nbImages++;
		images[nbImages-1] = image;
	}
}

// Initialise les images pour la transition
function initialiserTransitions() {
	
	if (nbImages > 0) {
	
		// ***************************************************************
		// DEBUT du code inspiré du site 
		// http://www.brothercake.com/site/resources/scripts/transitions/
		// ***************************************************************

		// Choisi le type d'opacité pour le type de navigateur
		if(typeof images[0].style.opacity != 'undefined') {
			typeDeNavigateur = 'w3c';
		}
		else if(typeof images[0].style.MozOpacity != 'undefined') {
			typeDeNavigateur = 'moz';
		}
		else if(typeof images[0].style.KhtmlOpacity != 'undefined') {
			typeDeNavigateur = 'khtml';
		}
		else if(typeof images[0].filters == 'object') {
			typeDeNavigateur = (images[0].filters.length > 0 && typeof images[0].filters.alpha == 'object' && typeof images[0].filters.alpha.opacity == 'number') ? 'ie' : 'aucun';
		}
		else {
			typeDeNavigateur = 'aucun';
		}
		
		// ***************************************************************
		// FIN du code inspiré
		// ***************************************************************
		
		// Si le navigateur supporte l'opacité
		if (typeDeNavigateur != "aucun") {
			// Donne à toutes les images sauf la première une opacité de 0
			for (i = 1; i < nbImages; i++)
				modifierOpacite(images[i], 0);
		}
		else {
			for (i = 1; i < nbImages; i++)
				modifierVisibilite(images[i], "hidden");
		}
		
		self.setTimeout("continuerTransitions()", delaiChangerImage);
	}
}

// Observe l'état de la transition courante et décide de l'action à faire
function continuerTransitions() {
	if (!enTransition) {
		imageCourante = images[posImageCourante];
		posImageCourante = (posImageCourante+1) % (nbImages);
		prochaineImage = images[posImageCourante];
		enTransition = true;
		self.setTimeout("continuerTransitions()", delaiChangerImage);
	}
	else
		self.setTimeout("effectuerEtapeTransition()", vitesseTransition);
	
}

// Effectue une étape de la transition
function effectuerEtapeTransition() {
	opaciteImageCourante--;
	opaciteProchaineImage++;
	
	// On modifie l'opacite si la fonction est supportée par le navigateur
	if (typeDeNavigateur != "aucun") {
		modifierOpacite(imageCourante, opaciteImageCourante);
		modifierOpacite(prochaineImage, opaciteProchaineImage);
		
		// Si la transition est terminée
		if (opaciteImageCourante == 1) {
			enTransition = false;
			opaciteImageCourante = nbDegreOpaciteAPasser;
			opaciteProchaineImage = 0;
		} 
	}
	else {
		modifierVisibilite(imageCourante, "hidden");
		modifierVisibilite(prochaineImage, "visible");
		enTransition = false;
	} 
	
	continuerTransitions();
}

// Modifie l'opacité d'un objet en fonction du type de navigateur
function modifierOpacite(objet, valeur) {
	switch(typeDeNavigateur){
		case 'ie' :
			objet.filters.alpha.opacity = valeur*(100/nbDegreOpaciteAPasser);
			break;
			
		case 'khtml' :
			objet.style.KhtmlOpacity = valeur/nbDegreOpaciteAPasser;
			break;
			
		case 'moz' : 
			objet.style.MozOpacity = valeur/nbDegreOpaciteAPasser;
			break;
			
		default : 
			objet.style.opacity = valeur/nbDegreOpaciteAPasser;
	}
}

// Modifie l'opacité d'un objet en fonction du type de navigateur
function modifierVisibilite(objet, valeur) {
	switch(typeDeNavigateur){
		case 'ie' :
			objet.visibility = valeur;
			break;
			
		case 'khtml' :
			objet.style.visibility = valeur;
			break;
			
		case 'moz' : 
			objet.style.visibility = valeur;
			break;
			
		default : 
			objet.style.visibility = valeur;
	}
}

ajouterImage("image1");
ajouterImage("image2");
ajouterImage("image3");
initialiserTransitions();