// JavaScript Document




/*-----------------------------------*/
/*- GESTION ANIMATION AUTRES IMAGES -*/
/*-----------------------------------*/


var is_playing=false; // Variable qui permet d'attendre que la dernière action soit terminée
var fadeoff=false; // Variable qui permet d'attendre que la dernière action soit terminée

	/*
	 * Description : Cette fonction permet d'afficher un apave et de gerer les onglets
	 *
	 * @parametres : 	- element : id de l element div à afficher 
	 *
	 */
	
	function action(affiche) {
		fadeoff=false;
		//alert(element);
		if (is_playing==false) {
			is_playing=true;
			
			//alert("affiche = "+affiche);
			
			//##definition des noms de divs a animer
			var div_aff="boite_"+affiche;
			var onglet_on="onglet_"+affiche;
			
			//alert("div_aff = "+div_aff);
			//alert("onglet_on = "+onglet_on);
			
				a=setInterval(temps_anim,1000);
				
				
				//##cache tous les div
				for (var i=1; i<=3 ;  i++) {
					
					if (i!=affiche) {
					//new Effect.Opacity("pave_"+i, {duration:2, fps:25, from:1.0, to:0.0});
					new Effect.Fade("boite_"+i, {duration:0.5});
					//alert ("boite_"+i+" fade");
					}
					var boitei="boite_"+i;
					//document.getElementById(boitei).style.display="none";
				}
				
				if (affiche=="1")	b=setInterval(affiche_boite_1,500);
				else if (affiche=="2") 	c=setInterval(affiche_boite_2,500);
				else d=setInterval(affiche_boite_3,500);
				/*document.getElementById(div_aff).style.filter="alpha(opacity=0)";
				document.getElementById(div_aff).style.opacity="0.0";
				document.getElementById(div_aff).style.display="block";*/
				//##affiche le div demandé
				//new Effect.Appear(div_aff, {duration:0.5, queue:"end"});
				//document.getElementById(div_aff).style.display="block";
				//alert (div_aff+" appear");
				//new Effect.Opacity(div_aff, {duration:2, fps:25, from:0.0, to:1.0});
				
				
				
				
				
				//## met tous les onglet a la class off
				for (var i=1; i<=3 ;  i++) {
					if (i!=affiche){
						document.getElementById("onglet_"+i).className="off";
						//alert ("onglet_"+i+" off");
						//alert("i= "+i+"classe mise a off : pave_"+i);
					}
				}
				
				//##met l'onglet voulu a la class on
				document.getElementById(onglet_on).className="on";
				//alert (onglet_on+" on");
				
				
			
		}
	}
	

	/*
	 * Description : Cette fonction permet d'empêcher de lancer la fct action avant qu'une précédente action ne soit terminée
	 *
	 */
	
	function temps_anim(div_aff) {
		
		is_playing= false;
		clearTimeout(a);
		
		}
	
	
	
	
	function affiche_boite_1() {
		//alert(affiche_boite_1);
		//alert(fadeoff);
		if (fadeoff==true) {
			//alert ("fadeoff");
			document.getElementById("boite_1").style.filter="alpha(opacity=0)";
			document.getElementById("boite_1").style.opacity="0.0";
			document.getElementById("boite_1").style.display="block";
			document.getElementById("boite_2").style.display="none";
			document.getElementById("boite_3").style.display="none";
			new Effect.Appear("boite_1", {duration:0.5});
			clearTimeout(b);
			
		}
		fadeoff=true;
		
		
		//alert(fadeoff);
		
		}
	function affiche_boite_2() {
		
		if (fadeoff==true) {
			//alert ("fadeoff");
			document.getElementById("boite_2").style.filter="alpha(opacity=0)";
			document.getElementById("boite_2").style.opacity="0.0";
			document.getElementById("boite_2").style.display="block";
			document.getElementById("boite_1").style.display="none";
			document.getElementById("boite_3").style.display="none";
			new Effect.Appear("boite_2", {duration:0.5});
			clearTimeout(c);
		}
		fadeoff=true;
		
		}
	function affiche_boite_3() {
		if (fadeoff==true) {
			//alert ("fadeoff");
			document.getElementById("boite_3").style.filter="alpha(opacity=0)";
			document.getElementById("boite_3").style.opacity="0.0";
			document.getElementById("boite_3").style.display="block";
			document.getElementById("boite_2").style.display="none";
			document.getElementById("boite_1").style.display="none";
			new Effect.Appear("boite_3", {duration:0.5});
			clearTimeout(d);
		}
		fadeoff=true;
		
		}
		
	
	


/*------------------------------------------------*/
/*- GESTION ANIMATION AFFICHAGE DES REALISATIONS -*/
/*------------------------------------------------*/


/*---- Objet AJAX ----*/

		var xhr = null;
		var xhr_liste = null;


/*
 * OBJET XmlHttpRequest permettant de faire les requetes ajax
 *
 *
 *
*/

