var currentLayer = 1;
var currentImage = 0;
var fadeTime = 100;
var fadeStep = 5;
var pauseTime = 1500;

function initImage() {

  imageOne = 'imageone';
  imageTwo = 'imagetwo';
  image1 = document.getElementById(imageOne);
  image2 = document.getElementById(imageTwo);
  
  layer1 = document.getElementById('canvas_1');
  layer2 = document.getElementById('canvas_2');
  image1.src = images[0];
  setOpacity(image1, 0);
  image1.style.visibility = "visible";
  image2.style.visibility = "visible";
  layer1.style.zIndex=2;
  layer2.style.zIndex=1;
  fade(imageOne,imageTwo, 0, 0);
}

function fade(objOne, objTwo, opacityOne, opacityTwo) {
  if (document.getElementById) {
    objectOne = document.getElementById(objOne);
    objectTwo = document.getElementById(objTwo);
    if (currentLayer == 1 && opacityOne <= 100) {
      setOpacity(objectOne, opacityOne);
      setOpacity(objectTwo, opacityTwo);
      opacityOne += fadeStep;
      opacityTwo -= fadeStep;
      if (opacityTwo < 0) {
        opacityTwo = 0;
      }
      window.setTimeout("fade('"+objOne+"','"+objTwo+"',"+opacityOne+","+opacityTwo+")", fadeTime);
    } else 
    if (currentLayer == 2 && opacityTwo <= 100) {
      setOpacity(objectOne, opacityOne);
      setOpacity(objectTwo, opacityTwo);
      opacityOne -= fadeStep;
      opacityTwo += fadeStep;
      if (opacityOne < 0) {
        opacityOne = 0;
      }
      window.setTimeout("fade('"+objOne+"','"+objTwo+"',"+opacityOne+","+opacityTwo+")", fadeTime);
    } else {
      if (currentImage == images.length - 1) {
        currentImage = 0;
      } else {
        currentImage += 1;
      }
      
      if (currentLayer == 1) {
        document.getElementById('canvas_1').style.zIndex=1;
        document.getElementById('canvas_2').style.zIndex=2;
        objectTwo.src = images[currentImage];
        currentLayer = 2;
        opacityOne = 100;
        opacityTwo = 0;
      } else {
        document.getElementById('canvas_1').style.zIndex=2;
        document.getElementById('canvas_2').style.zIndex=1;
        objectOne.src = images[currentImage];
        currentLayer = 1;
        opacityOne = 0;
        opacityTwo = 100;
      }
      
      window.setTimeout("pause('"+objOne+"','"+objTwo+"',"+opacityOne+","+opacityTwo+")", pauseTime);
    }  
  }
}

function pause(objOne, objTwo, opacityOne, opacityTwo) {
  window.setTimeout("fade('"+objOne+"','"+objTwo+"',"+opacityOne+","+opacityTwo+")", fadeTime);
} 

function setOpacity(obj, opacity) {
  opacity = (opacity == 100)?99.999:opacity;
  // IE/Win
  obj.style.filter = "alpha(opacity:"+opacity+")";
  // Safari<1.2, Konqueror
  obj.style.KHTMLOpacity = opacity/100;
  // Older Mozilla and Firefox
  obj.style.MozOpacity = opacity/100;
  // Safari 1.2, newer Firefox and Mozilla, CSS3
  obj.style.opacity = opacity/100;
}