var imageURL = new Array(), imageArray = new Array(), e;
var currentImageIndex = 0, nextImageIndex, imageOpacity, imageMaxOpacity = 1, direction = "none";

//----YOU CAN EDIT THESE PARAMETERS//
var fadeSpeed = 0.05; //0 < fadeSpeed < 1
var transitionInterval = 8; //in seconds
var randomizeImages = true; //true or false
var fadeColour = "#ffffff"; //hexidecimal colour value
var imageBorder = "1px #000000 solid"; //width | colour | style
//---------------------------------//
/*@cc_on fadeSpeed = fadeSpeed * 100; imageMaxOpacity = 100; @*/

//----IMAGES OF ANY DIMENSIONS MAY BE INCLUDED//
//----INFINITE AMOUNT OF IMAGES PERMITTED//
//----IMAGES MAY BE NAMED ANYTHING, SCRIPT HAS NO RELIANCE ON NAME//
imageURL[0] = "images/leaf.jpg";
imageURL[1] = "images/tree-in-hand.jpg";
imageURL[2] = "images/globe.jpg";
imageURL[3] = "images/plant-in-hand.jpg";

window.onload = init;

//initialisation
function init() {
  //assign each image to imageArray whose URL specified above
  for (var i = 0; i < imageURL.length; i++) {
    imageArray[i] = new Image();
    imageArray[i].src = imageURL[i];
  }
  e = document.getElementById("transitionImage");
  e.style.border = imageBorder;
  document.getElementById("imageCell").style.backgroundColor = fadeColour;
  //display first image
  if (randomizeImages == true)
    randomize();
  else
    incrementForward();
  try {imageOpacity = e.style;} catch(err) {}
  try {imageOpacity = e.filters.alpha;} catch(err) {}
  transitionDelay();
}

//performs interval/delay between transitions
function transitionDelay() {
  t = setTimeout("fadeOut()", transitionInterval * 1000);
}

//fades out image to 0% opacity
function fadeOut() {
  if (imageOpacity.opacity - fadeSpeed <= 0) {
    imageOpacity.opacity = 0;
    if (randomizeImages == true) {randomize();}
    else {(direction == "back") ? incrementBack() : incrementForward();}
    fadeIn();
  } else {
    imageOpacity.opacity = imageOpacity.opacity - fadeSpeed;
    t = setTimeout("fadeOut()", 20);
  }
}

//randomly select the next image to display in transition
function randomize() {
  do {nextImageIndex = Math.floor(Math.random() * imageArray.length);}
  while (nextImageIndex == currentImageIndex)
  e.src = imageArray[nextImageIndex].src;
  currentImageIndex = nextImageIndex;
}

//display next image in transition
function incrementForward() {
  if (currentImageIndex + 1 == imageArray.length) {currentImageIndex = 0;}
  else {currentImageIndex++;}
  e.src = imageArray[currentImageIndex].src;
}

//display previous image in transition
function incrementBack() {
  if (currentImageIndex - 1 == -1) {currentImageIndex = imageArray.length - 1;}
  else {currentImageIndex--;}
  direction = "none";
  e.src = imageArray[currentImageIndex].src;
}

//fades in image to 100% opacity
function fadeIn() {
  if (imageOpacity.opacity + fadeSpeed >= imageMaxOpacity) {
    imageOpacity.opacity = imageMaxOpacity;
    transitionDelay();
  } else {
    var temp;
    imageOpacity.opacity = (imageOpacity.opacity * 1) + fadeSpeed;
    t = setTimeout("fadeIn()", 20);
  }
}