var timeToFade = 1000.0;
var timer = null;
var anime = null;
var panelCode = 1;
var panelCount = 4;

function fade(eid)
{
  if(anime != null) clearTimeout(anime);
  var element = document.getElementById(eid);
  if(element == null)
    return;
   
  if(element.fadeState == null)
  {
    if(element.style.opacity == null 
        || element.style.opacity == '' 
        || element.style.opacity == '1')
    {
      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;
    animateFade(new Date().getTime(), eid);
  }  
}
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;
    // cycle... 
    if(element.fadeState == -2) {
      getNewPanel(); 
      if(timer != null) clearTimeout(timer); 
    }
    else {
      timer = setTimeout("fade('paneShowing')",10000);
    }
    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) + ')';
  
  anime = setTimeout("animateFade(" + curTick 
      + ",'" + eid + "')", 33);
}
function getNewPanel() {
  // clear out old panel...
  $('paneShowing').innerHTML = '';
  panelCode += 1;
  if(panelCode > panelCount) panelCode = 1;
	Ajax.action = 'post';
	Ajax.url = '?p=panel';
	Ajax.keys.push('panel_code');
	Ajax.vals.push(panelCode);
	Ajax.sendRequest(callBack);
}
function callBack(res) {
  panel = res.responseText;  
  $('paneShowing').innerHTML = panel;
  fade('paneShowing');
}