source: trunk/web/addons/job_monarch/lib/extjs/examples/portal/sample.js @ 619

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

lib/:

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