function init(){
  var element = document.getElementById("konaLayer");
  element.style.opacity = "0";
  element.style.filter = 'alpha(opacity = 0)';
  element = document.getElementById("patrickLayer");
  element.style.opacity = "0";
  element.style.filter = 'alpha(opacity = 0)';
  element = document.getElementById("cherubLayer");
  element.style.opacity = "0";
  element.style.filter = 'alpha(opacity = 0)';
  element = document.getElementById("visionLayer");
  element.style.opacity = "0";
  element.style.filter = 'alpha(opacity = 0)';
  element = document.getElementById("skillsLayer");
  element.style.opacity = "0";
  element.style.filter = 'alpha(opacity = 0)';
  element = document.getElementById("breakLayer");
  element.style.opacity = "0";
  element.style.filter = 'alpha(opacity = 0)';
}

/*
function hideAll() {
}
*/

function showMe(layer){
  if (layer.toString() == "konaLayer".toString()) {
      hideVision();
      hidePatrick();
      hideSkills();
      hideCherub();
      hideBreak();
      showKona();
  }
  else if (layer.toString() == "visionLayer".toString()) {
      hideKona();
      hidePatrick();
      hideSkills();
      hideCherub();
      hideBreak();
      showVision();
  }
  else if (layer.toString() == "patrickLayer".toString()) {
      hideKona();
      hideVision();
      hideSkills();
      hideCherub();
      hideBreak();
      showPatrick();
  }
  else if (layer.toString() == "skillsLayer".toString()) {
      hideKona();
      hideVision();
      hidePatrick();
      hideCherub();
      hideBreak();
      showSkills();
  }
  else if (layer.toString() == "cherubLayer".toString()) {
      hideKona();
      hideVision();
      hidePatrick();
      hideSkills();
      hideBreak();
      showCherub();
  }
  else if (layer.toString() == "breakLayer".toString()) {
      hideKona();
      hideVision();
      hidePatrick();
      hideSkills();
      hideCherub();
      showBreak();
  }
  else {
      hideKona();
      hideVision();
      hidePatrick();
      hideSkills();
      hideCherub();
      hideBreak();
  }
}
/*
function hideMe(i){
  switch (i) {
    case 1:
      hideKona();
      break;
    case 2:
      hideVision();
      break;
    case 3:
      hidePatrick();
      break;
    case 4:
      hideSkills();
      break;
    case 5:
      hideCherub();
      break;
    case 6:
      hideBreak();
      break;
    default:
      hideKona();
      hideVision();
      hidePatrick();
      hideSkills();
      hideCherub();
      hideBreak();
  }
}
*/

function hideKona(){
  fade("konaLayer",true);
}

function showKona(){
  fade("konaLayer",false);
}

function hideVision(){
  fade("visionLayer",true);
}
function showVision(){
  fade("visionLayer",false);
}

function hidePatrick(){
  fade("patrickLayer",true);
}
function showPatrick(){
  fade("patrickLayer",false);
}

function hideSkills(){
  fade("skillsLayer",true);
}
function showSkills(){
  fade("skillsLayer",false);
}

function hideCherub(){
  fade("cherubLayer",true);
}
function showCherub(){
  fade("cherubLayer",false);
}

function hideBreak(){
  fade("breakLayer",true);
}
function showBreak(){
  fade("breakLayer",false);
}


var TimeToFade = 500.0;

function fade(eid, toHidden)
{
  var element = document.getElementById(eid);
  if(element == null)
    return;
   
  if (toHidden) {
    if (element.style.opacity == '0') { 
      return;
    }
    element.FadeState = 2;
  }
  else {
    element.FadeState = -2;
  }
  if(element.FadeState == 1 || element.FadeState == -1)
  {
    element.FadeState = element.FadeState == 1 ? -1 : 1;
    element.FadeTimeLeft = TimeToFade - element.FadeTimeLeft;
  }
  else
  {
    element.FadeState = element.FadeState == 2 ? -1 : 1;
    element.FadeTimeLeft = TimeToFade;
    setTimeout("animateFade(" + new Date().getTime() + ",'" + eid + "')", 33);
  }  
}

function animateFade(lastTick, eid)
{  
  var curTick = new Date().getTime();
  var elapsedTicks = curTick - lastTick;
 
  var element = document.getElementById(eid);
 
  if(element.FadeTimeLeft <= elapsedTicks)
  {
    element.style.opacity = element.FadeState == 1 ? '1' : '0';
    element.style.filter = 'alpha(opacity = '
        + (element.FadeState == 1 ? '100' : '0') + ')';
    element.FadeState = element.FadeState == 1 ? 2 : -2;
    return;
  }
 
  element.FadeTimeLeft -= elapsedTicks;
  var newOpVal = element.FadeTimeLeft/TimeToFade;
  if(element.FadeState == 1)
    newOpVal = 1 - newOpVal;

  element.style.opacity = newOpVal;
  element.style.filter = 'alpha(opacity = ' + (newOpVal*100) + ')';
 
  setTimeout("animateFade(" + curTick + ",'" + eid + "')", 33);
}