Ext.ns('energywater');

energywater.counterInfos = Ext.extend(Ext.Panel,{
  layout: 'card'
  ,activeItem:'watercounter'
  ,frame:false
  ,border:false
  ,initComponent:function() {
    var config = {
      items:[{
        id:'watercounter',
        xtype:'watercounterinfos'
      },{
        id:'energycounter',
        xtype:'energycounterinfos'
      }]
    }; // eo config object
    // apply config
    Ext.apply(this, Ext.apply(this.initialConfig, config));
    // call parent initComponent
    energywater.counterInfos.superclass.initComponent.apply(this, arguments);
    this.waterCounterInfos = this.items.itemAt(0);
    this.energyCounterInfos = this.items.itemAt(1);
  } // end of function initComponent
  ,onRender:function() {
    energywater.counterInfos.superclass.onRender.apply(this, arguments);
  } // eo function onRender
  ,init:function(type,counter_id) {
    switch(type){
      case"water":
        this.layout.setActiveItem(type+'counter');
        this.waterCounterInfos.init(counter_id);
      break;
      case"energy":
        this.layout.setActiveItem('energycounter');
        this.energyCounterInfos.init(counter_id);
      break;
      case"elecsimple":
        this.layout.setActiveItem('energycounter');
        this.energyCounterInfos.init(counter_id);
      break;
      case"elecdouble":
        this.layout.setActiveItem('energycounter');
        this.energyCounterInfos.init(counter_id);
      break;
    }
  }
});

Ext.reg('energywatercounterinfos', energywater.counterInfos);