$(document).ready(function(){
	/*					   
	jQuery.fn.extend({
		findPos : function() {
			var obj = $(this).get();
			var curleft = obj.offsetLeft || 0;
			var curtop = obj.offsetTop || 0;
			while (obj = obj.offsetParent) {
					 curleft += obj.offsetLeft
					 curtop += obj.offsetTop
			}
			return {x:curleft,y:curtop};
		}
 	});
	pos = $('affiche').findPos();
	ret = pos.y;
	
	*/
	
	
						   
	var cpt = -1;
	var nbImage = 1000;
	
	//Les variables du slide auto
	var timeoutID; //= setTimeout(function(){charge()}, delay*1000);
	var enChargement=false;
	var onOff = false;
	var delayOption = 4;
	var delay = 0;
	var pageUp = false;
	var debut = true;
	
	
	
					$("#boutonMoins").css({ opacity: 0.5 });
	
	
					function bouton(cpt){
						
						$('#loader').show();
						function afficher(donnees){ // pour remplacer le contenu du div contenu
							
							var tab = donnees.split('|');
							nbImage = tab[0];
							if(nbImage == 1)$('#commandeDiapo').css({'visibility':'hidden'});
							
							//on change le dossier de chargement de l'image en fonction de la fenètre navigateur
							var tailleTab = chercheTaille();
							var largeurImg = tailleTab[0];
							var hauteurImg = tailleTab[1];
							var ligneTab= tab[1].split('1400');
							var ligne = ligneTab[0]+largeurImg+ligneTab[1];
							var ligneTab= ligne.split('<img');
							var haute = $(window).width() / 1.5 
							ligne = ligneTab[0]+'<img  width ='+$(window).width()+'  height = '+haute+' '+ligneTab[1];
							// on ajoute le résultat de la requete ajax (<Li> ... </li>)
							$("#fond ul").append(ligne); 
							
							//A  la fin du chargement de l'image on la laisse apparaitre
							$('#fond ul li:last img').load(function() {
								//on signale (au slideAuto) que le chargement est terminé
								enChargement = false;
								
								//on écrit la légende
								var legende = $('#fond ul li:last img').attr('alt');
								$("#legendeDiapoP").empty();
								$("#legendeDiapoP").append(legende);
								 
								//recherche des dimensions d'origine de l'image
								_get_orig_data($('#fond ul li:last img'))							
								function _get_orig_data(image){
									$this = image;
									$this.attr('origWidth', $this.width());
									$this.attr('origWidth', $this.width());
									$this.attr('origHeight', $this.height());
									$this.attr('ratio', find_ratio($this.width(),$this.height()));
								}
								
								//Dimensions de l'image
								_size_image($('#fond ul li:last img'));
								function _size_image(image){
									$this = image;
									var originalWidth = to_i($this.attr('origWidth'));
									var originalHeight = to_i($this.attr('origHeight'));
									var ratio = $this.attr('ratio');
									
									//si l'image n'est pas totalemetn chargée
									if(originalWidth == 0 || originalHeight == 0){
										setTimeout(function(){
												_get_orig_data(image);
												_size_image(image);
											}, 100);
										return;
									}
									var width_and_height = [];
									width_and_height = find_width_and_height(originalWidth,originalHeight,ratio);
									$this.width( width_and_height[0] );
									$this.height( width_and_height[1] );
									//_show_resize_message(originalWidth,originalHeight,image);
								}
								
								
								function find_width_and_height(originalWidth,originalHeight,ratio) {
									var pageWidth = $(window).width();
									var pageHeight = $(window).height();
									
									var posLoad = pageHeight/2;
									$('#loader').css({'top':posLoad});
									
									
										if(pageWidth/pageHeight >= ratio)
										{
											width = pageWidth; // Page Width minus leftSpace and rightSpace
											height = width/ratio
										}
										else 
										{
											height = pageHeight;  // Page Height minus topSpace and bottomSpace
											width = height*ratio;
										}
									
									arrayImageSize = new Array(width,height);
									return arrayImageSize;
								}
								
								
								
								function find_ratio(width,height) {
									width = to_i(width);
									height = to_i(height);
									var ratio = width/height;
									ratio = ratio.toFixed(2);
									return ratio;
								}
								  
								function to_i(i){
								last = parseInt(i);
									return last;
								}
								
								//centrer l'image
								_center_image($('#fond ul li:last img'));
								function _center_image(image){
									$this = image;
									
									var pageWidth = $(window).width() ;
									var newWidth = -1*($this.width() - pageWidth)/2;
									$(image).css({'position':'relative'});
									$(image).css({'left':newWidth});
									
									var pageHeight = $(window).height();
									var newHeight = -1*($this.height() - pageHeight)/2;
									$(image).css({'top':newHeight});
								}
	
	
								//on prépare le nouveau li
								$("#fond ul li:last").css({
									'display': 'none',
									'margin': 0,
									'position': 'absolute'
								});
								$("#fond ul li:last").fadeIn("slow", efface);
								$("#fond ul li:first").fadeOut("slow");
		
								$(window).resize(function(){
								  _size_image($('#fond ul li:last img'));
								  _center_image($('#fond ul li:last img'))
								  
								})
								
							});
						}
						//on efface le premier li
						function efface(){
							$("#fond ul li:first").remove();
							$('#loader').hide();
						};
						
						
						//le chargement est commandé par l'appel charge() en fin de bloc
						//une fois lancé on teste  delay > 0 -> si oui on lance la méthode auto 
						// qui vérifie qu'un chargement n'est pas en cours 
						//si c'est le cas elle se met en attente ...
						
						function charge(){
							//on envoie en parametre le numéro d'image et le nom de la page
							// c'est gace au nom de la page que l'on va pouvoir cibler les diaporamas
							var pageUrl=self.location.href;
							var fichierAjax = 'inclure/ajouteImageDiaporama.php?profondeur='+cpt+'&p='+pageUrl;
							//alert(pageUrl);
							//on charge le nouveau li
							$.ajax({  // ajax
								
								url: fichierAjax, // url de la page à¡£harger
								success:function(retour){ // si la requète est un succés
									//alert(retour);
									afficher(retour);	    // on execute la fonction afficher(donnees)
								},
								error:function(XMLHttpRequest, textStatus, errorThrows){ // erreur durant la requete
								}
							});
							
							if(delay > 0)auto();
						}
						
						function auto(){
							//si le chargement est en cours (delay == fale) fait une boucle sur toi m^me tousd les 100
							//sinon charge une image toutes les delay 
							if(delay == false){
								setTimeout(function(){auto()}, 100);
								return;
							}else{
								timeoutID = setTimeout(function(){charge()}, delay*1000);
								enChargement = true;
								cpt++; 
							};
						};
						charge();
						
					};
					
	function chercheTaille(){
		//on recherche la dimesion la plus appropriée à l'écran (le photos sont enregistrées dans différents dossiers)
		var result = 1400;
		var hauteur = 933;
		var pageWidth = $(window).width();
		var pageHeight = $(window).height();
									
		if(pageWidth/pageHeight >= 1.5) result = pageWidth; 
		else result = pageHeight*1.5;
		
		tailleImage = new Array(result, hauteur);
		
		if(result<500){result = 400; hauteur = 267;}
		else if (result>=500 && result <700) {result = 600;  hauteur = 400;}
		else if (result>=700 && result < 900) {result = 800; hauteur = 533;}
		else if (result >= 900 && result < 1100) {result = 1000; hauteur = 667;}
		else if (result >= 1100 && result < 1300) {result = 1200; hauteur = 800;}
		else if (result >= 1300 && result < 1500) {result = 1400;  hauteur = 933;}
		else if (result >= 1500 && result < 1700) {result = 1600; hauteur = 1067;}
		else if (result >= 1700 && result < 2000) {result = 1800; hauteur = 1200;}
		else if (result >= 2000) {result = 2000; hauteur = 1333;}
		
		return tailleImage = new Array(result, hauteur);
	}
	
	
	$("#boutonPlus").click(function(){foncPlus()});
	
	$("#boutonMoins").click(function () {foncMoins()});
	
	$("#boutonAuto").click(function () {foncAuto()});
	
	$("#boutonPause").click(function () {foncPause()});
	
	 function foncPlus() {
		
		clearTimeout(timeoutID);
		if(debut == false)$("#boutonAuto").css({'visibility':'visible'});
		$("#boutonPause").css({'visibility':'hidden'});
		
		if(debut)debut = false;
		else remontePage();
		
		onOff = false;
		delay = 0;
		cpt++;
		if(cpt<nbImage-1){$("#boutonPlus").css({ opacity: 1 });  bouton(cpt);}
		if(cpt == nbImage-2) $("#boutonPlus").css({ opacity: 0.5 });
		if(cpt==nbImage-1) cpt --;
		
		if(cpt>0)$("#boutonMoins").css({ opacity: 1 });
		else $("#boutonMoins").css({ opacity: 0.5 }); 
		
	};
	
		
	function foncMoins() {
		remontePage();
		clearTimeout(timeoutID);
		$("#boutonAuto").css({'visibility':'visible'});
		$("#boutonPause").css({'visibility':'hidden'});
		onOff = false;
		delay = 0;
		cpt--;	
		if(cpt>=0){
			$("#boutonMoins").css({'opacity': '1' });
			bouton(cpt);
		}
		if (cpt == 0)$("#boutonMoins").css({ 'opacity': '0.5' });
		
		if(cpt < 0) cpt ++;
		
		if(cpt<nbImage-1)$("#boutonPlus").css({'opacity': '1' });
		
		else $("#boutonPlus").css({ 'opacity': '0.5' });
	};
	
	function foncAuto() {
			remontePage();
			delay = delayOption;
			cpt++;
			if (cpt == nbImage-1)cpt = 0;
			if(cpt>0)$("#boutonMoins").css({ opacity: '1' }); 
			bouton(cpt); 
			onOff=true;
			$("#boutonAuto").css({'visibility':'hidden'});
			$("#boutonPause").css({'visibility':'visible'});
		
	};
	
	function foncPause(){
		descendPage()
		clearTimeout(timeoutID);
		delay=false;
		onOff = false;
		$("#boutonAuto").css({'visibility':'visible'});
		$("#boutonPause").css({'visibility':'hidden'});
	}
	
	function remontePage(){
		if($("#affiche").is(":visible")){
			$('#affiche').slideUp(400);
			$('#boutonDown').css({'visibility':'visible'});
			$('#retour').css({'visibility':'visible'});
			$('#boutonUp').css({'visibility':'hidden'});
			var poslegende = $(window).height() - 30
			$('#legendeDiapo').css({"margin-top": poslegende});
		}
	}
	
	function descendPage(){
		if($("#affiche").is(":hidden")){
			$('#affiche').slideDown('slow');
			$('#boutonDown').css({'visibility':'hidden'});
			$('#retour').css({'visibility':'hidden'});
			$('#boutonUp').css({'visibility':'visible'});
			$('#legendeDiapo').css({"margin-top": "100%"});
		}
	}
	
});