$(document).ready
(
	function()
	{
		var timer;
		var waitTime;
		var btnArr;
		var imgArr;
		var index;
		var showImage;
		var flickImage;
		var currentIndex;
		var setImageIndex;
		var handleIndexClick;
		var continueSlideShow;

		currentIndex = 0;
		waitTime = 5000;
		btnArr = ["button_0", "button_1", "button_2", "button_3"];
		imgArr = ["image_0", "image_1", "image_2", "image_3"];
		
		continueSlideShow = function()
		{
			if (timer)
			{
				clearTimeout(timer);
				timer = null;
			}
			timer = setTimeout(flickImage, waitTime);
		};

		flickImage = function()
		{
			var temp = currentIndex;

			if (temp+1 > imgArr.length-1)
			{
				temp = 0;
			}
			else
			{
				temp++;
			}

			setImageIndex(temp);
		};

		revertImage = function()
		{
			var temp = currentIndex;

			if (temp-1 < 0)
			{
				temp = imgArr.length-1;
			}
			else
			{
				temp--;
			}

			setImageIndex(temp);
		};

		setImageIndex = function(newIndex)
		{
			var arrayIndex;

			// set the current index
			currentIndex = newIndex;
			
			// hide all images
			for (arrayIndex = 0; arrayIndex < imgArr.length; arrayIndex++)
			{
				$("#" + btnArr[arrayIndex]).removeClass("selected");
				$("#" + imgArr[arrayIndex]).hide();
			}

			// show the image corresponding to the button pressed
			$("#" + btnArr[currentIndex]).addClass("selected");
			$("#" + imgArr[currentIndex]).fadeIn("slow");

			continueSlideShow();
		};
		
		handleIndexClick = function(evt)
		{
			var buttonIndex;
			var thisIndex;
			thisIndex = 0;

			for (buttonIndex = 0; buttonIndex < btnArr.length; buttonIndex++)
			{
				if (btnArr[buttonIndex] === this.id)
				{
					thisIndex = buttonIndex;
					break;
				}
			}
			
			setImageIndex(thisIndex);

			evt.preventDefault();
		};

		handlePreviousClick = function(evt)
		{
			revertImage();
			evt.preventDefault();
		};

		handleNextClick = function(evt)
		{
			flickImage();
			evt.preventDefault();
		};

		for (index = 0; index < btnArr.length; index++)
		{
			$addHandler($get(btnArr[index]), "click", handleIndexClick);
		}
		
		$addHandler($get("image_scroll_previous"), "click", handlePreviousClick);
		$addHandler($get("image_scroll_next"), "click", handleNextClick);

		setImageIndex(0);
	}
);