-/*!
- * Ext JS Library 3.0.0
- * Copyright(c) 2006-2009 Ext JS, LLC
- * licensing@extjs.com
- * http://www.extjs.com/license
- */
-Ext.onReady(function(){\r
-\r
- var handleAction = function(action){\r
- Ext.example.msg('<b>Action</b>', 'You clicked "'+action+'"');\r
- };\r
- \r
- var p = new Ext.Window({\r
- title: 'Standard',\r
- closable: false,\r
- height:250,\r
- width: 500,\r
- bodyStyle: 'padding:10px',\r
- contentEl: 'content',\r
- autoScroll: true,\r
- tbar: [{\r
- xtype:'splitbutton',\r
- text: 'Menu Button',\r
- iconCls: 'add16',\r
- handler: handleAction.createCallback('Menu Button'),\r
- menu: [{text: 'Menu Item 1', handler: handleAction.createCallback('Menu Item 1')}]\r
- },'-',{\r
- xtype:'splitbutton',\r
- text: 'Cut',\r
- iconCls: 'add16',\r
- handler: handleAction.createCallback('Cut'),\r
- menu: [{text: 'Cut menu', handler: handleAction.createCallback('Cut menu')}]\r
- },{\r
- text: 'Copy',\r
- iconCls: 'add16',\r
- handler: handleAction.createCallback('Copy')\r
- },{\r
- text: 'Paste',\r
- iconCls: 'add16',\r
- menu: [{text: 'Paste menu', handler: handleAction.createCallback('Paste menu')}]\r
- },'-',{\r
- text: 'Format',\r
- iconCls: 'add16',\r
- handler: handleAction.createCallback('Format')\r
- },'->',{\r
- text: 'Right',\r
- iconCls: 'add16',\r
- handler: handleAction.createCallback('Right')\r
- }]\r
- });\r
- p.show();\r
-\r
-});
\ No newline at end of file
+Ext.require(['*']);
+Ext.onReady(function(){
+
+ var handleAction = function(action){
+ Ext.example.msg('<b>Action</b>', 'You clicked "' + action + '"');
+ };
+
+ var colorMenu = Ext.create('Ext.menu.ColorPicker', {
+ handler: function(cm, color){
+ Ext.example.msg('Color Selected', '<span style="color:#' + color + ';">You choose {0}.</span>', color);
+ }
+ });
+
+ Ext.create('Ext.Window', {
+ title: 'Standard',
+ closable: false,
+ height:250,
+ width: 500,
+ bodyStyle: 'padding:10px',
+ contentEl: 'content',
+ autoScroll: true,
+ tbar: Ext.create('Ext.toolbar.Toolbar', {
+ layout: {
+ overflowHandler: 'Menu'
+ },
+ items: [{
+ xtype:'splitbutton',
+ text: 'Menu Button',
+ iconCls: 'add16',
+ handler: Ext.Function.pass(handleAction, 'Menu Button'),
+ menu: [{text: 'Menu Item 1', handler: Ext.Function.pass(handleAction, 'Menu Item 1')}]
+ },'-',{
+ xtype:'splitbutton',
+ text: 'Cut',
+ iconCls: 'add16',
+ handler: Ext.Function.pass(handleAction, 'Cut'),
+ menu: [{text: 'Cut menu', handler: Ext.Function.pass(handleAction, 'Cut menu')}]
+ },{
+ text: 'Copy',
+ iconCls: 'add16',
+ handler: Ext.Function.pass(handleAction, 'Copy')
+ },{
+ text: 'Paste',
+ iconCls: 'add16',
+ menu: [{text: 'Paste menu', handler: Ext.Function.pass(handleAction, 'Paste menu')}]
+ },'-',{
+ text: 'Format',
+ iconCls: 'add16',
+ handler: Ext.Function.pass(handleAction, 'Format')
+ },'->',{
+ text: 'Right',
+ iconCls: 'add16',
+ handler: Ext.Function.pass(handleAction, 'Right')
+ }, {
+ text: 'Choose a Color',
+ menu: colorMenu // <-- submenu by reference
+ }]
+ })
+ }).show();
+});