var imagesURL = '/front_page_images.html';

document.observe("dom:loaded", function() {
  var imagesPairs = [];
  var currentImage = 0;
  
	new Ajax.Request(imagesURL, {
	  method: 'get',
	  onSuccess: function(transport) {
	  	
	  	var text = transport.responseText;//.gsub("\n", "");
			text.scan(/<p><img src="(\S+)" alt="" \/><br \/>(.*)<\/p>/, function(match) {
				imagesPairs.push(new Array(match[1], match[2]));
			});
				
			if(imagesPairs.size() == 0)
				alert('Oh noes! (something went wrong)');
			else {
				$('slideshow_image').setStyle({backgroundImage: 'url('+imagesPairs[0][0]+')'});
				$('slideshow_caption').update(imagesPairs[0][1]);
				
			  currentImage = 0;
				
				$('slideshow_next').observe('click', function(event) {
					currentImage = (currentImage + 1) % imagesPairs.size();
					
					$('slideshow_image').setStyle({backgroundImage: 'url('+imagesPairs[currentImage][0]+')'});
					$('slideshow_caption').update(imagesPairs[currentImage][1]);
				});
				
				$('slideshow_previous').observe('click', function(event) {
					currentImage = (currentImage + 1) % imagesPairs.size();
					
					$('slideshow_image').setStyle({backgroundImage: 'url('+imagesPairs[currentImage][0]+')'});
					$('slideshow_caption').update(imagesPairs[currentImage][1]);
				});
			}
	  }
	});
});