// JavaScript Document

/*
Groupe : 1 ou 2
largeur : 1300
hauteur : 244
alignementH : gauche droite ou centre
alignementV : bas milieu ou haut
Taille (de la police en px)
Nom
Ref
id : pour le lien (ex : produit.php?id=98)
*/


var tabExt = new Array();
var accExt = new Array();
var colorExt = new Array();
var sizeExt = new Array();
var posXExt = new Array();
var posYExt = new Array();
var prodExt = new Array();

var tabInt = new Array();
var accInt = new Array();
var colorInt = new Array();
var sizeInt = new Array();
var posXInt = new Array();
var posYInt = new Array();
var prodInt = new Array();

var largeurConteneurs = 905;
var hauteurConteneurs = 220 ;

var vitesse = 50;
var pas = 1;

// EXT
/*tabExt[0] = 'resource/image/photo/visuel-ext_1.jpg';		
tabExt[1] = 'resource/image/photo/visuel-ext_2.jpg';
tabExt[2] = 'resource/image/photo/visuel-ext_3.jpg';	
tabExt[3] = 'resource/image/photo/visuel-ext_4.jpg';

accExt[0] = 'Sacs de couchage - Accessoires'; //   obligatoire sinon bug sous IE7
accExt[1] = 'Sacs de couchage - Accessoires';
accExt[2] = 'Sacs de couchage - Accessoires';
accExt[3] = 'Sacs de couchage - Accessoires';

colorExt[0] = '#000000';
colorExt[1] = '#000000';
colorExt[2] = '#ffffff';
colorExt[3] = '#ffffff';

sizeExt[0] = '30px';
sizeExt[1] = '24px';
sizeExt[2] = '32px';
sizeExt[3] = '28px';

posXExt[0] = 'gauche';
posXExt[1] = 'gauche';
posXExt[2] = 'gauche';
posXExt[3] = 'gauche';

posYExt[0] = 'haut';
posYExt[1] = 'bas';
posYExt[2] = 'milieu';
posYExt[3] = 'milieu';

prodExt[0] = '<div style="text-align:right"><img src="resource/image/fermer_ext.gif" onclick="javascript:AfficheInfoProd(\'ext\');" style="cursor:pointer;" /></div><span class="titreExt">Oreillers1 & Couette islande de Lestra</span><br />Duvet blanc neuf<br />'+
			 'Traité anti acariens, anti bactérien<br />Ref : 012546<div style="text-align:right"><a href="#">> Plus d\'info</a></div>';
prodExt[1] = '<div style="text-align:right"><img src="resource/image/fermer_ext.gif" onclick="javascript:AfficheInfoProd(\'ext\');" style="cursor:pointer;" /></div><span class="titreExt">Oreillers2 & Couette islande de Lestra</span><br />Duvet blanc neuf<br />Traité anti acariens, anti bactérien<br />Ref : 012546'+
			 '<div style="text-align:right"><a href="#">> Plus d\'info</a></div>';
prodExt[2] = '<div style="text-align:right"><img src="resource/image/fermer_ext.gif" onclick="javascript:AfficheInfoProd(\'ext\');" style="cursor:pointer;" /></div><span class="titreExt">Oreillers3 & Couette islande de Lestra</span><br />Duvet blanc neuf<br />Traité anti acariens, anti bactérien<br />Ref : 012546'+
			 '<div style="text-align:right"><a href="#">> Plus d\'info</a></div>';
prodExt[3] = '<div style="text-align:right"><img src="resource/image/fermer_ext.gif" onclick="javascript:AfficheInfoProd(\'ext\');" style="cursor:pointer;" /></div><span class="titreExt">Oreillers4 & Couette islande de Lestra</span><br />Duvet blanc neuf<br />Traité anti acariens, anti bactérien<br />Ref : 012546'+
			 '<div style="text-align:right"><a href="#">> Plus d\'info</a></div>';


//INT
tabInt[0] = 'resource/image/photo/visuel-int_1.jpg';		
tabInt[1] = 'resource/image/photo/visuel-int_2.jpg';
tabInt[2] = 'resource/image/photo/visuel-int_3.jpg';	
tabInt[3] = 'resource/image/photo/visuel-int_4.jpg';

accInt[0] = 'Couettes - Oreillers';// &nbsp; obligatoire sinon bug sous IE7
accInt[1] = 'Couettes - Oreillers';
accInt[2] = 'Couettes - Oreillers';
accInt[3] = 'Couettes - Oreillers';

colorInt[0] = '#ffffff' ;
colorInt[1] = '#ffffff';
colorInt[2] = '#000000';
colorInt[3] = '#000000';

sizeInt[0] = '30px';
sizeInt[1] = '24px';
sizeInt[2] = '32px';
sizeInt[3] = '28px';

posXInt[0] = 'droite';
posXInt[1] = 'droite';
posXInt[2] = 'droite';
posXInt[3] = 'droite';

posYInt[0] = 'bas';
posYInt[1] = 'haut';
posYInt[2] = 'milieu';
posYInt[3] = 'bas';

prodInt[0] = '<div style="text-align:right"><img src="resource/image/fermer_int.gif" onclick="javascript:AfficheInfoProd(\'int\');" style="cursor:pointer;" /></div><span class="titreInt">Oreillers1 & Couette islande de Lestra</span><br />Duvet blanc neuf<br />Traité anti acariens, anti bactérien<br />Ref : 012546'+
			 '<div style="text-align:right"><a href="#">> Plus d\'info</a></div>';
prodInt[1] = '<div style="text-align:right"><img src="resource/image/fermer_int.gif" onclick="javascript:AfficheInfoProd(\'int\');" style="cursor:pointer;" /></div><span class="titreInt">Oreillers1 & Couette islande de Lestra</span><br />Duvet blanc neuf<br />Traité anti acariens, anti bactérien<br />Ref : 012546'+
			 '<div style="text-align:right"><a href="#">> Plus d\'info</a></div>';
prodInt[2] = '<div style="text-align:right"><img src="resource/image/fermer_int.gif" onclick="javascript:AfficheInfoProd(\'int\');" style="cursor:pointer;" /></div><span class="titreInt">Oreillers1 & Couette islande de Lestra</span><br />Duvet blanc neuf<br />Traité anti acariens, anti bactérien<br />Ref : 012546'+
			 '<div style="text-align:right"><a href="#">> Plus d\'info</a></div>';
prodInt[3] = '<div style="text-align:right"><img src="resource/image/fermer_int.gif" onclick="javascript:AfficheInfoProd(\'int\');" style="cursor:pointer;" /></div><span class="titreInt">Oreillers1 & Couette islande de Lestra</span><br />Duvet blanc neuf<br />Traité anti acariens, anti bactérien<br />Ref : 012546'+
			 '<div style="text-align:right"><a href="#">> Plus d\'info</a></div>';
*/
indexExt = 0;
indexInt = 0;



