/**********************************************************************************
Better(?) Image cross fader (C)2004 Patrick H. Lauke aka redux
Inspired by Steve at Slayeroffice http://slayeroffice.com/code/imageCrossFade/ 
preInit "Scheduler" idea by Cameron Adams aka The Man in Blue
http://www.themaninblue.com/writing/perspective/2004/09/29/ 
Changes/Additions by Theresa Sullivan (2006)
***********************************************************************************/


/**********************************************************************************
Add the following CSS within the HEAD tags of the page that holds the slideshow:

<style type="text/css">
#slideshow {
	width: 250px;
	float: right;}
#slideshow img {
	padding: 3px;
	margin: 0px 0px 0px 0px;
	border: 1px solid #000;}
#slideshow li { display: block; }
</style>


*************************************************************************************/


/* constant variables - CHANGE THESE */
var GALLERY_ID = 'slideshow'; /* ID of the gallery list (ul) */
var PHOTO_WIDTH = "300px";
var PHOTO_HEIGHT = "202px";
var UL_POSITION = "relative";
var UL_MARGIN = "10px";
var UL_PADDING = "0";
var POSITION_TOP = "0";
var POSITION_LEFT = "0";
var FADE_PAUSE = "3000"; /* number of seconds to pause between photos x 1000 */

/**************************** DO NOT CHANGE BELOW *********************************/
/* general variables */
var	gallery; /* this will be the object reference to the list later on */
var galleryImages; /* array that will hold all child elements of the list */
var currentImage; /* keeps track of which image should currently be showing */
var previousImage;
preInit();

/* initially hide the image gallery list*/
function preInit() {
	if ((document.getElementById)&&(gallery=document.getElementById(GALLERY_ID))) {
		gallery.style.position = UL_POSITION; 
		gallery.style.width = PHOTO_WIDTH;
		gallery.style.height = PHOTO_HEIGHT; 
		gallery.style.margin = UL_MARGIN; 
		gallery.style.padding = UL_PADDING; 
		gallery.style.visibility = "hidden";
		clearTimeout(preInitTimer);
	} else {
		preInitTimer = setTimeout("preInit()",2);
	}
}

/* helper function to deal specifically with images and the cross-browser differences in opacity handling */
function fader(imageNumber,opacity) {
	var obj=galleryImages[imageNumber];
	if (obj.style.MozOpacity!=null) {  
		/* Mozilla's pre-CSS3 proprietary rule */
		obj.style.MozOpacity = (opacity/100) - .001;
	} else if (obj.style.opacity!=null) {
		/* CSS3 compatible */
		obj.style.opacity = (opacity/100) - .001;
	} else if (obj.style.filter!=null) {
		/* IE's proprietary filter */
		obj.style.filter = "alpha(opacity="+opacity+")";
	}
}

/* start the fade in/out process */
function fadeInit() {
	if (document.getElementById) {
		preInit(); /* shouldn't be necessary, but IE can sometimes get ahead of itself and trigger fadeInit first */
		
		/* get all child nodes */
		galleryImages = gallery.getElementsByTagName("li"); 
		for(i=0;i<galleryImages.length;i++) {
			/* loop through all these child nodes and set up their styles */
			galleryImages[i].style.position='absolute';
			galleryImages[i].style.top=POSITION_TOP;
			galleryImages[i].style.left=POSITION_LEFT;
			galleryImages[i].style.zIndex=0;
			/* set their opacity to transparent */
			fader(i,0);
		}
		/* make the list visible again */
		gallery.style.visibility = 'visible';
		/* initialise a few parameters to get the cycle going */
		currentImage=0;
		previousImage=galleryImages.length-1;
		opacity=100;
		fader(currentImage,100);
		/* start the whole crossfade process after a second's pause */
		window.setTimeout("crossfade(100)", 100);
	}
}

function crossfade(opacity) {
		if (opacity < 100) {
			/* current image not faded up fully yet,so increase its opacity */
			fader(currentImage,opacity);
			opacity += 10;
			window.setTimeout("crossfade("+opacity+")", 30);
		} else {
			/* make the previous image - which is now covered by the current one fully - transparent */
			fader(previousImage,0);
			/* current image is now previous image, as we advance in the list of images */
			previousImage=currentImage;
			currentImage+=1;
			if (currentImage>=galleryImages.length) {
				/* start over from first image if we cycled through all images in the list */
				currentImage=0;
			}
			/* make sure the current image is on top of the previous one */
			galleryImages[previousImage].style.zIndex = 0;
			galleryImages[currentImage].style.zIndex = 100;
			/* and start the crossfade after a pause */
			opacity=0;
			window.setTimeout("crossfade("+opacity+")", FADE_PAUSE);
		}
		
}

/* initialise fader by hiding image object first */
addEvent (window,'load',fadeInit)


// addEvent and removeEvent
// cross-browser event handling for IE5+,  NS6 and Mozilla
// By Scott Andrew
function addEvent(elm, evType, fn, useCapture) 
{
 if (elm.addEventListener){
   elm.addEventListener(evType, fn, useCapture);
   return true;
 } else if (elm.attachEvent){
   var r = elm.attachEvent("on"+evType, fn);
   return r;
 }
}