/*
// -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- ---- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 
   Panel de desplazamiento horizontal
   Namespace es.aquataller.ui
   version:  d01-m02-a07
//  -- -- -- -- -- -- -- -- --
//  Mauricio F. Tolezano (www.acuataller.com)
// -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- ---- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 
// 
//
*/


es.aquataller.ui.PanelHorizontal = function (cont, panel, lkAnt, lkSig, margen, margenEstatico) 
{
	this.contenedor 	= cont;
	this.panel			= panel;
	this.lkAnterior		= lkAnt;
	this.lkSiguiente	= lkSig;
	this.margen			= margen;
	this.margenEstatico	= margenEstatico;
	
	this.desplazamiento = false;
	this.u				= null;
}


es.aquataller.ui.PanelHorizontal.prototype  = {
	
	iniciar: function(posInicial) 
	{	 		
		if(posInicial) { 
			this.panel.style.left = posInicial;
		}
		
		var u = new es.aquataller.utiles.Utiles();
		if(!document.getElementById	||!u.createElement) return false;		
		this.u = u;	
		this.ajustarAlAncho();		
	},
	
	ajustarAlAncho: function(x1,x2,iniciar) 
	{		
		// Activar o no desplazamiento
		this.desplazamiento = this.panel.offsetWidth + this.margen > this.contenedor.offsetWidth;
		
		if(this.desplazamiento) {	
			this.u.asignarEstilo(this.panel,'desplazamiento');
			//this.u.eliminarEstilo(this.panel,'estatico');
		}else{
			this.u.eliminarEstilo(this.panel,'desplazamiento');
			//this.u.asignarEstilo(this.panel,'estatico');
			this.panel.style.left = '';
		}
		
		/*if(iniciar && this.desplazamiento) {	
			// Posicion inicial.
			var x1Actual = parseInt(this.panel.style.left);				
			if(!x1Actual||x1Actual!=this.margen) {
				x1 = this.margenEstatico;
				x2 = this.margen;
			}		
		}else */
		if(!x1||!x2 && this.desplazamiento){
			x1 = x2 = parseInt(this.panel.style.left) || this.margen;	
		}
		
		if(x1&&x2 && this.desplazamiento){
			// Limite de desplazamiento.
			var anchoMenu 	= this.contenedor.offsetWidth; 
			var	topeIzq		= this.margen;
			var	topeDer		= 0 - (this.panel.offsetWidth - anchoMenu + this.margen);
			
			x1	= x1 || topeIzq;			
			x2 	= Math.min(x2, this.margen);
			x2 	= Math.max(x2, topeDer);				
		}
		
		// Siguiente, Anterior
		// Visibles
		if(this.desplazamiento) {
			 this.u.asignarEstilo(this.lkAnterior, 'activo'	);
			 this.u.asignarEstilo(this.lkSiguiente,'activo'	);
		}else {			 
			 this.u.eliminarEstilo(this.lkAnterior, 'activo'	);
			 this.u.eliminarEstilo(this.lkAnterior, 'tope'		);
			 this.u.eliminarEstilo(this.lkSiguiente,'activo'	);				
			 this.u.eliminarEstilo(this.lkSiguiente,'tope'		);				 
		}	
		// Tope
		if(x2==topeIzq){
			this.u.asignarEstilo(this.lkAnterior, 'tope'	);
			this.lkAnterior.guardarTitle = this.lkAnterior.title;
			this.lkAnterior.title = '';
		}else{
			this.u.eliminarEstilo(this.lkAnterior, 'tope'	);
			if(this.lkAnterior.guardarTitle) this.lkAnterior.title = this.lkAnterior.guardarTitle;
		}
		if(x2==topeDer){
			this.u.asignarEstilo(this.lkSiguiente, 'tope'	);
			this.lkSiguiente.guardarTitle = this.lkSiguiente.title;
			this.lkSiguiente.title = '';
		}else{
			this.u.eliminarEstilo(this.lkSiguiente, 'tope'	);
			if(this.lkSiguiente.guardarTitle) this.lkSiguiente.title = this.lkSiguiente.guardarTitle;
		}
		
		if(x1&&x2 && this.desplazamiento) this.desplazar(x1, x2);
	},	
	
	reajusteVentana: function() 
	{
		// Retardo de ajuste.
		var _this = this;			
		window.clearTimeout(this.retardoAjuste);
		this.retardoAjuste = null;
		this.retardoAjuste = window.setTimeout(function(){_this.ajustarAlAncho()}, 300);			
	},
	
	
	paneo: function(derecha) 
	{	 		
		var derecha 		= (derecha==false)?false:true;		
		var elementosMenu 	= this.panel.getElementsByTagName('li');
		var anchoElemento 	= elementosMenu[0].offsetWidth;
		var anchoMenu 		= this.contenedor.offsetWidth; 
		
							// Distancia de desplazamiento
		var distancia		= anchoElemento * Math.floor((anchoMenu-(this.margen*2))/anchoElemento);	
		var x1 				= parseInt(this.panel.style.left); 		
		var x2 				= (derecha)? x1 + distancia - this.margen : x1-distancia;					
		
		this.ajustarAlAncho(x1, x2);
	},	
	
	
	desplazar: function(x1,x2) 
	{	 				
		var transicion = new Animator().addSubject(
			new NumericalStyleSubject(this.panel, 'left', x1, x2)
		);
		transicion.play();
	},	
	
	
	posicion: function() 
	{	 				
		return (this.panel.style)? this.panel.style.left : 0;
	}	
	
}