examples/window/layout.js

   1 Ext.require([
   2     'Ext.tab.*',
   3     'Ext.window.*',
   4     'Ext.tip.*',
   5     'Ext.layout.container.Border'
   6 ]);
   7 Ext.onReady(function(){
   8     var win,
   9         button = Ext.get('show-btn');
  10
  11     button.on('click', function(){
  12
  13         if (!win) {
  14             win = Ext.create('widget.window', {
  15                 title: 'Layout Window',
  16                 closable: true,
  17                 closeAction: 'hide',
  18                 //animateTarget: this,
  19                 width: 600,
  20                 height: 350,
  21                 layout: 'border',
  22                 bodyStyle: 'padding: 5px;',
  23                 items: [{
  24                     region: 'west',
  25                     title: 'Navigation',
  26                     width: 200,
  27                     split: true,
  28                     collapsible: true,
  29                     floatable: false
  30                 }, {
  31                     region: 'center',
  32                     xtype: 'tabpanel',
  33                     items: [{
  34                         title: 'Bogus Tab',
  35                         html: 'Hello world 1'
  36                     }, {
  37                         title: 'Another Tab',
  38                         html: 'Hello world 2'
  39                     }, {
  40                         title: 'Closable Tab',
  41                         html: 'Hello world 3',
  42                         closable: true
  43                     }]
  44                 }]
  45             });
  46         }
  47         button.dom.disabled = true;
  48         if (win.isVisible()) {
  49             win.hide(this, function() {
  50                 button.dom.disabled = false;
  51             });
  52         } else {
  53             win.show(this, function() {
  54                 button.dom.disabled = false;
  55             });
  56         }
  57     });
  58 });