/*
*	AUTOR: Eduardo Guerrero
*	FECHA: 26.12.2009
*	ARCHIVO: galeria.js
*	DESCRIPCION: contiene las funciones para la galeria de imagenes
*				 
*/

	/*
	*variables globales
	*/		
	var nomsImg = new Array();
	var maxLon = 0;
	var lonImgs = 0;
	
	/*
	*varbiales de configuracion
	*/
	var txtPreload = 'Cargando..';//mensaje de preload de cada imagen
	var info = 'Usa la ruedita del raton para navegar'//atributo alt de las miniaturas
	var velocidadWheel = 20; //velocidad con la que scrollea la tira de imagenes
	var dirImagenes = 'galeria/';
	
	/*
	*Carga las miniaturas en la tira de imagenes y configura
	*los metodos y propiedades de cada una
	*/
	function cargarThumbs (){
		var peticion = new Request({
			url:'servidor.php',
			method:'get',
			onSuccess: function(texto, xml){
				nomsImg = texto.split(',');
				var rutasThumb = new Array();
				for ( i=0;i<nomsImg.length;i++ ){
					rutasThumb[i] = dirImagenes+'thumb_'+nomsImg[i];
				}
				
				maxLon = $('cajaTiraImagenes').getStyle('width').toInt();
			
				var imagenes = new Asset.images ( rutasThumb, {					
					onProgress:function( counter, index ){		
						var img = new Element('img', {
							id: nomsImg[index],
							alt: info,
							src: this.src
						});
						img.addEvent( 'click', function(){
							if ( $('cajaBienvenida') != null ){
								$('img').empty();
							}
							if ( $('fondoImagen') == null ){
								var fondoImagen = new Element( 'div', {
									id:'fondoImagen',
									text:txtPreload
								});
								fondoImagen.inject('img');
							}
							cargarImg(this.id);
						});

						lonImgs += this.width + 20;						

						img.addClass('cajaThumb');
						img.inject( 'cajaTiraImagenes' );
						if ( lonImgs > maxLon ){
							$('cajaTiraImagenes').setStyle('width', lonImgs);
						}						
					}
				});
			}
		});
		peticion.send( 'accion=1' );	
	}
	
	/*
	*Esta funcion carga una imagen en la ventana principal 
	*de la galeria
	*/
	function cargarImg( idImagen ){
		
		//si la caja para imagenes no esta la ponemos
		if ( $('fondoImagen').get('opacity') == 0 ){
			$('fondoImagen').set('text', txtPreload);	
			$('fondoImagen').set('opacity', 100);			
		}
		
		//si la imagen que queremos ver ya esta en la
		//caja, entonces no hacemos nada
		if ( $('preVista') != null){
			if ( $('preVista').get('src') == dirImagenes+"med_"+idImagen){
				//una forma facil de salir de un funcion
				return 0;
			}
		}
		
		//si hay alguna imagen en la caja la quitamos
		if ( $('preVista') != null  ) {
			$('preVista').set('opacity', 0);
			$('fondoImagen').empty();
			$('fondoImagen').set('text', txtPreload);
		}		
				
		rutaImg = dirImagenes+'med_'+idImagen;
						
		var imagen = new Asset.image(rutaImg, {
			id:'preVista',
			opacity:0,
			onload: function() {
				var resize = new Fx.Morph($('fondoImagen'), { 
					duration: 'short',
					onComplete:function(){
						$('fondoImagen').set('text', '');	
						imagen.inject( 'fondoImagen' );
						imagen.set('opacity',100);
					}
				});
				
				resize.start({
					width: this.width+10, 
					height: this.height+10 
				});				
			}
		});
		

		
	}
	
	/*
	*Adminsitra el scroll de la tira de imagenes
	*/
	function scroll(){
		var pos = 0;
		$('desborda').addEvent('mousewheel', function(event){
			var limSup = lonImgs - $('desborda').getStyle('width').toInt();
			pos += (event.wheel*velocidadWheel)
			if (pos <=  0) pos = 0;
			if (pos >=  (limSup)) {
				pos = limSup;
			}
			var efecto = new Fx.Scroll(this, { duration:'short' } ).set( pos, 0 );
		});		

	}
	
	/*
	*Adihere el color verde a la tira de imagenes
	*/
	function limoon(){
		$('cajaTiraImagenes').addEvents({
			'mouseenter':function(){
				$('cajaTiraImagenes').morph('.limoon');
			},
			'mouseleave':function(){
				$('cajaTiraImagenes').morph('.cajaTiraImagenes');
			}
		});
	}
	
	/*
	*Inicio de la aplicacion
	*/
	window.addEvent( 'domready', function(){
		limoon();
		cargarThumbs();	
		scroll();			
	});

