var centradaVerticalmente=false;
var altoLeyenda=40;
var animacionLeyenda=true;
var ampliandoImagen=false;

function cierraLightBox () {

	ampliandoImagen=false;
	$('capaLightBox').setStyle('display', 'none');
	document.getElementById('capaLightBox').innerHTML='';
}
function lanzaLightBox (srcImagen, comentario, esLaMismaRuta) {
	//Efecto Lightbox basado en jquery para compaginar con mootols			
	
	ampliandoImagen=true;
	var contenido="";			
	
	//Sacamos la altura del scroll de la pagina para mover la capa negra
	
	contenido="<div id='contenedoraImagenAmpliada'><img src='' id='imagenAmpliada'><div id='leyendaImagenAmpliada'><div id='comentarioImagenAmpliada'></div><div id='cerrarImagenAmpliada' title='Cerrar Imagen' onclick='cierraLightBox();'></div></div></div>";
	$('capaLightBox').setStyle('display', 'block');
	//Al terminar, le incrustamos el fondo de la imagen
	document.getElementById('capaLightBox').innerHTML=contenido;
	//Y añadimos el comentario a la capa
	document.getElementById('comentarioImagenAmpliada').innerHTML=comentario;
	//Ahora le aplicamos a la capa contenedora de la imagen, el margen superior
	if (centradaVerticalmente) document.getElementById('contenedoraImagenAmpliada').style.marginTop=((document.getElementById('capaLightBox').offsetHeight/2)-100);
	else document.getElementById('contenedoraImagenAmpliada').style.marginTop=100;
	//Y ahora mostramos la capa contenedora de la imagen
	$('contenedoraImagenAmpliada').setStyle('display', 'block');
	//Diferenciamos entre si tenemos que cargar la misma imagen o es una nueva	
	if (esLaMismaRuta) {
		document.getElementById('imagenAmpliada').src=srcImagen;		
		//Ahora ajustamos el tamaño de la capa contenedora al de la imagen
		var ampliaCapa1 = new Fx.Styles($('contenedoraImagenAmpliada'), {duration: 1000});
		ampliaCapa1.start({
			'height': document.getElementById('imagenAmpliada').height,
			'width': document.getElementById('imagenAmpliada').width
		})
		//Le indicamos que cuando termine la animacion, debe mostrar la imagen
		.addEvent('onComplete', function() {
			//$('imagenAmpliada').setStyle('visibility', 'visible');
			var opacidadImg = new Fx.Styles($('imagenAmpliada'), {duration: 1000});
			opacidadImg.start({
				'opacity': 100
			})
			//Ahora mostramos la leyenda
			document.getElementById('leyendaImagenAmpliada').style.paddingTop="10px";
			var alturaF=parseInt(document.getElementById('contenedoraImagenAmpliada').style.height)+altoLeyenda;
			var ampliaCapa2 = new Fx.Styles($('leyendaImagenAmpliada'), {duration: 500});
			ampliaCapa2.start({
				'height': altoLeyenda
			})			
			.addEvent('onComplete', function() {
				var ampliaCapa3 = new Fx.Styles($('contenedoraImagenAmpliada'), {duration: 1000});
				ampliaCapa3.start({
					'height': alturaF
				})
				.addEvent('onComplete', function (){
					$('leyendaImagenAmpliada').setStyle('visibility', 'visible');
				});
			});
		});
	} else {
		var objImagePreloader = new Image(); //Donde se cargara la imagen
		objImagePreloader.src=srcImagen; //Le decimos que cargue la imagen en cuestion
		objImagePreloader.onload = function () {
			//Cuando carga, le asignamos el src cargado
			document.getElementById('imagenAmpliada').src=objImagePreloader.src;		
			//Ahora ajustamos el tamaño de la capa contenedora al de la imagen
			var ampliaCapa1 = new Fx.Styles($('contenedoraImagenAmpliada'), {duration: 1000});
			ampliaCapa1.start({
				'height': document.getElementById('imagenAmpliada').height,
				'width': document.getElementById('imagenAmpliada').width
			})
			//Le indicamos que cuando termine la animacion, debe mostrar la imagen
			.addEvent('onComplete', function() {
				//$('imagenAmpliada').setStyle('visibility', 'visible');
				var opacidadImg = new Fx.Styles($('imagenAmpliada'), {duration: 1000});
				opacidadImg.start({
					'opacity': 100
				})
				//Ahora mostramos la leyenda
				document.getElementById('leyendaImagenAmpliada').style.paddingTop="10px";
				var alturaF=parseInt(document.getElementById('contenedoraImagenAmpliada').style.height)+altoLeyenda;
				var ampliaCapa2 = new Fx.Styles($('leyendaImagenAmpliada'), {duration: 500});
				ampliaCapa2.start({
					'height': altoLeyenda
				})			
				.addEvent('onComplete', function() {
					var ampliaCapa3 = new Fx.Styles($('contenedoraImagenAmpliada'), {duration: 1000});
					ampliaCapa3.start({
						'height': alturaF
					})
					.addEvent('onComplete', function (){
						$('leyendaImagenAmpliada').setStyle('visibility', 'visible');
					});
				});
			});		
		}
	}
}
//Para controlar si pulsa la tecla escape
document.onkeypress=function(e){
	var esIE=(document.all);
	var esNS=(document.layers);
	tecla=(esIE) ? event.keyCode : e.which;
	if ((tecla==27)  && (ampliandoImagen)) cierraLightBox();
}
