// This array lists the id attributes of the divs we want to fade between
var divs_to_fade = new Array('imgbox-1', 'imgbox-2', 'imgbox-3', 'imgbox-4', 'imgbox-5', 'imgbox-6', 'imgbox-7', 'imgbox-8', 'imgbox-9', 'imgbox-10', 'imgbox-11', 'imgbox-12', 'imgbox-13', 'imgbox-14', 'imgbox-15', 'imgbox-16');

// Shuffles the array so that the spotlights display in a random order

divs_to_fade.sort(function() {return 0.5 - Math.random()});
		
var i = 0;
			
// The number of seconds to wait before swapping divs. 
var seconds = 29;

			
// Converts seconds into milliseconds - the period of time the script uses.
var wait = seconds*1000;

waitperiod = setInterval('swapFade()',wait);

// The function that performs the fading.
function swapFade() {
  Effect.Fade(divs_to_fade[i], { duration:2, from:1.0, to:0.0 });
  i++;
  // Loops the script. Set the (i == #) to equal the total number of fading divs.
  // Example: "if (i == 5)" means that there are 5 total divs to fade.
  if (i == 16) i = 0;
  Effect.Appear(divs_to_fade[i], { duration:3, from:0.0, to:1.0 });
}

// The onload event that starts the fading.
function startPage() {
Effect.Appear(divs_to_fade[i], { duration:.25, from:0.0, to:1.0 });

}

function nextSpotlight() {
  document.getElementById(divs_to_fade[i]).style.display = "none";
  i++;
  if (i == 16) i = 0;
  document.getElementById(divs_to_fade[i]).style.display = "block";
//  Effect.Appear(divs_to_fade[i], { duration:3, from:0.0, to:1.0 });
  clearInterval(waitperiod);
}

function prevSpotlight() {
  document.getElementById(divs_to_fade[i]).style.display = "none";
  i--;
  if (i <= -1) i = 11;
  document.getElementById(divs_to_fade[i]).style.display = "block";
//  Effect.Appear(divs_to_fade[i], { duration:3, from:0.0, to:1.0 });
  clearInterval(waitperiod);
}