
function GaleriaSimple(contenedor, datos) {

	this._imagenes = [];
	
	this._posicion = 0;
	
	this._navegando = false;
	
	this._DURACION = 200;
	
	this.cargarImagenes = function() 
	{		
		this._imagenes = datos;
		var galeria = this;
		
		if (this._imagenes != null && this._imagenes.length > 0) 
		{
			// creamos el navegador debajo del contenedor
			var navegador = document.createElement("div");
			$(navegador).attr("id", "Galeria_Simple_Navegador");
			$(navegador).addClass("GaleriaSimpleNavegador");
			$(navegador).css("width", "677px");
			$(navegador).insertAfter(this._contenedor);

			for (var i = 0; i < this._imagenes.length; i++) 
			{
				var image = new Image();
				image.src = this._imagenes[i];
				this._imagenes[i] = image;
				$(this._contenedor).append(image);
				$(image).css("left", "0px");
				$(image).css("top", "0px");
				$(image).css("display", "none");

				var link = document.createElement("a");
				$(link).attr("id", "Galeria_Simple_Link_" + i );
				$(link).addClass("Link_Galeria_Simple");
				$(link).text(""+(i+1));
				
				$(navegador).append(link);
				$(link).click(function(){
					galeria.navegar(parseInt(this.id.replace("Galeria_Simple_Link_","")));
				});	

				if (i == 0) 
				{
					$(link).addClass("Actual");
					$(this._imagenes[0]).fadeIn("slow");
				}
			}

		}
	};

	this.navegar = function(pos) {
		if (this._navegando) return;
		if (pos != this._posicion) {
			var galeria = this;
			this._navegando = true;
		
			$(this._imagenes[this._posicion]).fadeOut('slow', function() {

				$(galeria._imagenes[pos]).fadeIn("slow", function() {
					$("#Galeria_Simple_Link_" + galeria._posicion).removeClass("Actual");
					galeria._posicion = pos;
					$("#Galeria_Simple_Link_" + galeria._posicion).addClass("Actual");
					galeria._navegando = false;	
				});

			});

		}
	};	
	
	this.detachAllImages = function() {
		$(this._contenedor).children("img").remove();
	};

	/////////////////////
	/// INICIALIZACION
	/////////////////////
	
	// nos quedamos con el contenedor	
	this._contenedor = contenedor;
	
	// seteamos la clase CSS
	$(this._contenedor).addClass("GaleriaSimple");
	
	// atachamos el wrapper
	var wrapper = document.createElement("div");
	$(wrapper).attr("id", "Galeria_Simple_Wrapper");
	$(wrapper).addClass("GaleriaSimpleWrapper");
	$(wrapper).css("padding-bottom", "10px");
	$(this._contenedor).wrap(wrapper);
	
	// cojemos las dimensiones del contenedor	
	this._width  = parseInt($(this._contenedor).css("width").replace("px", ""));
	this._height = parseInt($(this._contenedor).css("height").replace("px", ""));
	
	this.cargarImagenes();
	
}
