function gebi(psId){return document.getElementById(psId)}

function show(element){
  if(element.show){
    element.show();
  }else{
    element.style.display = '';
  }
}

function hide(element){
  if(element.hide){
    element.hide();
  }else{
    element.style.display = 'none';
  }
}

/**
 * Classe para controlar abas
 */
function TabbedLayout(psDefaultTab,psClassSelected,psClassUnselected){
  var self = this;
  self.caTabs = {};
  self.csDefaultTab = psDefaultTab;
  self.csSelectedTab = psDefaultTab;
  self.csClassSelected = psClassSelected;
  self.csClassUnselected = psClassUnselected;
  
  self.showTab = function(psTabId){
    var moTab = self.caTabs[psTabId];
    show(moTab.panel);
    moTab.button.className = self.csClassSelected;
  }
  
  self.hideTab = function(psTabId){
    var moTab = self.caTabs[psTabId];
    hide(moTab.panel);
    moTab.button.className = self.csClassUnselected;
  }
  
 /**
  * Adiciona uma aba
  */
  self.addTab = function(psTabId,pmTabButton,pmTabPanel){
    self.caTabs[psTabId] = {
      'panel': (typeof(pmTabPanel)=='string' ? gebi(pmTabPanel) : pmTabPanel),
      'button': (typeof(pmTabButton)=='string' ? gebi(pmTabButton) : pmTabButton)
    };
    if(self.csSelectedTab === null){
      self.csSelectedTab = psTabId;
    }
    if(psTabId == self.csSelectedTab){
      self.showTab(psTabId);
    }else{
      self.hideTab(psTabId);
    }
  }
  
 /**
  * Seleciona uma aba
  */
  self.selectTab = function(psTabId){
    self.hideTab(self.csSelectedTab);
    if(self.caTabs[psTabId]){
      self.csSelectedTab = psTabId;
      self.showTab(self.csSelectedTab);
    }else if(self.csDefaultTab){
      self.csSelectedTab = self.csDefaultTab;
      self.showTab(self.csSelectedTab);
    }else{
      self.csSelectedTab = null;
    }
  }
  
 /**
  * Reseta tudo, escondendo os elementos nao selecionados e mostrando o selecionado
  * OBS: Util apos modificacoes nas abas
  */
  self.refresh = function(){
    for(var i in self.caTabs){
      if(i == self.csSelectedTab){
        self.showTab(i);
      }else{
        self.hideTab(i);
      }
    }
  }

}

/**
 * Classe que agrupa elementos HTML para que possam ser tratados como um só elemento.
 * Usage: grupo = new ElementGroup('idElem1','idElem2',...,'idElemN');
 */
function ElementGroup(){
  var self = this;
  var elements = {};
  var walk = function(methodName,func){
    for(var id in elements){
      if(elements[id]){
        if(elements[id][methodName]){
          elements[id][methodName]();
        }else{
          func(elements[id]);
        }
      }
    }
  }
  for(var i=0; i<arguments.length; i++){
    elements[arguments[i]] = gebi(arguments[i]);
  }
  
 /**
  * Adiciona um elemento ao grupo
  */
  self.addElement = function(piElementId){
    elements[piElementId] = gebi(piElementId);
  }
  
 /**
  * Desabilita todos elementos do grupo
  */
  self.disable = function(){
    walk('disable',function(e){e.disabled=true});
  }
  
 /**
  * Habilita todos elementos do grupo
  */
  self.enable = function(){
    walk('enable',function(e){e.disabled=false});
  }
  
 /**
  * Exibe todos elementos do grupo
  */
  self.show = function(){
    walk('show',function(e){show(e)});
  }
  
 /**
  * Oculta todos elementos do grupo
  */
  self.hide = function(){
    walk('hide',function(e){hide(e)});
  }
  
}