/************************* Clase Simple Transition Scroller ***************************/

function SimpleTransitionScroller(divID, imageWidth, cellpadding, milliSecs)
{
	this.ImageWidth = imageWidth;
	this.CellPadding = cellpadding;
	this.MilliSecs = milliSecs;
	this.PanelName = divID;
}

SimpleTransitionScroller.prototype.NavegarIzquierda = function(positions)
{
	this.DoTransicion(this.PanelName, false, (this.ImageWidth + this.CellPadding * 2) * positions, 8);
}

SimpleTransitionScroller.prototype.NavegarDerecha = function(positions)
{
	this.DoTransicion(this.PanelName, true, (this.ImageWidth + this.CellPadding * 2) * positions, 8);
}

//private
SimpleTransitionScroller.prototype.DoTransicion = function(panelName, positivo, totalSize, steps)
{
	var stepSize = totalSize / steps;
	var initialScroll = parseInt(document.getElementById(panelName).scrollLeft);
	var evalText = "";
	for (var i=1;i<=steps;i++)
	{
		var scrollValue = 0;
		if (positivo)
		{
			scrollValue = initialScroll + (stepSize * i);
		}
		else
		{
			scrollValue = initialScroll - (stepSize * i);
		}	
		evalText = "document.getElementById('" + panelName + "').scrollLeft = " + scrollValue + ";";
		//alert(evalText);
		setTimeout(evalText, this.MilliSecs * i);
	}
}
/************************* Clase Transition Scroller ***************************/
function TransitionScroller(divID, imageSrcs, selectedImageSrc, imageWidth, imageHeight, cellpadding, milliSecs, positions)
{
	this.ImageWidth = imageWidth;
	this.ImageHeight = imageHeight;
	this.CellPadding = cellpadding;
	this.MilliSecs = milliSecs;
	this.PanelName = divID;
	this.ImageSrcs = imageSrcs;
	this.Positions = positions;
	this.SelectedIndex = 0;
	this.Images = new Array();
	this.TransitionManager = new SimpleTransitionScroller(divID, imageWidth, cellpadding, milliSecs);
	
	
	//Creo una tabla con las imagaenes adentro
	var table = document.createElement("TABLE");
	table.border = 0;
	table.height = imageHeight;
	table.cellpadding = 2;
	table.cellspacing = 0;
	var tBody = document.createElement("TBODY");
	table.appendChild(tBody);
	var row = document.createElement("TR");
	tBody.appendChild(row);
	
	//Primera Imagen
	var cell = document.createElement("TD");
	row.appendChild(cell);
	var img = document.createElement("IMG");
	img.width = this.ImageWidth;
	img.height = this.ImageHeight;
	img.border = 0;
	img.alt = "Primera foto";
	var hiddenSrc = document.createAttribute("hiddenSrc");
	hiddenSrc.value = "/Imagenes/NavegacionPrimera.gif";
	img.attributes.setNamedItem(hiddenSrc);
	cell.appendChild(img);
	this.Images.push(img);
	
	for (var i=0;i<imageSrcs.length;i++)
	{
		var imgProperty = imageSrcs[i];
		//creo la celda
		var cell = document.createElement("TD");
		row.appendChild(cell);
		
		//creo el link de la imagen
		var link = document.createElement("A");
		link.href = imgProperty.HRef;
		cell.appendChild(link);
		
		var img = document.createElement("IMG");
		img.width = this.ImageWidth;
		img.border = 0;
		img.className = "CargaInicial";
		
		if (imgProperty.Src.toUpperCase() == selectedImageSrc.toUpperCase())
		{
			this.SelectedIndex = i+1;
		}
		//Establezco un attributo oculto
		var hiddenSrc = document.createAttribute("hiddenSrc");
		hiddenSrc.value = imgProperty.Src;
		img.attributes.setNamedItem(hiddenSrc);
		
		
		
		//lo agrego a la celda
		link.appendChild(img);
		//lo agrego al array de imagenes
		this.Images.push(img);
	}
	
	//Primera Imagen
	cell = document.createElement("TD");
	row.appendChild(cell);
	img = document.createElement("IMG");
	img.width = this.ImageWidth;
	img.height = this.ImageHeight;
	img.border = 0;
	img.alt = "Ultima foto";
	hiddenSrc = document.createAttribute("hiddenSrc");
	hiddenSrc.value = "/Imagenes/NavegacionUltima.gif";
	img.attributes.setNamedItem(hiddenSrc);
	cell.appendChild(img);
	this.Images.push(img);
	
	
	//Incluyo la tabla en el div
	var divContenedor = document.getElementById(divID);
	divContenedor.appendChild(table);
	
	
	//Imagen seleccionada
	this.ForceMove(this.SelectedIndex);
	//table.setActive();
	
	//Arreglo el scroll para esconder las partes q sobresalen
	divContenedor.scrollTop = parseInt((table.clientHeight - this.ImageHeight) / 2);
	
	
}

//private
TransitionScroller.prototype.ForceMove = function(imageIndex)
{
	this.SetSrc(imageIndex);
	this.TransitionManager.NavegarDerecha(imageIndex);
	//document.getElementById(this.PanelName).scrollLeft = (this.ImageWidth + (this.CellPadding * 2)) * imageIndex;
}

TransitionScroller.prototype.NavegarDerecha = function()
{
	if (this.SelectedIndex < this.Images.length-1)
	{
		var positions = this.Positions;
		var selectedIndexAnterior = this.SelectedIndex;
		//alert("eq: " + this.SelectedIndex + "+" + positions + ">=" +  this.Images.length-1);
		if (this.SelectedIndex == this.Images.length-1)
		{
			//do nothing
			
		}
		else if (this.SelectedIndex + positions >= this.Images.length-1)
		{
			//Debo modificar el selected index a this.Images.length-positions
			this.SelectedIndex = this.Images.length-positions;
			positions = this.SelectedIndex - selectedIndexAnterior;
		}
		else
		{
			this.SelectedIndex += positions;
		}
		
		
		if (positions > 0)
		{
			this.TransitionManager.NavegarDerecha(positions);
			this.SetSrc(this.SelectedIndex);
		}
	}
}

TransitionScroller.prototype.NavegarIzquierda = function()
{
	if (this.SelectedIndex > 0)
	{
		var positions = this.Positions;
		if (this.SelectedIndex-positions < 0)
		{
			positions = this.SelectedIndex;						
		}
		this.SelectedIndex -= positions;
		//alert("SELECTED INDEX: " + this.SelectedIndex + " POSITIONS: " + positions);
		this.TransitionManager.NavegarIzquierda(positions);
		this.SetSrc(this.SelectedIndex);
	}
}

TransitionScroller.prototype.SetSrc = function(index)
{
	//Establece la src de la imagen seleccionada y la siguiente
	
	for (var i=0;i<this.Positions;i++)
	{
		if (index + i < this.Images.length && index >= 0)
		{
			var img = this.Images[index + i];
			//alert((index + i )+ " =" + img.attributes["hiddenSrc"].value);
			if (img.src == "")
			{
				img.src = img.attributes["hiddenSrc"].value;
				//img.setActive();
			}
		}
	}
}
/************************* Clase Image Properties ***************************/

function ImageProperty(src, href)
{
	this.Src = src;
	this.HRef = href;
}



/************************* Clase Image Array ***************************/
/*
Array.prototype.AddImage = function(src, href)
{
	this.push(new ImageProperty(src, href));
}
*/