/*
 * thefantasy3d.co.uk
 * Le script ci-dessous est inspire pour la galerie de : 
 * http://css.alsacreations.com/Tutoriels-JavaScript/galerie-photo-javascript
 * La découpe des miniatures s'inspire de cette astuce :
 * http://www.spip-contrib.net/Creer-une-galerie-d-images-avec
 * Le script du fondu est inspire de cette page de forum
 * http://forum.alsacreations.com/topic-1-24157-1-Effet-de-fondu-enchaine-Resolu.html
 * Le Zoom du grand écran est directement de lightbox2
 * http://www.huddletogether.com/projects/lightbox2/
 *
 */






// Indice première vignette
var iVignette = 0;

// Nombre de vignettes par ligne + 1																					
var distVignette = 5;

// Largeur d'une vignette																			
var largeurMax = 64+ 4;

// Fluidité
var easygallery_pas = 32;	// (pixels)

// Vitesse de défilement
var easygallery_timing = 1;	// (millisecondes)

function initEasyGallery(firstIndiceMiniature, nbMiniatures, widthMiniature, fluidite, delay)
{
	// Indice première vignette
	iVignette = firstIndiceMiniature;
	
	// Nombre de vignettes par ligne + 1																					
	distVignette = nbMiniatures;
	
	// Largeur d'une vignette																			
	largeurMax = widthMiniature;
	
	// Fluidité
	easygallery_pas = fluidite;	// (pixels)
	
	// Vitesse de défilement
	easygallery_timing = delay;	// (millisecondes)
	
}


function getElementsByClassName(findClass) 
{
	var aElm=document.body.getElementsByTagName('*');

	for(var i=0; i<aElm.length; i++) 
	{
		if(aElm[i].className==findClass)
		{
			return aElm[i];
		}
	}     
}


 

// Exemple d'utilisation : var im=getElementsBySelector('div img') va recupere toutes les images contenues dans une div
function getElementsBySelector(selector)
{
	selector=selector.split(" ");
	var a=document.getElementsByTagName(selector[0]);
	var r=[];
	for (var i=0;i<a.length;i++) 
	{
		var b= a[ i ].getElementsByTagName(selector[1]);
		for (var j=0;j<b.length;j++) 
		{
			r.push(b[j]);
		}
	}


	return r;
}


function setOpacity(obj, opacity) 
{
	opacity = (opacity == 100)?99.999:opacity;
	
	// IE/Win
	 obj.style.filter = "alpha(opacity:"+opacity+")";

	// Safari<1.2, Konqueror
	obj.style.KHTMLOpacity = opacity/100;

	// Older Mozilla and Firefox
	obj.style.MozOpacity = opacity/100;
  
	// Safari 1.2, newer Firefox and Mozilla, CSS3
	obj.style.opacity = opacity/100;
}


function fonduImage(image, newURL)
{
	setOpacity(image, 100);
	image.style.visibility = 'visible';
	fadeOut(image,100, newURL);

}


function fadeIn(obj,opacity) 
{
	if (opacity <= 100) 
	{
		setOpacity(obj, opacity);
		opacity += 10;
		window.setTimeout( function() {
									fadeIn(obj,opacity);
									},100);

    }
}


function fadeOut(obj,opacity, newURL) 
{
	if (opacity >= 0) 
	{
		setOpacity(obj, opacity);
		opacity -= 10;
		window.setTimeout( function() {
									fadeOut(obj,opacity, newURL);
									},0);

    }
	else
	{
		
		obj.src = newURL; 	// On change l'attribut src de l'image en le remplaçant par la valeur du lien
		fadeIn(obj, 0);
	}
	
}



function moveLeft(obj,deplacementX, limiteneg) 
{
	deplacementX = deplacementX + 4;
	obj.style.left="-"+deplacementX+"px";
	
	
	if (deplacementX <= limiteneg) 
	{
		window.setTimeout( function() {
									moveLeft(obj,deplacementX, limiteneg);
									},10);

    }
	else
	{
		deplacementX = limiteneg;
	}
	
}

