/***************************************************************************************
  Multiple frame, fading slideshow
  This slideshow displays images in one or more frames on a web page. The frames do 
  not have to be contiguous, however, since all the images shown are drawn from a 
  single set, placement of the frames should take into account that an image
  will appear in each frame at some point while the slideshow is active.
  
  Three arrays in the layout are needed to make this routine work:
  	params = [0:nrframes, 1:slideheight, 2:slidewidth, 3:slideorder, 4:transition, 5:delay(in seconds),[6:transtime]]
	imgset = [0...n] (indices of images in each slideshow frame)
	slides = [image0.address, image1.address, ... imageN.address] 
  
  
****************************************************************************************/

function addEvent(toElement,verb,funct,tf){
	if(navigator.userAgent.match(/MSIE [0-8]/)) toElement.attachEvent("on"+verb, funct);
	else toElement.addEventListener(verb,funct,tf);
	}

addEvent(window,"load",startslideshow,false);

var dom=(document.getElementById); //modern dom browsers
var iebrowser=document.all;

var idir = "http://uuss.org/Pictures/SlideShow2/";// image directory
var images = new Array(); 		// cache of preloaded images
var slideframe = new Array();	// cache of slideframe <div> objects
var slideimg = new Array();		// cache of slide <img> objects
var nrframes = 4;				// number of slide frames on the page
var nrimages = 0;				// number of images available for the slideshow
var slideheight = 150;			// height of each image
var slidewidth = 225;			// width of each image
var slideorder = "serial";		// order images selected - choices: random | serial
var transition = "insync";		// how slide images transition - choices: insync | wave
var delay = 12000;				// time in microseconds between slideshow transitions
var transtime = 60;				// time in microseconds for a slide transition
var lastpick = 0;				// pointer to last image picked
var showtimer;					// pointer to last setTimeout
var density = 100;				// slide opacity
var currentframe = 0;			// pointer
  
function startslideshow(){
	nrimages = (typeof slides !="undefined") ? slides.length : 0;
	lastpick = imgset[nrframes-1];
	if(nrimages < (1+nrframes*3)) slideorder = 'serial';

	//preload images
	for(var i=0; i<nrimages; i++){
		images[i]=new Image();
		images[i].src=idir+slides[i];
		}

	for(var i=0; i<nrframes; i++){
		slideframe[i] = iebrowser ? iebrowser["slideholder"+i] : document.getElementById("slideholder"+i);
		slideframe[i].style.backgroundImage = "url("+nextimage(i)+")";
		slideimg[i] = slideframe[i].getElementsByTagName("img")[0];
		slideimg[i].style.height = slideheight+"px";
		slideimg[i].style.width = slidewidth+"px";
		}
	
	showtimer = setTimeout("slideshow()", delay);
	}
  
function nextimage(n){
	if(slideorder == "serial") lastpick = (lastpick < nrimages-1) ? lastpick + 1 : 0;
	else {
		var stack = "--,"+imgset.toString()+",--";
		while(stack.search(","+lastpick+",") > 1) lastpick = Math.round(Math.random()*(nrimages-1));
		}
	imgset[n] = lastpick;
	return images[lastpick].src;
	}


function slideshow(){
	clearTimeout(showtimer);

	// copy div background-image to img.src, set img opacity to 100, get next set of images
	for(n=0; n<nrframes; n++) {
		slideimg[n].src = images[imgset[n]].src;
		setOpacity(slideimg[n],100);
		slideframe[n].style.backgroundImage = "url("+nextimage(n)+")";
		}

	// transition slides
	density = 100;
	if(transition == 'insync') fadeimageset()
	else {currentframe = 0;	fadeimages();}

	// set time to do it again
	showtimer = setTimeout("slideshow()", delay);
	}


function fadeimageset(){
	density -= 5;
	if(density >= 0) {
		for(var i=0; i<nrframes; i++) setOpacity(slideimg[i], density);
		setTimeout("fadeimageset()", transtime);
		}
	}

function fadeimages(){
	if(density < 1 ){
		density = 100;
		currentframe++;
		}
	if(currentframe < nrframes){
		density -= 5;
		if(density >= 0) {
			setOpacity(slideimg[currentframe], density);
			setTimeout("fadeimages()", transtime/2);
			}
		}
	}
	
function setOpacity(obj, opacity) {
	obj.style.KhtmlOpacity = opacity/100;
	obj.style.MozOpacity = opacity/101; 
	obj.style.opacity =  opacity/100;
	if(obj.filters && obj.filters[0]) {
		if (typeof obj.filters[0].opacity == "number") obj.filters[0].opacity = opacity
		else obj.style.filter = "alpha(opacity=" + opacity + ")"; 
		}
	}
