//  JavaScript Document

	//
	//	GaleriaJavascript.js
	//	Fecha de creacion: 08 / 07 / 2010
	//	Descripcion: Clase que controla una galeria de imágenes
	//
	
	//
	//  Versión 1.0 (Original)
	//  Versión 1.01 (9/7/2010) :: Se ha añadido la funcionalidad de acceder a una foto en particular
	//

	//  CLASE
	
	
	var claseGaleria = null;

	function GaleriaJavascript ( desplazamientoCoordX , desplazamientoCoordY , tiempoEventoTransicion , tiempoTransicion ) 
	{
		tiempoEventoTransicion 	= typeof(tiempoEventoTransicion) != 'undefined' ? tiempoEventoTransicion : 20000;
  		tiempoTransicion 		= typeof(tiempoTransicion) 		 != 'undefined' ? tiempoTransicion : 0.8;
		
		this.galimagenes		= new Array();
		this.galdescripcion 	= new Array();
		this.galbuttons			= new Array();
		this.galbuttonsclass	= new Array();
		this.galdivbuttons		= null;
		this.galnumimagenes		= 0;
		this.galimagenActual	= 0;
		this.desplazamientoX 	= desplazamientoCoordX;
		this.desplazamientoY 	= desplazamientoCoordY;
		this.tiempoEvento 		= tiempoEventoTransicion;
		this.tiempoTrans 		= tiempoTransicion;
		this.bloqueado			= false;
		this.tieneBotones		= false;
		this.timer				= self.setTimeout ( 'claseGaleria.siguienteImagenAutoGaleria()' , this.tiempoEvento );
		
		claseGaleria			= this;
		
		this.addImagenGaleria = function addImagenGaleria ( idImagen , idDescripcion , idButton , divclassButton )
		{
			idButton 			= typeof(idButton) != 'undefined' ? idButton : null;
			divclassButton		= typeof(divclassButton) != 'undefined' ? divclassButton : null;
			
			this.galimagenes	[ this.galnumimagenes ]	= idImagen;
			this.galdescripcion	[ this.galnumimagenes ]	= idDescripcion;
	
			if ( idButton != null )
			{
				this.galbuttons	[ this.galnumimagenes ]			= idButton;
				this.galbuttonsclass [ this.galnumimagenes ]	= divclassButton;
				this.tieneBotones 								= true;
			}
	
			this.galnumimagenes++;
		}
		
		this.insertDivButtons = function insertDivButtons ( nameDivButtons )
		{
			if ( this.galnumimagenes <= 1 ) return;
			
			this.galdivbuttons	= nameDivButtons;
			
			var divBotones	= document.getElementById ( nameDivButtons );
			
			for ( var i = ( this.galnumimagenes - 1 ) ; i >= 0 ; i-- )
			{
				var nuevoBoton 	= document.createElement('div');
				nuevoBoton.setAttribute ( "id" , this.galbuttons[i] );
				nuevoBoton.setAttribute ( "border" , 0 );
				nuevoBoton.className = this.galbuttonsclass[i];
				nuevoBoton.onclick = function () 
				{
					var posicionBoton = claseGaleria.obtenerPosicionBotonByDiv ( this.id )

					claseGaleria.gotoImagenGaleriaNumero(posicionBoton);
				}
				
				var nuevoEnlace = document.createElement('a');
				nuevoEnlace.setAttribute('href', '#');

				nuevoEnlace.appendChild(nuevoBoton)
				divBotones.appendChild(nuevoEnlace);	
			}
			
			this.resaltarBoton ( this.galbuttons[0] );
		}
		
		this.siguienteImagenAutoGaleria = function siguienteImagenAutoGaleria ()
		{
			if ( this.galnumimagenes <= 1 )  return false;
			
			// Programamos reloj
			this.timer = self.setTimeout ( 'claseGaleria.siguienteImagenAutoGaleria()' , this.tiempoEvento );
			
			this.siguienteImagenGaleria ();
		}
		
		this.anteriorImagenManualGaleria = function anteriorImagenManualGaleria ()
		{
			if ( this.galnumimagenes <= 1 )  return false;
			
			// Reiniciamos reloj
			self.clearTimeout ( this.timer );
			this.timer = self.setTimeout ( 'claseGaleria.siguienteImagenAutoGaleria()' , this.tiempoEvento );
			
			this.anteriorImagenGaleria ();
		}
		
		this.siguienteImagenManualGaleria = function siguienteImagenManualGaleria ()
		{
			if ( this.galnumimagenes <= 1 )  return false;
			
			// Reiniciamos reloj
			self.clearTimeout ( this.timer );
			this.timer = self.setTimeout ( 'claseGaleria.siguienteImagenAutoGaleria()' , this.tiempoEvento );
			
			this.siguienteImagenGaleria ();
		}
		
		this.anteriorImagenGaleria = function anteriorImagenGaleria ()
		{
			if ( this.galnumimagenes <= 1 )  return false;
			if ( this.galimagenActual == 0 ) return false;
			
			if ( !document.getElementById ( this.galimagenes	[ this.galimagenActual ] ) )		return false;
			if ( !document.getElementById ( this.galimagenes	[ this.galimagenActual - 1 ] ) )	return false;
			if ( !document.getElementById ( this.galdescripcion [ this.galimagenActual ] ) )		return false;
			if ( !document.getElementById ( this.galdescripcion [ this.galimagenActual - 1 ] ) )	return false;
			
			var imagenActual 	= document.getElementById ( this.galimagenes	[ this.galimagenActual ] );
			var imagenAnterior	= document.getElementById ( this.galimagenes	[ this.galimagenActual - 1 ] );
			
			var descripActual 	= this.galdescripcion [ this.galimagenActual ];
			var descripAnterior	= this.galdescripcion [ this.galimagenActual - 1 ];
	
			if ( this.bloqueado ) 	return false;
			else					this.bloqueado = true;
	
			new Effect.Move ( imagenAnterior , { x: this.desplazamientoX , y: this.desplazamientoY , duration: this.tiempoTrans } );
			new Effect.Move ( imagenActual ,   { x: this.desplazamientoX , y: this.desplazamientoY , duration: this.tiempoTrans , afterFinish: ( function(){ claseGaleria.desbloquear (); }) } );
			
			//this.desapareceBloque ( descripActual );
			//this.apareceBloque ( descripAnterior );
			this.transicionEntreBloques ( descripAnterior , descripActual );
			
			if ( this.tieneBotones )
			{
				var botonActual 	= this.galbuttons [ this.galimagenActual ];
				var botonAnterior	= this.galbuttons [ this.galimagenActual - 1 ];
				
				this.resaltarBoton ( botonAnterior );
				this.atenuarBoton  ( botonActual );
			}
			
			this.galimagenActual--;
		}
		
		this.siguienteImagenGaleria = function siguienteImagenGaleria ()
		{
			if ( this.galnumimagenes <= 1 )  return false;
			if ( this.galimagenActual >= ( this.galnumimagenes - 1 ) )
			{
				this.siguienteImagenGaleriaLoop ();
				
				return;
			}
			
			if ( !document.getElementById ( this.galimagenes    [ this.galimagenActual ] ) )		return false;
			if ( !document.getElementById ( this.galimagenes    [ this.galimagenActual + 1 ] ) )	return false;
			if ( !document.getElementById ( this.galdescripcion [ this.galimagenActual ] ) )		return false;
			if ( !document.getElementById ( this.galdescripcion [ this.galimagenActual + 1 ] ) )	return false;
	
			var imagenActual 		= document.getElementById ( this.galimagenes    [ this.galimagenActual ] );
			var imagenSiguiente		= document.getElementById ( this.galimagenes    [ this.galimagenActual + 1 ] );
			
			var descripActual 		= this.galdescripcion [ this.galimagenActual ];
			var descripSiguiente	= this.galdescripcion [ this.galimagenActual + 1 ];
			
			if ( this.bloqueado ) 	return false;
			else					this.bloqueado = true;
			
			new Effect.Move ( imagenSiguiente , { x: -this.desplazamientoX, y: -this.desplazamientoY , duration: this.tiempoTrans } );
			new Effect.Move ( imagenActual ,    { x: -this.desplazamientoX, y: -this.desplazamientoY , duration: this.tiempoTrans , afterFinish: ( function(){ claseGaleria.desbloquear (); }) } );
			
			//this.desapareceBloque ( descripActual );
			//this.apareceBloque ( descripSiguiente );
			this.transicionEntreBloques ( descripActual , descripSiguiente );
			
			if ( this.tieneBotones )
			{
				var botonActual 	= this.galbuttons [ this.galimagenActual ];
				var botonSiguiente	= this.galbuttons [ this.galimagenActual + 1 ];
				
				this.resaltarBoton ( botonSiguiente );
				this.atenuarBoton  ( botonActual );
			}
			
			this.galimagenActual++;
		}
		
		this.gotoImagenGaleriaNumero = function gotoImagenGaleriaNumero ( numImagen )
		{
			if ( this.galnumimagenes <= 1 )  			return false;
			if ( numImagen >= this.galnumimagenes )		return false;
			if ( numImagen == this.galimagenActual )	return false;
			
			var descripActual 		= this.galdescripcion [ this.galimagenActual ];
			var descripSiguiente	= this.galdescripcion [ numImagen ];
			
			if ( numImagen > this.galimagenActual )
			{
				var initCount		= this.galimagenActual;
				var finishCount		= numImagen;
				var fordward		= true;
			}
			else
			{
				var initCount		= numImagen;
				var finishCount		= this.galimagenActual;
				var fordward		= false;
			}
			
			if ( this.bloqueado ) 	return false;
			else					this.bloqueado = true;
			
			//this.desapareceBloque ( descripActual );
			//this.apareceBloque ( descripSiguiente );
			this.transicionEntreBloques ( descripActual , descripSiguiente );
			
			for ( var count = initCount; count <= finishCount; count++ ) 
			{
				if (!document.getElementById(this.galimagenes[count])) 
				{
					this.bloqueado = false;
					return false;
				}
				
				imagenActual = document.getElementById(this.galimagenes[count]);
				
				if ( fordward )
				{
					if 		( count == initCount )		new Effect.Move(imagenActual, { x: -this.desplazamientoX, y: -this.desplazamientoY, duration: this.tiempoTrans });
					else if	( count == finishCount )	new Effect.Move(imagenActual, { x: -this.desplazamientoX, y: -this.desplazamientoY, duration: this.tiempoTrans, afterFinish: ( function(){ claseGaleria.desbloquear (); }) });
					else								new Effect.Move(imagenActual, { x: -(this.desplazamientoX * 2), y: -(this.desplazamientoY * 2), duration: this.tiempoTrans });
				}
				else
				{
					if 		( count == initCount )		new Effect.Move(imagenActual, { x: this.desplazamientoX, y: this.desplazamientoY, duration: this.tiempoTrans });
					else if	( count == finishCount )	new Effect.Move(imagenActual, { x: this.desplazamientoX, y: this.desplazamientoY, duration: this.tiempoTrans, afterFinish: ( function(){ claseGaleria.desbloquear (); }) });
					else								new Effect.Move(imagenActual, { x: (this.desplazamientoX * 2), y: (this.desplazamientoY * 2), duration: this.tiempoTrans });
				}
			}
			
			if ( this.tieneBotones )
			{
				var botonActual 	= this.galbuttons [ this.galimagenActual ];
				var botonSiguiente	= this.galbuttons [ numImagen ];
				
				this.resaltarBoton ( botonSiguiente );
				this.atenuarBoton  ( botonActual );
			}
			
			// Reiniciamos el reloj
			self.clearTimeout ( this.timer );
			this.timer = self.setTimeout ( 'claseGaleria.siguienteImagenAutoGaleria()' , this.tiempoEvento );
			
			this.galimagenActual = numImagen;
		}
		
		this.siguienteImagenGaleriaLoop = function siguienteImagenGaleriaLoop ()
		{
			if ( this.galnumimagenes <= 1 )  return false;
			
			if ( this.galimagenActual == ( this.galnumimagenes - 1 ) )
			{
				var imagenActual = null;
				
				var descripActual 		= this.galdescripcion [ this.galimagenActual ];
				var descripSiguiente	= this.galdescripcion [ 0 ];
				
				if ( this.bloqueado ) 	return false;
				else					this.bloqueado = true;
				
				//this.desapareceBloque ( descripActual );
				//this.apareceBloque ( descripSiguiente );
				this.transicionEntreBloques ( descripActual , descripSiguiente );
				
				for ( var count = ( this.galnumimagenes - 1 ); count >= 0; count-- ) 
				{
					if (!document.getElementById(this.galimagenes[count])) 
					{
						this.bloqueado = false;
						return false;
					}
					
					imagenActual = document.getElementById(this.galimagenes[count]);
					
					if 		( count == 0 ) 								new Effect.Move(imagenActual, { x: this.desplazamientoX, y: this.desplazamientoY, duration: this.tiempoTrans, afterFinish: ( function(){ claseGaleria.desbloquear (); }) });
					else if	( count == ( this.galnumimagenes - 1 ) )	new Effect.Move(imagenActual, { x: this.desplazamientoX, y: this.desplazamientoY, duration: this.tiempoTrans, afterFinish: ( function(){ claseGaleria.desbloquear (); }) });
					else												new Effect.Move(imagenActual, { x: (this.desplazamientoX * 2), y: (this.desplazamientoY * 2), duration: this.tiempoTrans });
				}
				
				if ( this.tieneBotones )
				{
					var botonActual 	= this.galbuttons [ this.galimagenActual ];
					var botonSiguiente	= this.galbuttons [ 0 ];
					
					this.resaltarBoton ( botonSiguiente );
					this.atenuarBoton  ( botonActual );
				}
				
				this.galimagenActual = 0;
			}
		}
	
	
		// Funciones privadas para la propia clase
		
		this.obtenerPosicionBotonByDiv = function obtenerPosicionBotonByDiv ( idBoton )
		{
			var posicion = 0;
			
			for ( var count = 0 ; count < this.galnumimagenes ; count++ )
			{
				if ( this.galbuttons[count] == idBoton )
				{
					posicion = count; 
					break;
				}
			}
			
			return posicion;
		}
	
		this.desbloquear = function desbloquear ()
		{
			this.bloqueado = false;	
		}
		
		this.resaltarBoton = function resaltarBoton ( idBoton )
		{
			$(idBoton).setStyle({border: '1px solid #FFF'});
		}
		
		this.atenuarBoton = function atenuarBoton ( idBoton )
		{
			var color = $(idBoton).getStyle('background-color');

			$(idBoton).setStyle({border: '1px solid ' + color });
		}
		
		this.transicionEntreBloques = function transicionEntreBloques ( idBloqueDesaparece , idBloqueAparece )
		{
			$(idBloqueDesaparece).setStyle({display: 'none'});
			
			Effect.Fade( idBloqueAparece , { 	duration: this.tiempoTrans, 
										 		from: 0,
										 		to: 1,
										 		afterUpdate: ( function(){ $(idBloqueAparece).setStyle({display: 'block'}); })
			});
		}
		
		this.apareceBloque = function apareceBloque ( idBloque )
		{
			$(idBloque).setStyle({display: 'block'});
		}
		
		this.desapareceBloque = function desapareceBloque ( idBloque )
		{
			$(idBloque).setStyle({display: 'none'});
		}
	}