]>
Commit | Line | Data |
---|---|---|
5c7a1b15 DM |
1 | Ext.define('PBS.MainView', { |
2 | extend: 'Ext.container.Container', | |
3 | xtype: 'mainview', | |
4 | ||
5 | title: 'Proxmox Backup Server', | |
6 | ||
7 | controller: { | |
8 | xclass: 'Ext.app.ViewController', | |
9 | routes: { | |
10 | ':path:subpath': { | |
11 | action: 'changePath', | |
12 | before: 'beforeChangePath', | |
13 | conditions : { | |
51c63475 | 14 | ':path' : '(?:([%a-zA-Z0-9\\-\\_\\s,\.]+))', |
5c7a1b15 DM |
15 | ':subpath' : '(?:(?::)([%a-zA-Z0-9\\-\\_\\s,]+))?' |
16 | } | |
17 | } | |
18 | }, | |
2e75b6d8 | 19 | |
5c7a1b15 DM |
20 | beforeChangePath: function(path, subpath, action) { |
21 | var me = this; | |
22 | ||
c0ac2074 DC |
23 | let xtype = path; |
24 | let datastore; | |
25 | let isDataStore = PBS.Utils.isDataStorePath(path); | |
26 | if (isDataStore) { | |
27 | xtype = 'pbsDataStorePanel'; | |
28 | datastore = PBS.Utils.getDataStoreFromPath(path); | |
29 | } | |
30 | ||
31 | if (!Ext.ClassManager.getByAlias(`widget.${xtype}`)) { | |
32 | console.warn(`xtype ${xtype} not found`); | |
b0ee976f DM |
33 | action.stop(); |
34 | return; | |
35 | } | |
36 | ||
37 | var lastpanel = me.lookupReference('contentpanel').getLayout().getActiveItem(); | |
c0ac2074 DC |
38 | if (lastpanel && lastpanel.xtype === xtype) { |
39 | if (isDataStore) { | |
40 | if (datastore === lastpanel.datastore) { | |
ca23a97f DM |
41 | action.stop(); |
42 | return; | |
43 | } | |
44 | } else { | |
45 | // we have the right component already, | |
46 | // we just need to select the correct tab | |
47 | // default to the first | |
48 | subpath = subpath || 0; | |
49 | if (lastpanel.getActiveTab) { | |
50 | // we assume lastpanel is a tabpanel | |
51 | if (lastpanel.getActiveTab().getItemId() !== subpath) { | |
52 | // set the active tab | |
53 | lastpanel.setActiveTab(subpath); | |
54 | } | |
55 | // else we are already there | |
b0ee976f | 56 | } |
ca23a97f DM |
57 | action.stop(); |
58 | return; | |
b0ee976f | 59 | } |
b0ee976f DM |
60 | } |
61 | ||
5c7a1b15 DM |
62 | action.resume(); |
63 | }, | |
2e75b6d8 | 64 | |
ca23a97f | 65 | changePath: function(path, subpath) { |
5c7a1b15 DM |
66 | var me = this; |
67 | var contentpanel = me.lookupReference('contentpanel'); | |
68 | var lastpanel = contentpanel.getLayout().getActiveItem(); | |
69 | ||
ca23a97f | 70 | var obj; |
c0ac2074 DC |
71 | if (PBS.Utils.isDataStorePath(path)) { |
72 | let datastore = PBS.Utils.getDataStoreFromPath(path); | |
73 | obj = contentpanel.add({ | |
74 | xtype: 'pbsDataStorePanel', | |
573bcd9a | 75 | nodename: 'localhost', |
c0ac2074 DC |
76 | datastore, |
77 | }); | |
ca23a97f | 78 | } else { |
573bcd9a DC |
79 | obj = contentpanel.add({ |
80 | xtype: path, | |
81 | nodename: 'localhost', | |
82 | border: false | |
83 | }); | |
ca23a97f DM |
84 | } |
85 | ||
b0ee976f DM |
86 | var treelist = me.lookupReference('navtree'); |
87 | ||
88 | treelist.suspendEvents(); | |
ca23a97f DM |
89 | if (subpath === undefined) { |
90 | treelist.select(path); | |
91 | } else { | |
92 | treelist.select(path + ':' + subpath); | |
93 | } | |
b0ee976f DM |
94 | treelist.resumeEvents(); |
95 | ||
96 | if (Ext.isFunction(obj.setActiveTab)) { | |
97 | obj.setActiveTab(subpath || 0); | |
98 | obj.addListener('tabchange', function(tabpanel, newc, oldc) { | |
99 | var newpath = path; | |
100 | ||
101 | // only add the subpath part for the | |
102 | // non-default tabs | |
103 | if (tabpanel.items.findIndex('id', newc.id) !== 0) { | |
104 | newpath += ":" + newc.getItemId(); | |
105 | } | |
106 | ||
107 | me.redirectTo(newpath); | |
108 | }); | |
109 | } | |
110 | ||
111 | contentpanel.setActiveItem(obj); | |
112 | ||
113 | if (lastpanel) { | |
114 | contentpanel.remove(lastpanel, { destroy: true }); | |
115 | } | |
116 | ||
117 | }, | |
118 | ||
34f956bc DM |
119 | logout: function() { |
120 | PBS.app.logout(); | |
121 | }, | |
122 | ||
b0ee976f DM |
123 | navigate: function(treelist, item) { |
124 | this.redirectTo(item.get('path')); | |
5c7a1b15 DM |
125 | }, |
126 | ||
34f956bc DM |
127 | control: { |
128 | 'button[reference=logoutButton]': { | |
129 | click: 'logout' | |
130 | } | |
131 | }, | |
132 | ||
5c7a1b15 DM |
133 | init: function(view) { |
134 | var me = this; | |
5c7a1b15 | 135 | |
87b4d953 | 136 | me.lookupReference('usernameinfo').update({username:Proxmox.UserName}); |
a602faeb | 137 | |
8af272fd TL |
138 | // show login on requestexception |
139 | // fixme: what about other errors | |
140 | Ext.Ajax.on('requestexception', function(conn, response, options) { | |
141 | if (response.status == 401) { // auth failure | |
142 | me.logout(); | |
143 | } | |
144 | }); | |
145 | ||
a602faeb TL |
146 | // get ticket periodically |
147 | Ext.TaskManager.start({ | |
148 | run: function() { | |
149 | var ticket = Proxmox.Utils.authOK(); | |
150 | if (!ticket || !Proxmox.UserName) { | |
151 | return; | |
152 | } | |
153 | ||
154 | Ext.Ajax.request({ | |
155 | params: { | |
156 | username: Proxmox.UserName, | |
157 | password: ticket | |
158 | }, | |
159 | url: '/api2/json/access/ticket', | |
160 | method: 'POST', | |
161 | failure: function() { | |
162 | me.logout(); | |
163 | }, | |
164 | success: function(response, opts) { | |
165 | var obj = Ext.decode(response.responseText); | |
323515c2 | 166 | PBS.Utils.updateLoginData(obj.data); |
a602faeb TL |
167 | } |
168 | }); | |
169 | }, | |
170 | interval: 15*60*1000 | |
171 | }); | |
9710e5d0 TL |
172 | |
173 | ||
174 | // select treeitem and load page from url fragment, if set | |
175 | let token = Ext.util.History.getToken() || 'pbsDashboard'; | |
176 | this.redirectTo(token, true); | |
5c7a1b15 DM |
177 | } |
178 | }, | |
179 | ||
180 | plugins: 'viewport', | |
181 | ||
182 | layout: { type: 'border' }, | |
183 | ||
184 | items: [ | |
185 | { | |
186 | region: 'north', | |
187 | xtype: 'container', | |
188 | layout: { | |
189 | type: 'hbox', | |
190 | align: 'middle' | |
191 | }, | |
192 | margin: '2 5 2 5', | |
193 | height: 38, | |
194 | items: [ | |
195 | { | |
1d8ef0dc DC |
196 | xtype: 'proxmoxlogo', |
197 | prefix: '', | |
5c7a1b15 DM |
198 | }, |
199 | { | |
e4dc0a14 | 200 | xtype: 'versioninfo' |
5c7a1b15 DM |
201 | }, |
202 | { | |
203 | flex: 1 | |
204 | }, | |
205 | { | |
206 | baseCls: 'x-plain', | |
207 | reference: 'usernameinfo', | |
208 | padding: '0 5', | |
209 | tpl: Ext.String.format(gettext("You are logged in as {0}"), "'{username}'") | |
210 | }, | |
9c01e73c TL |
211 | { |
212 | xtype: 'button', | |
213 | baseCls: 'x-btn', | |
214 | cls: 'x-btn-default-toolbar-small proxmox-inline-button', | |
215 | iconCls: 'fa fa-book x-btn-icon-el-default-toolbar-small ', | |
216 | text: gettext('Documentation'), | |
217 | href: '/docs/index.html', | |
218 | margin: '0 5 0 0', | |
219 | }, | |
5c7a1b15 DM |
220 | { |
221 | reference: 'logoutButton', | |
222 | xtype: 'button', | |
223 | iconCls: 'fa fa-sign-out', | |
224 | text: gettext('Logout') | |
225 | } | |
226 | ] | |
227 | }, | |
228 | { | |
229 | xtype: 'panel', | |
230 | scrollable: 'y', | |
231 | border: false, | |
232 | region: 'west', | |
233 | layout: { | |
234 | type: 'vbox', | |
235 | align: 'stretch' | |
236 | }, | |
b0ee976f DM |
237 | items: [{ |
238 | xtype: 'navigationtree', | |
239 | minWidth: 180, | |
240 | reference: 'navtree', | |
241 | // we have to define it here until extjs 6.2 | |
242 | // because of a bug where a viewcontroller does not detect | |
243 | // the selectionchange event of a treelist | |
244 | listeners: { | |
245 | selectionchange: 'navigate' | |
246 | } | |
247 | }, { | |
248 | xtype: 'box', | |
249 | cls: 'x-treelist-nav', | |
250 | flex: 1 | |
251 | }] | |
5c7a1b15 DM |
252 | }, |
253 | { | |
254 | xtype: 'panel', | |
255 | layout: { type: 'card' }, | |
256 | region: 'center', | |
257 | border: false, | |
258 | reference: 'contentpanel' | |
259 | } | |
260 | ] | |
261 | }); |