source: trunk/web/addons/job_monarch/lib/extjs-30/examples/portal/portal.js @ 625

Last change on this file since 625 was 625, checked in by ramonb, 15 years ago

lib/extjs-30:

  • new ExtJS 3.0
File size: 3.8 KB
Line 
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 */
7Ext.onReady(function(){
8
9    // NOTE: This is an example showing simple state management. During development,
10    // it is generally best to disable state management as dynamically-generated ids
11    // can change across page loads, leading to unpredictable results.  The developer
12    // should ensure that stable state ids are set for stateful components in real apps.
13    Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
14
15    // create some portlet tools using built in Ext tool ids
16    var tools = [{
17        id:'gear',
18        handler: function(){
19            Ext.Msg.alert('Message', 'The Settings tool was clicked.');
20        }
21    },{
22        id:'close',
23        handler: function(e, target, panel){
24            panel.ownerCt.remove(panel, true);
25        }
26    }];
27
28    var viewport = new Ext.Viewport({
29        layout:'border',
30        items:[{
31            region:'west',
32            id:'west-panel',
33            title:'West',
34            split:true,
35            width: 200,
36            minSize: 175,
37            maxSize: 400,
38            collapsible: true,
39            margins:'35 0 5 5',
40            cmargins:'35 5 5 5',
41            layout:'accordion',
42            layoutConfig:{
43                animate:true
44            },
45            items: [{
46                html: Ext.example.shortBogusMarkup,
47                title:'Navigation',
48                autoScroll:true,
49                border:false,
50                iconCls:'nav'
51            },{
52                title:'Settings',
53                html: Ext.example.shortBogusMarkup,
54                border:false,
55                autoScroll:true,
56                iconCls:'settings'
57            }]
58        },{
59            xtype:'portal',
60            region:'center',
61            margins:'35 5 5 0',
62            items:[{
63                columnWidth:.33,
64                style:'padding:10px 0 10px 10px',
65                items:[{
66                    title: 'Grid in a Portlet',
67                    layout:'fit',
68                    tools: tools,
69                    items: new SampleGrid([0, 2, 3])
70                },{
71                    title: 'Another Panel 1',
72                    tools: tools,
73                    html: Ext.example.shortBogusMarkup
74                }]
75            },{
76                columnWidth:.33,
77                style:'padding:10px 0 10px 10px',
78                items:[{
79                    title: 'Panel 2',
80                    tools: tools,
81                    html: Ext.example.shortBogusMarkup
82                },{
83                    title: 'Another Panel 2',
84                    tools: tools,
85                    html: Ext.example.shortBogusMarkup
86                }]
87            },{
88                columnWidth:.33,
89                style:'padding:10px',
90                items:[{
91                    title: 'Panel 3',
92                    tools: tools,
93                    html: Ext.example.shortBogusMarkup
94                },{
95                    title: 'Another Panel 3',
96                    tools: tools,
97                    html: Ext.example.shortBogusMarkup
98                }]
99            }]
100           
101            /*
102             * Uncomment this block to test handling of the drop event. You could use this
103             * to save portlet position state for example. The event arg e is the custom
104             * event defined in Ext.ux.Portal.DropZone.
105             */
106//            ,listeners: {
107//                'drop': function(e){
108//                    Ext.Msg.alert('Portlet Dropped', e.panel.title + '<br />Column: ' +
109//                        e.columnIndex + '<br />Position: ' + e.position);
110//                }
111//            }
112        }]
113    });
114});
115
Note: See TracBrowser for help on using the repository browser.