// -----------------------------------------------------------------------------------
//	Lightbox v2.02
//	by Lokesh Dhakar - http://www.huddletogether.com
//	3/31/06
//	For more information on this script, visit:
//	http://huddletogether.com/projects/lightbox2/
//	Licensed under the Creative Commons Attribution 2.5 License - http://creativecommons.org/licenses/by/2.5/
//	
//	Credit also due to those who have helped, inspired, and made their code available to the public.
//	Including: Scott Upton(uptonic.com), Peter-Paul Koch(quirksmode.org), Thomas Fuchs(mir.aculo.us), and others.
//	Et aussi le pitititi molokoloco ! L'créatif du code ! Yeah baby <:p
//
//  rel="popimg"
//  rel="popimg[Zorglut]"
//  rel="popurl[800|400]"
//  rel="popurl[Multi]"
//  onClick="return myLightbox.getImage('clients/eole/figue.jpg','Test');"
//	onClick="return myLightbox.getUrl('clients/eole/sommaire.htm','Test',720,300);"
//  onClick="return myLightbox.slidebox('clients/eole/galeries_medias_5.xml',2,'Test',720,300);"
//
// -----------------------------------------------------------------------------------


//	Configuration
var pathUrlDiaporama = './medias/galeries/grand/';
var fileLoadingImage = "images/lightbox/loading.gif";		
var fileBottomNavCloseImage = "images/action/annuler.png";
var sliderImage = "images/action/slider.png";
var borderSize = 10; // if you adjust the padding in the CSS, you will need to update this variable
var globalTempo = 6000; // 6 Sec
var demoSlider; // Slide tempo

// -----------------------------------------------------------------------------------
//	Global Variables
var mediasArray = [];
var urlArray = []; // Ajax
var ajaxObjects = [];
var activeImage;
var activeUrl;

var slideShow = false;
var onceScrollImageData = 0;
var xmlDoc; // XML doc
window.slideOut = null; // Timer

resizeDuration = 0.5;

// -----------------------------------------------------------------------------------

var Lightbox = Class.create();

