function preloadImage(source) {
	var imageObj = new Image();
	imageObj.src = source;
}

/**
 * 
 * LIGHTBOX v. 1.0 - 28.05.2009
 * Affichage d'un texte, d'une image ou d'une liste d'images par-dessus l'écran actuel
 * 
 * @author		Gabriel Chevrier
 * @copyright	Warp-Zone Entertainment, G. Chevrier. Tous droits réservés
 * @country		Switzerland
 * @contact		gabriel.chevrier@warp-zone.ch
 * 
 */

// largeur maximale autorisée pour une image
var lightbox_max_width = document.documentElement.clientWidth - 50;
// hauteur maximale autorisée pour une image
var lightbox_max_height = document.documentElement.clientHeight - 80;
// vitesse de défilement (différente car IE est lent !)
var lightbox_isIE = ((navigator.userAgent.toLowerCase().indexOf("msie") != -1) && (navigator.userAgent.toLowerCase().indexOf("opera") == -1));
var lightbox_vitesse = (lightbox_isIE ? 50 : 25);

var lightbox_images = new Array();			// tableau contenant les images
var lightbox_current = 0;					// index de l'image courante
var lightbox_texte = '';					// texte à afficher (si on choisit texte au lieu d'image)
var lightbox_width = 0;						// largeur courante de la lightbox
var lightbox_height = 0;					// hauteur courante de la lightbox
var lightbox_element = null;				// $("lightboxtexte") || $("lightboximage")
var lightbox_slideshow = false;				// le slide-show est-il en lecture? (condition d'arrêt)
var lightbox_textes = new Array();			// textes d'affichage pour les boutons

/**
 * Initialise la lightbox
 * 
 * @param textes
 *            textes utilisés par les boutons
 */
function lightboxInit(textes) {
	lightbox_textes = textes;

	// Div servant à griser l'écran
	var div = document.createElement('div');
	div.id = 'lightbox';
	div.style.display = 'none';
	div.style.opacity = '0.00';
	div.style.filter = 'filter:alpha(opacity=0)';
	document.body.appendChild(div);

	// Div accueillant le contenu image
	var img = document.createElement('div');
	img.id = 'lightboximage';
	img.style.display = 'none';
	document.body.appendChild(img);

	// Div accueillant le contenu texte
	var txt = document.createElement('div');
	txt.id = 'lightboxtexte';
	txt.style.display = 'none';
	document.body.appendChild(txt);

	// Div contenant le numéro de l'image
	var numero = document.createElement('div');
	numero.id = 'lightboxnumber';
	numero.style.display = 'none';
	document.body.appendChild(numero);

	// Div contenant le titre
	var titre = document.createElement('div');
	titre.id = 'lightboxtitre';
	titre.style.display = 'none';
	document.body.appendChild(titre);

	// Div contenant le bouton "fermer" (image seule, ou texte)
	var fermer = document.createElement('div');
	fermer.id = 'lightboxfermer';
	fermer.style.display = 'none';
	fermer.innerHTML = '<a href="javascript:lightboxQuit(100);">' + lightbox_textes[0] + '</a>';
	document.body.appendChild(fermer);

	// Div contenant le player
	var player = document.createElement('div');
	player.id = 'lightboxplayer';
	player.style.display = 'none';
	player.innerHTML = ''
		+ '<img src="/images/player_first.jpg" id="player_first" alt="&lt;" title="' + lightbox_textes[1] + '" />'
		+ '<img src="/images/player_preview.jpg" id="player_preview" alt="&lt;" title="' + lightbox_textes[2] + '" />'
		+ '<img src="/images/player_play.jpg" id="player_play" alt="O" title="' + lightbox_textes[3] + '" />'
		+ '<img src="/images/playeroff_stop.jpg" id="player_stop" alt="O" title="' + lightbox_textes[4] + '" />'
		+ '<img src="/images/player_next.jpg" id="player_next" alt="&gt;" title="' + lightbox_textes[5] + '" />'
		+ '<img src="/images/player_last.jpg" id="player_last" alt="&gt;" title="' + lightbox_textes[6] + '" />'
		+ '<img src="/images/player_quit.jpg" id="player_quit" alt="X" title="' + lightbox_textes[7] + '" />';
	document.body.appendChild(player);
	
	// Div contenant la description
	var description = document.createElement('div');
	description.id = 'lightboxdescription';
	description.style.display = 'none';
	document.body.appendChild(description);
}

