X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/d41dc04ad17d1d9125fb2cf72db2b4782dbe3a8c..7a654f8d43fdb43d78b63d90528bed6e86b608cc:/examples/menu/actions.js

diff --git a/examples/menu/actions.js b/examples/menu/actions.js
index 4575d90e..558753c3 100644
--- a/examples/menu/actions.js
+++ b/examples/menu/actions.js
@@ -1,67 +1,65 @@
-/*
- * Ext JS Library 2.2.1
- * Copyright(c) 2006-2009, Ext JS, LLC.
- * licensing@extjs.com
- * 
- * http://extjs.com/license
- */
-
-Ext.onReady(function(){
-    // The action
-    var action = new Ext.Action({
-        text: 'Action 1',
-        handler: function(){
-            Ext.example.msg('Click','You clicked on "Action 1".');
-        },
-        iconCls: 'blist'
-    });
-
-
-    var panel = new Ext.Panel({
-        title: 'Actions',
-        width:600,
-        height:300,
-        bodyStyle: 'padding:10px;',     // lazy inline style
-
-        tbar: [
-            action, {                   // <-- Add the action directly to a toolbar
-                text: 'Action Menu',
-                menu: [action]          // <-- Add the action directly to a menu
-            }
-        ],
-
-        items: [
-           new Ext.Button(action)       // <-- Add the action as a button
-        ],
-
-        renderTo: Ext.getBody()
-    });
-
-
-    // Buttons added to the toolbar of the Panel above
-    // to test/demo doing group operations with an action
-    panel.getTopToolbar().add('->', {
-        text: 'Disable',
-        handler: function(){
-            action.setDisabled(!action.isDisabled());
-            this.setText(action.isDisabled() ? 'Enable' : 'Disable');
-        }
-    }, {
-        text: 'Change Text',
-        handler: function(){
-            Ext.Msg.prompt('Enter Text', 'Enter new text for Action 1:', function(btn, text){
-                if(btn == 'ok' && text){
-                    action.setText(text);
-                    action.setHandler(function(){
-                        Ext.example.msg('Click','You clicked on "'+text+'".');
-                    });
-                }
-            });
-        }
-    }, {
-        text: 'Change Icon',
-        handler: function(){
-            action.setIconClass(action.getIconClass() == 'blist' ? 'bmenu' : 'blist');
-        }
-    });
-});
\ No newline at end of file
+Ext.require([
+    'Ext.panel.Panel',
+    'Ext.Action',
+    'Ext.button.Button',
+    'Ext.window.MessageBox'
+]);
+
+Ext.onReady(function(){
+    var action = Ext.create('Ext.Action', {
+        text: 'Action 1',
+        iconCls: 'icon-add',
+        handler: function(){
+            Ext.example.msg('Click', 'You clicked on "Action 1".');
+        }
+    });
+    
+     var panel = Ext.create('Ext.panel.Panel', {
+        title: 'Actions',
+        renderTo: document.body,
+        width: 600,
+        height: 300,
+        bodyPadding: 10,
+        dockedItems: {
+            itemId: 'toolbar',
+            xtype: 'toolbar',
+            items: [
+                action, // Add the action directly to a toolbar
+                {
+                    text: 'Action menu',
+                    menu: [action] // Add the action directly to a menu
+                }
+            ]
+        },
+        items: Ext.create('Ext.button.Button', action)       // Add the action as a button
+    });
+    
+    /*
+     * Add toolbar items dynamically after creation
+     */
+    var toolbar = panel.child('#toolbar');
+    toolbar.add('->', {
+        text: 'Disable',
+        handler: function(){
+            action.setDisabled(!action.isDisabled());
+            this.setText(action.isDisabled() ? 'Enable' : 'Disable');
+        }
+    }, {
+        text: 'Change Text',
+        handler: function(){
+            Ext.Msg.prompt('Enter Text', 'Enter new text for Action 1:', function(btn, text){
+                if(btn == 'ok' && text){
+                    action.setText(text);
+                    action.setHandler(function(){
+                        Ext.example.msg('Click','You clicked on "'+text+'".');
+                    });
+                }
+            });
+        }
+    }, {
+        text: 'Change Icon',
+        handler: function(){
+            action.setIconCls(action.getIconCls() == 'icon-add' ? 'icon-edit' : 'icon-add');
+        }
+    });
+});