img1= new Image();
img1.src="i/quito.jpg";
img2= new Image();
img2.src="i/cuenca.jpg";
img3= new Image();
img3.src="i/riobamba.jpg";
img4= new Image();
img4.src="i/esmeraldas.jpg";
img5= new Image();
img5.src="i/bahia.jpg";
img6= new Image();
img6.src="i/loja.jpg";
img7= new Image();
img7.src="i/machala.jpg";
img8= new Image();
img8.src="i/guayaquil.jpg";
img9= new Image();
img9.src="i/napo.jpg";
img10= new Image();
img10.src="i/puyo.jpg";

imgarray = new Array(10);
imgarray[1] = new Image();
imgarray[1].src = "i/quito.jpg";
imgarray[2] = new Image();
imgarray[2].src = "i/cuenca.jpg";
imgarray[3] = new Image();
imgarray[3].src = "i/riobamba.jpg";
imgarray[4] = new Image();
imgarray[4].src = "i/esmeraldas.jpg";
imgarray[5] = new Image();
imgarray[5].src = "i/bahia.jpg";
imgarray[6] = new Image();
imgarray[6].src = "i/loja.jpg";
imgarray[7] = new Image();
imgarray[7].src = "i/machala.jpg";
imgarray[8] = new Image();
imgarray[8].src = "i/guayaquil.jpg";
imgarray[9] = new Image();
imgarray[9].src = "i/napo.jpg";
imgarray[10] = new Image();
imgarray[10].src = "i/puyo.jpg";
var timeoutValue = 1500;
var animDelay = 1000;
var numOfImages = 10;

var imageIndex = 0;
var timeoutID = 0;
var playMode = 1;

function animImageInc()
{
if (imageIndex < numOfImages)
	imageIndex++
else
	imageIndex = 1;
}

function animImageDec()
{
if (imageIndex > 1)
	imageIndex--;
else
	imageIndex = numOfImages;
}

function setCurrImage()
{
	document.MainImage.src = imgarray[imageIndex].src;
}

function updateAnim()
{
	var currTimeoutValue;
	
	currTimeoutValue = timeoutValue;

	if (playMode == 1)
	{
		animImageInc();
		if (imageIndex == numOfImages) 
			currTimeoutValue += animDelay;
	}
	else
	{
		animImageDec();
		if (imageIndex == 1) 
			currTimeoutValue += animDelay;
	}
	setCurrImage();
	timeoutID = setTimeout("updateAnim()", currTimeoutValue);
}

function clearLastUpdate()
{
	clearTimeout(timeoutID);
	timeoutID = 0;
}

function startPlay()
{
	clearLastUpdate();
	playMode = 1;
	updateAnim();	
}

function startPlayReverse()
{
	clearLastUpdate();
	playMode = 2;
	updateAnim();	
}