]>
Commit | Line | Data |
---|---|---|
9d91eeb0 DC |
1 | Ext.define('PMG.MainView', { |
2 | extend: 'Ext.container.Container', | |
3 | xtype: 'mainview', | |
4 | ||
5 | title: 'Proxmox Mail Gateway', | |
6 | ||
7 | controller: { | |
8 | xclass: 'Ext.app.ViewController', | |
9 | routes: { | |
10 | ':path:subpath': { | |
11 | action: 'changePath', | |
12 | before: 'beforeChangePath', | |
13 | conditions : { | |
14 | ':path' : '(?:([%a-zA-Z0-9\-\_\s,]+))', | |
15 | ':subpath' : '(?:(?::)([%a-zA-Z0-9\-\_\s,]+))?' | |
16 | } | |
17 | } | |
18 | }, | |
19 | ||
20 | beforeChangePath: function(path, subpath, action) { | |
21 | var me = this; | |
22 | ||
23 | if (!Ext.ClassManager.getByAlias('widget.'+ path)) { | |
24 | console.warn('xtype "'+path+'" not found'); | |
25 | action.stop(); | |
26 | return; | |
27 | } | |
28 | ||
29 | var lastpanel = me.lookupReference('contentpanel').getLayout().getActiveItem(); | |
30 | if (lastpanel && lastpanel.xtype === path) { | |
31 | // we have the right component already, | |
32 | // we just need to select the correct tab | |
33 | // default to the first | |
34 | subpath = subpath || 0; | |
35 | if (lastpanel.getActiveTab) { | |
36 | // we assume lastpanel is a tabpanel | |
37 | if (lastpanel.getActiveTab().getItemId() === subpath) { | |
38 | // we are already there | |
39 | } else { | |
40 | // set the active tab | |
41 | lastpanel.setActiveTab(subpath); | |
42 | } | |
43 | } | |
44 | action.stop(); | |
45 | return; | |
46 | } | |
47 | ||
48 | action.resume(); | |
49 | }, | |
50 | ||
51 | changePath: function(path,subpath) { | |
52 | var me = this; | |
53 | var contentpanel = me.lookupReference('contentpanel'); | |
54 | var lastpanel = contentpanel.getLayout().getActiveItem(); | |
55 | ||
56 | var obj = contentpanel.add({ xtype: path }); | |
57 | var treelist = me.lookupReference('navtree'); | |
58 | ||
59 | treelist.suspendEvents(); | |
60 | treelist.select(path); | |
61 | treelist.resumeEvents(); | |
62 | ||
63 | if (Ext.isFunction(obj.setActiveTab)) { | |
64 | obj.setActiveTab(subpath || 0); | |
65 | obj.addListener('tabchange', function(tabpanel, newc, oldc) { | |
66 | var newpath = path; | |
67 | ||
68 | // only add the subpath part for the | |
69 | // non-default tabs | |
70 | if (tabpanel.items.findIndex('id', newc.id) !== 0) { | |
71 | newpath += ":" + newc.getItemId(); | |
72 | } | |
73 | ||
74 | me.redirectTo(newpath); | |
75 | }); | |
76 | } | |
77 | ||
78 | contentpanel.setActiveItem(obj); | |
79 | ||
80 | if (lastpanel) { | |
81 | contentpanel.remove(lastpanel, { destroy: true }); | |
82 | } | |
83 | ||
84 | }, | |
85 | ||
86 | logout: function() { | |
87 | var me = this; | |
88 | Proxmox.Utils.authClear(); | |
89 | me.getView().destroy(); | |
90 | Ext.create({ xtype: 'loginview'}); | |
91 | }, | |
92 | ||
93 | navigate: function(treelist, item) { | |
94 | this.redirectTo(item.get('path')); | |
95 | }, | |
96 | ||
97 | control: { | |
98 | 'button[reference=logoutButton]': { | |
99 | click: 'logout' | |
100 | } | |
101 | }, | |
102 | ||
103 | init: function(view) { | |
104 | var me = this; | |
105 | ||
106 | // load username | |
107 | me.lookupReference('usernameinfo').update({username:Proxmox.UserName}); | |
108 | ||
109 | // show login on requestexception | |
110 | // fixme: what about other errors | |
111 | Ext.Ajax.on('requestexception', function(conn, response, options) { | |
112 | if (response.status == 401) { // auth failure | |
113 | me.logout(); | |
114 | } | |
115 | }); | |
116 | ||
117 | // get ticket periodically | |
118 | Ext.TaskManager.start({ | |
119 | run: function() { | |
120 | var ticket = Proxmox.Utils.authOK(); | |
121 | if (!ticket || !Proxmox.UserName) { | |
122 | return; | |
123 | } | |
124 | ||
125 | Ext.Ajax.request({ | |
126 | params: { | |
127 | username: Proxmox.UserName, | |
128 | password: ticket | |
129 | }, | |
130 | url: '/api2/json/access/ticket', | |
131 | method: 'POST', | |
132 | failure: function() { | |
133 | me.logout(); | |
134 | }, | |
135 | success: function(response, opts) { | |
136 | var obj = Ext.decode(response.responseText); | |
137 | PMG.Utils.updateLoginData(obj.data); | |
138 | } | |
139 | }); | |
140 | }, | |
141 | interval: 15*60*1000 | |
142 | }); | |
143 | ||
144 | // select treeitem and load page from url fragment | |
145 | var token = Ext.util.History.getToken(); | |
146 | this.redirectTo(token, true); | |
147 | ||
148 | } | |
149 | }, | |
150 | ||
151 | plugins: 'viewport', | |
152 | ||
153 | layout: 'border', | |
154 | ||
155 | items: [ | |
156 | { | |
157 | region: 'north', | |
158 | xtype: 'container', | |
159 | layout: { | |
160 | type: 'hbox', | |
161 | align: 'middle' | |
162 | }, | |
163 | margin: '4 5 4 5', | |
164 | items: [ | |
165 | { | |
166 | xtype: 'proxmoxlogo' | |
167 | }, | |
168 | { | |
169 | xtype: 'versioninfo' | |
170 | }, | |
171 | { | |
172 | flex: 1 | |
173 | }, | |
174 | { | |
175 | baseCls: 'x-plain', | |
176 | reference: 'usernameinfo', | |
177 | padding: '0 5', | |
178 | tpl: Ext.String.format(gettext("You are logged in as '{0}'"), '{username}') | |
179 | }, | |
180 | { | |
181 | reference: 'logoutButton', | |
182 | xtype: 'button', | |
183 | iconCls: 'fa fa-sign-out', | |
184 | text: gettext('Logout'), | |
185 | } | |
186 | ] | |
187 | }, | |
188 | { | |
189 | xtype: 'navigationtree', | |
190 | reference: 'navtree', | |
191 | minWidth: 177, | |
192 | border: false, | |
193 | region: 'west', | |
194 | // we have to define it here until extjs 6.2 | |
195 | // because of a bug where a viewcontroller does not detect | |
196 | // the selectionchange event of a treelist | |
197 | listeners: { | |
198 | selectionchange: 'navigate' | |
199 | } | |
200 | }, | |
201 | { | |
202 | xtype: 'panel', | |
203 | layout: 'card', | |
204 | region: 'center', | |
205 | border: false, | |
206 | reference: 'contentpanel', | |
207 | } | |
208 | ] | |
209 | }); |