///////////////////////////////////////////////////////////////////////////////////////////////////
// JAVASCRIPT IMAGE FADER
// Script built upon Prototype Javascript framework (http://prototype.conio.net/)
// Utilizes Scriptaculous effects library (http://script.aculo.us/)
///////////////////////////////////////////////////////////////////////////////////////////////////

// Array of image objects that we're fading between
// To change delay on a per-image basis, modify 'wait' property of the object

// Default delay between transitions (1 second = 1000ms)

	var wait = 8000; // 5 seconds
	
	switch(navigator.appName) {
		case "Microsoft Internet Explorer": {
			var doFade = false;
			break;
		}
		case "Netscape": {
			var doFade = true;
			break;
		}
		default: {
			var doFade = true;
			break;
		}
	}

	var divArray = [

		{div: "image1",wait:wait},
		{div: "image2",wait:wait},
		{div: "image3",wait:wait},
		{div: "image4",wait:wait},
		{div: "image5",wait:wait},
		{div: "image6",wait:wait},
		{div: "image7",wait:wait},
		{div: "image8",wait:wait},
		{div: "image9",wait:wait},
		{div: "image10",wait:wait},
		{div: "image11",wait:wait},
		{div: "image12",wait:wait},
		{div: "image13",wait:wait},
		{div: "image14",wait:wait},
		{div: "image15",wait:wait},
		{div: "image16",wait:wait},
		{div: "image17",wait:wait},
		{div: "image18",wait:wait},
		{div: "image19",wait:wait},
		{div: "image20",wait:wait}
	]

// Starting index of the array. Should be set to the div whose display style is not set to 'none'.

	var i = 0;

// Function to perform fade transition

	function swapFade() {
		if(doFade) {
			// Fade current image from 100% to 0% opacity
			Effect.Fade(divArray[i].div, { duration:1, from:1.0, to:0.0 });
		} else {
			toggle(divArray[i].div);
		}
		i++;
		// If current image is the last in the sequence, loop to the beginning
		if (i == divArray.length)i = 0;
				// Set delay interval before next transition
				setTimeout('swapFade()',divArray[i].wait);
				
				if(doFade) {
					// Fade current image from 0% to 100% opacity
			        Effect.Appear(divArray[i].div, { duration:1, from:0.0, to:1.0 });
				} else {
					toggle(divArray[i].div);
				}
	}

// onLoad event handler to initialize the transition script

	function startPage() {
		setTimeout('swapFade()',wait);
	}
	
	//Display/hide an element
	function toggle(obj) {
		var el = document.getElementById(obj);
		if ( el.style.display != 'none' ) {
			el.style.display = 'none';
		}
		else {
			el.style.display = '';
		}
	
	}
	
startPage();