// slideshow a series of images, using a fade transition in IE 5.5 or later

var isIE55 = window.createPopup;

var images = [	'images/home/otter.jpg',
			    'images/home/dolphin.jpg',	
				'images/home/ammonite.jpg', 				
				'images/home/cat.jpg',
				'images/home/amity.jpg',
				'images/home/elephant.jpg',
				'images/sculptures/cobra_01.jpg',
				'images/home/penguin.jpg',
				'images/home/cephalapod.jpg',
				'images/home/koi.jpg',
				'images/home/cobra.jpg',
				'images/home/oryx.jpg'
			];
			
var links = [ 	'<a href="sculptures/otter.html">otter</a>',	
				'<a href="sculptures/dolphin.html">dolphin & mackerel</a>',	
				'<a href="sculptures/ammonite.html">ammonite</a>',				
				'<a href="sculptures/cat.html">cat</a>',
				'<a href="sculptures/amity.html">amity</a>',
				'<a href="sculptures/elephant.html">elephant</a>',
				'<a href="sculptures/cobra.html">cobra</a>',
				'<a href="sculptures/penguin.html">penguin</a>',				
				'<a href="sculptures/cephalapod.html">cephalapod</a>',
				'<a href="sculptures/koi.html">koi carp</a>',
				'<a href="sculptures/cobra.html">cobra</a>',
				'<a href="sculptures/oryx.html">oryx</a>'
			];
var imageName = 'fadeImage';
var linkName = 'fadeLink';

var imageIndex = -1;
var pauseTime = 3000; // milliseconds
var nextImage;

function startNextImage ( ) {		
	// setup the next image
	imageIndex = ( ++imageIndex ) % images.length;
	
	// preload the image
	nextImage = new Image();
	nextImage.src = images[imageIndex];
	
	// timeout between image changes
	window.setTimeout ( changeImage, pauseTime );			
}

function findObj (id) {
	if ( document.getElementById )
		return document.getElementById(id);
		
	else if ( document.all )
		return document.all[id];
}

function changeImage ( ) {
	
	var imageObject = findObj ( imageName );
	// setup the filter, change the source, then play the filter
	imageObject.filters[0].apply();
	imageObject.src = nextImage.src;
	imageObject.filters[0].play();

	// change the text of the link
	var linkObject = findObj ( linkName );
	linkObject.innerHTML = links[imageIndex];
	
	// start preloading the next image
	startNextImage();
}

// start the first phase once the page has loaded
window.onload = startNextImage;