Ext.define problems (loses layout and this reference)

[eldono]

Hello,
I'm using extjs 4.1.1 and trying to "extend" the Window object just for configuration purpose.
If I try something like:

Ext.define('MyWindow', {
   extend : 'Ext.Window',
   config: {
       layout : 'fit',
       width : 350,
       height : 300,
       modal: true,
       items: [ Ext.create('Ext.form.Panel', {
             [...]
        }]
    }
});

The window doesn't have a correct "layout" and if I resize it the form doesn't adapt to it.
Am I doing something wrong? If I remove the config word and set all configuration properties in the defines configuration everything works as expected.

Another "strange" problem that has no workaround is when declaring window buttons:

Ext.define('MyWindow', {
    extend : 'Ext.Window',
    alias : 'solarisistemi.listarichiestefiltro',
    requires : [ 'Ext.form.*', 'Ext.window.Window' ],
    layout : 'fit',
    width : 350,
    height : 300,
    minWidth : 300,
    minHeight : 200,
    buttonsAlign: 'center',
    buttons : [{
        text : 'Reset',
        scope: this,
        handler : function() {
             // Here this is the window object
        }
    }]
})

In ExtJS 3 it was possible to define the "this" scope for this kind of situation. How can I do it in 4.1.1?

Thanx

[friend]

Below is a simple window extension which also addresses the button scope issue. Note that I assigned a widget alias of 'mw' to the extended Window, which you can then use with Ext.ComponentQuery, up(), down(), etc.

Ext.define('MyWindow', {
  extend : 'Ext.window.Window',
  alias: 'widget.mw',
  bodyPadding: 5,
  height : 300,
  layout : 'fit',
  modal: true,
  width : 350,
  saySomething: function(message) {
    Ext.Msg.alert(message, 'Button Handler Message');
  },
  items: [{  
    xtype: 'panel',
    title: 'Inner Panel'
  }],
  buttons: [{
    text: 'Do Something',
    handler: function(button, event) {
      button.up('mw').saySomething('The Do Something button was clicked.');
    }
  }]
});

// create a test instance of the Window.
Ext.create('MyWindow').show();

The use of the 'widget' alias also allows you to create object instances via xtype and override any default config:

var windowConfig = {
  xtype: 'mw',
  height: 200,
  width: 500,
  <...>
}