Lightbox.prototype = {

	initialize: function() {	
		
		if (!document.getElementsByTagName) return;

		$$('a').each( function(e) {
			var relAttribute = String(e.getAttribute('rel'));
			if (e.getAttribute('href') && ( (relAttribute.match('popimg')) || (relAttribute.match('popurl')) ) ) {
				e.onclick = function () { 
					myLightbox.start(this);
					return false;
				}
			}
		});

		//	<div id="overlay"></div>
		//	<div id="lightbox">
		//		<div id="outerImageContainer">
		//			<div id="imageContainer">
		//				<img id="lightboxImage">
		//				<div id="lightboxUrl"></div> // mlklc
		//				<div style="" id="hoverNav">
		//					<a href="#" id="prevLink"></a>
		//					<a href="#" id="nextLink"></a>
		//				</div>
		//				<div id="loading">
		//					<a href="#" id="loadingLink"><img src="images/loading.gif"></a>
		//				</div>
		//			</div>
		//		</div>
		//		<div id="imageDataContainer">
		//			<div id="imageData">
		//				<div id="imageDetails">
		//					<span id="diapoCtrl"></span>  // mlklc
		//					<span id="numberDisplay"></span>
		//					<span id="caption"></span>
		//					<span id="slideTempoSpan"></span>  // mlklc
		//				</div>
		//				<div id="bottomNav">
		//					<a href="#" id="bottomNavClose"><img src="images/close.gif"></a>
		//				</div>
		//			</div>
		//		</div>
		//	</div>

		var objBody = document.getElementsByTagName("body").item(0);
		
		var objOverlay = document.createElement("div");
		objOverlay.setAttribute('id','overlay');
		objOverlay.style.display = 'none';
		objOverlay.onclick = function() { myLightbox.end(); return false; }
		objBody.appendChild(objOverlay);
		
		var objLightbox = document.createElement("div");
		objLightbox.setAttribute('id','lightbox');
		objLightbox.style.display = 'none';
		objBody.appendChild(objLightbox);
	
		var objOuterImageContainer = document.createElement("div");
		objOuterImageContainer.setAttribute('id','outerImageContainer');
		objLightbox.appendChild(objOuterImageContainer);

		var objImageContainer = document.createElement("div");
		objImageContainer.setAttribute('id','imageContainer');
		objOuterImageContainer.appendChild(objImageContainer);
	
		var objLightboxImage = document.createElement("img");
		objLightboxImage.setAttribute('id','lightboxImage');
		objImageContainer.appendChild(objLightboxImage);
		
		// mlklc //////////////////////
		var objlightboxUrl = document.createElement("div");
		objlightboxUrl.setAttribute('id','lightboxUrl');
		objlightboxUrl.style.display = 'none';
		objImageContainer.appendChild(objlightboxUrl);
		
		var objHoverNav = document.createElement("div");
		objHoverNav.setAttribute('id','hoverNav');
		objImageContainer.appendChild(objHoverNav);
	
		var objPrevLink = document.createElement("a");
		objPrevLink.setAttribute('id','prevLink');
		objPrevLink.setAttribute('href','#');
		objHoverNav.appendChild(objPrevLink);
		
		var objNextLink = document.createElement("a");
		objNextLink.setAttribute('id','nextLink');
		objNextLink.setAttribute('href','#');
		objHoverNav.appendChild(objNextLink);
	
		var objLoading = document.createElement("div");
		objLoading.setAttribute('id','loading');
		objImageContainer.appendChild(objLoading);
	
		var objLoadingLink = document.createElement("a");
		objLoadingLink.setAttribute('id','loadingLink');
		objLoadingLink.setAttribute('href','#');
		objLoadingLink.onclick = function() { myLightbox.end(); return false; }
		objLoading.appendChild(objLoadingLink);
	
		var objLoadingImage = document.createElement("img");
		objLoadingImage.setAttribute('src', fileLoadingImage);
		objLoadingLink.appendChild(objLoadingImage);

		var objImageDataContainer = document.createElement("div");
		objImageDataContainer.setAttribute('id','imageDataContainer');
		objImageDataContainer.className = 'clearfix';
		objLightbox.appendChild(objImageDataContainer);
		$('imageDataContainer').hide(); // Only if slideshow

		var objImageData = document.createElement("div");
		objImageData.setAttribute('id','imageData');
		objImageDataContainer.appendChild(objImageData);

		var objImageDetails = document.createElement("div");
		objImageDetails.setAttribute('id','imageDetails');
		objImageData.appendChild(objImageDetails);
		
		// mlklc //////////////////////
		var objDivController = document.createElement("span");
		objDivController.setAttribute('id','diapoCtrl');
		objImageDetails.appendChild(objDivController);
		$('diapoCtrl').hide(); // Only if slideshow
		
		// Controls Tool SlideShow
		$('diapoCtrl').update('<a href="javascript:myLightbox.nav(\'b\');" title="Image précédante" id="back"><img src="images/action/back.png" width="15" height="15" border="0"></a> <a href="javascript:myLightbox.pause();" title="Pause" id="pause"><img src="images/action/pause.png" width="15" height="15" border="0"></a> <a href="javascript:myLightbox.play();" title="Lecture" id="play"><img src="images/action/play.png" width="15" height="15" border="0"></a> <a href="javascript:myLightbox.nav(\'n\');" title="Image suivante" id="next"><img src="images/action/next.png" width="15" height="15" border="0"></a> <a href="javascript:void(0);" onClick="Element.toggle(\'slideTempoSpan\');this.blur();" title="Choisir le tempo" id="tempotoggler"><img src="images/action/tempo.png" width="15" height="15" border="0"></a>');

		var objNumberDisplay = document.createElement("span");
		objNumberDisplay.setAttribute('id','numberDisplay');
		objImageDetails.appendChild(objNumberDisplay);
		
		var objCaption = document.createElement("span");
		objCaption.setAttribute('id','caption');
		objImageDetails.appendChild(objCaption);
		
		// mlklc //////////////////////
		var objSlideTempoSpan = document.createElement("span");
		objSlideTempoSpan.setAttribute('id','slideTempoSpan');
		objImageDetails.appendChild(objSlideTempoSpan);
		$('slideTempoSpan').hide(); // Toggle from link tempo
		
		// Slider tempo
		$('slideTempoSpan').update('<div id="slideTempo" style="width:120px; height:11px; background: url(images/action/slider_bg.png) left top no-repeat;"><div id="handleTempo" style="width:11px; height:11px;"><img src="'+sliderImage+'"/></div></div>');

		var objBottomNav = document.createElement("div");
		objBottomNav.setAttribute('id','bottomNav');
		objImageData.appendChild(objBottomNav);
	
		var objBottomNavCloseLink = document.createElement("a");
		objBottomNavCloseLink.setAttribute('id','bottomNavClose');
		objBottomNavCloseLink.setAttribute('href','#');
		objBottomNavCloseLink.setAttribute('onFocus','blur();');
		objBottomNavCloseLink.onclick = function() { myLightbox.end(); return false; }
		objBottomNav.appendChild(objBottomNavCloseLink);
	
		var objBottomNavCloseImage = document.createElement("img");
		objBottomNavCloseImage.setAttribute('src', fileBottomNavCloseImage);
		objBottomNavCloseLink.appendChild(objBottomNavCloseImage);

	},
	
	startOverlay: function() {
		hideSelectBoxes();
		var arrayPageSize = getPageSize();
		Element.setHeight('overlay', arrayPageSize[1]);
		new Effect.Appear('overlay', {duration: 0.3, from: 0.0, to: 0.8, queue: 'front'});
	},
	
	startLightBox: function() { 
		var arrayPageSize = getPageSize();
		var arrayPageScroll = getPageScroll();
		Element.setTop('lightbox', arrayPageScroll[1] + (arrayPageSize[3] / 15));
		Element.show('lightbox');
	},
	
	// Direct Call
	getImage: function(imgLink,imgTitle) {	
		myLightbox.startOverlay();
		slideShow = false;
		mediasArray = [];
		urlArray = [];
		imageNum = 0;
		urlNum = 0;
		mediasArray.push({'mediasrc':imgLink, 'titre': imgTitle});
		myLightbox.startLightBox();
		myLightbox.changeImage(imageNum);
		return false; // Don't open href
	},
	
	// Direct Call
	getUrl: function(urlLink,urlTitle,w,h) {	
		myLightbox.startOverlay();
		slideShow = false;
		mediasArray = [];
		urlArray = [];
		imageNum = 0;
		urlNum = 0;
		urlArray.push({'mediasrc':urlLink, 'titre': urlTitle, 'largeur':w, 'hauteur':h});
		myLightbox.startLightBox();
		myLightbox.changeUrl(urlNum); // this. 
		return false; // Don't open href
	},
	
	// Automatik call
	start: function(imageLink) {
		
		myLightbox.startOverlay();
		
		slideShow = false;
		mediasArray = [];
		urlArray = [];
		imageNum = 0;
		urlNum = 0;
	
		var relAttribute = String(imageLink.getAttribute('rel'));
		if (relAttribute.match('popimg')) { // image
			if (relAttribute == 'popimg') // add single image to mediasArray
				mediasArray.push({'mediasrc':imageLink.getAttribute('href'), 'titre':imageLink.getAttribute('title')});
			else { // if image is part of a set.. loop through anchors, find other images in set, and add them to mediasArray
				$$('a').each( function(e) {					
					if (e.getAttribute('rel') == imageLink.getAttribute('rel'))
						mediasArray.push({'mediasrc':e.getAttribute('href'), 'titre':(e.getAttribute('title')?e.getAttribute('title'):affCleanName(e.getAttribute('href')))});
				});
				while (mediasArray[imageNum]['mediasrc'] != imageLink.getAttribute('href')) imageNum++;
			}
		}
		else if (relAttribute.match('popurl')) { // url
			if (relAttribute == 'popurl') // add single url to urlArray
				urlArray.push({'mediasrc':imageLink.getAttribute('href'), 'titre':imageLink.getAttribute('title')});
			else if (relAttribute.match(/\|/)){
				size = relAttribute.split('|');
				contentWidth = parseInt(size[0].split('\[')[1]);
				contentHeight = parseInt(size[1].split('\]')[0]);
				urlArray.push({'mediasrc':imageLink.getAttribute('href'), 'titre':imageLink.getAttribute('title'), 'largeur':contentWidth, 'hauteur':contentHeight});
			}
			else { // if url is part of a set.. loop through anchors, find other images in set, and add them to mediasArray
				$$('a').each( function(e) {					
					if (e.getAttribute('rel') == imageLink.getAttribute('rel'))
						urlArray.push({'mediasrc':e.getAttribute('href'), 'titre':(e.getAttribute('title')?e.getAttribute('title'):affCleanName(e.getAttribute('href')))});
				});
				while (mediasArray[urlNum]['mediasrc'] != imageLink.getAttribute('href')) urlNum++;
			}
		}

		myLightbox.startLightBox();
		
		if (urlArray.length > 0) this.changeUrl(urlNum);
		else if (mediasArray.length > 0) myLightbox.changeImage(imageNum);
		else return; // No lightBox in this document
	},
	
	//////////////////////////// mlklc CUSTOM ///////////////////////////////////////////////////////////////////////////////////////////

	slidebox: function(xmlPath,currentIndex) {	// INIT
		slideShow = true;
		mediasArray = [];
		urlArray = [];
		imageNum = 0;
		urlNum = 0;
		activeImage = currentIndex;
		demoSlider = null;

		if (document.implementation && document.implementation.createDocument) {
			xmlDoc = document.implementation.createDocument("", "", null);	
			xmlDoc.onload = myLightbox.parseXml;
		}
		else if (window.ActiveXObject) {
			xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
			xmlDoc.onreadystatechange = function () {
				if (xmlDoc.readyState == 4) myLightbox.parseXml();
			};
		}
		else {
			printInfo('Votre navigateur ne supporte pas le XML.<br>Le site risque de ne pas fonctionner');
			return;
		}

		myLightbox.startOverlay();
		myLightbox.startLightBox();
		xmlDoc.load(xmlPath);

		return false; // Don't open href
	},
	
	parseXml: function() { //currentIndex,w,h

		/* XML FORMAT
		<medias>
			<media>
				<id><![CDATA[63]]></id>
				<titre><![CDATA[Arbre]]></titre>
				<legende><![CDATA[]]></legende>
				<miniature><![CDATA[070305142303_arbre.jpg]]></miniature>
				<mediasrc><![CDATA[070305142303_arbre.jpg]]></mediasrc>
				<legende_pos><![CDATA[8tl]]></legende_pos>
				<extension><![CDATA[jpg]]></extension>
				<largeur><![CDATA[624]]></largeur>
				<hauteur><![CDATA[420]]></hauteur>
				<medialink><![CDATA[http://localhost/www.saintdesprit.org/medias/galerie/070305142303_arbre.jpg]]></medialink>
			</media>
			...
		</medias>
		db(xmlDoc.getElementsByTagName('id')[0].childNodes[0].nodeValue);
		*/

		// EACH MEDIA
		if (xmlDoc) {
			var nodes = $A(xmlDoc.getElementsByTagName('media'));
			nodes.each( function(e) {
				mediasArray.push({
					'id':			e.getElementsByTagName('id')[0].childNodes[0].nodeValue,
					'titre':		e.getElementsByTagName('titre')[0].childNodes[0].nodeValue,
					'legende':		e.getElementsByTagName('legende')[0].childNodes[0].nodeValue.stripTags(),
					'miniature':	e.getElementsByTagName('miniature')[0].childNodes[0].nodeValue,
					'mediasrc':		e.getElementsByTagName('mediasrc')[0].childNodes[0].nodeValue,
					'legende_pos':	e.getElementsByTagName('legende_pos')[0].childNodes[0].nodeValue,
					'extension': 	e.getElementsByTagName('extension')[0].childNodes[0].nodeValue,
					'largeur':		e.getElementsByTagName('largeur')[0].childNodes[0].nodeValue,
					'hauteur':		e.getElementsByTagName('hauteur')[0].childNodes[0].nodeValue
				});	
			});
		}
		else printInfo('Problème de lecture du fichier XML.<br>Le site risque de ne pas fonctionner');

		if (!mediasArray.length)
			return printInfo('Le fichier XML associé a ce lien semble vide');
		else if (mediasArray.length > 1) { // start slide.... //////////////////////////////////////
			myLightbox.play(activeImage);
		}
		else if (mediasArray[0]['mediasrc']) {
			myLightbox.getImage(pathUrlDiaporama + mediasArray[0]['mediasrc'], mediasArray[0]['titre']);
		}

	},

	// Controller diaporama
	pause: function() {
		if (window.slideOut) clearTimeout(window.slideOut);
		Element.hide('pause');
		Element.show('play');
		printInfo('Pause');
	},
	
	play: function(imageNum) {
		if (window.slideOut) clearTimeout(window.slideOut);
		Element.hide('play');
		Element.show('pause');
		myLightbox.changeImage(imageNum);
		printInfo('Lecture (Tempo : '+(globalTempo/1000)+' secondes)');
	},
	
	settempo: function(tempo) {
		if (window.slideOut) clearTimeout(window.slideOut);
		$('slideTempoSpan').hide();
		tempo = parseInt(tempo);
		if (tempo < 2) tempo = 2;
		globalTempo = tempo * 1000;
		myLightbox.play(activeImage);
		//printInfo('Tempo <b>'+tempo+'</b> sec');
	},

	//	Hide most elements and preload image in preparation for resizing image container.
	changeImage: function(imageNum) {

		if (window.slideOut) clearTimeout(window.slideOut);
		activeImage = imageNum;	// update global var

		// hide elements during transition
		$('loading').show();
		$('lightboxImage','lightboxUrl','hoverNav','prevLink','nextLink').each(Element.hide);
		if (!slideShow || (slideShow && onceScrollImageData != 1) )
			$('numberDisplay','diapoCtrl','imageDataContainer').each(Element.hide);
		
		// once image is preloaded, resize image container
		imgPreloader = new Image();
		if (!slideShow) {
			imgPreloader.onload = function() {
				Element.setSrc('lightboxImage', mediasArray[activeImage]['mediasrc']);
				myLightbox.resizeImageContainer(imgPreloader.width, imgPreloader.height);
			}
			imgPreloader.src = mediasArray[activeImage]['mediasrc'];
		}
		else {
			imgPreloader.onload = function() {
				Element.setSrc('lightboxImage', pathUrlDiaporama + mediasArray[activeImage]['mediasrc']);
				myLightbox.resizeImageContainer(imgPreloader.width, imgPreloader.height);
				
				if (globalTempo < 3000) globalTempo = 3000;
				else if (globalTempo > 60000) globalTempo = 60000;
				if (activeImage != (mediasArray.length - 1)) activeNext = activeImage + 1;
				else activeNext = 0;
				window.slideOut = setTimeout("myLightbox.changeImage("+activeNext+");", globalTempo);
				db(globalTempo);
			}
			imgPreloader.src = pathUrlDiaporama + mediasArray[activeImage]['mediasrc'];
		}
	},

	//	Hide most elements and load AJax Url
	changeUrl: function(urlNum) {	
		
		activeUrl = urlNum;	// update global var

		// hide elements during transition
		Element.show('loading');
		$('diapoCtrl','lightboxImage','lightboxUrl','hoverNav','prevLink','nextLink','numberDisplay','imageDataContainer').each(Element.hide);
	 
		// Size
		var ajaxW = 620;
		var ajaxH = 520;
		if (urlArray[activeUrl]['largeur'] && urlArray[activeUrl]['hauteur']) {
			ajaxW = urlArray[activeUrl]['largeur'];
			ajaxH = urlArray[activeUrl]['hauteur'];
		}

		$('outerImageContainer').style.overflow = 'hidden';
		
		// Ajax with Prototype.js
		var lbContentUrl = urlArray[activeUrl]['mediasrc'];
		var specs = lbContentUrl.split('?');
		var lbContentUrl = specs[0]
		var lbParameters = specs[1];

		ajaxObjects[ajaxObjects.length] = new Ajax.Request(lbContentUrl, {
			method: 'get',
			parameters: lbParameters,
			evalScripts: true,
			contentType: 'text/html',
			encoding: 'iso-8859-1',
			onSuccess: function(transport) {
				$('lightboxUrl').update(transport.responseText);
				myLightbox.resizeImageContainer(ajaxW,ajaxH);
			}
		});
	},

	// ResizeImageContainer()
	resizeImageContainer: function(imgWidth, imgHeight) {
		
		imgWidth = parseInt(imgWidth);
		imgHeight = parseInt(imgHeight);
		
		if (urlArray.length > 0) {
			$('outerImageContainer').style.overflow = 'auto';
			// Auto-size to Inner Content : if Ajax Load some king of html with <img id="media_media"/>)
			if ( $('media_media') && $('media_media').getAttribute('src')) {
				var relAttribute = String( $('media_media').getAttribute('src') );
				if (relAttribute.match('.jpg') || relAttribute.match('.gif') || relAttribute.match('.png')) {
					imgWidth = parseInt($('media_media').getAttribute('width'));
					imgHeight = parseInt($('media_media').getAttribute('height'));
					$('outerImageContainer').style.overflow = 'hidden';
				}
			}
		}
		else $('outerImageContainer').style.overflow = 'hidden';

		// get current height and width
		var wCur = Element.getWidth('outerImageContainer');
		var hCur = Element.getHeight('outerImageContainer');
		// Min Width for imagedata
		imgWidth = imgWidth < 300 ? 300 : imgWidth; 
		// scalars based on change from old to new
		var xScale = ((imgWidth  + (borderSize * 2)) / wCur) * 100;
		var yScale = ((imgHeight  + (borderSize * 2)) / hCur) * 100;
		// calculate size difference between new and old image, and resize if necessary
		wDiff = (wCur - borderSize * 2) - imgWidth;
		hDiff = (hCur - borderSize * 2) - imgHeight;

		if (hDiff != 0)
			new Effect.Scale('outerImageContainer', yScale, {scaleX: false, duration: resizeDuration, scaleContent:false});
		if (wDiff != 0) {
			Element.setWidth('imageDataContainer', wCur);
			new Effect.Scale('outerImageContainer', xScale, {scaleY: false, delay: resizeDuration, duration: resizeDuration,scaleContent:false, afterFinish: function() { Element.setWidth('imageDataContainer', imgWidth + (borderSize * 2)); } });
		}
		
		// if new and old image are same size and no scaling transition is necessary, do a quick pause to prevent image flicker.
		if (hDiff == 0 && wDiff == 0){
			if (navigator.appVersion.indexOf("MSIE")!=-1) pause(250); else pause(100);
		}

		Element.setHeight('prevLink', imgHeight);
		Element.setHeight('nextLink', imgHeight);

		myLightbox.showImage();
	},

	//	Display image and begin preloading neighbors. ///////////////////////////////////////////////////////////////
	showImage: function() {
		Element.hide('loading');
		if (mediasArray.length > 0)
			new Effect.Appear('lightboxImage', { duration: resizeDuration, queue: 'end', afterFinish: function() { myLightbox.updateDetails(); } });
		else
			new Effect.Appear('lightboxUrl', { duration: resizeDuration, queue: 'end', afterFinish: function() { myLightbox.updateDetails(); } });
		if (mediasArray.length > 0) myLightbox.preloadNeighborImages();
	},

	//	Display caption, image number, and bottom nav.
	updateDetails: function() {

		// PREPARE CONTROLER TOOL BAR
		if (mediasArray.length > 1 && slideShow) {
			
			// $('back','pause','play','next').each(Element.hide);
			
			if (onceScrollImageData != 1) // if not first image in set, display prev image button
				new Effect.Appear('diapoCtrl', { duration: 0.3, from: 0.0, to: 0.9, queue: 'front'});

			if (activeImage != 0) {
				Element.show('back');
				$('back').onclick = function() {
					myLightbox.changeImage(activeImage - 1);
					Element.hide('play');
					Element.show('pause');
					return false;
				};
			}
			else Element.hide('back');
			
			if (activeImage != (mediasArray.length - 1)) activeNext = activeImage + 1;
			else activeNext = 0;
			
			// if not last image in set, display next image button
			if (activeImage != (mediasArray.length - 1)) {
				Element.show('next');
				$('next').onclick = function() { 
					myLightbox.changeImage(activeNext);
					Element.hide('play');
					Element.show('pause');
					return false;
				}
			}
			else Element.hide('next');
			
			// Tempo Slider
			if (!demoSlider) {
				demoSlider = new Control.Slider('handleTempo','slideTempo', {
					axis:'horizontal',
					minimum: 3,
					maximum: 120,
					alignX: 3,
					alignY: -2,
					increment: 1,
					range: $R(3,120),
					sliderValue: ((globalTempo/1000)*2)
				});
				demoSlider.options.onSlide = function(value){
					value = Math.floor(value/2);
					value = Math.max(3,value);
					value = Math.min(value,60);
					printInfo('Tempo <b>'+value+'</b> sec');
				};
				demoSlider.options.onChange = function(value){
					value = Math.floor(value/2);
					value = Math.max(3,value);
					value = Math.min(value,60);
					myLightbox.settempo(value);
				};
			}
			
			$('play').href = 'javascript:myLightbox.play('+activeNext+');';
			
			$('diapoCtrl').show();
		}
		
		Element.show('caption');

		// if image is part of set display 'Image x of x' 
		if (mediasArray.length > 1) {
			if (mediasArray[activeImage]['legende']) {
				leg = mediasArray[activeImage]['legende'].substr(0,70)+(mediasArray[activeImage]['legende'].length>70?'...':'');
				Element.setInnerHTML( 'caption', '<b>'+mediasArray[activeImage]['titre']+'</b> : '+leg);
			}
			else Element.setInnerHTML( 'caption', '<b>'+mediasArray[activeImage]['titre']+'</b>');
			
			Element.show('numberDisplay');
			Element.setInnerHTML( 'numberDisplay', '['+eval(activeImage+1)+'/'+mediasArray.length+']');
		}
		else if (urlArray.length > 1) {
			Element.setInnerHTML( 'caption', urlArray[activeUrl]['titre']);
			Element.show('numberDisplay');
			Element.setInnerHTML( 'numberDisplay', '['+eval(activeUrl + 1)+'/'+urlArray.length+']');
		}
		
		if (!slideShow || (slideShow && onceScrollImageData != 1) ) {
			onceScrollImageData = 1;
			new Effect.Parallel( [ 
				new Effect.SlideDown( 'imageDataContainer', { sync: true, duration: resizeDuration + 0.25, from: 0.0, to: 1.0 }), 
				new Effect.Appear('imageDataContainer', { sync: true, duration: 1.0 })
				], { duration: 0.65, afterFinish: function() { myLightbox.updateNav(); } } 
			);
		}
		else if (slideShow) {
			//$('imageDataContainer').show();
			myLightbox.updateNav();
		}
	},

	//	Display appropriate previous and next hover navigation.
	updateNav: function() {

		if (mediasArray.length < 1 && urlArray.length < 1) return;
		
		Element.show('hoverNav');	

		if (mediasArray.length > 1 && !slideShow) {
			// if not first image in set, display prev image button
			if (activeImage != 0) {
				Element.show('prevLink');
				$('prevLink').onclick = function() {
					myLightbox.changeImage(activeImage - 1); return false;
				}
			}
			// if not last image in set, display next image button
			if (activeImage != (mediasArray.length - 1)) {
				Element.show('nextLink');
				$('nextLink').onclick = function() {
					myLightbox.changeImage(activeImage + 1); return false;
				}
			}
		}
		else if (urlArray.length > 1) {
			if (activeUrl != 0) {
				Element.show('prevLink');
				$('prevLink').onclick = function() {
					myLightbox.changeUrl(activeUrl - 1); return false;
				}
			}
			if (activeUrl != (urlArray.length - 1)) {
				Element.show('nextLink');
				$('nextLink').onclick = function() {
					myLightbox.changeUrl(activeUrl + 1); return false;
				}
			}
		}

		myLightbox.enableKeyboardNav();
	},

	//	enableKeyboardNav()
	enableKeyboardNav: function() {
		document.onkeydown = myLightbox.keyboardAction; 
	},

	//	disableKeyboardNav()
	disableKeyboardNav: function() {
		document.onkeydown = '';
	},

	//	keyboardAction()
	keyboardAction: function(e) {
		if (e == null) keycode = event.keyCode;
		else keycode = e.which;

		key = String.fromCharCode(keycode).toLowerCase();
		
		if ((key == 'x') || (key == 'o') || (key == 'c')) {	// close lightbox
			myLightbox.end();
		} else if (key == 'p') {	// display previous image
			if (activeImage != 0) {
				myLightbox.disableKeyboardNav();
				myLightbox.changeImage(activeImage - 1);
			}
		} else if (key == 'n') {	// display next image
			if (activeImage != (mediasArray.length - 1)) {
				myLightbox.disableKeyboardNav();
				myLightbox.changeImage(activeImage + 1);
			}
		}
	},

	//	Preload previous and next images.
	preloadNeighborImages: function() {
		if (mediasArray.length > 0) {
			if ((mediasArray.length - 1) > activeImage) {
				preloadNextImage = new Image();
				preloadNextImage.src = mediasArray[activeImage + 1]['mediasrc'];
			}
			if (activeImage > 0) {
				preloadPrevImage = new Image();
				preloadPrevImage.src = mediasArray[activeImage - 1]['mediasrc'];
			}
		}
	},

	//	Kill Me !
	end: function() {
		myLightbox.disableKeyboardNav();
		if (window.slideOut) clearTimeout(window.slideOut);
		Element.hide('lightbox');
		$('lightboxImage').src = '';
		$('lightboxUrl').innerHTML = '';
		$('diapoCtrl').hide();
		new Effect.Fade('overlay', { duration: 0.3});
		showSelectBoxes();
	}
}