function initDiaporama()
{
	document.getElementById('ext_contenant').style.width=largeurConteneurs+"px";
	document.getElementById('int_contenant').style.width=largeurConteneurs+"px";
	demarrer();
}

function demarrer(){
	
	//EXT 
	//visuel
	document.getElementById('ext_divimagea').src = tabExt[0];
	document.getElementById('ext_divimageb').src = tabExt[1];
	//Accroche
	document.getElementById('ext_accrochea').innerHTML = accExt[0];
	document.getElementById('ext_accrocheb').innerHTML = accExt[1];
	//Couleur
	document.getElementById('ext_accrochea').style.color = colorExt[0];
	document.getElementById('ext_accrocheb').style.color = colorExt[1];
	//Taille
	document.getElementById('ext_accrochea').style.fontSize = sizeExt[0];
	document.getElementById('ext_accrocheb').style.fontSize = sizeExt[1];
	//Position
	calculPosition(0,"ext");
	calculPosition(1,"ext");
	//popup
	document.getElementById('popProdExt').innerHTML=prodExt[0];
	
	
	//INT 
	
	//visuel
	document.getElementById('int_divimagea').src = tabInt[0];
	document.getElementById('int_divimageb').src = tabInt[1];
	//Accroche
	document.getElementById('int_accrochea').innerHTML = accInt[0];
	document.getElementById('int_accrocheb').innerHTML = accInt[1];
	//Couleur
	document.getElementById('int_accrochea').style.color = colorInt[0];
	document.getElementById('int_accrocheb').style.color = colorInt[1];
	//Taille
	document.getElementById('int_accrochea').style.fontSize = sizeInt[0];
	document.getElementById('int_accrocheb').style.fontSize = sizeInt[1];
	//Position
	calculPosition(0,"int");
	calculPosition(1,"int");
	//popup
	document.getElementById('popProdInt').innerHTML=prodInt[0];
	
	
	//EXT	
	if(indexExt%2==0)// a:100 / b:0
	{
		ext_timera = setInterval('avancerAExt()',vitesse);
	}
	else
		{
			ext_timerb = setInterval('avancerBExt()',vitesse);
		}
		
	//INT	
	if(indexInt%2==0)// a:100 / b:0
	{
		int_timera = setInterval('avancerAInt()',vitesse);
	}
	else
		{
			int_timerb = setInterval('avancerBInt()',vitesse);
		} 
}

