//A METTRE DANS LE PROGRAMME PRINCIPAL

//var listeImages = Array();
//listeImages[0] = "photo1.jpg";
//listeImages[1] = "photo2.jpg";
//listeImages[2] = "photo3.jpg";	
//var largeur = 77;
//var hauteur = 77;
//var largeurTotale = 300;
//var origineX = 80;
//var origineY = 300;
//var pause = 20;
//var pas = 1;

var isRunning = true;
var decalage = 0;
var largeurTotale;

// fonction pour obtenir le chemin de la prochaine image
var nextImage = 0;
function getNextImage()
{
	im = listeImages[nextImage];
	nextImage = (nextImage + 1) % listeImages.length;
	return im;
}

// Affichage des vignettes à leurs positions absolues respectives
function positionnerImages()
{	
	var i;
	$("div.imgSlide").css("top", origineY);	
	$("div.imgSlide:eq(0)").css("left", origineX).css("width", largeur-decalage).css("background-position", -decalage + "px 0px");
	for (i=1; i<nbImages-1; i++) $("div.imgSlide:eq(" + i + ")").css("left", origineX + i*largeur - decalage).css("width", largeurTotale - i*largeur + decalage);
	$("div.imgSlide:eq(" + (nbImages-1) + ")").css("left", origineX + (nbImages-1)*largeur - decalage).css("width", largeurTotale - (nbImages-1)*largeur + decalage);
}

function insererImage()
{
	$("body").append("<div class='imgSlide' style='position:absolute; width:"+largeur+"px; height:"+hauteur+"px'/>");
	$("div.imgSlide:last").bind("mouseenter", function() {
		isRunning=false;
		$(this).fadeTo(0,0.8);
	}).bind("mouseout", function() {
		isRunning=true;		
		$(this).fadeTo(0,1);
	}).bind("click", function() {
		source = $(this).css("background-image");		
		source = source.substr(4, source.length-9);		
		if (source.substr(source.length-1) == ".") source = source.substr(1, source.length-2);
		source = source + "_big.jpg";		
		$("#imageBig").attr("src", source);
	});
}

function slideImages()
{
	if (isRunning)
	{
		decalage += pas;			
		if (decalage >= largeur)
		{
			decalage = 0;
			var i; for (i=0; i<nbImages-1; i++)	$("div.imgSlide:eq("+ i +")").css("background-image", $("div.imgSlide:eq("+(i+1)+")").css("background-image")); 			
			$("div.imgSlide:last").css("background-image", "url("+getNextImage()+")");
		}		
		positionnerImages();
	}	
	setTimeout(slideImages, pause);
}

function startSlideImage()
{
	largeurTotale = (nbImages-1)*largeur;
	// Création des <div> dans body
	for (i=0; i<nbImages; i++) insererImage();
	// On affecte les sources aux images et on les cache
	$("div.imgSlide").each(function(){$(this).hide().css("background", "url("+getNextImage()+") no-repeat" );});
	// On positionne une première fois les images puis on fait apparaitre le résultat
	positionnerImages();
	$("div.imgSlide").show();	
	// C'est parti pour le défilement !
	setTimeout(slideImages, pause);	
}