| 1 | /*! |
|---|
| 2 | * Ext JS Library 3.0.0 |
|---|
| 3 | * Copyright(c) 2006-2009 Ext JS, LLC |
|---|
| 4 | * licensing@extjs.com |
|---|
| 5 | * http://www.extjs.com/license |
|---|
| 6 | */ |
|---|
| 7 | Ext.onReady(function() { |
|---|
| 8 | Ext.QuickTips.init(); |
|---|
| 9 | |
|---|
| 10 | // create some portlet tools using built in Ext tool ids |
|---|
| 11 | var tools = [{ |
|---|
| 12 | id:'gear', |
|---|
| 13 | handler: function(){ |
|---|
| 14 | Ext.Msg.alert('Message', 'The Settings tool was clicked.'); |
|---|
| 15 | } |
|---|
| 16 | },{ |
|---|
| 17 | id:'close', |
|---|
| 18 | handler: function(e, target, panel){ |
|---|
| 19 | panel.ownerCt.remove(panel, true); |
|---|
| 20 | } |
|---|
| 21 | }]; |
|---|
| 22 | |
|---|
| 23 | var viewport = new Ext.Viewport({ |
|---|
| 24 | layout:'fit', |
|---|
| 25 | items:[{ |
|---|
| 26 | xtype: 'grouptabpanel', |
|---|
| 27 | tabWidth: 130, |
|---|
| 28 | activeGroup: 0, |
|---|
| 29 | items: [{ |
|---|
| 30 | mainItem: 1, |
|---|
| 31 | items: [{ |
|---|
| 32 | title: 'Tickets', |
|---|
| 33 | layout: 'fit', |
|---|
| 34 | iconCls: 'x-icon-tickets', |
|---|
| 35 | tabTip: 'Tickets tabtip', |
|---|
| 36 | style: 'padding: 10px;', |
|---|
| 37 | items: [new SampleGrid([0,1,2,3,4])] |
|---|
| 38 | }, |
|---|
| 39 | { |
|---|
| 40 | xtype: 'portal', |
|---|
| 41 | title: 'Dashboard', |
|---|
| 42 | tabTip: 'Dashboard tabtip', |
|---|
| 43 | items:[{ |
|---|
| 44 | columnWidth:.33, |
|---|
| 45 | style:'padding:10px 0 10px 10px', |
|---|
| 46 | items:[{ |
|---|
| 47 | title: 'Grid in a Portlet', |
|---|
| 48 | layout:'fit', |
|---|
| 49 | tools: tools, |
|---|
| 50 | items: new SampleGrid([0, 2, 3]) |
|---|
| 51 | },{ |
|---|
| 52 | title: 'Another Panel 1', |
|---|
| 53 | tools: tools, |
|---|
| 54 | html: Ext.example.shortBogusMarkup |
|---|
| 55 | }] |
|---|
| 56 | },{ |
|---|
| 57 | columnWidth:.33, |
|---|
| 58 | style:'padding:10px 0 10px 10px', |
|---|
| 59 | items:[{ |
|---|
| 60 | title: 'Panel 2', |
|---|
| 61 | tools: tools, |
|---|
| 62 | html: Ext.example.shortBogusMarkup |
|---|
| 63 | },{ |
|---|
| 64 | title: 'Another Panel 2', |
|---|
| 65 | tools: tools, |
|---|
| 66 | html: Ext.example.shortBogusMarkup |
|---|
| 67 | }] |
|---|
| 68 | },{ |
|---|
| 69 | columnWidth:.33, |
|---|
| 70 | style:'padding:10px', |
|---|
| 71 | items:[{ |
|---|
| 72 | title: 'Panel 3', |
|---|
| 73 | tools: tools, |
|---|
| 74 | html: Ext.example.shortBogusMarkup |
|---|
| 75 | },{ |
|---|
| 76 | title: 'Another Panel 3', |
|---|
| 77 | tools: tools, |
|---|
| 78 | html: Ext.example.shortBogusMarkup |
|---|
| 79 | }] |
|---|
| 80 | }] |
|---|
| 81 | }, { |
|---|
| 82 | title: 'Subscriptions', |
|---|
| 83 | iconCls: 'x-icon-subscriptions', |
|---|
| 84 | tabTip: 'Subscriptions tabtip', |
|---|
| 85 | style: 'padding: 10px;', |
|---|
| 86 | layout: 'fit', |
|---|
| 87 | items: [{ |
|---|
| 88 | xtype: 'tabpanel', |
|---|
| 89 | activeTab: 1, |
|---|
| 90 | items: [{ |
|---|
| 91 | title: 'Nested Tabs', |
|---|
| 92 | html: Ext.example.shortBogusMarkup |
|---|
| 93 | }] |
|---|
| 94 | }] |
|---|
| 95 | }, { |
|---|
| 96 | title: 'Users', |
|---|
| 97 | iconCls: 'x-icon-users', |
|---|
| 98 | tabTip: 'Users tabtip', |
|---|
| 99 | style: 'padding: 10px;', |
|---|
| 100 | html: Ext.example.shortBogusMarkup |
|---|
| 101 | }] |
|---|
| 102 | }, { |
|---|
| 103 | expanded: true, |
|---|
| 104 | items: [{ |
|---|
| 105 | title: 'Configuration', |
|---|
| 106 | iconCls: 'x-icon-configuration', |
|---|
| 107 | tabTip: 'Configuration tabtip', |
|---|
| 108 | style: 'padding: 10px;', |
|---|
| 109 | html: Ext.example.shortBogusMarkup |
|---|
| 110 | }, { |
|---|
| 111 | title: 'Email Templates', |
|---|
| 112 | iconCls: 'x-icon-templates', |
|---|
| 113 | tabTip: 'Templates tabtip', |
|---|
| 114 | style: 'padding: 10px;', |
|---|
| 115 | html: Ext.example.shortBogusMarkup |
|---|
| 116 | }] |
|---|
| 117 | }] |
|---|
| 118 | }] |
|---|
| 119 | }); |
|---|
| 120 | }); |
|---|