function avancerAExt(){
	
	
	var ext_lefta = parseInt(document.getElementById('ext_divimagea').style.left);
	document.getElementById('ext_divimagea').style.left = (ext_lefta-pas)+'px';
   
    if(ext_lefta==-250)
	{
		//alert('yoyo');
		fondu(indexExt,"ext");
		//alert('yoyo2');
		ext_timerb = setInterval('avancerBExt()',vitesse);
		//alert('yoyo3');
	}
   
	//Après 300 px de translation : on stop
	if(ext_lefta==-300)
	{
		
		clearInterval(ext_timera);
		//On incremente l'index
		if( indexExt==(tabExt.length-1) ){ indexExt = 0;}else {indexExt++;}
		//On met la prochaine image
		//alert('pouet1')
		
		document.getElementById('ext_divimagea').src = tabExt[calculNextImg(indexExt)];
		document.getElementById('ext_accrochea').innerHTML = accExt[calculNextImg(indexExt)];
		document.getElementById('ext_accrochea').style.color = colorExt[calculNextImg(indexExt)];
		document.getElementById('ext_accrochea').style.fontSize = sizeExt[calculNextImg(indexExt)];
		
		calculPosition(calculNextImg(indexExt),"ext");
		
		document.getElementById('ext_divimagea').style.left = "0px";
		//Popup
		document.getElementById('popProdExt').innerHTML = prodExt[indexExt];

	}
}
function avancerBExt(){
	
	
	var ext_leftb = parseInt(document.getElementById('ext_divimageb').style.left);
	document.getElementById('ext_divimageb').style.left = (ext_leftb-pas)+'px';
  
  /*if(ext_leftb==-240)*/
	if(ext_leftb==-250)
	{ 
		//alert("appel fondu"+indexExt);
		fondu(indexExt,"ext")
		ext_timera = setInterval('avancerAExt()',vitesse);
	}
   
	//Après 300 px de translation : on stop
	if(ext_leftb==-300)
	/*if(ext_leftb==-290)*/
	{

		clearInterval(ext_timerb);
		//On incremente l'index
		if( indexExt==(tabExt.length-1) ){ indexExt = 0;}else {indexExt++;}
		//On met la prochaine image
		document.getElementById('ext_divimageb').src = tabExt[calculNextImg(indexExt)];
		document.getElementById('ext_accrocheb').innerHTML = accExt[calculNextImg(indexExt)];
		document.getElementById('ext_accrocheb').style.color = colorExt[calculNextImg(indexExt)];
		document.getElementById('ext_accrocheb').style.fontSize = sizeExt[calculNextImg(indexExt)];
		calculPosition(calculNextImg(indexExt),"ext");

		document.getElementById('ext_divimageb').style.left = "0px";
		//Popup
		document.getElementById('popProdExt').innerHTML = prodExt[indexExt];
	}
}

function avancerAInt(){
	
	var int_lefta = parseInt(document.getElementById('int_divimagea').style.left);
	document.getElementById('int_divimagea').style.left = (int_lefta+pas)+'px';
   
    if(int_lefta==-60)
	{
		fondu(indexInt,"int");
		int_timerb = setInterval('avancerBInt()',vitesse);
	}
   
	//Après 300 px de translation : on stop
	if(int_lefta==-10)
	{
		clearInterval(int_timera);
		//On incremente l'index
		if( indexInt==(tabInt.length-1) ){ indexInt = 0;}else {indexInt++;}
		//On met la prochaine image
		document.getElementById('int_divimagea').src = tabInt[calculNextImg(indexInt)];
		document.getElementById('int_accrochea').innerHTML = accInt[calculNextImg(indexInt)];
		document.getElementById('int_accrochea').style.color = colorInt[calculNextImg(indexInt)];
		document.getElementById('int_accrochea').style.fontSize = sizeInt[calculNextImg(indexInt)];
		calculPosition(calculNextImg(indexInt),"int");
		
		document.getElementById('int_divimagea').style.left = "-300px";
		//Popup
		document.getElementById('popProdInt').innerHTML = prodInt[indexInt];
	}
}
function avancerBInt(){
	
	
	var int_leftb = parseInt(document.getElementById('int_divimageb').style.left);
	document.getElementById('int_divimageb').style.left = (int_leftb+pas)+'px';
   
   /* if(int_leftb==-50)*/
	if(int_leftb==-60)
	{
		fondu(indexInt,"int")
		int_timera = setInterval('avancerAInt()',vitesse);
	}
   
	//Après 300 px de translation : on stop
	/*if(int_leftb==0)*/
	if(int_leftb==-10)
	{
		clearInterval(int_timerb);
		//On incremente l'index
		if( indexInt==(tabInt.length-1) ){ indexInt = 0;}else {indexInt++;}
		//On met la prochaine image
		document.getElementById('int_divimageb').src = tabInt[calculNextImg(indexInt)];
		document.getElementById('int_accrocheb').innerHTML = accInt[calculNextImg(indexInt)];
		document.getElementById('int_accrocheb').style.color = colorInt[calculNextImg(indexInt)];
		document.getElementById('int_accrocheb').style.fontSize = sizeInt[calculNextImg(indexInt)];
		calculPosition(calculNextImg(indexInt),"int");
		
		document.getElementById('int_divimageb').style.left = "-300px";
		//Popup
		document.getElementById('popProdInt').innerHTML = prodInt[indexInt];
	}
}
						
