window.onload=function() {
upperTab.setup = {
   tabs: document.getElementById('info-category').getElementsByTagName('li'),
   
   pages: [
      document.getElementById('info-regular'),
      document.getElementById('info-animation'),
      document.getElementById('info-radio'),
//      document.getElementById('info-cd-dvd-bd'),
      document.getElementById('info-event'),
      document.getElementById('info-magazine'),
      document.getElementById('info-other')
   ]
}

upperTab.init();
}

var upperTab = {
   init: function(){
      var tabs = this.setup.tabs;
      var pages = this.setup.pages;
      
      for(i=0; i<pages.length; i++) {
         if(i !== 0) pages[i].style.display = 'none';
         tabs[i].onclick = function(){ upperTab.showpage(this); return false; };
      }
   },
   
   showpage: function(obj){
      var tabs = this.setup.tabs;
      var pages = this.setup.pages;
      var num;
      var myRegex = new RegExp(/-on$/);
      for(num=0; num<tabs.length; num++) {
         if(tabs[num] === obj) break;
      }

      for (var i=0; i<pages.length; i++) {

         if (i == num) {
            pages[num].style.display = 'block';
            if (! tabs[i].className.match(myRegex))
            {
              tabs[i].className = tabs[i].className+'-on';
            }
         }
         else {
            pages[i].style.display = 'none';

            if (tabs[i].className.match(myRegex))
            {
              tabs[i].className = tabs[i].className.slice(0,-3);
            }
         }

      }
   }
}