// Initialise the effects
var TRANSITION_SPEED = 400;
var SLIDE_DURATION = 4000;
var START_SWITCH = 2000;

var timerID;
var myEffect;
var iIndex = 1;
var oImage;
var oDiv;
var bFlip = 0;
var oImages = new Array();

oImages[1] = "/portals/5/images/AquatticaWaterLevel.jpg";
oImages[2] = "/portals/5/images/AquatticaBoxing.jpg";
oImages[3] = "/portals/5/images/AquatticaOverhead.jpg";
oImages[4] = "/portals/5/images/Aquattica34.jpg";
oImages[5] = "/portals/5/images/LineArt.jpg";

addLoadEvent(function() {
  oImage = document.getElementById("Front");
  oDiv = document.getElementById("Back");

  myEffect = new fx.Opacity('Front', {duration: TRANSITION_SPEED});
  setTimeout("StartSwitch()", START_SWITCH);
  timerID = setInterval("ToggleEffect()", SLIDE_DURATION);

  for (var i = 1; i < oImages.length; i++)
    Preload(oImages[i]);
});

function StartSwitch()
{
  SetImages();
  setInterval("SetImages()", SLIDE_DURATION);
}

function ToggleEffect()
{
  myEffect.toggle();
}

function Preload(imgName)
{
  var imagePreloader = new Image();
  imagePreloader.src = imgName;
}

function SetImages()
{
  var iNext = NextImage();

  if (bFlip == 1)
  {
    oImage.src = oImages[iNext];
  }
  else
  {
    oDiv.style.backgroundImage = "url(" + oImages[iNext] + ")";
  }

  iIndex = iNext;
  bFlip = !bFlip;
}

function NextImage()
{
  if ((iIndex + 1) == oImages.length)
    return 1;
  else
    return iIndex + 1;
}

function addLoadEvent(func) 
{
  var oldonload = window.onload;
  if (typeof window.onload != 'function') 
  {
    window.onload = func;
  } else 
  {
    window.onload = function() 
    {
      if (oldonload) 
      {
        oldonload();
      }
      func();
    }
  }
}