// images is an array of image paths
var imageScrollCount = null;
var imageScrollPrevIndex = null;
var imageScrollIndex = null;
var imageScrollPaths = null;
var imageScrollURLs = null;
var imageScrollImageId = null;
var imageScrollTimer = null;
var imageScrollIntervalSeconds = 5000;
function startImageScroll(imageDiv, imagePaths, imageURLs)
{
	if(!imagePaths || !imageDiv || !imageURLs)
	{
		return;
	}
	
	// make sure the image id exists
	if(!document.getElementById(imageDiv))
	{
		return;
	}
	
	// save the information as global variables
	imageScrollImageId = imageDiv;
	imageScrollPaths = imagePaths;
	imageScrollURLs = imageURLs;
	imageScrollCount = imagePaths.length;
	imageScrollPrevIndex = 0;
	imageScrollIndex = 0;
	if(imageScrollCount <= 0)
	{
		return;
	}
	
	// preload the images
	preloadImages();
	
	// create buttons dynamically
	//createImageScrollMenu();
	
	// highlight the first scroll menu button
	//document.getElementById("imageScrollMenu_" + imageScrollIndex).className = "promo_no_sel";
	
	// start the image scroll
	imageScrollTimer = setInterval(autoNextImageScroll, imageScrollIntervalSeconds);
}

function preloadImages()
{
	var i;
	for(i=0; i<imageScrollCount; i++)
	{
		var preloadedImage = new Image();
		preloadedImage.src = imageScrollPaths[i];
	}
}

function createImageScrollMenu()
{
	var i;
	for(i=0; i<imageScrollCount; i++)
	{
		var html = "<td id=\"imageScrollMenu_" + i + "\" class=\"promo_no\" onmouseout=\"imageScrollMenuMouseOut(" + i + ")\" onmouseover=\"imageScrollMenuMouseOver(" + i + ")\"><a class=\"imageScrollMenu\" href=\"javascript:manualImageScroll(" + i + ")\">" + (i+1) + "</a></td>";
		new Insertion.Bottom(imageScrollImageId + 'Menus', html);
	}
	
	if(imageScrollCount > 1)
	{
		var html = "<td class=\"promo_no\" onmouseout=\"this.className='promo_no';\" onmouseover=\"this.className='promo_no_sel';\"><a class=\"imageScrollMenu\" href=\"javascript:manualNextImageScroll()\">NEXT</a></td>";
		new Insertion.Bottom(imageScrollImageId + 'Menus', html);
	}
}

function imageScrollMenuMouseOver(index)
{
	document.getElementById("imageScrollMenu_" + index).className = "promo_no_sel";
}

function imageScrollMenuMouseOut(index)
{
	if(imageScrollIndex != index)
	{
		document.getElementById("imageScrollMenu_" + index).className = "promo_no";
	}
}

function manualImageScroll(selectedIndex)
{
	if(!imageScrollTimer)
	{
		return;
	}
	
	if(selectedIndex >= imageScrollCount)
	{
		return;
	}
	
	if(selectedIndex != imageScrollIndex)
	{
		//document.getElementById("imageScrollMenu_" + imageScrollIndex).className = "promo_no";
	}
	
	// stop the timer
	clearInterval(imageScrollTimer);
	imageScrollTimer = null;
	
	imageScrollPrevIndex = imageScrollIndex;
	imageScrollIndex = selectedIndex;
	scrollImage();
	
	// start the timer
	imageScrollTimer = setInterval(autoNextImageScroll, imageScrollIntervalSeconds);
}

function manualNextImageScroll()
{
	// stop the timer
	clearInterval(imageScrollTimer);
	imageScrollTimer = null;
	
	// imageScrollIndex is already pointing to the next image
	autoNextImageScroll();
	
	// start the timer
	imageScrollTimer = setInterval(autoNextImageScroll, imageScrollIntervalSeconds);
}

function autoNextImageScroll()
{
	imageScrollPrevIndex = imageScrollIndex;
	imageScrollIndex++;
	if(imageScrollIndex >= imageScrollCount)
	{
		imageScrollIndex = 0;
	}
	
	scrollImage();
}

function scrollImage()
{
	if(!imageScrollImageId)
	{
		return;
	}
	
	var imageElem = document.getElementById(imageScrollImageId);
	if(!imageElem)
	{
		return;
	}
	
	new Effect.Opacity(imageScrollImageId, 
	{ 
		from: 1.0,
		to: 0,
		duration: 0.2,
		afterFinish: function()
		{
			imageElem.src = imageScrollPaths[imageScrollIndex];
			$('heroMapDefault').href = imageScrollURLs[imageScrollIndex];
			//document.getElementById("imageScrollMenu_" + imageScrollPrevIndex).className = "promo_no";
			//document.getElementById("imageScrollMenu_" + imageScrollIndex).className = "promo_no_sel";
			Effect.Appear(imageScrollImageId, { duration: 0.2 });
		}
	});
}