function SDLIGHTBOX(urlUserFiles) {
	this.urlUserFiles = urlUserFiles;

	//attendre le chargement du DOM avant de continuer...
	theLightBox = this;
	document.observe('dom:loaded', function() {theLightBox.init()});
	this.tabLightBox = new Array();
}

SDLIGHTBOX.prototype.init = function() {

	//créer le conteneur 'lightbox'
	var body = document.getElementsByTagName('body');
	body = body[0];
	
	body.insert({top:'<div id="lightbox" style="display:none;"></div>'});
	body.insert({top:'<div id="rideau"></div>'});
	
	//rechercher toutes les images....
	var tabImg = document.getElementsByTagName('img');
	
	//pour toutes les images dont la classe vaut '_imgBig'...
	for(var i=0;i<tabImg.length;i++) {
		var img = tabImg[i];
		
		img.id = "imgBig_" + i;
		
		if (img.className == '_imgBig') {
			//ajouter un gestionnaire d'evt
			loadEventLightBox(i, this.urlUserFiles, img.alt, img.title);
			
		}
	}
}

function loadEventLightBox(id_picture, urlUserFiles, filename, realId)
{
	Event.observe($('imgBig_' + id_picture), 'click', function(event)
	{
		var body = document.getElementsByTagName('body');
		body = body[0];
		$('rideau').show();
		$('rideau').addClassName('rideau');
		
		$('rideau').style.height = document.documentElement.getHeight() + 'px';
		$('rideau').style.width = document.documentElement.getWidth() + 'px';
		
		$("lightbox").show();
		$("lightbox").addClassName('lightBox-wait');
		centerElt('lightbox');
		
		var img = new Image();
		img.src = urlUserFiles + "img/bigsize/" + filename;
		
		img.onload = function() {
			$('lightbox').innerHTML = '';
			$('lightbox').insert(this);
			$('lightbox').style.width = this.getWidth() + 'px';
			$('lightbox').style.height = this.getHeight() + 'px';
			centerElt('lightbox');
			
			Event.observe($('lightbox'), 'click', function(event)
			{
				$('lightbox').hide();
				$("lightbox").removeClassName('lightBox-wait');
				$('lightbox').style.height = '31px';
				$('lightbox').style.width = '31px';
				$('lightbox').innerHTML = '';
				$('rideau').hide();
			});
			
			//Aller chercher les infos sur l'image...
			var req = new Ajax.Request('?page=_ajaxPictLegend',
			{
				method:'get',
				parameters:'id_picture=' + realId,
				onComplete: function(response) {
					if (!(req.success && response.status == 200)) {
						
						//ajouter un message d'erreur...
						
					} else {
						//Afficher la légende de l'image....
						$('lightbox').insert('<p id="legendLightBox">' + response.responseText + '</p>');
						$('lightbox').style.height = 'auto';
					}
				}
			});
		}
		
	});
}

function centerElt(myId) {
	var result = document.viewport.getDimensions();
	var myWidth = result.width;
	var myHeight = result.height;
	var elementWidth = document.getElementById(myId).offsetWidth;
	var elementHeight = document.getElementById(myId).offsetHeight;
	var myScrollLeft = document.documentElement.scrollLeft;
	var myScrollTop = document.documentElement.scrollTop;
	var posX = myScrollLeft+myWidth-myWidth/2-elementWidth/2
	var posY = myScrollTop+myHeight-myHeight/2-elementHeight/2;
	document.getElementById(myId).style.left = posX+"px";
	document.getElementById(myId).style.top = posY+"px";
}