/*
// -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- ---- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 
   Galeria de imagenes
   Namespace es.aquataller.ui
   version:  d04-m06-a08
//  -- -- -- -- -- -- -- -- --
//  Mauricio F. Tolezano (www.acuataller.com)
// -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- ---- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 
// 
//
*/
	
	


es.aquataller.ui.GaleriaImagenes = {

	idNavImagenes	: false,
	idContenedorAmpliacion		: false,
	u				: false,	
	precargaImagen	: false,
	
	// Elementos DOM
	navImagenes		: false,
	enlacesImagenes	: false, // HTML collection de enlaces a imagenes
	seleccion 		: false, // Elemento A activo
	ampliacion		: { contenedor		 : false, 
						contenedorImagen : false, 
						imagen			 : false, 
						titulo			 : false 
					  },	
	
	opciones 		: { 
						banderaDOM 	: 'dom',
						ampliacion	:{	contenedor 		 : {elemento:'div'	, id:'ampliacion'	 	 ,'className':false	},
										contenedorImagen : {elemento:'div'	, id:'imagen-ampliada'	 ,'className':false	},	
										titulo			 : {elemento:'p'	, id:'titulo-ampliacion' ,'className':false , estiloActivo:'activo'	},
										estiloPrecarga	 : 'cargando',
										estiloActivo	 : 'activo'
									} ,
						funcTitulo 	: false,			
						navImagenes:{	estiloPrecarga:'cargando', estiloActivo	 : 'ampliacion-activa',
										imagen			 : {estiloPrecarga:'cargando', estiloActivo:'activo'}
									},
						vista	   :{	vistaPrecarga			: false, 
										vistaFinPrecarga		: false, 
										vistaCerrarAmpliacion	: false,
										crearAmpliacion			: false,
										scope					: false
									},
						seleccionInicial : false		
					  },
	
	
	
	iniciar: function(idNavImagenes, idContenedorAmpliacion, preferencias ) 
	{	 
		if(	!document.getElementById
		   	||
		   	!document.getElementsByTagName
		   	||
		   	!document.getElementById(idContenedorAmpliacion)
		   	||
		  	!document.getElementById(idNavImagenes)
		  	||
			!document.getElementById(idNavImagenes).getElementsByTagName('a')
			||
			!document.getElementById(idNavImagenes).getElementsByTagName('a')[0]
			||
			!document.createElement
		   ) return false;


		this.idNavImagenes			= idNavImagenes;
		this.idContenedorAmpliacion = idContenedorAmpliacion;
		this.opciones 				= this.aplicarPreferencias( this.opciones, preferencias );
		this.u 						= new es.aquataller.utiles.Utiles();		
		
		// Bandera para actiar estilos necesarios junto con la ejecucion Javascript
		this.u.setClaseBandera(this.opciones.banderaDOM); 
		
		// Navegacion de imagenes
		this.navImagenes 	 = document.getElementById(this.idNavImagenes);
		this.enlacesImagenes = this.navImagenes.getElementsByTagName('a');
		
		var _this = this;		
		for (i=0; a=this.enlacesImagenes[i]; i++)
		{
			a.onclick=function() {
				_this.seleccionar(this);		
				return false;
			}
		}
		
		// Ampliacion
		this.crearAmpliacion();
		// Precarga de imagenes.
		this.precargaImagen = new es.aquataller.utiles.CargarImagen(this.ampliacion.imagen, this.onCargaCompletada, this);
		
		if(this.opciones.seleccionInicial){
			this.seleccionar(this.opciones.seleccionInicial);
		}
			
	},		
	
	aplicarPreferencias : function(defaults, prefs) 
	{
		prefs = prefs || {};
		var prop, result = {};
		for (prop in defaults) result[prop] = prefs[prop] || defaults[prop];
		return result;
	},
	
	getTituloImagen: function(a) 
	{	
		if(this.opciones.funcTitulo)
		{
			return this.opciones.funcTitulo(a);
		}
		else if(a.childNodes[1] && a.childNodes[1].nodeName=='IMG')
		{
			return a.childNodes[1].alt;
		}
		else if(a.title)
		{
			return a.title;
		}
		else
		{
			return '';
		}
	},
	
	seleccionar: function(a) 
	{		
		if(typeof(a)=='number')
		{			
			a--;
			if(this.enlacesImagenes[a]) {
				a = this.enlacesImagenes[a];
			} else {
				return false;
			} 
		}
		
		this.seleccionarImagen(a);
		this.cargarImagen(a.href, this.getTituloImagen(a) );	
	},
	
	seleccionarImagen: function(a) 
	{
		var seleccion 	= this.seleccion;
		this.seleccion = a;
		this.vistaCambioSeleccion(seleccion);
	},
	
	
	cargarImagen: function(url, titulo) 
	{					
		this.precargaImagen.cargar(url);
		
		this.vistaPrecarga(this, titulo);
	},
	
	
	onCargaCompletada: function() 
	{	
		this.vistaFinPrecarga();
	},
	
	
	cerrarAmpliacion: function() 
	{	
		this.vistaCerrarAmpliacion(this.seleccion);
		
		this.seleccion 	= null;
	},	
	
	
	vistaCambioSeleccion : function(seleccion)
	{
		if(seleccion) {	
			this.u.eliminarEstilo(seleccion, this.opciones.navImagenes.imagen.estiloActivo);
			this.u.eliminarEstilo(seleccion, this.opciones.navImagenes.imagen.estiloPrecarga);
		}
	},
	
	
	vistaPrecarga: function(titulo) 
	{		
		// Titulo
		if(this.ampliacion.titulo) {
			if(titulo)
			{
				this.u.asignarEstilo(this.ampliacion.titulo, this.opciones.ampliacion.titulo.estiloActivo);
				this.ampliacion.titulo.replaceChild( this.u.createTextNode( titulo ), this.ampliacion.titulo.firstChild );
			}else{
				this.u.eliminarEstilo(this.ampliacion.titulo, this.opciones.ampliacion.titulo.estiloActivo);
			}
		}
		
		
		// Navegacion de imagenes.
		this.u.asignarEstilo(this.navImagenes, this.opciones.navImagenes.estiloPrecarga );		
		
		// Imagen seleccionada.
		this.u.asignarEstilo(this.seleccion, this.opciones.navImagenes.imagen.estiloPrecarga);
		
		
		// Ampliacion.
		this.u.eliminarEstilo(this.ampliacion.contenedor, this.opciones.navImagenes.estiloActivo);
		this.u.asignarEstilo(this.ampliacion.contenedor, this.opciones.navImagenes.estiloPrecarga);
		
		//alert(this.ampliacion.contenedor.id);
		
		if(this.opciones.vista.vistaPrecarga) 
			this.opciones.vista.vistaPrecarga.call(this.opciones.vista.scope);
	},
	
	
	vistaFinPrecarga: function() 
	{		
		// Navegacion de imagenes.
		this.u.eliminarEstilo(this.navImagenes, this.opciones.navImagenes.estiloPrecarga );
		this.u.asignarEstilo(this.navImagenes, this.opciones.navImagenes.estiloActivo );
		
		// Imagen seleccionada.
		this.u.eliminarEstilo(this.seleccion, this.opciones.navImagenes.imagen.estiloPrecarga);
		this.u.asignarEstilo(this.seleccion, this.opciones.navImagenes.imagen.estiloActivo);
		
		// Ampliacion.		
		this.u.eliminarEstilo(this.ampliacion.contenedor, this.opciones.navImagenes.estiloPrecarga);
		this.u.asignarEstilo(this.ampliacion.contenedor, this.opciones.navImagenes.estiloActivo);		
		
		if(this.opciones.vista.vistaFinPrecarga) 
			this.opciones.vista.vistaFinPrecarga.call(this.opciones.vista.scope);
	},	
	
	vistaCerrarAmpliacion: function(seleccion) 
	{	
		if(seleccion) 
		{
			this.u.eliminarEstilo(seleccion, this.opciones.navImagenes.imagen.estiloPrecarga);
			this.u.eliminarEstilo(seleccion, this.opciones.navImagenes.imagen.estiloActivo);
		}
		this.u.eliminarEstilo(this.navImagenes, this.opciones.navImagenes.estiloPrecarga );
		this.u.eliminarEstilo(this.navImagenes, this.opciones.navImagenes.estiloActivo );
		
		this.u.eliminarEstilo(this.ampliacion.contenedor, this.opciones.navImagenes.estiloPrecarga);
		this.u.eliminarEstilo(this.ampliacion.contenedor, this.opciones.navImagenes.estiloActivo);
		
		if(this.opciones.vista.vistaCerrarAmpliacion) 
			this.opciones.vista.vistaCerrarAmpliacion.call(this.opciones.vista.scope);
	},	

	
	crearAmpliacion: function() 
	{	
		if(this.opciones.vista.crearAmpliacion)
		{
			this.opciones.vista.crearAmpliacion();
			return;
		}
		
		// Titulo de la imagen
		if(this.opciones.ampliacion.titulo)
		{
			this.ampliacion.titulo				= this.u.createElement(this.opciones.ampliacion.titulo.elemento);
			this.ampliacion.titulo.id 			= this.opciones.ampliacion.titulo.id;			
			if(this.opciones.ampliacion.titulo.className) 
				this.ampliacion.titulo.className = this.opciones.ampliacion.titulo.className;		
			
			this.ampliacion.titulo.appendChild( this.u.createTextNode(' ') );
		}
		
		
		// Imagen ampliada
		this.ampliacion.imagen				= this.u.createElement('img');			
		
		// Contenedor de la imagen ampliada.
		this.ampliacion.contenedorImagen	= this.u.createElement(this.opciones.ampliacion.contenedorImagen.elemento);
		this.ampliacion.contenedorImagen.id = this.opciones.ampliacion.contenedorImagen.id;			
		if(this.opciones.ampliacion.contenedorImagen.className) 
			this.ampliacion.contenedorImagen.className = this.opciones.ampliacion.contenedorImagen.className;		
		
		this.ampliacion.contenedorImagen.appendChild( this.ampliacion.imagen );
		
		
		// Contenedor de la imagen ampliada y su descripcion.
		this.ampliacion.contenedor 			= this.u.createElement(this.opciones.ampliacion.contenedor.elemento);
		this.ampliacion.contenedor.id 		= this.opciones.ampliacion.contenedor.id;
		if(this.opciones.ampliacion.contenedor.className) 
			this.ampliacion.contenedor.className = this.opciones.ampliacion.contenedor.className;		
				
		this.ampliacion.contenedor.appendChild( this.ampliacion.titulo				);
		this.ampliacion.contenedor.appendChild( this.ampliacion.contenedorImagen	);
		
		
		document.getElementById( this.idContenedorAmpliacion ).appendChild( this.ampliacion.contenedor );			
	}
	
	
}
