// JavaScript Document
var imgnum = 0;
var bgnum = 1;
// the number of milliseconds between swaps.  Default is five seconds.
var wait = 5000;
var divs_to_fade = new Array();
var fade_images = new Array();

function swapFade() {
	new Effect.Fade(divs_to_fade[imgnum]);
	new Effect.Appear(divs_to_fade[bgnum]); 	
	imgnum++; 
	if (imgnum == divs_to_fade.length) imgnum = 0;	
	bgnum = imgnum + 1;	
	if (bgnum == divs_to_fade.length) bgnum = 0;
	//new Effect.Appear(divs_to_fade[imgnum], { duration:.1, from:0.0, to:1.0});
	//new Effect.toggle(divs_to_fade[imgnum]);
}

// the onload event handler that starts the fading.
function startFade() {
	boxes = $('image-fader').immediateDescendants();
	d = 0;
	for(d=0; d < boxes.length; d++) {
		divs_to_fade[d] = boxes[d].id;
		var tmp_imgs = boxes[d].getElementsBySelector('img');
		fade_images[d] = tmp_imgs[0].src;
	}
	// the starting index in the above array.  It should be set to the value of the div 
	// which doesn't have the CSS Display property set to "none"
	setInterval('swapFade()',wait);
}
if (window.addEventListener) //DOM method for binding an event
	window.addEventListener("load", startFade, false)
else if (window.attachEvent) //IE exclusive method for binding an event
	window.attachEvent("onload", startFade)
else if (document.getElementById) //support older modern browsers
	window.onload=startFade