var TabInterface = {
      currentTabPosition: 0,
      tabbedFrames: '',
      tabbedHeadings: '',

      init: function(tabContainerId, tabToDisplay) {
         this.getTabbedFramesIdsAndHeadings(tabContainerId);
         this.setUpTabbedHeadings();
         this.appendFrameContent(tabContainerId);
         if(tabToDisplay && document.getElementById(tabToDisplay)) {
           this.displayNewTab(tabToDisplay);
         }
      },

      getTabbedFramesIdsAndHeadings: function(tabContainerId) {
         var tempChildNodes = YAHOO.util.Dom.getChildren(tabContainerId);

         this.tabbedFrames = new Array();
         this.tabbedHeadings = new Array();
         var j = 0;
         for(var i = 0; i < tempChildNodes.length; i++) {
            if(tempChildNodes[i].id.length > 0) {
              this.tabbedFrames[j] = tempChildNodes[i].id;
              var childHeadingNodes = YAHOO.util.Dom.getFirstChild(tempChildNodes[i]);
              this.tabbedHeadings[j] = childHeadingNodes.innerHTML;
              childHeadingNodes.style.display ="none";
              if(j > 0) {
                tempChildNodes[i].style.display ="none";
              }
              j++;
            }
         }
      },

      setUpTabbedHeadings: function() {
        for(var i = 0; i < this.tabbedFrames.length; i++) {
          if(i == 0) {
            this.createAndAppendTabbedCells(this.tabbedFrames[i], 'topContentNav', -1);
            this.createAndAppendTabbedCells(this.tabbedFrames[i], 'bottomContentNav', -1);
          }

          this.createAndAppendTabbedCells(this.tabbedFrames[i] + '-top', 'topContentNav', i);
          this.createAndAppendTabbedCells(this.tabbedFrames[i]  + '-bottom', 'bottomContentNav', i);

          if((i + 1) == this.tabbedFrames.length) {
            this.createAndAppendTabbedCells(this.tabbedFrames[i], 'topContentNav', 99);
            this.createAndAppendTabbedCells(this.tabbedFrames[i], 'bottomContentNav', 99);
          }
        }

      },

      appendFrameContent: function(tabContainerId) {
        this.createAndAppendTabbedCells(tabContainerId, 'tabbedContent', 999);
      },

      createAndAppendTabbedCells: function(cellId, rowId, cellnumber) {
        var rowToBeAppended = document.getElementById(rowId);
        var tableCell = document.createElement('TD');
        switch(cellnumber) {
          case -1:
            tableCell.className = 'bar';
            tableCell.innerHTML ='&nbsp;';
          break;
          case 0:
            tableCell.className = 'active';
          break;
          case 99:
            tableCell.className = 'remainder bar';
            tableCell.innerHTML ='&nbsp;';
          break;
          case 999:
            tableCell.className = 'content';
            tableCell.setAttribute('colSpan', 4);
            tableCell.appendChild(document.getElementById(cellId));
          break;

          default:
            tableCell.className = 'inactive';

        }

        if(cellnumber != '-1' && cellnumber != '99' && cellnumber != '999') {
          //tableCell.setAttribute('onClick', 'TabInterface.displayNewTab(\'' + cellnumber +'\')');
          tableCell.onclick=function(){TabInterface.displayNewTab(cellnumber)};
          tableCell.innerHTML = this.tabbedHeadings[cellnumber];
          tableCell.id = cellId;
        }

        rowToBeAppended.appendChild(tableCell);
      },


      displayNewTab: function(tabbedFramePosition) {
        if(tabbedFramePosition == this.currentTabPosition) {
          return;
        }
        for(var i = 0; i < this.tabbedFrames.length; i++) {
            if(i == tabbedFramePosition) {
              document.getElementById(this.tabbedFrames[i]).style.display="block";
              var newTopTab = document.getElementById(this.tabbedFrames[i] + '-top');
              var newBottomTab = document.getElementById(this.tabbedFrames[i] + '-bottom');
              newTopTab.className ='active';
              newBottomTab.className ='active';
              this.currentTabPosition = tabbedFramePosition;
            }else {
              document.getElementById(this.tabbedFrames[i]).style.display="none";

              var newTopTab = document.getElementById(this.tabbedFrames[i] + '-top');
              var newBottomTab = document.getElementById(this.tabbedFrames[i] + '-bottom');
              newTopTab.className ='inactive';
              newBottomTab.className ='inactive';
            }
          }
      }

};