function getXhr(){
	
var xhr = null; // L'objet qui contiendra le XMLHttpRequest
	 
	if(window.XMLHttpRequest) { // Firefox et autres
		xhr = new XMLHttpRequest();
	} else if(window.ActiveXObject) { // Internet Explorer 
		try {
			xhr = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (Msxml2E) {
			try {
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (MicrosoftE) {
				xhr = null;
			}
        }
	}
	
	if(xhr === null) { // XMLHttpRequest non supporté par le navigateur 
	   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
	   xhr = false; 
	}
	
	return xhr;
}




	/*
	if(window.XMLHttpRequest) // Firefox et autres
	   xhr = new XMLHttpRequest(); 
	else if(window.ActiveXObject){ // Internet Explorer 
	   try {
				xhr = new ActiveXObject("Msxml2.XMLHTTP");
			} catch (e) {
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			}
	}
	else { // XMLHttpRequest non supporté par le navigateur 
	   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
	   xhr = false; 
	} 
	return xhr;
	
}

*/


/*---- div de la realisation ----*/



/*
* FONCTION PERMETTANT D AFFICHER UNE REALISATION
*
* @param : 	div contenu : (string) nom de la div contenant le texte et les images relatives a la realisation demandee
*			id_real : (int) id de la realisation demandee
*			id_prev : (int) id de la realisation precedente 
*			id_next : (int) id de la realisation suivante 
*
*/

function afficher_real(div_contenu, id_real, id_prev, id_next, div_liste) {
	
	
	xhr_liste = getXhr(); // OBJET 2 : la liste des realisations
	//alert (xhr);
	
	
	
	//## ON MET A JOUR LA LISTE DES REALISATIONS
	xhr_liste.onreadystatechange = function(){
		// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
		if(xhr_liste.readyState == 4 && xhr_liste.status == 200){
			var contenu_liste = xhr_liste.responseText;
			//alert(xhr_liste.responseText);
			// On se sert de innerHTML pour rajouter les options a la liste
			document.getElementById(div_liste).innerHTML = contenu_liste;
			
		}
	}
	xhr_liste.open("POST","liste_real.php",true);
	// parametres du post
	xhr_liste.setRequestHeader('Content-Type','application/x-www-form-urlencoded; charset=iso-8859-1');	
	xhr_liste.send("id="+id_real);
	//alert ('xhr.send');
	
	
	
	//## ON CACHE LA DIV EN BLINDUP (SCRIPTACULOUS)
	new Effect.SlideUp(div_contenu, {duration:.5, queue: 'front', afterFinish:function() { modif_contenu(div_contenu, id_real, id_prev, id_next); } });
	//new Effect.Appear(div_contenu, {duration:1});
	
}



function modif_contenu(div_contenu, id_real, id_prev, id_next) {
	
	xhr = getXhr();  // OBJET 1 : la div contenant la realisation
	
	
	
	//##  ON CHANGE LE CONTENU
	//on défini ce qu'on va faire quand on aura la réponse
	xhr.onreadystatechange = function(){
		// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
		if(xhr.readyState == 4 && xhr.status == 200){
			//alert('xhr.onreadystatechange + ok');
			var contenu = xhr.responseText;
			//alert("contenu = "+xhr.responseText);
			// On se sert de innerHTML pour rajouter les options a la liste
			document.getElementById(div_contenu).innerHTML = contenu;
			//## ON AFFICHE LA DIV
			new Effect.SlideDown(div_contenu, {duration:.5, queue:"end"});
		}
	}
	xhr.open("POST","affichage_real.php",true);
	// parametres du post
	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded; charset=iso-8859-1');	
	xhr.send("id="+id_real+"&prev="+id_prev+"&next="+id_next);
	//alert ('xhr.send');
	
}





/*---- visuels ----*/



/*
* FONCTION PERMETTANT DE GERER L ANIMATION DES IMAGES DU PROJET
*
* @param : 	div _img : (string) nom de la balise img servant a afficher l'image demandee
*			adresse : (string) chemin vers l'image
*			div_onglet : (string)nom (commun) des onglets (exple li_1, li_2, li_3, li_4 ... => li)
*			onglet : (string)nom de l'onglet selectione (li) 
*			nb_onglet : (int)nombre d onglet (de li ds la liste)
*
*/

function afficher_images_real (div_img, adresse, div_onglet, onglet, nb_onglet) {
	
	//alert (div_img+', '+adresse+', '+div_onglet+', '+onglet+', '+nb_onglet);
	
	//## ON MET A JOUR LA LISTE DES REALISATIONS
	
		// tous les onglet class off
		var i;
		for (i=1;i<=nb_onglet;i++) {
			document.getElementById(div_onglet+i).className="";
		}
		//onglet demande class on
		document.getElementById(onglet).className="on";
	
	
	//## ON FAIT DISPARAITRE L IMAGE
	new Effect.Fade(div_img, {duration:0.5, queue: 'front', afterFinish:function() { 
																				 document.getElementById(div_img).src = adresse; 
																				 //##pour forcer a faire attendre le chargement de l'image
																				 new Effect.Fade(div_img, {duration:.1}); 
																				 //## ON FAIT APPARAITRE L IMAGE
																				 new Effect.Appear(div_img, {duration:.5, queue:"end"}); 
																				 }
																				 															}
																																				);
	//new Effect.Appear(div_contenu, {duration:1});
	
}