//	JavaScript Slideshow
//	This process handles the changeover from one slide to the next
//	It might be a simple replacement, or more complex transition effects
//	can be implemented
//	Declare some global variables to preserve values between calls of "swapSlides"
var swappingcomplete;
//var banneralphadelta = 0.05;

function swapBanners(thisImage, nextImage, framewidth, frameheight, count, delay, banneralt) {
//	Input Parameters:
//	thisImage = index value of current image
//	nextImage = index value of next image
//	framewidth = width of frame containing the images
//	frameheight = height of frame containing the images
//	count = number of steps (iterations) of this process so far (= 0 on first iteration)
//	delay = repeat rate (in ms) for this process
//	Output Parameters:
//	Returns true if swapping process is complete
//	Returns false if swapping still in progress	
	//	This version "fades" the new image in and the old image out by adjusting the
	//	opacity of each image up and down, respective
	
	//	First check that the browser supports the relevant W3C DOM APIs
	if (!document.getElementById || !document.getElementsByTagName  || !document.createElement) return true;
		
	//	If the element "mainSlide" doesn't exist, just exit from the process
	if (!document.getElementById(bannerholder)) return true;
	//	Now check that <div> element contains at least one <img> element
	//var slideHeight = 0;
	//var slideWidth = 0;
	var slideholder = document.getElementById(bannerholder);
	if (!slideholder.getElementsByTagName("img")) {
		//	No image created yet for some reason, create one and insert it immediately
		var slide = document.createElement("img");
		var tempsrc = bannerpath + bL[nextBanner] + bannerextn;
		slide.setAttribute("src",tempsrc);
		delete tempsrc;
		slide.setAttribute("alt",banneralt);
		slide.style.height = (bannerHeight) + "px";
		slide.style.width = (bannerWidth) + "px";
		slideholder.appendChild(slide);
		return true;	//	Swapping is complete
	} else {
		//	Now we're into the "normal" part of the process
		var images = slideholder.getElementsByTagName("img");
		if (count <= 1) {
			//	This is the first pass, there should be just one image in place
			if (images.length != 1) {
				//	Delete all images except the first
				//	This is a fault condition!
				for(var i = (images.length - 1); i >= 1; i--) {
					slideholder.removeChild(images[i]);
				}
			}
			swappingcomplete = false;
			//	Now create the new banner
			var slide = document.createElement("img");
			var tempsrc = bannerpath + bL[nextBanner] + bannerextn;
			slide.setAttribute("src",tempsrc);
			slide.setAttribute("alt",banneralt);
			slide.style.position = "absolute";
			slide.style.top = "0px";
			slide.style.left = "0px";
			slide.style.height = bannerHeight + "px";
			slide.style.width = bannerWidth + "px";
			slide.style.MozOpacity = "0";	//	Opacity for Mozilla (NN6+, Firefox?)
			slide.style.filter = "alpha(opacity = 0)";	//	Opacity for IE
			banneralphaval = 0;
			slideholder.appendChild(slide); // new banner inserted AFTER the current banner
			return false; // process not yet completed
		} else {
			//	Slide swapping in progress - increment/decrement opacity of new/old slides
			//	and test if complete
			var banners = slideholder.getElementsByTagName("img");
			banneralphaval += banneralphastep;
			if(banneralphaval >= 1) {
				banneralphaval = 1;	//	Reached the end of the transition
				banners[1].style.filter = "alpha(opacity = 100)";
				banners[1].style.MozOpacity = banneralphaval;
				slideholder.removeChild(banners[0]);
				swappingcomplete = true;
			} else {
				banners[1].style.filter = "alpha(opacity = " + Math.ceil(100 * banneralphaval) + ")";
				banners[1].style.MozOpacity = banneralphaval;
				banners[0].style.filter = "alpha(opacity = " + Math.ceil(100 * (1 - banneralphaval)) + ")";
				banners[0].style.MozOpacity = (1 - banneralphaval);
			}
			if (swappingcomplete == true) {
				swappingcomplete = false;
				return true;
			} else {
				return false;
			}
		}
	}
}