/**********	GESTION FONDU **************************/					
						
//var oxo=1;
/*var ext_opaa=100;
var ext_opab=0;
var int_opaa=100;
var int_opab=0;*/

function fondu(imgSelect,emplacement)
{
	if(emplacement=="ext")
	{
			
		if(imgSelect%2==0)// a:100 / b:0
		{
			
			$('ext_divimagea').fade({ duration: 1, from: 1, to: 0 });
			$('ext_divimageb').appear({ duration: 1, from: 0, to: 1 });
			
			document.getElementById('ext_accrochea').style.visibility = "hidden";
			
		}
		else// b:100 / a:0
			{
			
				
			$('ext_divimagea').appear({ duration: 1.5, from: 0, to: 1 });
			$('ext_divimageb').fade({ duration: 1.5, from: 1, to: 0 });
			
			document.getElementById('ext_accrocheb').style.visibility = "hidden";
			}
	}
	else
	{
		//int
		
		
		if(imgSelect%2==0)// a:100 / b:0
		{
			$('int_divimagea').fade({ duration: 1.5, from: 1, to: 0, afterFinish:afficherAcc1 });
			$('int_divimageb').appear({ duration: 1.5, from: 0, to: 1});
			
			document.getElementById('int_accrochea').style.visibility = "hidden";
			
		}
		else// b:100 / a:0
			{
				$('int_divimagea').appear({ duration: 1.5, from: 0, to:1, afterFinish:afficherAcc2 });
				$('int_divimageb').fade({ duration: 1.5, from: 1, to: 0 });
				
				document.getElementById('int_accrocheb').style.visibility = "hidden";
			}

	}
	

}

function afficherAcc1()
{
			document.getElementById('int_accrocheb').style.visibility = "visible";
			
			
			document.getElementById('ext_accrocheb').style.visibility = "visible";
			
}

function afficherAcc2()
{
			
			document.getElementById('int_accrochea').style.visibility = "visible";
			
			
			document.getElementById('ext_accrochea').style.visibility = "visible"
}

//Renvoi le prochain id
 function calculNextImg(idImg)
 {
	if( idImg==(tabExt.length-1) )
	{ 
		return 0;
	}
	else 
		{
			 idImg = idImg+1;
			return idImg ;
		}
 }
 