/**
 * Affiche image image
 * 
 * @param img
 *            source de l'image
 * @param width
 *            largeur de l'image
 * @param height
 *            hauteur de l'image
 * @param titre
 *            titre de l'image (facultatif)
 * @param description
 *            description de l'image (facultative)
 */
function lightboxImage(src, width, height, titre, description) {
	lightboxImages(new Array(new Array(src, width, height, titre, description)));
}

/**
 * Affiche un slide-show d'images
 * 
 * @param img
 *            Liste d'images sous forme de tableau, dont chaque élément est :
 *            array(src, width, height, titre, description)
 * @param start
 *            numéro de l'image à afficher en premier
 */
function lightboxImages(img, start) {
	lightbox_images = img;
	lightbox_current = 0;

	for ( var i = 0; i < lightbox_images.length; i++) {
		if (lightbox_images[i][1] > lightbox_max_width) {
			lightbox_images[i][2] = Math.floor(lightbox_images[i][2] / lightbox_images[i][1] * lightbox_max_width);
			lightbox_images[i][1] = Math.floor(lightbox_max_width);
		}
		if (lightbox_images[i][2] > lightbox_max_height) {
			lightbox_images[i][1] = Math.floor(lightbox_images[i][1] / lightbox_images[i][2] * lightbox_max_height);
			lightbox_images[i][2] = Math.floor(lightbox_max_height);
		}
	}

	if (start) {
		if (parseInt(start) >= 0 && parseInt(start) < lightbox_images.length) {
			lightbox_current = parseInt(start);
		}
	}
	lightbox_width = lightbox_images[lightbox_current][1];
	lightbox_height = lightbox_images[lightbox_current][2];
	lightbox_element = $("lightboximage");
	$("lightbox").show();
	lightboxShow(0);
}

/**
 * Affiche une lightbox contenant du texte
 * 
 * @param txt
 *            Texte à afficher
 */
function lightboxTexte(txt, width, height) {
	lightbox_texte = txt;
	lightbox_width = width;
	lightbox_height = height;
	lightbox_element = $("lightboxtexte");
	$("lightbox").show();
	lightboxShow(0);
}

/**
 * Grise l'écran
 * 
 * @param opacite
 *            Degré d'opacité, entre 0 et 100
 * @param element
 *            image | texte
 */
function lightboxShow(opacite) {
	opacite = parseInt(opacite) + 5;
	$("lightbox").style.opacity = (opacite / 100);
	$("lightbox").style.filter = 'alpha(opacity=' + opacite + ')';
	if (opacite < 75) {
		setTimeout("lightboxShow('" + opacite + "')", 10);
	} else {
		lightbox_element.show();
		lightboxLoad(0);
	}
}

/**
 * Masque la lightbox
 * 
 * @param opacite
 *            Degré d'opacité, entre 0 et 100
 */
function lightboxHide(opacite) {
	opacite = parseInt(opacite) - 5;
	$("lightbox").style.opacity = (opacite / 100);
	$("lightbox").style.filter = 'alpha(opacity=' + opacite + ')';
	if (opacite > 0) {
		setTimeout("lightboxHide('" + opacite + "')", 10);
	} else {
		$("lightbox").hide();
	}
}

/**
 * Charge la lightbox sur la lightbox
 * 
 * @param ratio
 *            Pourcentage actuel de la largeur totale
 */
