// This file works with images/home/slideImagesDB.js which holds the actual image file names
// and the pointers to each image's target page

// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 4000;

// Duration of crossfade (seconds)
var crossFadeDuration = 2;

// Creates a slot for a single kaleidoscope image on home page
// This is done dynamically to ensure a random image is displayed when page first loads 
// while also allowing a fixed set of images with no Javascript <noscript>
// Using this klutzy version, not the DOM below, b/c safari objected to DOM
function addHomeImage( oContainer, i, width ) {
	var oImgDiv = document.createElement("div");
	oImgDiv.className = "homePageImage";
	oImgDiv.id = "imgSlot" + i.toString();  // for nonIE blendImage
	oImgDiv.width = width;

	oImgDiv.innerHTML = "<a id='anchor"+i.toString()+"' href='#'><img id='img"+i.toString()+"' alt='' /></a>";
//	oImgDiv.innerHTML = "<a id='anchor"+i.toString()+"' href='#'><img id='img"+i.toString()+"'" + 
//		"filter: alpha(opacity=0); -moz-opacity: 0; opacity: 0; alt='' /></a>";

	oContainer.appendChild( oImgDiv );

// for nonIE blendImage
//<div style="background-image: url(media/texts/photos_about/02aft.jpg); background-repeat: no-repeat; width: 200px; height: 150px;" id="blenddiv">
//<img src="media/texts/photos_about/02aft.jpg" style="width: 200px; height: 150px; border: 0 none; filter: alpha(opacity=0); -moz-opacity: 0; opacity: 0;" id="blendimage" alt="" />

}


/*
function addHomeImage( oContainer, i, width ) {
	var oImgDiv = document.createElement("div");
//	oImgDiv.className = "homePageImage";
	oImgDiv.id = "imgSlot" + i.toString();
//	oImgDiv.style.width = width.toString()+"px";
	oImgDiv.width = width;
	var oAnchor = document.createElement("a");
	oAnchor.id = "anchor"+i.toString();
	var oImg = new Image;
	oImg.id = "img"+i.toString();
	oAnchor.appendChild( oImg );
	oImgDiv.appendChild( oAnchor );
	oContainer.appendChild( oImgDiv );
}
*/

// loads a set of randomly selected images into the available slots
function getInitialImages() {
	/* get initial images, one per image slot */
	for (i = 0; i < slideImages.length; i++) {
		/* get random image for this image slot */
		currentImages[i] = randInt(0, slideImages[i].length-1);
//alert(i.toString()+","+currentImages[i].toString());
		/* create an image object for it */
		imageCache[i][currentImages[i]] = new Image();
		/* and load it and image cache array*/
		imageCache[i][currentImages[i]].src = slideImages[i][currentImages[i]][0];
		/* set it to be the one on the page */
		document.getElementById("img"+i.toString()).src = slideImages[i][currentImages[i]][0];
		/* set the anchor's href */
		document.getElementById("anchor"+i.toString()).href = slideImages[i][currentImages[i]][1];
	}
}

// should do this after init preloads via callback from img's onload event
function getRestOfImages() {
	// loop thru the image list, and load any that weren't part of initial set
	for (i = 0; i < slideImages.length; i++) {
		for (j = 0; j < slideImages[i].length; j++) {
			if ( !imageCache[i][j] ) { // then it wasn't one of the init images
				imageCache[i][j] = new Image();
				imageCache[i][j].src = slideImages[i][j][0];
			}
		}
   	}
	setTimeout('runSlideShow(0)', slideShowSpeed);
}

function runSlideShow(imgSlot) {

	var bDoShow = false;
	// for fixed images (no show), each slot contains only 1 image
	for (i=0; (i<slideImages.length) && !bDoShow; i++ ) {
		if ( slideImages[i].length > 1 ) bDoShow = true;
	}
	// if so, don't do show
	if ( bDoShow ) {
		var	nextImg = currentImages[imgSlot]; // sure to match to start

		// loop until you find a new image for the random slot
		while ( currentImages[imgSlot] == nextImg ) {
			imgSlot = randInt(0, slideImages.length-1);
			nextImg = randInt(0, slideImages[imgSlot].length-1);
		}
		currentImages[imgSlot] = nextImg;

		// make the image clickable
		document.getElementById("anchor"+imgSlot.toString()).href = slideImages[imgSlot][nextImg][1];

		// determine current image
		currImg = document.getElementById("img"+imgSlot.toString());
		// fade from current to next
		if (document.all){  // if IE, use its proprietary blendTrans method
			currImg.style.filter="blendTrans(duration="+crossFadeDuration.toString()+")";
			currImg.filters.blendTrans.Apply();

			currImg.src = slideImages[imgSlot][nextImg][0];

			currImg.filters.blendTrans.Play()
		} else {  // non-IE, roll the fade yourself
//			currImg.src = slideImages[imgSlot][nextImg][0];
			blendimage("imgSlot"+imgSlot.toString(), "img"+imgSlot.toString(), 
				slideImages[imgSlot][nextImg][0], 1000*crossFadeDuration);
		}
		
		// recursively runSlideShow for next image, after waiting slideShowSpeed msecs
		setTimeout('runSlideShow('+imgSlot.toString()+')', slideShowSpeed);
	}
}

// main()
// which images currently occupy the slots
var currentImages = new Array(slideImages.length);
// a cache of all images to be used randomly
var imageCache = new Array(slideImages.length);
// create placeholders in the cache for each image's object and target page
// to be filled by getInitialImages() and getRestOfImages()
for (i = 0; i < slideImages.length; i++) {
	imageCache[i] = new Array(slideImages[i].length);
}