function stretching(obj , obj2)
{
	
	// La vignette qui doit disparaitre
	var a = obj.style.width;
	var width = parseInt( a.substr(0, Math.abs(obj.style.width.length)) );
	width -= easygallery_pas;		// vitesse
	
	
	if (width > 0)
	{
		// La vignette qui doit disparaitre		
		obj.style.width = width + "px";
		/* obj.style.display="none"; */
	
		// La vignette qui doit apparaitre
		var width2 = largeurMax - width;
		obj2.style.width = width2 + "px";
		
		window.setTimeout( function()
									{
									stretching(obj , obj2);
									},easygallery_timing);
    }
	else
	{
		// obj disparait
		obj.style.width = "0px";
		obj.style.display = "none";

		// obj2 apparait
		obj2.style.width = largeurMax + "px";		
		obj2.style.display = "block";		
	}
	
}

// 08001830143

// 08001830143

function arrow(fleche, vignettes)
{
	if (iVignette <= 0) 
		{
			fleche[1].style.display = "none";
		} 
		else
		{
			fleche[1].style.display = "block";
		}
		
	if (iVignette + distVignette > vignettes.length)
		{
			fleche[0].style.display = "none";
		} 
		else
		{
			fleche[0].style.display = "block";
		}

}

function deplacementdiv(sens, vignettes, fleche)
{
	var totalVignettes = vignettes.length;
	iVignetteNew = iVignette + distVignette - 1;
	
	if (sens == -1)
	{				
		if (iVignetteNew < totalVignettes )
		{
			vignettes[iVignetteNew].style.width = "0px";
			vignettes[iVignetteNew].style.display = "none";			
			/* vignettes[iVignette].style.display = "none"; */
			stretching(vignettes[iVignette], vignettes[iVignetteNew]);
			++iVignette;			
		}
	}
	
	if (sens == 1)
	{	
		if (iVignette > 0)
		{
			vignettes[iVignette - 1].style.width = "0px";
			vignettes[iVignette - 1].style.display = "block";
			vignettes[iVignetteNew - 1].style.display = "none";			
			stretching(vignettes[iVignetteNew - 1], vignettes[iVignette - 1]);	
			--iVignette;	
		}
	}
	
	arrow(fleche, vignettes);

}



	
function displayPics()
{
	// On recupere les elements de la balise dont la classe est easygallery
	var galerie = getElementsByClassName('easygallery') ;
	
	// Le premier ul trouvé correspond a l'ul des vignettes
	var photos = galerie.getElementsByTagName('ul')[0] ;	

	// On récupère dans une variable tous les liens contenu dans galerie_mini
	var liens = photos.getElementsByTagName('a');

	// On recupere la grosse photo
	var big_photo = galerie.getElementsByTagName('dd')[0].getElementsByTagName('img')[0];
	
	// On recupere le lien de la grosse photo
	var lien_photo = galerie.getElementsByTagName('dd')[0].getElementsByTagName('a')[0];
	
	// On recupere le titre de la grosse photo
	var titre_photo = galerie.getElementsByTagName('dt')[0] ;
	
	// Les fleches pour le scroll
	var fleche = galerie.getElementsByTagName('a');
	
	// Le tableau des miniatures
	var vignettes = photos.getElementsByTagName('li');	
	

	
	fleche[0].onclick = function()
								{
									deplacementdiv(-1, vignettes, fleche)
								};

	fleche[1].onclick = function()
								{
									deplacementdiv(1, vignettes, fleche)
								};


	arrow(fleche, vignettes);	

	// Une boucle parcourant l'ensemble des liens contenu dans galerie_mini
	for (var i = 0 ; i < liens.length ; ++i) 
	{
		// Au clique sur ces liens 
		liens[i].onclick = function() 
		{
			// alert(this.alt);
			titre_photo.firstChild.nodeValue = this.title; // On change le texte de titre de la photo
			lien_photo.href = this.href;
			lien_photo.title = this.title;
			fonduImage(big_photo, this.href);
			big_photo.alt = this.alt; // On change son titre			
			return false; // Et pour finir on inhibe l'action réelle du lien
		};
	}
	
}


window.onload = displayPics;