/************************ CALCUL DE LA POSITION DE L ACCROCHE ***********************/ 

 function calculPosition(idImg,emplacement)
 {
	if(emplacement=="ext")
	{
		if(idImg%2==0)// a:100 / b:0
		{
			var tempaccExtA = document.getElementById('ext_accrochea');
	
			//X
			switch(posXExt[idImg])
			{
				case "gauche":
				tempaccExtA.style.left = '10px';
				break;
				case "droite":
				var decal = largeurConteneurs-(parseInt(tempaccExtA.offsetWidth)+20);
				tempaccExtA.style.left = decal+'px';
				break;
				case "centre":
				var longPhrase = parseInt(tempaccExtA.offsetWidth)/2;
				var decal = parseInt((largeurConteneurs/2)-longPhrase);
				//alert("milieu "+ decal);
				tempaccExtA.style.left = decal+'px';
				break;
			}
			
			//Y
			switch(posYExt[idImg])
			{
				case "haut":
				tempaccExtA.style.top = '0px';
				break;
				case "bas":
				var decal = hauteurConteneurs-parseInt(tempaccExtA.offsetHeight);
				tempaccExtA.style.top = decal+'px';
				break;
				case "milieu":
				var hautPhrase = parseInt(tempaccExtA.offsetHeight)/2;
				var decal = parseInt((hauteurConteneurs/2)-hautPhrase);
				//alert("centre "+ decal);
				tempaccExtA.style.top = decal+'px';
				break;
			}
			
		}
		else //b:100 / a:0
			{
				var tempaccExtB = document.getElementById('ext_accrocheb');
				
				switch(posXExt[idImg])
				{
					case "gauche":
					tempaccExtB.style.left = '10px';
					break;
					case "droite":
					var decal = largeurConteneurs-(parseInt(tempaccExtB.offsetWidth)+20);
					tempaccExtB.style.left = decal+'px';
					break;
					case "centre":
					var longPhrase = parseInt(tempaccExtB.offsetWidth)/2;
					var decal = parseInt((largeurConteneurs/2)-longPhrase);
					//alert("milieu "+ decal);
					tempaccExtB.style.left = decal+'px';
					break;
				}
				
				//Y
				switch(posYExt[idImg])
				{
					case "haut":
					tempaccExtB.style.top = '0px';
					break;
					case "bas":
					var decal = hauteurConteneurs-parseInt(tempaccExtB.offsetHeight);
					tempaccExtB.style.top = decal+'px';
					break;
					case "milieu":
					var hautPhrase = parseInt(tempaccExtB.offsetHeight)/2;
					var decal = parseInt((hauteurConteneurs/2)-hautPhrase);
					//alert("centre "+ decal);
					tempaccExtB.style.top = decal+'px';
					break;
				}
			}

		
	}
	else
		{
			//INT
			if(idImg%2==0)// a:100 / b:0
			{
				var tempaccIntA = document.getElementById('int_accrochea');
				
				//X
				switch(posXInt[idImg])
				{
					case "gauche":
					tempaccIntA.style.left = '10px';
					break;
					case "droite":
					var decal = largeurConteneurs-(parseInt(tempaccIntA.offsetWidth)+20);
					tempaccIntA.style.left = decal+'px';
					break;
					case "centre":
					var longPhrase = parseInt(tempaccIntA.offsetWidth)/2;
					var decal = parseInt((largeurConteneurs/2)-longPhrase);
					//alert("milieu "+ decal);
					tempaccIntA.style.left = decal+'px';
					break;
				}
				
				//Y
				switch(posYInt[idImg])
				{
					case "haut":
					tempaccIntA.style.top = '0px';
					break;
					case "bas":
					var decal = hauteurConteneurs-parseInt(tempaccIntA.offsetHeight);
					tempaccIntA.style.top = decal+'px';
					break;
					case "milieu":
					var hautPhrase = parseInt(tempaccIntA.offsetHeight)/2;
					var decal = parseInt((hauteurConteneurs/2)-hautPhrase);
					//alert("centre "+ decal);
					tempaccIntA.style.top = decal+'px';
					break;
				}
			}
			else
				{
					var tempaccIntB = document.getElementById('int_accrocheb');
					
					//X
					switch(posXInt[idImg])
					{
						case "gauche":
						tempaccIntB.style.left = '10px';
						break;
						case "droite":
						var decal = largeurConteneurs-(parseInt(tempaccIntB.offsetWidth)+20);
						tempaccIntB.style.left = decal+'px';
						break;
						case "centre":
						var longPhrase = parseInt(tempaccIntB.offsetWidth)/2;
						var decal = parseInt((largeurConteneurs/2)-longPhrase);
						//alert("milieu "+ decal);
						tempaccIntB.style.left = decal+'px';
						break;
					}
					
					//Y
					switch(posYInt[idImg])
					{
						case "haut":
						tempaccIntB.style.top = '0px';
						break;
						case "bas":
						var decal = hauteurConteneurs-parseInt(tempaccIntB.offsetHeight);
						tempaccIntB.style.top = decal+'px';
						break;
						case "milieu":
						var hautPhrase = parseInt(tempaccIntB.offsetHeight)/2;
						var decal = parseInt((hauteurConteneurs/2)-hautPhrase);
						//alert("centre "+ decal);
						tempaccIntB.style.top = decal+'px';
						break;
					}
				}
				
			
		}
 }
 

 /************************* popup produit *********************************/
 

 function AfficheInfoProd(emplacement)
 {
	if(emplacement=="ext")
	{
		var popup = window.document.getElementById('popProdExt');
	}
	else
		{
		//Calcul position du top
		var popup = window.document.getElementById('popProdInt');
		}
		
	if(popup.style.display=="none")
	{
		popup.style.display = "block";
	}
	else
		{
			popup.style.display = "none";
		}
	
 }