$(document).ready(function(){

//alert(photos);

larg_img = 80;
nb_phos_vis = 3; //nb photos visible à la fois
nb_photos = photos.length;//renvoyé par script ds la page html
margin_right = 20;//espace entre les vignettes

//alert(nb_photos);

$("#contenant_vign").css({width: nb_phos_vis*(larg_img+margin_right)+"px"});

indice = 1; //sert pour les écchanges entre fonctions
indice_glob = 1;// stocke la valeur de l'indice de défilement.

	$("#photo img").attr("src","img/diaporamas/"+page+"/"+photos[0]);
	html_vignettes = '';	
	
		//Faire en php
	for(i=0;i<nb_photos;i++){
		//html_vignettes += '<img src="img/diaporamas/'+page+'/'+photos[i]+'" width='+larg_img+' lang="'+i+'"';
		html_vignettes += '<span><img src="img/diaporamas/'+page+'/'+photos[i]+'" height='+larg_img/4*3+' lang="'+i+'"';
		
		if(i==0){
			html_vignettes += ' class="actif"';
		}
		html_vignettes += '></span>';		
	}
	

	
$("#vign").html(html_vignettes);
$("#vign span").css({width: larg_img});

//alert($("#vign").html());


$("#vign img").click(function(){
	val  = $(this).attr('lang');
	change(val);
	indice = parseInt(val) + 1;
	clearTimeout(defilement);
	bt_lectpause('pause');
	
	$("#vign img.actif").removeClass('actif');
	$(this).addClass('actif');
		
		indice_glob = indice;
		
});



function defiler__(indice){
	change(indice);
	
	$("#vign img.actif").removeClass('actif');
	$("#vign img").eq(indice).addClass('actif');
	
	if(indice == nb_photos-1){/////calcul
		indice = 0;
	} else {
		indice++;
	}
	defilement = setTimeout(function(){defiler__(indice);},3000);
	bt_lectpause('lecture');
	
	indice_glob = indice;
	
}

function change(indice,retour){
      var ret = retour ? retour : false ; 
      


	$("#photo img").fadeOut("fast",function(){
		$("#photo img").attr("src",'img/diaporamas/'+page+'/'+photos[indice]);
		$("#photo img").fadeIn("slow");
		
if((ret == true) || ((indice % nb_phos_vis)==0)){//on déplace à chaque clic pour reculer et tous les 3 clics quand on avance
		leftdiv = (0 -(indice*(larg_img+margin_right)));//
		leftdiv = Math.min(leftdiv,0);//pas de left positif
		leftdiv = Math.max(leftdiv,((larg_img+margin_right)*(nb_phos_vis-nb_photos)));//pour caler dernière image toujours à droite
		$("#vign").animate({left: leftdiv+'px'}, 500);
}

		indice_glob = indice;

	});
} /*
// a virer
$("#bt").click(function(){
	change(indice);
	indice++;// = parseInt (indice)+1;	
});

$("#bt2").click(function(){
	defiler__(indice);//sett
	
	indice++;// = parseInt (indice)+1;	
});*/

$("#suiv").click(function(){

	clearTimeout(defilement);
	bt_lectpause('pause');
	
	indice = indice_glob;
	if(indice == nb_photos-1){                           
		indice = '0';
	} else {
		indice++;
	}
	$("#vign img.actif").removeClass('actif');
	$("#vign img").eq(indice).addClass('actif');	
	change(indice);
	
});

$("#prec").click(function(){

	clearTimeout(defilement);
	bt_lectpause('pause');
	
	indice = indice_glob;
	if(indice == '0'){                           
		indice = nb_photos-1;
	} else {
		indice--;
	}
	$("#vign img.actif").removeClass('actif');
	$("#vign img").eq(indice).addClass('actif');	
	change(indice,true);
	
});

function bt_lectpause(sens){
	if(sens == 'pause'){
		$("#pauselect a").unbind('click');
		$("#pauselect a").bind('click',function(){
			indice_glob++;
			defiler__(indice_glob);
			bt_lectpause('lecture');
		});
		$("#pauselect a img").attr('src','img/suiv.jpg');
		
		
	} else {
		$("#pauselect a").unbind('click');
		$("#pauselect a").bind('click',function(){
			clearTimeout(defilement);
			bt_lectpause('pause');
		});
		$("#pauselect a img").attr('src','img/pause.jpg');
	}
}






	
	defilement = setTimeout(function(){defiler__(indice);},3000);
	bt_lectpause('lecture');
});