/**
*      Picture Fader.
*			 Show a slide show and fade in images.
*			 Assumes <div> pfPic2 is nested in <div> pfPic1. It puts the
*			 previous (background) picture into pfPic1 and next picture
*			 into pfPic2 (with no opacity), then fades in pfPic2 by increasing
*			 it's opacity.
*
*			 Input is array of images and delay (in seconds).
*
*      @author   Andrew Connick
*      @version  25/06/08
*/
function PictureFader(imgArr, delay) {

	this.imgArr = imgArr;
	this.curImg = 0;
	this.delay = delay;
	this.speed = 2; 						// Lower numbers yield a slower transition (more than 5 is not smooth)
	this.hldr1 = document.getElementById("pfPic1");
	this.hldr2 = document.getElementById("pfPic2");
	document.pfObj = this;

	// make sure all images are downloaded at start
	for(var i=0; i<imgArr.length; i++) {
		var img = new Image();
		img.src = imgArr[i];
	}

	// set initial image
	var dv1 = document.getElementById("pfPic1");
	dv1.style.backgroundImage = "url('" + imgArr[0] + "')";		

	fadeIn(100);
}
	
function setOpacity(obj, opacity) {
	if (opacity>=100) opacity = 99.999;
  
	// IE/Win
	obj.style.filter = "alpha(opacity:" + opacity + ")";
  
	// Safari<1.2, Konqueror
	obj.style.KHTMLOpacity = opacity/100;
  
	// Older Mozilla and Firefox
	obj.style.MozOpacity = opacity/100;
  
	// Safari 1.2, newer Firefox and Mozilla, CSS3
	obj.style.opacity = opacity/100;
}

// fade in the second image
function fadeIn(opacity) {
	if (document.getElementById) {
		if (opacity < 100) {
			opacity = (opacity + document.pfObj.speed) * 1.05;
			setOpacity(document.pfObj.hldr2, opacity);
			setTimeout("fadeIn("+opacity+")", 50); 	// time < 100 has no effect ?
		}
		else setTimeout("swapImages()", document.pfObj.delay*1000);
	}
}

function swapImages(){
	var obj = document.pfObj;

	// get the previous and next image index. 
	var prvImg = obj.curImg;
	if(obj.curImg == obj.imgArr.length-1) obj.curImg = 0;
	else ++obj.curImg;

	// swap images	
	obj.hldr1.style.backgroundImage = "url('" + obj.imgArr[prvImg] + "')";
	setOpacity(obj.hldr2, 0);
	obj.hldr2.style.backgroundImage = "url('" + obj.imgArr[obj.curImg] + "')";

	// fade in new image
	obj.fadeStart = new Date().getTime();
	fadeIn(0);
}