var tabnav = new TabNavigation();
tabnav.Init();

function TabRollover(){
  tabnav.Rollover(this.getElementsByTagName("a")[0]);  
  tabnav.rolledOut=true;
}

function TabRollout(){
  if (!tabnav.rollingOut){    
    setTimeout(function(){tabnav.Rollout(this)}, 3000);  
    tabnav.rollingOut=true;
    tabnav.rolledOut=false;
  }
}

function TabNavigation(){
  this.rolledOut = true;
  this.rollingOut = false;
  this.TabEl = null; // Tab container div#tabs
  this.SubNavEl = null; // SubNav container div#subnav
  
  this.CurrentTab = null; // the current tab (li)
  this.CurrentSubNavLink = null;
  
  this.Tabs = new Array();  // array of tabs (LIs)
  
  this.CurrentUrl = "";
  
  this.Init = function(){
    this.TabEl = document.getElementById("tabs");
    this.SubNavEl = document.getElementById("subnav");
    var tabUl= this.TabEl.getElementsByTagName("ul")[0];    
    var tabLi = tabUl.childNodes;    
    var Tabs=tabLi;
    var j=0;
    
    for (var i=0; i<tabLi.length; i++){    
      if (tabLi[i].nodeType==1 && tabLi[i].tagName.toLowerCase() == "li"){      
        var currTabLi = tabLi[i];        
        this.Tabs[j++] = currTabLi;
        
        var currTabA = currTabLi.getElementsByTagName("a")[0];
        if (currTabLi.className=="current"){            
            this.CurrentTab=currTabLi;
            this.Rollover(currTabA);
        }
        
        currTabLi.onmouseover= TabRollover;
        currTabLi.onmouseout= TabRollout;
        
      }
    }
    
  }
  
  this.SetSubNav = function(a){        
    var ul = a.parentNode.getElementsByTagName("ul")[0];
    var newUl=document.createElement("ul");
    newUl.innerHTML=ul.innerHTML;
    this.SubNavEl.innerHTML="";
    this.SubNavEl.appendChild(newUl);
  }
  
  this.Rollover = function(a){
     this.SetSubNav(a);     
     
      for (var i=0; i<this.Tabs.length; i++){    
          var currTabLi = this.Tabs[i];
          currTabLi.className="";
      }
      var overTab=a.parentNode;      
      this.CurrentTab.className="current_out";
      overTab.className="current";
  }
  
  this.Rollout = function(a){ 
    if(!this.rolledOut){
      this.Rollover(this.CurrentTab.getElementsByTagName('a')[0]);
      this.rollingOut=false;
    }
  }
   
}