projects / extjs.git / blame
| Commit | Line | Data |
|---|---|---|
| 6527f429 DM |
1 | Ext.require([\r |
| 2 | 'Ext.tip.QuickTipManager',\r | |
| 3 | 'Ext.window.Window',\r | |
| 4 | 'Ext.tab.Panel',\r | |
| 5 | 'Ext.ux.TabScrollerMenu'\r | |
| 6 | ]);\r | |
| 7 | \r | |
| 8 | Ext.onReady(function() {\r | |
| 9 | // enable the tabTip config below\r | |
| 10 | Ext.tip.QuickTipManager.init();\r | |
| 11 | \r | |
| 12 | var win = Ext.widget('window', {\r | |
| 13 | constrain: true,\r | |
| 14 | height: 400,\r | |
| 15 | width: 600,\r | |
| 16 | layout: 'fit',\r | |
| 17 | title: 'Exercising scrollable tabs with a TabScroller menu',\r | |
| 18 | border: false,\r | |
| 19 | items: {\r | |
| 20 | xtype: 'tabpanel',\r | |
| 21 | activeTab: 0,\r | |
| 22 | itemId: 'tabPanel',\r | |
| 23 | plugins: [{\r | |
| 24 | ptype: 'tabscrollermenu',\r | |
| 25 | maxText : 15,\r | |
| 26 | pageSize : 5\r | |
| 27 | }],\r | |
| 28 | items: [{\r | |
| 29 | title: 'First tab',\r | |
| 30 | html: 'Creating more tabs...'\r | |
| 31 | }]\r | |
| 32 | }\r | |
| 33 | });\r | |
| 34 | \r | |
| 35 | win.show();\r | |
| 36 | \r | |
| 37 | // Add a bunch of tabs dynamically\r | |
| 38 | var tabLimit = 12,\r | |
| 39 | tabPanel = win.getComponent('tabPanel');\r | |
| 40 | \r | |
| 41 | Ext.defer(function (num) {\r | |
| 42 | var i,\r | |
| 43 | title,\r | |
| 44 | tabs = [];\r | |
| 45 | for (i = 1; i <= tabLimit; i++) {\r | |
| 46 | title = 'Tab # ' + i;\r | |
| 47 | tabs.push({\r | |
| 48 | title: title,\r | |
| 49 | html: 'Hi, I am tab ' + i,\r | |
| 50 | tabTip: title,\r | |
| 51 | closable: true\r | |
| 52 | });\r | |
| 53 | }\r | |
| 54 | tabPanel.add(tabs);\r | |
| 55 | tabPanel.getComponent(0).body.update('Done!');\r | |
| 56 | }, 100);\r | |
| 57 | }); |