Event.observe(window,'load',function(event) {
	Event.observe($('nextImage'),'click',function() {
		nextImage();
	});
	Event.observe($('prevImage'),'click',function() {
		prevImage();
	});
});

function nextImage() {
	var newImage, oldImage;
	newImage = $$('#invisible div:first-child')[0].remove();
	oldImage = $$('#visible div:first-child')[0];

	// Replace the old image with the new one
	oldImage.replace(newImage);
	
	// Copy the old image into the hidden div
	$('invisible').insert({bottom:oldImage});
	
	// Increment the image count in the controls
	incrementImageCount(1);
}

function prevImage() {
	var newImage, oldImage;
	newImage = $$('#invisible div:last-child')[0].remove();
	oldImage = $$('#visible div:first-child')[0];

	// Replace the old image with the new one
	oldImage.replace(newImage);
	
	// Copy the old image into the hidden div
	$('invisible').insert({top:oldImage});
	
	// Increment the image count in the controls
	incrementImageCount(-1);
}

function incrementImageCount(inc) {
	var newCount, oldCount;
	id = $$('#visible div:first-child')[0].readAttribute('rel');
	$('imageCount').down().innerHTML = id;
}