// -----------------------------------------------------------------------------------
// Returns array with x,y page scroll values.
// Core code from - quirksmode.org
function getPageScroll() {
	var yScroll;
	if (self.pageYOffset) yScroll = self.pageYOffset;
	else if (document.documentElement && document.documentElement.scrollTop) yScroll = document.documentElement.scrollTop;
	else if (document.body) yScroll = document.body.scrollTop;
	arrayPageScroll = new Array('',yScroll) 
	return arrayPageScroll;
}

// -----------------------------------------------------------------------------------
// Returns array with page width, height and window width, height
// Core code from - quirksmode.org
// Edit for Firefox by pHaez
function getPageSize() {
	
	var xScroll, yScroll;
	
	if (window.innerHeight && window.scrollMaxY) {	
		xScroll = document.body.scrollWidth;
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight) { // all but Explorer Mac
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}
	
	var windowWidth, windowHeight;
	if (self.innerHeight) {	// all except Explorer
		windowWidth = self.innerWidth;
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}	
	
	// for small pages with total height less then height of the viewport
	if (yScroll < windowHeight) pageHeight = windowHeight;
	else pageHeight = yScroll;

	// for small pages with total width less then width of the viewport
	if (xScroll < windowWidth) pageWidth = windowWidth;
	else pageWidth = xScroll;

	return new Array(pageWidth,pageHeight,windowWidth,windowHeight) 
}

// -----------------------------------------------------------------------------------
function getKey(e) {
	if (e == null) keycode = event.keyCode;
	else keycode = e.which;
	key = String.fromCharCode(keycode).toLowerCase();
	
	if (key == 'x') { myLightbox.end(); }
}

function listenKey () {	document.onkeypress = getKey; }
function showSelectBoxes() {
	selects = document.getElementsByTagName("select");
	for (i = 0; i != selects.length; i++) {
		selects[i].style.visibility = "visible";
	}
}

function hideSelectBoxes() {
	selects = document.getElementsByTagName("select");
	for (i = 0; i != selects.length; i++) {
		selects[i].style.visibility = "hidden";
	}
}
function pause(numberMillis) {
	var now = new Date();
	var exitTime = now.getTime() + numberMillis;
	while (true) {
		now = new Date();
		if (now.getTime() > exitTime) return;
	}
}
// -----------------------------------------------------------------------------------
function initLightbox() { myLightbox = new Lightbox(); }
Event.observe(window, 'load', initLightbox, false);