window.addEventListener ? window.addEventListener("load", initSlide, false) : window.attachEvent("onload", initSlide);

var alphaValue = new Array();
var currentIndex = 0;
var imgs = new Array();
var isIE = (navigator.appVersion.indexOf("MSIE") != -1) ? true : false;
var isWin = (navigator.appVersion.toLowerCase().indexOf("win") != -1) ? true : false;
var isOpera = (navigator.userAgent.indexOf("Opera") != -1) ? true : false;
var nextIndex = 1;
var timer;

function initSlide() {
  imgs = document.getElementById("pnlImages").getElementsByTagName("img");
  alphaValue = new Array(imgs.length);
  if (imgs.length > 1) {
    for (i = 1; i < alphaValue.length; i++) {
      alphaValue[i] = 0;
    }
    alphaValue[0] = .99;
    timer = setTimeout(fade, 5000);
  }
}

function fade() {
  nextIndex = (currentIndex + 1 < imgs.length) ? currentIndex + 1 : 0;
  alphaValue[currentIndex] -= .05;
  alphaValue[nextIndex] += .05
  imgs[nextIndex].style.display = "block";
  document.getElementById("page" + nextIndex).style.display = "block";
  setOpacity();
  if (alphaValue[currentIndex] <= 0) {
    imgs[currentIndex].style.display = "none";
    document.getElementById("page" + currentIndex).style.display = "none";
    currentIndex = nextIndex;
    timer = setTimeout(fade, 5000);
  }
  else {
    timer = setTimeout(fade, 50);
  }
}

function setOpacity() {
  if (alphaValue[nextIndex] > 1) { alphaValue[nextIndex] = 1; }
  with (navigator.userAgent.toLowerCase()) {
    if (indexOf("firefox") != -1) {
      imgs[currentIndex].style.MozOpacity = alphaValue[currentIndex];
      imgs[nextIndex].style.MozOpacity = alphaValue[nextIndex];
      document.getElementById("page" + currentIndex).style.MozOpacity = alphaValue[currentIndex];
      document.getElementById("page" + nextIndex).style.MozOpacity = alphaValue[nextIndex];
    }
    else if (indexOf("safari") != -1 || indexOf("opera") != -1) {
      imgs[currentIndex].style.opacity = alphaValue[currentIndex];
      imgs[nextIndex].style.opacity = alphaValue[nextIndex];
      document.getElementById("page" + currentIndex).style.opacity = alphaValue[currentIndex];
      document.getElementById("page" + nextIndex).style.opacity = alphaValue[nextIndex];
    }
    else {
      imgs[currentIndex].style.filter = "alpha(opacity=" + (alphaValue[currentIndex] * 100) + ")";
      imgs[nextIndex].style.filter = "alpha(opacity=" + (alphaValue[nextIndex] * 100) + ")";
    }
  }
}

function stopSlide(value) {
  clearTimeout(timer);
  for (i = 0; i < imgs.length; i++) {
    if (i == value) {
      alphaValue[i] = 1;
      imgs[i].style.display = "block";
      document.getElementById("page" + i).style.display = "block";
    }
    else {
      alphaValue[i] = 0;
      imgs[i].style.display = "none";
      document.getElementById("page" + i).style.display = "none";
    }
  }
  currentIndex = value;
  nextIndex = (currentIndex + 1 < imgs.length) ? currentIndex + 1 : 0;
  setOpacity();
}

function resumeSlide() {
  timer = setTimeout(fade, 5000);
}