var curImage = 0
var totalImages;
var galleryArray;
var to;
var delay = 5000;

var $ = jQuery.noConflict();

$(document).ready(function()
{
	galleryArray = $("#gallery").children();
	totalImages = galleryArray.length;
	curImage = totalImages-1;
	
	for(var i=0; i<totalImages; i++)
	{
		$(galleryArray[curImage]).css({"opacity":0, "display":"none"});
	}
	
	$(galleryArray[curImage]).css({"opacity":0, "display":"inline"});
	$(galleryArray[curImage]).animate({"opacity":1}, 1000, startTimer);
	
	
	$("#back-button").click(function()
	{
		clearTimeout(to);

		$(galleryArray[curImage%totalImages]).css({"z-index":800});
		$(galleryArray[curImage%totalImages]).animate({"opacity":0});
	
		curImage--;
		
		if( curImage < 0) curImage = totalImages-1;
		
		$(galleryArray[curImage%totalImages]).css({"opacity":0, "display":"inline", "z-index":900});
		$(galleryArray[curImage%totalImages]).animate({"opacity":1}, 1000, startTimer);
		
	});
	
	$("#next-button").click(function()
	{
		nextImage();
	});
	
});

function startTimer()
{
	to = setTimeout(nextImage, delay)
}

function nextImage()
{
	clearTimeout(to);
	
	$(galleryArray[curImage%totalImages]).css({"z-index":800});
	$(galleryArray[curImage%totalImages]).animate({"opacity":0});
	
	curImage++;
	
	$(galleryArray[curImage%totalImages]).css({"opacity":0, "display":"inline", "z-index":900});
	$(galleryArray[curImage%totalImages]).animate({"opacity":1}, 1000, startTimer);
}