// JavaScript Document



function CuadroScroll( sIDBox )
{
	this.loaded = false;

	this.sDivName = sIDBox;  // ID del DIV que contiene los cuadros
	this.iNoDivsScroll ;		// No de cuadros (divs) o de opcioens
	this.iNoDivActual = -1;		// Div Actual
	this.divScroll;			// Objeto que contiene el DIV dado por sIDBox, se inicializa al cargar el DOM
	this.iAnchoScroll;		// Ancho de cada cuadro
	
	this.iDelay = 300;  	// Milisegundos para concluir cambiar de posicion.
	this.iDelayScroll = 15000;  // Milisegundos para cambiar posiciones
	this.iTXCuadro = parseInt((1/30)*1000 );	// Milisegundos por cambio a 12 fps
	this.timer = null;			// Timer que anima un cuadro
	this.timerScroll = null;		// Timer para cambiar cada cuadro

	this.iXinicial;
	this.iXactual;
	this.iXfinal;
	this.iXinc;
	
	var varThis = this;		// Para ser usada desde MueveUnaX()
	


	/* Esta funcion no es normal debido a que el SetInverval() no funciona con métodos, solo funciones, asi que se cambiaron 
	  las referencias a this, por la variable varThis */
	this._MueveUnaX = function( ) 	
	{

			//if (  varThis.iXactual + varThis.iXinc  < varThis.iXfinal )
			if (  Math.abs( varThis.iXfinal -   (varThis.iXactual + varThis.iXinc)  )  > Math.abs(varThis.iXinc) )
				varThis.iXactual += varThis.iXinc;
			else
			{
				varThis.iXactual = varThis.iXfinal;
				varThis.Stop();
				varThis.timer = null;
			}
				
			varThis.divScroll.style.left = varThis.iXactual + "px"; 
	};
	
	this._Camina = function ()
	{
		
		varThis.Next();	
		
	}
	

}

CuadroScroll.prototype.Next = function( )
{
	var nuevapos;
	
		nuevapos = this.iNoDivActual + 1;
		if( nuevapos > this.iNoDivsScroll -1 )
			nuevapos = 0;
		this.CambiaDiv(nuevapos);
	
}

CuadroScroll.prototype.Previous = function( )
{
	var nuevapos;
	
		nuevapos = this.iNoDivActual - 1;
		if( nuevapos < 0 )
			nuevapos = this.iNoDivsScroll -1;
		this.CambiaDiv(nuevapos);
	
}
CuadroScroll.prototype.Stop = function( ) 									
{
		if ( this.timer == null ) return;  
		
		clearInterval(this.timer);
		this.timer = null;

}

CuadroScroll.prototype.StopScroll = function( ) 									
{
		if ( this.timerScroll == null ) return;  
		
		clearInterval(this.timerScroll);
		this.timerScroll = null;

}

CuadroScroll.prototype.StartScroll = function( iDelay ) 									
{
	if( !this.loaded ) return;
	
	if ( this.timerScroll != null ) ;   // Scroll en proceso
		this.StopScroll();
	
	if ( iDelay )  this.iDelayScroll = iDelay;
	
 	this.timerScroll  = setInterval( this._Camina, this.iDelayScroll  );
	
}


//window.addEvent('onload',function()
CuadroScroll.prototype.Ini = function( iDivIncial ) 									
{
	var iAncho,i,j;
	var iNoDivs;
	var TagsNexts;
	//sIDBox = "carrusel";

	if( !iDivIncial ) iDivIncial = 0;

	 this.divScroll = document.getElementById(this.sDivName);	
	 iAncho=this.divScroll.offsetWidth
	 iNoDivs=0;

	
	// Contar los DIVs dentro del marco

	for( i=0; i< this.divScroll.childNodes.length; i++ )
		if( this.divScroll.childNodes.item(i).nodeName == "DIV" )
			iNoDivs++;
	
	
	
	this.divScroll.style.width =iAncho*iNoDivs + "px"; // setAttribute("width",iAncho*iNoDivs);
	this.iNoDivsScroll = iNoDivs;
	this.iNoDivActual = 0;
	this.iAnchoScroll = iAncho;
	this.loaded = true;
	this.iXactual = - iDivIncial * this.iAnchoScroll;
	this.iNoDivActual = iDivIncial;
	this.divScroll.style.left = this.iXactual + "px";
	
			// Primera imagen

	document.getElementById('imgCarrusel_' + iDivIncial).src = aImgCarrusel[iDivIncial];

	
	
} 

CuadroScroll.prototype.IniScroll = function( iDivIncial )
{
	
		if( !iDivIncial ) iDivIncial = 0;

		this.Ini(iDivIncial);
		
	// Agregar botones de accion si existen las divs	
	
	
		TagsNexts = this.divScroll.getElementsByTagName("span");	
		for( i=0; i< TagsNexts.length; i++ )
		{
			if( TagsNexts[i].className == "next" )
				TagsNexts[i].onclick = function () { scrollCarrusel.Next(); };
			else if( TagsNexts[i].className == "prev" )
				TagsNexts[i].onclick = function () { scrollCarrusel.Previous(); };
		}
		
	
	
		this.StartScroll();

	
}
//);

CuadroScroll.prototype.CambiaDiv = function( pos ) 	
{	
	
	if( !this.loaded ) return;
	
	if ( pos < 0 || pos > this.iNoDivsScroll )
		return;

	if ( this.timer != null ) return;   // Scroll en proceso
	
	if ( this.iNoDivActual ==  pos ) return; // Ya esta ahi, no hacer nada
	
	this.iXinicial = - this.iNoDivActual * this.iAnchoScroll;
	this.iXfinal = - pos * this.iAnchoScroll;
	this.iXinc = parseInt( ( (this.iXfinal - this.iXinicial)*this.iTXCuadro ) / this.iDelay );  // Incremento de X por cada cuadro
	this.iXactual = this.iXinicial;
	this.iNoDivActual = pos;
	
	//alert( "xact: " + this.iXactual + "xin: " + this.iXinicial + " xfin: " + this.iXfinal + " xinc:  "  + this.iXinc );

 	this.timer  = setInterval( this._MueveUnaX, this.iTXCuadro );
	
	// La imagen
	document.getElementById('imgCarrusel_' + pos).src = aImgCarrusel[pos];
	this.StartScroll(); // Reinicia conteo para cambiar de pagina



}

CuadroScroll.prototype.CambiaDivInmediato = function( pos ) 	
{	
	
	if( !this.loaded ) return;
	
	if ( pos < 0 || pos > this.iNoDivsScroll )
		return;
		
	this.iXinicial = - this.iNoDivActual * this.iAnchoScroll;
	this.iXfinal = - pos * this.iAnchoScroll;
	this.iXinc = parseInt( ( (this.iXfinal - this.iXinicial)*this.iTXCuadro ) / this.iDelay );  // Incremento de X por cada cuadro
	this.iXactual = this.iXinicial;
	this.iNoDivActual = pos;
	
	//alert( "xact: " + this.iXactual + "xin: " + this.iXinicial + " xfin: " + this.iXfinal + " xinc:  "  + this.iXinc );

	this.divScroll.style.left = this.iXfinal + "px";

}