Ext.ns('ES');

ES.SiteCharacteristicSolarHeatingForm = Ext.extend(Ext.FormPanel,{
  frame:true,
  border:true,
  height:130,
  defaultUnit:'px',
  layout:'Form',
  width: 320,
  buttons: [{text: 'Sauver'}]
  ,listeners: {
    afterlayout: function(c) {
      var f = this.getForm().findField('solararea');
      f.container.up('div.x-form-item').hide();
    }
  }
  ,initComponent:function() {
    var dt = new Date();
    var config = {
      buttonAlign:'right'
      ,frame:false
      ,border:true
      ,labelWidth:150
      ,bodyStyle:'padding:10px'
      ,items:[{
        xtype:'radio'
        ,id:'radio1'
        ,name:'boolvalue'
        ,boxLabel: 'Oui'
        ,width:100
        ,fieldLabel:'Appoint solaire'
        ,value:'0'
      },{
        xtype:'radio'
        ,id:'radio2'
        ,name:'boolvalue'
        ,boxLabel: 'Non'
        ,width:100
        //,checked:true
        ,labelSeparator: ''
        ,value:'1'
      },{
        xtype:'ESNumber'
        ,name:'year'
        ,width:100
        ,minValue:1900
        ,maxValue:dt.format('Y')
        ,fieldLabel:'Depuis'
        ,allowBlank:false
//        ,anchor    : '-22'
        ,msgTarget : 'side'
//        ,msgDisplay: 'block'
      },{
        xtype:'ESNumber'
        ,name:'solararea'
        ,width:100
        ,fieldLabel:'Surface [m2]'
        ,allowBlank:false
        ,msgTarget : 'side'
      },{
      xtype:'textfield'
        ,name:'entry_id'
        ,width:100
        ,fieldLabel:'entry id'
        ,hidden: true
        ,hideLabel: true
      },{
        xtype:'textfield'
        ,name:'area_id'
        ,width:100
        ,fieldLabel:'area id'
        ,hidden: true
        ,hideLabel: true
      }]
    };
  //add 'afterrender' or any other event here
     // apply config
    Ext.apply(this, Ext.apply(this.initialConfig, config));
    // call parent initComponent
    ES.SiteCharacteristicSolarHeatingForm.superclass.initComponent.call(this);
    this.getField('boolyes').on('check',function(v,bool){
      if(bool) {
        var f = this.getForm().findField('solararea');
        f.container.up('div.x-form-item').show();
      }
    }.createDelegate(this),this);
    this.getField('boolno').on('check',function(v,bool){
      if(bool) {
        var f = this.getForm().findField('solararea');
        f.container.up('div.x-form-item').hide();
      }
    }.createDelegate(this),this);
    this.doLayout();
  } // end of function initComponent
  ,onRender:function() {
    // call parent
    ES.SiteCharacteristicSolarHeatingForm.superclass.onRender.apply(this, arguments);
  } // eo function onRender
  ,isValid:function (){
    var validboolvalue = true;
    if(this.getField('boolvalue').getValue()) {
      validboolvalue = this.getField('solararea').isValid();
    }
    return(this.getField('year').isValid() && validboolvalue);
  }
  ,getField:function(fieldName){
    switch(fieldName){
      case 'boolyes':
        return this.items.itemAt(0);
      break;
      case 'boolno':
        return this.items.itemAt(1);
      break;
    }
    return this.getForm().findField(fieldName);
  }
  ,setField:function(fieldName,value){
    this.getField(fieldName).setValue(value);
  }
});

Ext.reg('ESsitecharacteristicsolarheatingform', ES.SiteCharacteristicSolarHeatingForm);