function lightboxLoad(ratio) {
	ratio = parseInt(ratio) + lightbox_vitesse;
	if (lightbox_element.id == 'lightboximage') {
		lightbox_element.style.width = (lightbox_images[lightbox_current][1] * ratio / 100) + "px";
		lightbox_element.style.height = (lightbox_images[lightbox_current][2] * ratio / 100) + "px";
	} else {
		lightbox_element.style.width = (lightbox_width * ratio / 100) + "px";
		lightbox_element.style.height = (lightbox_height * ratio / 100) + "px";
	}

	var left = Math.round(parseInt(document.documentElement.clientWidth - parseInt(lightbox_element.getStyle("width")) - parseInt($("body").getStyle("padding-left")) - parseInt($("body").getStyle("padding-right"))) / 2);
	lightbox_element.style.left = left + "px";

	var top = Math.round(parseInt(
			document.documentElement.clientHeight
		  - parseInt(lightbox_element.getStyle("height"))
		  - parseInt($("body").getStyle("padding-top"))
		  - parseInt($("body").getStyle("padding-bottom"))
		  - parseInt(lightbox_element.getStyle('padding-top'))
		  - parseInt(lightbox_element.getStyle('padding-bottom'))
		  - parseInt($("lightboxplayer").getStyle('padding-top'))
		  - parseInt($("lightboxplayer").getStyle('padding-bottom'))		
		  ) / 2);
	lightbox_element.style.top = top + "px";

	if (ratio < 100) {
		setTimeout("lightboxLoad('" + ratio + "')", 10);
	} else {
		if (lightbox_element.id == 'lightboximage') {
			afficherImages();
		} else if (lightbox_element.id == 'lightboxtexte') {
			afficherTexte();
		}
	}
}

/**
 * Ferme la lightbox sur la lightbox
 * 
 * @param id
 *            Numéro de l'image
 * @param ratio
 *            Pourcentage actuel de la largeur totale
 */
function lightboxQuit(ratio) {
	ratio = parseInt(ratio) - lightbox_vitesse;
	lightbox_element.style.width = (lightbox_width * ratio / 100) + "px";
	lightbox_element.style.height = (lightbox_height * ratio / 100) + "px";

	$("lightboxfermer").hide();
	$("lightboxplayer").hide();
	$("lightboxnumber").hide();
	$("lightboxtitre").hide();
	$("lightboxdescription").hide();
	lightbox_slideshow = false;

	lightbox_element.innerHTML = '';

	var left = Math.round(parseInt(document.documentElement.clientWidth - parseInt(lightbox_element.getStyle("width")) - parseInt($("body").getStyle("padding-left")) - parseInt($("body").getStyle("padding-right"))) / 2);
	lightbox_element.style.left = left + "px";

	var top = Math.round(parseInt(
			document.documentElement.clientHeight
		  - parseInt(lightbox_element.getStyle("height"))
		  - parseInt($("body").getStyle("padding-top"))
		  - parseInt($("body").getStyle("padding-bottom"))
		  - parseInt(lightbox_element.getStyle('padding-top'))
		  - parseInt(lightbox_element.getStyle('padding-bottom'))
		  - parseInt($("lightboxplayer").getStyle('padding-top'))
		  - parseInt($("lightboxplayer").getStyle('padding-bottom'))		
		  ) / 2);
	lightbox_element.style.top = top + "px";

	if (ratio > 0) {
		setTimeout("lightboxQuit('" + ratio + "')", 10);
		lightbox_element.hide();
		lightboxHide(75);
	}
}

/**
 * Affiche une image sur la lightbox
 * 
 * @param id
 *            Numéro de l'image
 */
function afficherImages() {
	lightbox_element.style.padding = '3px';

	var img = document.createElement('img');
	img.id = 'lightbox-image';
	img.src = lightbox_images[lightbox_current][0];
	img.width = lightbox_images[lightbox_current][1];
	img.height = lightbox_images[lightbox_current][2];
	img.style.opacity = 0;
	img.style.filter = 'alpha(opacity=0)';
	img.onmouseover = function() { this.style.cursor = 'pointer'; }
	img.onmouseout = function() { this.style.cursor = 'default'; }
	img.onclick = function() { lightboxQuit(100); }
	lightbox_element.appendChild(img);
	lightboxTransition(0, 2);

	if (lightbox_images.length > 1) {
		// plusieurs images
		afficherNumImage();
		afficherTitreImage();
		afficherPlayer();
		afficherDescription();
	} else {
		// une seule image
		afficherTitreImage();
		afficherFermer();
	}
}

/**
 * Affiche du texte sur la lightbox
 */
function afficherTexte() {
	lightbox_element.innerHTML = lightbox_texte;
	afficherFermer();
}

