var highlight_not_empty = true;
                         
function tab_element_off(aTab){
  aTab.style.backgroundColor = "#F0F0F0";
  aTab.style.marginTop = "2px";
  aTab.style.paddingBottom = "0px";
  aTab.style.borderTop = "solid #A0A0A0 1px";
  aTab.style.marginRight = "1px";
}

function tab_element_on(aTab){
  aTab.style.backgroundColor = "#FFFFFF";
  aTab.style.marginTop = "0px";
  aTab.style.paddingBottom = "2px";
  aTab.style.borderTop = "solid orange 2px";
  aTab.style.marginRight = "0px";
}

function tab_element_adjacent(aTab){
  aTab.style.marginRight = "0px";
}

function TTab(aTabName, aTabField, aOnClick){
  this.name = aTabName;
  this.field = aTabField;
  this.onclick = aOnClick;

  this.onClickTab = function(){
    this.parent.show_tab(this);
    if(this.onclick!=""){
      eval(this.onclick);
    }
  }

  this.hide = function(){
    tab_element_off(this.tabElement);
    document.getElementById(this.name).style.display = "none";
  }

  this.show = function(){
    tab_element_on(this.tabElement);
    atab = document.getElementById(this.name);
    atab.style.display = "block";
  }

  this.adjacent = function(){
    tab_element_adjacent(this.tabElement);
  }
}

function TTabControl(aTabControlName){
  this.name = aTabControlName;
  this.tabArray = new Array();

  this.activate = function(aIndex){
    this.show_tab(this.tabArray[aIndex]);
  }

  this.show_tab = function(aShowTab){
    aPrevTab = null;
    for(i=0; i<this.tabArray.length; i++){
      aTab = this.tabArray[i];
      if(aTab==aShowTab){
        aTab.show();
        if(aPrevTab!=null){
          aPrevTab.adjacent();
        }
      }
      else{
        aTab.hide();
        aPrevTab = aTab;
      }
    }
  }

  this.hide_all = function(){
    for(i=0; i<this.tabArray.length; i++){
      aTab = this.tabArray[i];
      aTab.hide();
    }    
  }

  this.add = function(aTabName){
    aTab = new TTab(aTabName, "", "");
    aTab.parent = this;
    this.tabArray[this.tabArray.length] = aTab;
  }
  
  this.add = function(aTabName, aTabField){
    aTab = new TTab(aTabName, aTabField, "");
    aTab.parent = this;
    this.tabArray[this.tabArray.length] = aTab;
  }
  
  this.add = function(aTabName, aTabField, aOnClick){
    aTab = new TTab(aTabName, aTabField, aOnClick);
    aTab.parent = this;
    this.tabArray[this.tabArray.length] = aTab;
  }
  
  /*
  */
  
  this.writeCSS = function(){
    cssText = '<style type="text/css">';
    cssText += '.tabs{cursor: pointer;padding: 0px;margin: 0px;margin-top: 6px;border-collapse: collapse;border: none;}';
    cssText += '.tabs td{padding: 0px;margin: 0px;border: none;}';
    cssText += '.tabs div{padding-left: 6px;padding-right: 6px;border-top: solid #A0A0A0 2px;border-left: solid #A0A0A0 1px;border-right: solid #A0A0A0 1px;background-color: #F0F0F0; margin-right: 1px;}'
    cssText += '.tabs div:hover{border-top: solid orange 2px;background-color: #FFFFFF;}'
    cssText += '</style>';
    document.write(cssText);
  }

  this.writeHTML = function(){
    this.writeCSS();
  
    aText = ('<table class="tabs"><tr>');  

    for(i=0; i<this.tabArray.length; i++){
      aTab = this.tabArray[i];
      
      if((!highlight_not_empty)||(aTab.field=="")){
        not_empty = "";
      }
      else{
        not_empty = " *";
      }

      aText += ('<td><div onclick="this.tab.onClickTab();" id="'+this.name+':'+aTab.name+' Tab">'+aTab.name+not_empty+'</div></td>'); 
    }
    aText += ('</tr></table>');  

    document.write(aText + "\n");

    for(i=0; i<this.tabArray.length; i++){
      aTab = this.tabArray[i];
      aTabElement = document.getElementById(this.name + ":" + aTab.name + " Tab");
      aTabElement.tab = aTab;

      aTab.tabElement = aTabElement;
    }   
  }
}