source: trunk/web/addons/job_monarch/lib/extjs/examples/feed-viewer/MainPanel.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: 7.3 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
9MainPanel = function(){
10    this.preview = new Ext.Panel({
11        id: 'preview',
12        region: 'south',
13        cls:'preview',
14        autoScroll: true,
15        listeners: FeedViewer.LinkInterceptor,
16
17        tbar: [{
18            id:'tab',
19            text: 'View in New Tab',
20            iconCls: 'new-tab',
21            disabled:true,
22            handler : this.openTab,
23            scope: this
24        },
25        '-',
26        {
27            id:'win',
28            text: 'Go to Post',
29            iconCls: 'new-win',
30            disabled:true,
31            scope: this,
32            handler : function(){
33                window.open(this.gsm.getSelected().data.link);
34            }
35        }],
36
37        clear: function(){
38            this.body.update('');
39            var items = this.topToolbar.items;
40            items.get('tab').disable();
41            items.get('win').disable();
42        }
43    });
44
45    this.grid = new FeedGrid(this, {
46        tbar:[{
47            text:'Open All',
48            tooltip: {title:'Open All',text:'Opens all item in tabs'},
49            iconCls: 'tabs',
50            handler: this.openAll,
51            scope:this
52        },
53        '-',
54        {
55            split:true,
56            text:'Reading Pane',
57            tooltip: {title:'Reading Pane',text:'Show, move or hide the Reading Pane'},
58            iconCls: 'preview-bottom',
59            handler: this.movePreview.createDelegate(this, []),
60            menu:{
61                id:'reading-menu',
62                cls:'reading-menu',
63                width:100,
64                items: [{
65                    text:'Bottom',
66                    checked:true,
67                    group:'rp-group',
68                    checkHandler:this.movePreview,
69                    scope:this,
70                    iconCls:'preview-bottom'
71                },{
72                    text:'Right',
73                    checked:false,
74                    group:'rp-group',
75                    checkHandler:this.movePreview,
76                    scope:this,
77                    iconCls:'preview-right'
78                },{
79                    text:'Hide',
80                    checked:false,
81                    group:'rp-group',
82                    checkHandler:this.movePreview,
83                    scope:this,
84                    iconCls:'preview-hide'
85                }]
86            }
87        },
88        '-',
89        {
90            pressed: true,
91            enableToggle:true,
92            text:'Summary',
93            tooltip: {title:'Post Summary',text:'View a short summary of each item in the list'},
94            iconCls: 'summary',
95            scope:this,
96            toggleHandler: function(btn, pressed){
97                this.grid.togglePreview(pressed);
98            }
99        }]
100    });
101
102    MainPanel.superclass.constructor.call(this, {
103        id:'main-tabs',
104        activeTab:0,
105        region:'center',
106        margins:'0 5 5 0',
107        resizeTabs:true,
108        tabWidth:150,
109        minTabWidth: 120,
110        enableTabScroll: true,
111        plugins: new Ext.ux.TabCloseMenu(),
112        items: {
113            id:'main-view',
114            layout:'border',
115            title:'Loading...',
116            hideMode:'offsets',
117            items:[
118                this.grid, {
119                id:'bottom-preview',
120                layout:'fit',
121                items:this.preview,
122                height: 250,
123                split: true,
124                border:false,
125                region:'south'
126            }, {
127                id:'right-preview',
128                layout:'fit',
129                border:false,
130                region:'east',
131                width:350,
132                split: true,
133                hidden:true
134            }]
135        }
136    });
137
138    this.gsm = this.grid.getSelectionModel();
139
140    this.gsm.on('rowselect', function(sm, index, record){
141        FeedViewer.getTemplate().overwrite(this.preview.body, record.data);
142        var items = this.preview.topToolbar.items;
143        items.get('tab').enable();
144        items.get('win').enable();
145    }, this, {buffer:250});
146
147    this.grid.store.on('beforeload', this.preview.clear, this.preview);
148    this.grid.store.on('load', this.gsm.selectFirstRow, this.gsm);
149
150    this.grid.on('rowdblclick', this.openTab, this);
151};
152
153Ext.extend(MainPanel, Ext.TabPanel, {
154
155    loadFeed : function(feed){
156        this.grid.loadFeed(feed.url);
157        Ext.getCmp('main-view').setTitle(feed.text);
158    },
159
160    movePreview : function(m, pressed){
161        if(!m){ // cycle if not a menu item click
162            var readMenu = Ext.menu.MenuMgr.get('reading-menu');
163            readMenu.render();
164            var items = readMenu.items.items;
165            var b = items[0], r = items[1], h = items[2];
166            if(b.checked){
167                r.setChecked(true);
168            }else if(r.checked){
169                h.setChecked(true);
170            }else if(h.checked){
171                b.setChecked(true);
172            }
173            return;
174        }
175        if(pressed){
176            var preview = this.preview;
177            var right = Ext.getCmp('right-preview');
178            var bot = Ext.getCmp('bottom-preview');
179            var btn = this.grid.getTopToolbar().items.get(2);
180            switch(m.text){
181                case 'Bottom':
182                    right.hide();
183                    bot.add(preview);
184                    bot.show();
185                    bot.ownerCt.doLayout();
186                    btn.setIconClass('preview-bottom');
187                    break;
188                case 'Right':
189                    bot.hide();
190                    right.add(preview);
191                    right.show();
192                    right.ownerCt.doLayout();
193                    btn.setIconClass('preview-right');
194                    break;
195                case 'Hide':
196                    preview.ownerCt.hide();
197                    preview.ownerCt.ownerCt.doLayout();
198                    btn.setIconClass('preview-hide');
199                    break;
200            }
201        }
202    },
203
204    openTab : function(record){
205        record = (record && record.data) ? record : this.gsm.getSelected();
206        var d = record.data;
207        var id = !d.link ? Ext.id() : d.link.replace(/[^A-Z0-9-_]/gi, '');
208        var tab;
209        if(!(tab = this.getItem(id))){
210            tab = new Ext.Panel({
211                id: id,
212                cls:'preview single-preview',
213                title: d.title,
214                tabTip: d.title,
215                html: FeedViewer.getTemplate().apply(d),
216                closable:true,
217                listeners: FeedViewer.LinkInterceptor,
218                autoScroll:true,
219                border:true,
220
221                tbar: [{
222                    text: 'Go to Post',
223                    iconCls: 'new-win',
224                    handler : function(){
225                        window.open(d.link);
226                    }
227                }]
228            });
229            this.add(tab);
230        }
231        this.setActiveTab(tab);
232    },
233
234    openAll : function(){
235        this.beginUpdate();
236        this.grid.store.data.each(this.openTab, this);
237        this.endUpdate();
238    }
239});
Note: See TracBrowser for help on using the repository browser.