/**
 * Affiche le bouton "fermer"
 */
function afficherFermer() {
	$("lightboxfermer").show();

	var left = parseInt(lightbox_element.getStyle("left")) - parseInt($("lightboxfermer").getStyle("margin-left"));

	var top = parseInt(lightbox_element.getStyle("top")) + parseInt(lightbox_element.getStyle("height")) + parseInt(lightbox_element.getStyle("padding-top")) + parseInt(lightbox_element.getStyle("padding-bottom"));

	var width = parseInt(lightbox_element.getStyle("width")) + parseInt(lightbox_element.getStyle("padding-left")) + parseInt(lightbox_element.getStyle("padding-right")) - parseInt($("lightboxfermer").getStyle("padding-left")) - parseInt($("lightboxfermer").getStyle("padding-right")) + (lightbox_element.id == 'lightboxtexte' ? 2 : 0);

	$("lightboxfermer").style.left = left + "px";
	$("lightboxfermer").style.top = top + "px";
	$("lightboxfermer").style.width = width + "px";

}

/**
 * Charge un lecteur style multimédia pour la lecture des images
 */
function afficherPlayer() {
	var max_width = 0;
	var max_height = 0;
	for ( var i = 0; i < lightbox_images.length; i++) {
		if (lightbox_images[i][1] > max_width) {
			max_width = lightbox_images[i][1];
		}
		if (lightbox_images[i][2] > max_height) {
			max_height = lightbox_images[i][2];
		}
	}

	var left = Math.round(parseInt(document.documentElement.clientWidth - max_width - parseInt($("body").getStyle("padding-left")) - parseInt($("body").getStyle("padding-right"))) / 2);

	var top = Math.round(parseInt(
			  document.documentElement.clientHeight
			- max_height
			- parseInt($("body").getStyle("padding-top"))
			- parseInt($("body").getStyle("padding-bottom"))
			- parseInt(lightbox_element.getStyle('padding-top'))
			- parseInt(lightbox_element.getStyle('padding-bottom'))		
			- parseInt($("lightboxplayer").getStyle('padding-top'))
			- parseInt($("lightboxplayer").getStyle('padding-bottom'))		
			) / 2) + max_height + parseInt(lightbox_element.getStyle("padding-top")) + parseInt(lightbox_element.getStyle("padding-bottom"));

	$("lightboxplayer").style.top = top + "px";
	$("lightboxplayer").style.left = left + "px";
	$("lightboxplayer").style.width = max_width + "px";

	$("lightboxplayer").show();

	// Actions sur les boutons
	lightboxSetBoutons();

}

/**
 * Affiche la description de l'image, dans une couche superposée au player
 * Important : doit être appelé après afficherPlayer(), car sa largeur dépend de la largeur du media-player !
 */
function afficherDescription() {
	
	var width = 
		  parseInt($("lightboxplayer").getStyle("width"))
		- 7 * 24 // 7 boutons de 24 pixels chacun
		- 10 // laisser une marge
		;

	$("lightboxdescription").style.top = $("lightboxplayer").getStyle("top");
	$("lightboxdescription").style.left = $("lightboxplayer").getStyle("left");
	$("lightboxdescription").style.width = width + "px";

	$("lightboxdescription").show();
	$("lightboxdescription").innerHTML = '<div id="scroller_deroulant_lightbox" class="scroller_deroulant"><div id="scroller_defile_lightbox" class="scroller_defile">' + lightbox_images[lightbox_current][4] + '</div></div>';
	scroller_init("_lightbox", 1);

}

function fillDescription() {
	$("scroller_defile_lightbox").innerHTML = lightbox_images[lightbox_current][4];
}

/**
 * Affiche le numéro de l'image (dans le cas de plusieurs images)
 */
function afficherNumImage() {
	if (lightbox_images.length > 1) {
		$("lightboxnumber").show();

		var left = parseInt(
				lightbox_element.getStyle("left"))
			  + parseInt(lightbox_element.getStyle("width"))
			  - parseInt($("lightboxnumber").getStyle("width"));
		var top = parseInt(
				lightbox_element.getStyle("top"))
			  - parseInt($("lightboxnumber").getStyle("height"))
			  - parseInt($("lightboxnumber").getStyle("padding-top"))
			  - parseInt($("lightboxnumber").getStyle("padding-bottom"));
		$("lightboxnumber").style.left = left + "px";
		$("lightboxnumber").style.top = top + "px";
		$("lightboxnumber").innerHTML = (parseInt(lightbox_current) + 1) + '/' + lightbox_images.length;
	}
}

