// -----------------------------
// Carrousel
// -----------------------------
// Visor de imágenes con flechas 
// -----------------------------

var Carrousel = function(contexto, anchoImagen, maxImagenesVisibles){

	// Tipado fuerte
	ObjectUtils.strict([Object, Number, Number], arguments);
	
	// Variables privadas
	var _ct = this;
	var _contexto;
	var _anchoImagen;
	var _maxImagenesVisibles;
	
	var _numCargadas;
	var _fromImg;
	var _toImg;
	var _numImg;
	var _actualImg;
	
	var _carrouselColumna;
	var _carrouselColumnaVisor
	var _carrouselColumnaCont;
	var _carrouselColumnaDivs;
	var _carrouselFlechaLeft;
	var _carrouselFlechaRight;
	
	// Getter / Setter
	this.contexto = function(data){
		if (arguments.length==0) return _contexto;
		else _contexto = data;
	}
	
	this.anchoImagen = function(data){
		if (arguments.length==0) return _anchoImagen;
		else _anchoImagen = data;
	}
	
	this.numImg = function(){
		return _numImg;
	}
	
	// Métodos privados
	function resetCarrousel() {
		_fromImg = 0;
		_toImg = 0;
		_numImg = 0;
		_actualImg = 0;
		_numCargadas = 0;
		// si ya se han creado las flechas, se borran
		if (_carrouselFlechaLeft) _carrouselFlechaLeft.remove();
		if (_carrouselFlechaRight) _carrouselFlechaRight.remove();
	}
	
	function getReferencesCarrousel() {
		_carrouselColumna =  _contexto.find(".destacado_columnas");
		_carrouselColumnaVisor = _carrouselColumna.find(".visor_columnas");
		_carrouselColumnaCont = _carrouselColumnaVisor.find(".visor_columnas_contenido");
		_carrouselColumnaDivs = _carrouselColumnaCont.find("div");
	}
	
	function cargaCarrousel() {
		_numImg = _carrouselColumnaCont.children().size();
		_fromImg = 1;
		_toImg = _numImg - _maxImagenesVisibles + 1;
		_actualImg = 1;
		
		_carrouselColumnaCont.css({marginLeft: "0px"});	
		// precargamos las imágenes
		_carrouselColumnaDivs.find("img").css({opacity: 0}).hide();
		_carrouselColumnaDivs.find("p").css({opacity: 0}).hide();
		if (!ObjectUtils.isIE) $('<div class="ajax_loader"></div>').prependTo(_carrouselColumnaDivs);
		
		window.setTimeout(cargaImagenesCarrousel, 750);
		
		// pasador de imágenes
		anadirPasadorCarrousel();
	}
	
	function anadirPasadorCarrousel() {
		if (_numImg > _maxImagenesVisibles){
			// creamos los contenedores de las flechas, etc
			$('<div class="visor_columnas_left" id="visor_columnas_left"></div>').insertBefore(_carrouselColumnaVisor).hide();
			$('<div class="visor_columnas_right" id="visor_columnas_right"></div>').insertAfter(_carrouselColumnaVisor).hide();
			
			// asignamos los clicks de las flechas
			_carrouselFlechaLeft = _contexto.find("#visor_columnas_left");
			_carrouselFlechaRight = _contexto.find("#visor_columnas_right");
			
			
			_carrouselFlechaLeft.click(function() {
				_ct.showImage(-1);
				return false;
			});
			
			_carrouselFlechaRight.click(function() {
				_ct.showImage(1);
				return false;
			});
		}
	}
	
	function cargaImagenesCarrousel(){
		for (var i = 0; i < _numImg; i++) {
		
			var imagenParticular = _carrouselColumnaCont.find(".destacado_columna:eq(" + i + ") img");
			var source_alt = imagenParticular.attr("alt");
			var source = (source_alt != "") ? source_alt : imagenParticular[0].src;
			var pre_source = (ObjectUtils.isIE) ? source + "?" + ObjectUtils.randomStr(8) : source;
			
			// la cambiamos (si es alternativa)
			if (source_alt != "") imagenParticular[0].src = source;
			
			$('<img />').attr('alt', i).attr('src', pre_source).load(function(){
				var numChild = parseInt(this.alt);
				
				var columnaParticular = _carrouselColumnaCont.find(".destacado_columna:eq(" + numChild + ")");
				
				var visorImagen = columnaParticular.find("img");
				var visorParrafos = columnaParticular.find("p");
				var visorPrecarga = _carrouselColumna.find(".ajax_loader:eq(" + numChild + ")");
				
				visorImagen.attr("alt", $(this).attr("title"));
				
				visorImagen.tooltip({ 
				    track: true, 
				    delay: 0, 
				    showURL: false, 
				    fade: 250 
				});
				
				if (!ObjectUtils.isIE) visorPrecarga.hide();
				visorImagen.show().animate({ opacity: 1 }, "slow");
				visorParrafos.show().animate({ opacity: 1 }, "slow");
				
				_numCargadas++;
				
				if (_numCargadas == _numImg) {
				
					// aprovechamos para colocar las flechas en altura (centradas respecto al alto total de la imagen)
					//var alturaDiv = Math.round((_carrouselColumnaVisor.height() - (_carrouselFlechaLeft.height())) / 2) + "px";
					//_carrouselFlechaLeft.css({ 'margin-top': alturaDiv });
					//_carrouselFlechaRight.css({ 'margin-top': alturaDiv });
					
					// mostramos y ocultamos según sea necesario
					if (_actualImg > _fromImg) _carrouselFlechaLeft.css({ opacity: 0 }).show().animate({ opacity: 1 }, "slow");
					if (_actualImg < _toImg) _carrouselFlechaRight.css({ opacity: 0 }).show().animate({ opacity: 1 }, "slow");
						
					if (ObjectUtils.isIE) _carrouselColumnaVisor.css({ 'margin-left': "25px" });
					// hemos terminado de cargar todo
				}
			});
			
		}
	}
	
	function toggleVisor(side, hideOrShow){
		var flecha = _contexto.find("#visor_columnas_"+side);
		
		if (hideOrShow) {
			flecha.hide();
			if (side=="left") _carrouselColumnaVisor.css({ 'margin-left': "30px" }); 
		} else { 
			flecha.show();
			if (side=="left") _carrouselColumnaVisor.css({ 'margin-left': "0px" });
		}
	}
	
	// Métodos públicos
	this.init = function() {
		resetCarrousel();
		getReferencesCarrousel();
		cargaCarrousel();
	}
	
	this.showImage = function(inc) {
		_actualImg += inc;
		var posX = -_anchoImagen*(_actualImg-1);
		_carrouselColumnaCont.animate({marginLeft: posX+"px"}, "slow");	
		toggleVisor("left", _actualImg == _fromImg);
		toggleVisor("right", _actualImg == _toImg);
	}
	
	this.hide = function(){
		_carrouselColumna.fadeOut("slow");
	}
	
	this.show = function(){
		_carrouselColumna.fadeIn("slow");
	}
	
	
	// Constructor
	//Carrousel.superclass.constructor.call(this,...);
	_contexto 				= contexto;
	_anchoImagen 			= anchoImagen;
	_maxImagenesVisibles 	= maxImagenesVisibles;
	
	_ct.init();
	
};

// Herencia de alguna otra clase
//ObjectUtils.extend(Carrousel, null);

// Métodos públicos
//Carrousel.prototype.metodo = function(){
//	...
//}