var banner_monster_pos = 0;
//var banner_monster_pos_max = 5;
var TimeToFade = 1000.0;
var TMOut = 20000;
var timeout_var = 0;

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);
}

function fade(eid)
{
  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;
    setTimeout("animateFade(" + new Date().getTime() + ",'" + eid + "')", 33);
  }  
}
function resetActiveBannerMonster() {
  document.getElementById('t_navi'+banner_monster_pos).className = "b_tbl_cell";
  document.getElementById('w_banner_monster'+banner_monster_pos).style.display = "none";
}

function setBannerMonster(div_id) {
  document.getElementById('w_banner_monster'+div_id).FadeState = -2;
  document.getElementById('w_banner_monster'+div_id).style.opacity = 0;
//  document.getElementById('w_banner_monster'+div_id).style.backgroundImage = ar_banner_monster[div_id]["img url"];
  document.getElementById('t_navi'+div_id).className = "b_tbl_cell_sel";
  document.getElementById('w_banner_monster_text_h').innerHTML = ar_banner_monster[div_id]["head text"];
  document.getElementById('w_banner_monster_text_h').style.backgroundColor = ar_banner_monster[div_id]["head background-color"];
  document.getElementById('w_banner_monster_text_b').innerHTML = ar_banner_monster[div_id]["bottom text"];
  document.getElementById('w_banner_monster_text_b').style.backgroundColor = ar_banner_monster[div_id]["bottom background-color"];
  document.getElementById('w_banner_monster'+div_id).style.display = "block";
  fade('w_banner_monster'+div_id);
}

function banner_monster_timer () {
  resetActiveBannerMonster();
  if (banner_monster_pos == banner_monster_pos_max) {
    banner_monster_pos = 0;
  } else {
    banner_monster_pos++;
  }
  setBannerMonster(banner_monster_pos);
  timeout_var = setTimeout("banner_monster_timer()",TMOut);
}

function loadBannerMonsters() {
  for (i=0;i<=banner_monster_pos_max;i++) {
    document.getElementById('w_banner_monster'+i).style.backgroundImage = ar_banner_monster[i]["img url"];
	if (ar_banner_monster[i]["link url"] != null) {
	    document.getElementById('w_banner_monster'+i).onclick = new Function("self.location.href='"+ar_banner_monster[i]["link url"]+"'");
	    document.getElementById('w_banner_monster'+i).style.cursor="pointer";
	  }
  }
}

function animateBannerMonster(div_id) {
  if (div_id <= banner_monster_pos_max) {
    clearTimeout(timeout_var);
    resetActiveBannerMonster();
    banner_monster_pos = div_id;
    setBannerMonster(div_id);
    timeout_var = setTimeout("banner_monster_timer()",TMOut);
  }
}

function toggle_rm_article(div_id) {
  if (document.getElementById('rm_article'+div_id).style.display == "block") {
    document.getElementById('rm_article'+div_id).style.display = "none";
  } else {
    document.getElementById('rm_article'+div_id).style.display = "block";
  }

}