/**
 * Affiche le titre de l'image
 * Important : doit être appelé après afficherNumImage(), car sa largeur dépend de la largeur du numéro d'image !
 */
function afficherTitreImage() {
	$("lightboxtitre").show();
	left = parseInt(lightbox_element.getStyle("left"));
	var top =
		    parseInt(lightbox_element.getStyle("top"))
		  - parseInt($("lightboxtitre").getStyle("height"))
		  - parseInt($("lightboxtitre").getStyle("padding-top"))
		  - parseInt($("lightboxtitre").getStyle("padding-bottom"));
	var width = 
		  parseInt(lightbox_element.getStyle("width"))
		+ parseInt(lightbox_element.getStyle("padding-left"))
		+ parseInt(lightbox_element.getStyle("padding-right"))
		- parseInt($("lightboxtitre").getStyle("margin-left"))
		- parseInt($("lightboxtitre").getStyle("margin-right"))
		;
	if ($("lightboxnumber") && $("lightboxnumber").getStyle("display") != 'none') {
		width = width
		- parseInt($("lightboxnumber").getStyle("width"))
		- parseInt($("lightboxnumber").getStyle("margin-left"))
		- parseInt($("lightboxnumber").getStyle("margin-right"))
		;
	}
		
	$("lightboxtitre").style.left = left + "px";
	$("lightboxtitre").style.top = top + "px";
	$("lightboxtitre").style.width = width + "px";
	$("lightboxtitre").innerHTML = lightbox_images[lightbox_current][3];
}

/**
 * Démarre le slide-show (action du bouton PLAY)
 */
function lightboxStartSlideshow() {
	lightbox_slideshow = true;
	$("player_first").src = '/images/playeroff_first.jpg';
	$("player_preview").src = '/images/playeroff_preview.jpg';
	$("player_play").src = '/images/playeroff_play.jpg';
	$("player_stop").src = '/images/player_stop.jpg';
	$("player_next").src = '/images/playeroff_next.jpg';
	$("player_last").src = '/images/playeroff_last.jpg';
	$("player_quit").src = '/images/playeroff_quit.jpg';
	lightboxDisableBoutons();
	$("player_stop").onmouseover = function() {
		this.style.cursor = 'pointer';
	}
	$("player_stop").onmouseout = function() {
		this.style.cursor = 'default';
	}
	$("player_stop").onclick = function() {
		lightboxStopSlideshow();
	}
	lightboxSlideshow();
}

/**
 * Arrête le slide-show (action du bouton STOP)
 */
function lightboxStopSlideshow() {
	lightbox_slideshow = false;
	$("player_first").src = '/images/player_first.jpg';
	$("player_preview").src = '/images/player_preview.jpg';
	$("player_play").src = '/images/player_play.jpg';
	$("player_stop").src = '/images/playeroff_stop.jpg';
	$("player_next").src = '/images/player_next.jpg';
	$("player_last").src = '/images/player_last.jpg';
	$("player_stop").src = '/images/player_stop.jpg';
	lightboxSetBoutons();
}

/**
 * Fait défiler les images avec un intervalle de x secondes
 */
function lightboxSlideshow() {
	if (lightbox_slideshow) {
		lightbox_current++;
		if (lightbox_current == lightbox_images.length) {
			lightbox_current = 0;
		}
		lightboxTransition(100, 1);
	}
}

/**
 * Assigne les boutons permettant la navigation : FIRST, PREVIEW, NEXT, LAST
 */
