/*

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/ 

Tweaked to deal with empty nodes 19 Feb 2006

*/

/* general variables */

var galleryId = 'gallery'; /* change this to the ID of the gallery image */
var galleryImageSlot = new Object; /* this will be the object reference to an extra image used for crossfading */
var currentImage; /* keeps track of which image should currently be showing */
var currentlyFading = false; /* flag for whether a fade is in progress */

/* functions */

function fader(obj, opacity) {
	/* helper function to deal specifically with images and the cross-browser differences in opacity handling */
	if (obj.style) {
		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+")";
		}
	}
}

function createGalleryImageSlot(gallery) {
	/* For the gallery, we fade between the current image and a second image; each of these images are held in
	   its own DOM elements, which are overlayed.
	   This method copies a DOM image element, turns the opacity on the new image down to 0, and attaches the new
	   image to the parent of the original image.
	   Parameters:  gallery -- the actual DOM image element to be copied
	*/
	
	/* copy the original image */
	img = gallery.cloneNode(true);
	/* clear the ID on the copy (can't have two DOM elements with the same ID) */
	img.id = '';
	/* turn down the opacity on the new, copied image element */
	fader(img, 0);
	/* put the new image element behind the original image element on the Z-Order stack */
	img.style.zIndex = 2;
	/* attach the new image element to the parent of the original image element */
	gallery.parentNode.appendChild(img);
	return img;
}

function galleryInit() {
	if (document.getElementById) {
		
		/* momentarily disable fading, just to be cute */
		currentlyFading = true;
		
		/* initialize the gallery image slots that hold the next and previous images (for fading)
		   (see the "createGalleryImageSlot function for more details). */
        galleryImageSlot['current'] = document.getElementById(galleryId);
		galleryImageSlot['current'].style.zIndex = 3;
		galleryImageSlot['prev'] = createGalleryImageSlot(galleryImageSlot['current']);
		galleryImageSlot['prev'].src = imagePath + galleryImages[galleryImages.length - 1];
		galleryImageSlot['next'] = createGalleryImageSlot(galleryImageSlot['current']);
		galleryImageSlot['next'].src = imagePath + galleryImages[1 % galleryImages.length];

		/* load an extra image forwards and backwards to the cache, just to be thorough */
		var tempimg = createGalleryImageSlot(galleryImageSlot['current']);
		tempimg.src = imagePath + galleryImages[(galleryImages.length + currentImage - 2) % galleryImages.length];
		tempimg.src = imagePath + galleryImages[(currentImage+2) % galleryImages.length];
		delete tempimg;

        /* initialize the pointer which says which image is currently displayed */
		currentImage=0;
		
		/* show the gallery controls to the user  */
		document.getElementById('gallery-controls').style.display='block';
		
		/* enable the fun */
		currentlyFading = false;
	}
}

function fadenext() {
	/* check if we're already switching images */
	if (currentlyFading==false) {
		/* disable the controls */
		currentlyFading = true;
		/* turn up the opacity for the "next" image */
		fader(galleryImageSlot['next'],100);
		/* start the cross fade */
		fadenextloop(100);
	}
}
function fadenextloop(opacity) {
	if (opacity > 0) {
		/* current image not faded up fully yet...so increase its opacity */
		fader(galleryImageSlot['current'],opacity);
		/* fader(previousImage,100-opacity); */
		opacity -= 10;
		window.setTimeout("fadenextloop("+opacity+")", 30);
	} else {
		/* make the previous image - which is now covered by the current one fully - transparent */
		fader(galleryImageSlot['current'],0);
		
		/* current image is now previous image, as we advance in the list of images */
		var tempimg = galleryImageSlot['prev'];
		galleryImageSlot['prev']=galleryImageSlot['current'];
		galleryImageSlot['current']=galleryImageSlot['next'];
		galleryImageSlot['next']=tempimg;
		
		/* images are shuffled.  Now update the "currentImage" marker, and the src's for the "next" image */
		currentImage = (currentImage + 1) % galleryImages.length;
		galleryImageSlot['current'].parentNode.href = fullsizeImagePath + galleryImages[currentImage];
		/* load upcoming images, first two ahead, then just one ahead, (just to be thorough) */
		galleryImageSlot['next'].src = imagePath + galleryImages[(currentImage+2) % galleryImages.length];
		galleryImageSlot['next'].src = imagePath + galleryImages[(currentImage+1) % galleryImages.length];
	
		/* make sure the current image is on top of the previous one */
		galleryImageSlot['prev'].style.zIndex = 2;
		galleryImageSlot['next'].style.zIndex = 2;
		galleryImageSlot['current'].style.zIndex = 3;
		
		/* enable the controls again */
		currentlyFading = false;
	}
}

function fadeprev() {
	/* check if we're already switching images */
	if (currentlyFading==false) {
		/* disable the controls */		
		currentlyFading = true;
		/* turn up the opacity for the "previous" image */
		fader(galleryImageSlot['prev'],100);
		/* start the cross fade */
		fadeprevloop(100);
	}
}
function fadeprevloop(opacity) {
	if (opacity > 0) {
		/* current image not faded down fully yet...so decrease its opacity */
		fader(galleryImageSlot['current'],opacity);
		opacity -= 10;
		window.setTimeout("fadeprevloop("+opacity+")", 30);
	} else {
		/* make the current image - which is now covered by the previous one fully - transparent */
		fader(galleryImageSlot['current'],0);
		
		/* current image is now previous image, as we advance in the list of images */
		var tempimg = galleryImageSlot['next'];
		galleryImageSlot['next']=galleryImageSlot['current'];
		galleryImageSlot['current']=galleryImageSlot['prev'];
		galleryImageSlot['prev']=tempimg;
		
		/* images are shuffled.  Now update the "currentImage" marker, and the src's for the "previous" image */
		currentImage = (galleryImages.length + currentImage - 1) % galleryImages.length;
		galleryImageSlot['current'].parentNode.href = fullsizeImagePath + galleryImages[currentImage];
		/* load previous images, first two back, then just one back, (just to be thorough) */
		galleryImageSlot['prev'].src = imagePath + galleryImages[(galleryImages.length + currentImage - 2) % galleryImages.length];
		galleryImageSlot['prev'].src = imagePath + galleryImages[(galleryImages.length + currentImage - 1) % galleryImages.length];
		
		/* make sure the current image is on top of the previous one */
		galleryImageSlot['prev'].style.zIndex = 2;
		galleryImageSlot['next'].style.zIndex = 2;
		galleryImageSlot['current'].style.zIndex = 3;
		currentlyFading = false;
	}
}

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



/* 3rd party helper functions */

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