Upgrade to ExtJS 4.0.1 - Released 05/18/2011
[extjs.git] / examples / window / layout.js
index 2751840..6edc70a 100644 (file)
@@ -1,63 +1,58 @@
-/*\r
- * Ext JS Library 2.2.1\r
- * Copyright(c) 2006-2009, Ext JS, LLC.\r
- * licensing@extjs.com\r
- * \r
- * http://extjs.com/license\r
- */\r
-\r
-Ext.onReady(function(){\r
-    \r
-    Ext.state.Manager.setProvider(\r
-            new Ext.state.SessionProvider({state: Ext.appState}));\r
-\r
-    var button = Ext.get('show-btn');\r
-\r
-    button.on('click', function(){\r
-\r
-        // tabs for the center\r
-        var tabs = new Ext.TabPanel({\r
-            region    : 'center',\r
-            margins   : '3 3 3 0', \r
-            activeTab : 0,\r
-            defaults  : {\r
-                               autoScroll : true\r
-                       },\r
-            items     : [{\r
-                title    : 'Bogus Tab',\r
-                html     : Ext.example.bogusMarkup\r
-             },{\r
-                title    : 'Another Tab',\r
-                html     : Ext.example.bogusMarkup\r
-             },{ \r
-                title    : 'Closable Tab',\r
-                html     : Ext.example.bogusMarkup,\r
-                closable : true\r
-            }]\r
-        });\r
-\r
-        // Panel for the west\r
-        var nav = new Ext.Panel({\r
-            title       : 'Navigation',\r
-            region      : 'west',\r
-            split       : true,\r
-            width       : 200,\r
-            collapsible : true,\r
-            margins     : '3 0 3 3',\r
-            cmargins    : '3 3 3 3'\r
-        }); \r
-\r
-        var win = new Ext.Window({\r
-            title    : 'Layout Window',\r
-            closable : true,\r
-            width    : 600,\r
-            height   : 350,\r
-            //border : false,\r
-            plain    : true,\r
-            layout   : 'border',\r
-            items    : [nav, tabs]\r
-        });\r
-\r
-        win.show(button);\r
-    });\r
+Ext.require([
+    'Ext.tab.*',
+    'Ext.window.*',
+    'Ext.tip.*',
+    'Ext.layout.container.Border'
+]);
+Ext.onReady(function(){
+    var win,
+        button = Ext.get('show-btn');
+
+    button.on('click', function(){
+
+        if (!win) {
+            win = Ext.create('widget.window', {
+                title: 'Layout Window',
+                closable: true,
+                closeAction: 'hide',
+                //animateTarget: this,
+                width: 600,
+                height: 350,
+                layout: 'border',
+                bodyStyle: 'padding: 5px;',
+                items: [{
+                    region: 'west',
+                    title: 'Navigation',
+                    width: 200,
+                    split: true,
+                    collapsible: true,
+                    floatable: false
+                }, {
+                    region: 'center',
+                    xtype: 'tabpanel',
+                    items: [{
+                        title: 'Bogus Tab',
+                        html: 'Hello world 1'
+                    }, {
+                        title: 'Another Tab',
+                        html: 'Hello world 2'
+                    }, {
+                        title: 'Closable Tab',
+                        html: 'Hello world 3',
+                        closable: true
+                    }]
+                }]
+            });
+        }
+        button.dom.disabled = true;
+        if (win.isVisible()) {
+            win.hide(this, function() {
+                button.dom.disabled = false;
+            });
+        } else {
+            win.show(this, function() {
+                button.dom.disabled = false;
+            });
+        }
+    });
 });
\ No newline at end of file