function lightboxSetBoutons() {
	// ------- BOUTONS FIRST && PREVIEW -------
	if (lightbox_current > 0) {
		$("player_first").src = '/images/player_first.jpg';
		$("player_first").onmouseover = function() {
			this.style.cursor = 'pointer';
		}
		$("player_first").onmouseout = function() {
			this.style.cursor = 'default';
		}
		$("player_first").onclick = function() {
			lightboxFirstImage();
		}

		$("player_preview").src = '/images/player_preview.jpg';
		$("player_preview").onmouseover = function() {
			this.style.cursor = 'pointer';
		}
		$("player_preview").onmouseout = function() {
			this.style.cursor = 'default';
		}
		$("player_preview").onclick = function() {
			lightboxPreviewImage();
		}
	} else {
		$("player_first").src = '/images/playeroff_first.jpg';
		$("player_first").onmouseover = function() {
			this.style.cursor = 'default';
		}
		$("player_first").onmouseout = function() {
		}
		$("player_first").onclick = function() {
		}

		$("player_preview").src = '/images/playeroff_preview.jpg';
		$("player_preview").onmouseover = function() {
			this.style.cursor = 'default';
		}
		$("player_preview").onmouseout = function() {
		}
		$("player_preview").onclick = function() {
		}
	}

	// ------- BOUTONS NEXT && LAST -------
	if (lightbox_current < lightbox_images.length - 1) {
		$("player_next").src = '/images/player_next.jpg';
		$("player_next").onmouseover = function() {
			this.style.cursor = 'pointer';
		}
		$("player_next").onmouseout = function() {
			this.style.cursor = 'default';
		}
		$("player_next").onclick = function() {
			lightboxNextImage();
		}

		$("player_last").src = '/images/player_last.jpg';
		$("player_last").onmouseover = function() {
			this.style.cursor = 'pointer';
		}
		$("player_last").onmouseout = function() {
			this.style.cursor = 'default';
		}
		$("player_last").onclick = function() {
			lightboxLastImage();
		}
	} else {
		$("player_next").src = '/images/playeroff_next.jpg';
		$("player_next").onmouseover = function() {
			this.style.cursor = 'default';
		}
		$("player_next").onmouseout = function() {
		}
		$("player_next").onclick = function() {
		}

		$("player_last").src = '/images/playeroff_last.jpg';
		$("player_last").onmouseover = function() {
			this.style.cursor = 'default';
		}
		$("player_last").onmouseout = function() {
		}
		$("player_last").onclick = function() {
		}
	}

	$("player_quit").src = '/images/player_quit.jpg';
	$("player_quit").onmouseover = function() {
		this.src = '/images/player_quit2.jpg';
		this.style.cursor = 'pointer';
	}
	$("player_quit").onmouseout = function() {
		this.src = '/images/player_quit.jpg';
		this.style.cursor = 'default';
	}
	$("player_quit").onclick = function() {
		lightboxQuit(100);
	}

	$("player_play").src = '/images/player_play.jpg';
	$("player_play").onmouseover = function() {
		this.style.cursor = 'pointer';
	}
	$("player_play").onmouseout = function() {
		this.style.cursor = 'default';
	}
	$("player_play").onclick = function() {
		lightboxStartSlideshow();
	}

	$("player_stop").src = '/images/playeroff_stop.jpg';
	$("player_stop").style.cursor = 'default';
	$("player_stop").onmouseover = function() {
	}
	$("player_stop").onmouseout = function() {
	}
	$("player_stop").onclick = function() {
	}
}

/**
 * Désactive les boutons, le temps de la transition
 * 
 * @return
 */
function lightboxDisableBoutons() {
	var boutons = new Array($("player_first"), $("player_preview"), $("player_play"), $("player_next"), $("player_last"), $("player_quit"));
	for ( var i = 0; i < boutons.length; i++) {
		boutons[i].onmouseover = function() {
			this.style.cursor = 'default';
		}
		boutons[i].onmouseout = function() {
			this.style.cursor = 'default';
		}
		boutons[i].onclick = function() {
		}
	}
}

/**
 * Affiche la première image de la liste; action du bouton FIRST
 */
function lightboxFirstImage() {
	lightbox_current = 0;
	lightboxTransition(100, 1);
}

/**
 * Affiche l'image précédente dans la liste; action du bouton PREVIEW
 */
function lightboxPreviewImage() {
	lightbox_current--;
	lightboxTransition(100, 1);
}

