
// profondeur vaut 1 si les images sont des enfants directs du conteneur
// vaut 2 si chaque image est encapsulée dans un DIV
function initZoom(conteneurCSS, profondeur)
{	
	$(conteneurCSS+" img.zoomable").each(function(k){
		$(this).unbind("click").bind("click", function(){			
			affPhotoBig($(this), k, profondeur);
		});
	});
}


function affPhotoBig(obj, k, profondeur)
{
	if (profondeur == 1) nb = obj.parent().children("img.zoomable").size();
	else nb = obj.parent().parent().find("img.zoomable").size();
	
	url = obj.attr('src');
	
	
	
	
	$.post("/wp-content/themes/decopro/ajax_getPhotoGood.php", {source:url, taille:"large"}, function(urlBig){
		
		// Si le problème de qualité n'est pas résolu, essayer d'ajouter ces 2 lignes :
		// lg = $(window).width(); hg = $(window).height();
		// urlBig = "/wp-content/themes/decopro/phpthumb/phpThumb.php?src="+urlBig+"&w="+(lg-60)+"&h="+(hg-12)+"&q=88";
	
		if ($("#calqueBlanc").size() == 0) $("body").append("<div id='calqueBlanc'></div>");
		$("body").append("<div id='zoneBig'><div id='messageSouris'>Cliquez pour<br/>revenir<br/>au site</div><div id='btnPhotoPrec'><img src='"+IMGPATH+"flecheGauche.png' /><br/>PHOTO<br/>PRECEDENTE</div><div id='btnPhotoSuiv'><img src='"+IMGPATH+"flecheDroite.png' /><br/>PHOTO<br/>SUIVANTE</div><img id='loading' src='"+IMGPATH+"loading.gif' /><img src='"+urlBig+"' id='photoBig' /></div>");
		$("#btnPhotoPrec, #btnPhotoSuiv, #messageSouris").hide();
		$("#calqueBlanc").fadeTo(0,0.5).css("visibility", "visible");
		
		yloading = ($(window).height() - 50) >> 1;
		xloading = ($(window).width() - 50) >> 1;
		$("#loading").css("top", yloading+"px").css("left", xloading+"px").fadeTo(0,0).fadeTo(500,0.4);
		
		$("#photoBig").load(function()
		{
			$("#loading, #global").hide();
			$(this).css("visibility", "visible");
			lp = $(this).width(); hp = $(this).height();
			lg = $(window).width(); hg = $(window).height();					
			if (hp > hg) {ratio = hg/hp; lp=ratio*lp; hp=ratio*hp;}					
			if (lp > 1000) {ratio = 1000/lp; lp=1000; hp=ratio*hp;}					
			xp = (lg-lp)>>1; yp = (hg-hp)>>1;
			$(this).css("left", xp+"px").css("top", yp+"px").css("height", hp+"px");					
			xBtnGauche = (($(window).width() - $("#global").width()) >> 1) - 95;					
			if (k > 0) $("#btnPhotoPrec").css("top", (hg>>1)+"px").css("left", xBtnGauche+"px").show();					
			xBtnDroite = $("#global").width() + xBtnGauche + 100;					
			if (k < nb-1) $("#btnPhotoSuiv").css("top", (hg>>1)+"px").css("left", xBtnDroite+"px").show();
			
			affLegendes($(this).attr('src'), lp, hp);
		}
		).mouseenter(function(e){
			$("#messageSouris").css("left", e.pageX+"px").css("top", (e.pageY+22)+"px").show();					
		}).mousemove(function(e){
			$("#messageSouris").css("left", e.pageX+"px").css("top", (e.pageY+22)+"px").show();					
		}).mouseleave(function(){
			$("#messageSouris").hide();
		}).click(function(){
			$("#zoneBig, #calqueBlanc").remove();
			$("#global").show();
		});
		
		$("#btnPhotoPrec").click(function(){
			$("#zoneBig").remove();			
			if (profondeur == 1) obj = obj.parent().find("img.zoomable").eq(k-1);			
			else obj = obj.parent().parent().find("img.zoomable").eq(k-1);
			affPhotoBig(obj, k-1, profondeur);
		});
		
		$("#btnPhotoSuiv").click(function(){
			$("#zoneBig").remove();			
			if (profondeur == 1) obj = obj.parent().find("img.zoomable").eq(k+1);
			else obj = obj.parent().parent().find("img.zoomable").eq(k+1);
			affPhotoBig(obj, k+1, profondeur);
		});
	
	});
	
	
	
	
	
	
	
	
}


function affLegendes(url, l, h)
{
	$(".pointLegende").remove();
	
	// 1 : retrouver l'ID de la photo
	// 2 : retrouver les dimensions de la photo source uploadée
	$.post("/wp-content/themes/decopro/ajax_getIDphoto.php", {path:url}, function(retour){			
		tab = retour.split('|');
		idPhoto = tab[0];
		largeur = tab[1];
		hauteur = tab[2];
		zoom = l / largeur;
		
		// 3 : rechercher les légendes	
		// 4 : afficher un bloc HTML contenant les points légendés avec les coordonnées resizées
		$.post("/wp-content/themes/decopro/ajax_getLegendes.php", {id:idPhoto, ratio:zoom}, function(bloc){			
			$("#zoneBig").append(bloc);
			
			// 5 : positionner les points légendés
			xRef = $("#photoBig").offset().left;
			yRef = $("#photoBig").offset().top;
			$(".pointLegende").prepend("<img src='"+IMGPATH+"rondLegende.png' />").each(function(){
				x = xRef + 1.0*($(this).children('.x').text());
				y = yRef + 1.0*($(this).children('.y').text());
				$(this).css("left", x+"px").css("top", y+"px");
			});
			$(".pointLegende").children("p").hide();
			
			// 6 : mettre en place les évènements de survol des points légendés
			$(".pointLegende img").mouseenter(function(){
				$(this).parent().children("p").show();
			}).mouseleave(function(){
				$(this).parent().children("p").hide();
			});
		});
	});
}