/**
 * Affiche l'image suivante dans la liste; action du bouton NEXT
 */
function lightboxNextImage() {
	lightbox_current++;
	lightboxTransition(100, 1);
}

/**
 * Affiche la dernière image de la liste; action du bouton LAST
 */
function lightboxLastImage() {
	lightbox_current = lightbox_images.length - 1;
	lightboxTransition(100, 1);
}

/**
 * Effectue une transition entre deux images
 */
function lightboxTransition(ratio, step) {
	lightboxDisableBoutons();
	if (step == 1) {
		ratio = parseInt(ratio) - lightbox_vitesse;
		$("lightbox-image").style.opacity = (ratio / 100);
		$("lightbox-image").style.filter = 'alpha(opacity=' + ratio + ')';
		if (ratio > 0) {
			setTimeout('lightboxTransition(' + ratio + ', 1)', 10);
		} else {
			$("lightbox-image").remove();

			var img = document.createElement('img');
			img.id = 'lightbox-image';
			img.src = lightbox_images[lightbox_current][0];
			img.style.width = lightbox_images[lightbox_current][1] + 'px';
			img.style.height = lightbox_images[lightbox_current][2] + 'px';
			img.style.opacity = 0;
			img.style.filter = 'alpha(opacity=0)';
			img.onmouseover = function() { this.style.cursor = 'pointer'; }
			img.onmouseout = function() { this.style.cursor = 'default'; }
			img.onclick = function() { lightboxQuit(100); }
			$('lightboximage').appendChild(img);

			setTimeout('lightboxTransition(0, 2)', 10);
		}

	} else if (step == 2) {
		ratio = parseInt(ratio) + lightbox_vitesse;
		if (ratio <= 100) {

			// Taille de la zone
			var width = parseInt(lightbox_width + (lightbox_images[lightbox_current][1] - lightbox_width) * ratio / 100);
			var height = parseInt(lightbox_height + (lightbox_images[lightbox_current][2] - lightbox_height) * ratio / 100);
			lightbox_element.style.width = width + 'px';
			lightbox_element.style.height = height + 'px';

			// Position de la zone
			var left = Math.round(parseInt(document.documentElement.clientWidth - parseInt(lightbox_element.getStyle("width")) - parseInt($("body").getStyle("padding-left")) - parseInt($("body").getStyle("padding-right"))) / 2);
			lightbox_element.style.left = left + "px";

			var top = Math.round(parseInt(
					document.documentElement.clientHeight
				  - parseInt(lightbox_element.getStyle("height"))
				  - parseInt($("body").getStyle("padding-top"))
				  - parseInt($("body").getStyle("padding-bottom"))
				  - parseInt(lightbox_element.getStyle('padding-top'))
				  - parseInt(lightbox_element.getStyle('padding-bottom'))
				  - parseInt($("lightboxplayer").getStyle('padding-top'))
				  - parseInt($("lightboxplayer").getStyle('padding-bottom'))		
				  ) / 2);
			lightbox_element.style.top = top + "px";

			setTimeout('lightboxTransition(' + ratio + ', 2)', 10);
		} else {
			lightbox_width = parseInt(lightbox_element.getStyle('width'));
			lightbox_height = parseInt(lightbox_element.getStyle('height'));

			setTimeout('lightboxTransition(0, 3)', 10);
		}

	} else {
		if ($("lightbox-image").complete) {
			ratio = parseInt(ratio) + lightbox_vitesse;
			$("lightbox-image").style.opacity = (ratio / 100);
			$("lightbox-image").style.filter = 'alpha(opacity=' + ratio + ')';
			if (ratio < 100) {
				setTimeout('lightboxTransition(' + ratio + ', 3)', 10);
			} else {
				fillDescription();
				preloadImage(lightbox_current == lightbox_images.length -1 ? lightbox_images[0][0] : lightbox_images[lightbox_current + 1][0]);
				if (!lightbox_slideshow) {
					lightboxSetBoutons();
				} else {
					setTimeout('lightboxSlideshow()', 3000);
				}
			}
		} else {
			setTimeout('lightboxTransition(0, 3)', 10);
		}
	}
	afficherNumImage();
	afficherTitreImage();
}