]>
Commit | Line | Data |
---|---|---|
bb64de6e DM |
1 | // ExtJS related things |
2 | ||
3 | // do not send '_dc' parameter | |
4 | Ext.Ajax.disableCaching = false; | |
5 | ||
30076ed6 TL |
6 | // FIXME: HACK! Makes scrolling in number spinner work again. fixed in ExtJS >= 6.1 |
7 | if (Ext.isFirefox) { | |
8 | Ext.$eventNameMap.DOMMouseScroll = 'DOMMouseScroll'; | |
9 | } | |
10 | ||
bb64de6e DM |
11 | // custom Vtypes |
12 | Ext.apply(Ext.form.field.VTypes, { | |
01031528 | 13 | IPAddress: function(v) { |
bb64de6e DM |
14 | return Proxmox.Utils.IP4_match.test(v); |
15 | }, | |
01031528 | 16 | IPAddressText: gettext('Example') + ': 192.168.1.1', |
05a977a2 | 17 | IPAddressMask: /[\d.]/i, |
bb64de6e | 18 | |
01031528 | 19 | IPCIDRAddress: function(v) { |
05a977a2 | 20 | let result = Proxmox.Utils.IP4_cidr_match.exec(v); |
bb64de6e DM |
21 | // limits according to JSON Schema see |
22 | // pve-common/src/PVE/JSONSchema.pm | |
01031528 | 23 | return result !== null && result[1] >= 8 && result[1] <= 32; |
bb64de6e | 24 | }, |
05a977a2 TL |
25 | IPCIDRAddressText: gettext('Example') + ': 192.168.1.1/24<br>' + gettext('Valid CIDR Range') + ': 8-32', |
26 | IPCIDRAddressMask: /[\d./]/i, | |
bb64de6e | 27 | |
01031528 | 28 | IP6Address: function(v) { |
bb64de6e DM |
29 | return Proxmox.Utils.IP6_match.test(v); |
30 | }, | |
01031528 | 31 | IP6AddressText: gettext('Example') + ': 2001:DB8::42', |
bb64de6e DM |
32 | IP6AddressMask: /[A-Fa-f0-9:]/, |
33 | ||
01031528 | 34 | IP6CIDRAddress: function(v) { |
05a977a2 | 35 | let result = Proxmox.Utils.IP6_cidr_match.exec(v); |
bb64de6e DM |
36 | // limits according to JSON Schema see |
37 | // pve-common/src/PVE/JSONSchema.pm | |
01031528 | 38 | return result !== null && result[1] >= 8 && result[1] <= 128; |
bb64de6e | 39 | }, |
05a977a2 TL |
40 | IP6CIDRAddressText: gettext('Example') + ': 2001:DB8::42/64<br>' + gettext('Valid CIDR Range') + ': 8-128', |
41 | IP6CIDRAddressMask: /[A-Fa-f0-9:/]/, | |
bb64de6e | 42 | |
01031528 | 43 | IP6PrefixLength: function(v) { |
bb64de6e DM |
44 | return v >= 0 && v <= 128; |
45 | }, | |
01031528 TL |
46 | IP6PrefixLengthText: gettext('Example') + ': X, where 0 <= X <= 128', |
47 | IP6PrefixLengthMask: /[0-9]/, | |
bb64de6e | 48 | |
01031528 | 49 | IP64Address: function(v) { |
bb64de6e DM |
50 | return Proxmox.Utils.IP64_match.test(v); |
51 | }, | |
01031528 | 52 | IP64AddressText: gettext('Example') + ': 192.168.1.1 2001:DB8::42', |
05a977a2 | 53 | IP64AddressMask: /[A-Fa-f0-9.:]/, |
bb64de6e | 54 | |
577b6c75 | 55 | IP64CIDRAddress: function(v) { |
05a977a2 | 56 | let result = Proxmox.Utils.IP64_cidr_match.exec(v); |
577b6c75 ML |
57 | if (result === null) { |
58 | return false; | |
59 | } | |
60 | if (result[1] !== undefined) { | |
61 | return result[1] >= 8 && result[1] <= 128; | |
62 | } else if (result[2] !== undefined) { | |
63 | return result[2] >= 8 && result[2] <= 32; | |
64 | } else { | |
65 | return false; | |
66 | } | |
67 | }, | |
68 | IP64CIDRAddressText: gettext('Example') + ': 192.168.1.1/24 2001:DB8::42/64', | |
05a977a2 | 69 | IP64CIDRAddressMask: /[A-Fa-f0-9.:/]/, |
577b6c75 | 70 | |
bb64de6e DM |
71 | MacAddress: function(v) { |
72 | return (/^([a-fA-F0-9]{2}:){5}[a-fA-F0-9]{2}$/).test(v); | |
73 | }, | |
74 | MacAddressMask: /[a-fA-F0-9:]/, | |
75 | MacAddressText: gettext('Example') + ': 01:23:45:67:89:ab', | |
76 | ||
01031528 | 77 | MacPrefix: function(v) { |
add18fad | 78 | return (/^[a-f0-9][02468ace](?::[a-f0-9]{2}){0,2}:?$/i).test(v); |
8f449655 TL |
79 | }, |
80 | MacPrefixMask: /[a-fA-F0-9:]/, | |
ffe26505 | 81 | MacPrefixText: gettext('Example') + ': 02:8f - ' + gettext('only unicast addresses are allowed'), |
8f449655 | 82 | |
bb64de6e DM |
83 | BridgeName: function(v) { |
84 | return (/^vmbr\d{1,4}$/).test(v); | |
85 | }, | |
8aefd47c AD |
86 | VlanName: function(v) { |
87 | if (Proxmox.Utils.VlanInterface_match.test(v)) { | |
88 | return true; | |
89 | } else if (Proxmox.Utils.Vlan_match.test(v)) { | |
90 | return true; | |
91 | } | |
92 | return true; | |
93 | }, | |
bb64de6e DM |
94 | BridgeNameText: gettext('Format') + ': vmbr<b>N</b>, where 0 <= <b>N</b> <= 9999', |
95 | ||
96 | BondName: function(v) { | |
97 | return (/^bond\d{1,4}$/).test(v); | |
98 | }, | |
99 | BondNameText: gettext('Format') + ': bond<b>N</b>, where 0 <= <b>N</b> <= 9999', | |
100 | ||
101 | InterfaceName: function(v) { | |
102 | return (/^[a-z][a-z0-9_]{1,20}$/).test(v); | |
103 | }, | |
05a977a2 TL |
104 | InterfaceNameText: gettext("Allowed characters") + ": 'a-z', '0-9', '_'<br />" + |
105 | gettext("Minimum characters") + ": 2<br />" + | |
106 | gettext("Maximum characters") + ": 21<br />" + | |
bb64de6e DM |
107 | gettext("Must start with") + ": 'a-z'", |
108 | ||
01031528 | 109 | StorageId: function(v) { |
05a977a2 | 110 | return (/^[a-z][a-z0-9\-_.]*[a-z0-9]$/i).test(v); |
bb64de6e | 111 | }, |
05a977a2 TL |
112 | StorageIdText: gettext("Allowed characters") + ": 'A-Z', 'a-z', '0-9', '-', '_', '.'<br />" + |
113 | gettext("Minimum characters") + ": 2<br />" + | |
bb64de6e DM |
114 | gettext("Must start with") + ": 'A-Z', 'a-z'<br />" + |
115 | gettext("Must end with") + ": 'A-Z', 'a-z', '0-9'<br />", | |
116 | ||
01031528 | 117 | ConfigId: function(v) { |
05a977a2 | 118 | return (/^[a-z][a-z0-9_]+$/i).test(v); |
bb64de6e | 119 | }, |
05a977a2 TL |
120 | ConfigIdText: gettext("Allowed characters") + ": 'A-Z', 'a-z', '0-9', '_'<br />" + |
121 | gettext("Minimum characters") + ": 2<br />" + | |
bb64de6e DM |
122 | gettext("Must start with") + ": " + gettext("letter"), |
123 | ||
01031528 | 124 | HttpProxy: function(v) { |
bb64de6e DM |
125 | return (/^http:\/\/.*$/).test(v); |
126 | }, | |
127 | HttpProxyText: gettext('Example') + ": http://username:password@host:port/", | |
128 | ||
129 | DnsName: function(v) { | |
130 | return Proxmox.Utils.DnsName_match.test(v); | |
131 | }, | |
132 | DnsNameText: gettext('This is not a valid DNS name'), | |
133 | ||
134 | // workaround for https://www.sencha.com/forum/showthread.php?302150 | |
135 | proxmoxMail: function(v) { | |
05a977a2 | 136 | return (/^(\w+)([-+.][\w]+)*@(\w[-\w]*\.){1,5}([A-Za-z]){2,63}$/).test(v); |
bb64de6e DM |
137 | }, |
138 | proxmoxMailText: gettext('Example') + ": user@example.com", | |
139 | ||
ba916e58 DC |
140 | DnsOrIp: function(v) { |
141 | if (!Proxmox.Utils.DnsName_match.test(v) && | |
694a76f6 | 142 | !Proxmox.Utils.IP64_match.test(v)) { |
ba916e58 DC |
143 | return false; |
144 | } | |
145 | ||
146 | return true; | |
147 | }, | |
694a76f6 | 148 | DnsOrIpText: gettext('Not a valid DNS name or IP address.'), |
ba916e58 | 149 | |
5252b7f1 DC |
150 | HostPort: function(v) { |
151 | return Proxmox.Utils.HostPort_match.test(v) || | |
152 | Proxmox.Utils.HostPortBrackets_match.test(v) || | |
153 | Proxmox.Utils.IP6_dotnotation_match.test(v); | |
154 | }, | |
a9bea104 | 155 | HostPortText: gettext('Host/IP address or optional port is invalid'), |
5252b7f1 | 156 | |
bb64de6e | 157 | HostList: function(v) { |
05a977a2 TL |
158 | let list = v.split(/[ ,;]+/); |
159 | let i; | |
bb64de6e | 160 | for (i = 0; i < list.length; i++) { |
05a977a2 | 161 | if (list[i] === '') { |
bb64de6e DM |
162 | continue; |
163 | } | |
164 | ||
165 | if (!Proxmox.Utils.HostPort_match.test(list[i]) && | |
166 | !Proxmox.Utils.HostPortBrackets_match.test(list[i]) && | |
167 | !Proxmox.Utils.IP6_dotnotation_match.test(list[i])) { | |
168 | return false; | |
169 | } | |
170 | } | |
171 | ||
172 | return true; | |
173 | }, | |
36704a2f DM |
174 | HostListText: gettext('Not a valid list of hosts'), |
175 | ||
176 | password: function(val, field) { | |
177 | if (field.initialPassField) { | |
05a977a2 TL |
178 | let pwd = field.up('form').down(`[name=${field.initialPassField}]`); |
179 | return val === pwd.getValue(); | |
36704a2f DM |
180 | } |
181 | return true; | |
182 | }, | |
183 | ||
01031528 | 184 | passwordText: gettext('Passwords do not match'), |
bb64de6e DM |
185 | }); |
186 | ||
aea77b2c DC |
187 | // Firefox 52+ Touchscreen bug |
188 | // see https://www.sencha.com/forum/showthread.php?336762-Examples-don-t-work-in-Firefox-52-touchscreen/page2 | |
189 | // and https://bugzilla.proxmox.com/show_bug.cgi?id=1223 | |
190 | Ext.define('EXTJS_23846.Element', { | |
01031528 | 191 | override: 'Ext.dom.Element', |
aea77b2c | 192 | }, function(Element) { |
05a977a2 | 193 | let supports = Ext.supports, |
aea77b2c DC |
194 | proto = Element.prototype, |
195 | eventMap = proto.eventMap, | |
196 | additiveEvents = proto.additiveEvents; | |
197 | ||
198 | if (Ext.os.is.Desktop && supports.TouchEvents && !supports.PointerEvents) { | |
199 | eventMap.touchstart = 'mousedown'; | |
200 | eventMap.touchmove = 'mousemove'; | |
201 | eventMap.touchend = 'mouseup'; | |
202 | eventMap.touchcancel = 'mouseup'; | |
203 | ||
204 | additiveEvents.mousedown = 'mousedown'; | |
205 | additiveEvents.mousemove = 'mousemove'; | |
206 | additiveEvents.mouseup = 'mouseup'; | |
207 | additiveEvents.touchstart = 'touchstart'; | |
208 | additiveEvents.touchmove = 'touchmove'; | |
209 | additiveEvents.touchend = 'touchend'; | |
210 | additiveEvents.touchcancel = 'touchcancel'; | |
211 | ||
212 | additiveEvents.pointerdown = 'mousedown'; | |
213 | additiveEvents.pointermove = 'mousemove'; | |
214 | additiveEvents.pointerup = 'mouseup'; | |
215 | additiveEvents.pointercancel = 'mouseup'; | |
216 | } | |
217 | }); | |
218 | ||
219 | Ext.define('EXTJS_23846.Gesture', { | |
01031528 | 220 | override: 'Ext.event.publisher.Gesture', |
aea77b2c | 221 | }, function(Gesture) { |
05a977a2 | 222 | let gestures = Gesture.instance; |
aea77b2c DC |
223 | |
224 | if (Ext.supports.TouchEvents && !Ext.isWebKit && Ext.os.is.Desktop) { | |
05a977a2 TL |
225 | gestures.handledDomEvents.push('mousedown', 'mousemove', 'mouseup'); |
226 | gestures.registerEvents(); | |
aea77b2c DC |
227 | } |
228 | }); | |
229 | ||
acfbf255 DC |
230 | Ext.define('EXTJS_18900.Pie', { |
231 | override: 'Ext.chart.series.Pie', | |
232 | ||
233 | // from 6.0.2 | |
01031528 | 234 | betweenAngle: function(x, a, b) { |
05a977a2 | 235 | let pp = Math.PI * 2, |
acfbf255 DC |
236 | offset = this.rotationOffset; |
237 | ||
238 | if (a === b) { | |
239 | return false; | |
240 | } | |
241 | ||
242 | if (!this.getClockwise()) { | |
243 | x *= -1; | |
244 | a *= -1; | |
245 | b *= -1; | |
246 | a -= offset; | |
247 | b -= offset; | |
248 | } else { | |
249 | a += offset; | |
250 | b += offset; | |
251 | } | |
252 | ||
253 | x -= a; | |
254 | b -= a; | |
255 | ||
256 | // Normalize, so that both x and b are in the [0,360) interval. | |
257 | x %= pp; | |
258 | b %= pp; | |
259 | x += pp; | |
260 | b += pp; | |
261 | x %= pp; | |
262 | b %= pp; | |
263 | ||
264 | // Because 360 * n angles will be normalized to 0, | |
265 | // we need to treat b === 0 as a special case. | |
266 | return x < b || b === 0; | |
267 | }, | |
268 | }); | |
269 | ||
3c158249 TL |
270 | // we always want the number in x.y format and never in, e.g., x,y |
271 | Ext.define('PVE.form.field.Number', { | |
272 | override: 'Ext.form.field.Number', | |
01031528 | 273 | submitLocaleSeparator: false, |
3c158249 TL |
274 | }); |
275 | ||
bb64de6e DM |
276 | // ExtJs 5-6 has an issue with caching |
277 | // see https://www.sencha.com/forum/showthread.php?308989 | |
278 | Ext.define('Proxmox.UnderlayPool', { | |
279 | override: 'Ext.dom.UnderlayPool', | |
280 | ||
01031528 | 281 | checkOut: function() { |
05a977a2 | 282 | let cache = this.cache, |
bb64de6e DM |
283 | len = cache.length, |
284 | el; | |
285 | ||
286 | // do cleanup because some of the objects might have been destroyed | |
287 | while (len--) { | |
288 | if (cache[len].destroyed) { | |
289 | cache.splice(len, 1); | |
290 | } | |
291 | } | |
292 | // end do cleanup | |
293 | ||
294 | el = cache.shift(); | |
295 | ||
296 | if (!el) { | |
297 | el = Ext.Element.create(this.elementConfig); | |
298 | el.setVisibilityMode(2); | |
299 | //<debug> | |
300 | // tell the spec runner to ignore this element when checking if the dom is clean | |
301 | el.dom.setAttribute('data-sticky', true); | |
302 | //</debug> | |
303 | } | |
304 | ||
305 | return el; | |
01031528 | 306 | }, |
bb64de6e DM |
307 | }); |
308 | ||
a2d8b9a9 DC |
309 | // 'Enter' in Textareas and aria multiline fields should not activate the |
310 | // defaultbutton, fixed in extjs 6.0.2 | |
311 | Ext.define('PVE.panel.Panel', { | |
312 | override: 'Ext.panel.Panel', | |
313 | ||
314 | fireDefaultButton: function(e) { | |
315 | if (e.target.getAttribute('aria-multiline') === 'true' || | |
316 | e.target.tagName === "TEXTAREA") { | |
317 | return true; | |
318 | } | |
319 | return this.callParent(arguments); | |
01031528 | 320 | }, |
a2d8b9a9 DC |
321 | }); |
322 | ||
bb64de6e DM |
323 | // if the order of the values are not the same in originalValue and value |
324 | // extjs will not overwrite value, but marks the field dirty and thus | |
325 | // the reset button will be enabled (but clicking it changes nothing) | |
326 | // so if the arrays are not the same after resetting, we | |
327 | // clear and set it | |
328 | Ext.define('Proxmox.form.ComboBox', { | |
329 | override: 'Ext.form.field.ComboBox', | |
330 | ||
331 | reset: function() { | |
332 | // copied from combobox | |
05a977a2 | 333 | let me = this; |
bb64de6e | 334 | me.callParent(); |
bb64de6e DM |
335 | |
336 | // clear and set when not the same | |
05a977a2 TL |
337 | let value = me.getValue(); |
338 | if (Ext.isArray(me.originalValue) && Ext.isArray(value) && | |
339 | !Ext.Array.equals(value, me.originalValue)) { | |
bb64de6e DM |
340 | me.clearValue(); |
341 | me.setValue(me.originalValue); | |
342 | } | |
50032132 DC |
343 | }, |
344 | ||
345 | // we also want to open the trigger on editable comboboxes by default | |
346 | initComponent: function() { | |
347 | let me = this; | |
348 | me.callParent(); | |
349 | ||
350 | if (me.editable) { | |
351 | // The trigger.picker causes first a focus event on the field then | |
352 | // toggles the selection picker. Thus skip expanding in this case, | |
353 | // else our focus listener expands and the picker.trigger then | |
354 | // collapses it directly afterwards. | |
355 | Ext.override(me.triggers.picker, { | |
356 | onMouseDown: function(e) { | |
357 | // copied "should we focus" check from Ext.form.trigger.Trigger | |
358 | if (e.pointerType !== 'touch' && !this.field.owns(Ext.Element.getActiveElement())) { | |
359 | me.skip_expand_on_focus = true; | |
360 | } | |
361 | this.callParent(arguments); | |
01031528 | 362 | }, |
50032132 DC |
363 | }); |
364 | ||
365 | me.on("focus", function(combobox) { | |
366 | if (!combobox.isExpanded && !combobox.skip_expand_on_focus) { | |
367 | combobox.expand(); | |
368 | } | |
369 | combobox.skip_expand_on_focus = false; | |
370 | }); | |
371 | } | |
372 | }, | |
bb64de6e DM |
373 | }); |
374 | ||
47d1c80c TL |
375 | // when refreshing a grid/tree view, restoring the focus moves the view back to |
376 | // the previously focused item. Save scroll position before refocusing. | |
377 | Ext.define(null, { | |
378 | override: 'Ext.view.Table', | |
379 | ||
380 | jumpToFocus: false, | |
381 | ||
382 | saveFocusState: function() { | |
05a977a2 TL |
383 | let me = this, |
384 | store = me.dataSource, | |
385 | actionableMode = me.actionableMode, | |
386 | navModel = me.getNavigationModel(), | |
387 | focusPosition = actionableMode ? me.actionPosition : navModel.getPosition(true), | |
388 | refocusRow, refocusCol; | |
389 | ||
390 | if (focusPosition) { | |
391 | // Separate this from the instance that the nav model is using. | |
392 | focusPosition = focusPosition.clone(); | |
393 | ||
394 | // Exit actionable mode. | |
395 | // We must inform any Actionables that they must relinquish control. | |
396 | // Tabbability must be reset. | |
397 | if (actionableMode) { | |
398 | me.ownerGrid.setActionableMode(false); | |
399 | } | |
47d1c80c | 400 | |
05a977a2 TL |
401 | // Blur the focused descendant, but do not trigger focusLeave. |
402 | me.el.dom.focus(); | |
403 | ||
404 | // Exiting actionable mode navigates to the owning cell, so in either focus mode we must | |
405 | // clear the navigation position | |
406 | navModel.setPosition(); | |
407 | ||
408 | // The following function will attempt to refocus back in the same mode to the same cell | |
409 | // as it was at before based upon the previous record (if it's still inthe store), or the row index. | |
410 | return function() { | |
411 | // If we still have data, attempt to refocus in the same mode. | |
412 | if (store.getCount()) { | |
413 | // Adjust expectations of where we are able to refocus according to what kind of destruction | |
414 | // might have been wrought on this view's DOM during focus save. | |
415 | refocusRow = Math.min(focusPosition.rowIdx, me.all.getCount() - 1); | |
416 | refocusCol = Math.min(focusPosition.colIdx, | |
417 | me.getVisibleColumnManager().getColumns().length - 1); | |
418 | refocusRow = store.contains(focusPosition.record) ? focusPosition.record : refocusRow; | |
419 | focusPosition = new Ext.grid.CellContext(me).setPosition(refocusRow, refocusCol); | |
420 | ||
421 | if (actionableMode) { | |
422 | me.ownerGrid.setActionableMode(true, focusPosition); | |
423 | } else { | |
424 | me.cellFocused = true; | |
47d1c80c TL |
425 | |
426 | // we sometimes want to scroll back to where we were | |
05a977a2 TL |
427 | let x = me.getScrollX(); |
428 | let y = me.getScrollY(); | |
47d1c80c | 429 | |
05a977a2 TL |
430 | // Pass "preventNavigation" as true so that that does not cause selection. |
431 | navModel.setPosition(focusPosition, null, null, null, true); | |
47d1c80c TL |
432 | |
433 | if (!me.jumpToFocus) { | |
01031528 | 434 | me.scrollTo(x, y); |
47d1c80c | 435 | } |
05a977a2 TL |
436 | } |
437 | } else { // No rows - focus associated column header | |
438 | focusPosition.column.focus(); | |
439 | } | |
440 | }; | |
441 | } | |
442 | return Ext.emptyFn; | |
01031528 | 443 | }, |
47d1c80c TL |
444 | }); |
445 | ||
bb64de6e DM |
446 | // should be fixed with ExtJS 6.0.2, see: |
447 | // https://www.sencha.com/forum/showthread.php?307244-Bug-with-datefield-in-window-with-scroll | |
448 | Ext.define('Proxmox.Datepicker', { | |
449 | override: 'Ext.picker.Date', | |
01031528 | 450 | hideMode: 'visibility', |
bb64de6e DM |
451 | }); |
452 | ||
a55813d6 DM |
453 | // ExtJS 6.0.1 has no setSubmitValue() (although you find it in the docs). |
454 | // Note: this.submitValue is a boolean flag, whereas getSubmitValue() returns | |
455 | // data to be submitted. | |
1d9804a9 DM |
456 | Ext.define('Proxmox.form.field.Text', { |
457 | override: 'Ext.form.field.Text', | |
458 | ||
459 | setSubmitValue: function(v) { | |
460 | this.submitValue = v; | |
461 | }, | |
1d9804a9 DM |
462 | }); |
463 | ||
1fb41f2e TL |
464 | // this should be fixed with ExtJS 6.0.2 |
465 | // make mousescrolling work in firefox in the containers overflowhandler | |
466 | Ext.define(null, { | |
467 | override: 'Ext.layout.container.boxOverflow.Scroller', | |
468 | ||
469 | createWheelListener: function() { | |
05a977a2 | 470 | let me = this; |
1fb41f2e | 471 | if (Ext.isFirefox) { |
01031528 | 472 | me.wheelListener = me.layout.innerCt.on('wheel', me.onMouseWheelFirefox, me, { destroyable: true }); |
1fb41f2e | 473 | } else { |
01031528 | 474 | me.wheelListener = me.layout.innerCt.on('mousewheel', me.onMouseWheel, me, { destroyable: true }); |
1fb41f2e TL |
475 | } |
476 | }, | |
477 | ||
478 | // special wheel handler for firefox. differs from the default onMouseWheel | |
479 | // handler by using deltaY instead of wheelDeltaY and no normalizing, | |
480 | // because it is already | |
481 | onMouseWheelFirefox: function(e) { | |
482 | e.stopEvent(); | |
05a977a2 | 483 | let delta = e.browserEvent.deltaY || 0; |
1fb41f2e | 484 | this.scrollBy(delta * this.wheelIncrement, false); |
01031528 | 485 | }, |
1fb41f2e TL |
486 | |
487 | }); | |
488 | ||
312310e0 DC |
489 | // add '@' to the valid id |
490 | Ext.define('Proxmox.validIdReOverride', { | |
491 | override: 'Ext.Component', | |
05a977a2 | 492 | validIdRe: /^[a-z_][a-z0-9\-_@]*$/i, |
312310e0 DC |
493 | }); |
494 | ||
98d894d8 DC |
495 | Ext.define('Proxmox.selection.CheckboxModel', { |
496 | override: 'Ext.selection.CheckboxModel', | |
497 | ||
1f628e9c | 498 | // [P] use whole checkbox cell to multiselect, not only the checkbox |
98d894d8 | 499 | checkSelector: '.x-grid-cell-row-checker', |
1f628e9c | 500 | |
ea2b3fd7 TL |
501 | // TODO: remove all optimizations below to an override for parent 'Ext.selection.Model' ?? |
502 | ||
1f628e9c TL |
503 | // [ P: optimized to remove all records at once as single remove is O(n^3) slow ] |
504 | // records can be an index, a record or an array of records | |
505 | doDeselect: function(records, suppressEvent) { | |
506 | var me = this, | |
507 | selected = me.selected, | |
508 | i = 0, | |
509 | len, record, | |
510 | commit; | |
511 | if (me.locked || !me.store) { | |
512 | return false; | |
513 | } | |
514 | if (typeof records === "number") { | |
515 | // No matching record, jump out | |
516 | record = me.store.getAt(records); | |
517 | if (!record) { | |
518 | return false; | |
519 | } | |
520 | records = [ | |
521 | record, | |
522 | ]; | |
523 | } else if (!Ext.isArray(records)) { | |
524 | records = [ | |
525 | records, | |
526 | ]; | |
527 | } | |
528 | // [P] a beforedeselection, triggered by me.onSelectChange below, can block removal by | |
529 | // returning false, thus the original implementation removed only here in the commit fn, | |
530 | // which has an abysmal performance O(n^3). As blocking removal is not the norm, go do the | |
531 | // reverse, record blocked records and remove them from the to-be-removed array before | |
532 | // applying it. A FF86 i9-9900K on 10k records goes from >40s to ~33ms for >90% deselection | |
533 | let committed = false; | |
534 | commit = function() { | |
535 | committed = true; | |
536 | if (record === me.selectionStart) { | |
537 | me.selectionStart = null; | |
538 | } | |
539 | }; | |
540 | let removalBlocked = []; | |
541 | len = records.length; | |
542 | me.suspendChanges(); | |
543 | for (; i < len; i++) { | |
544 | record = records[i]; | |
545 | if (me.isSelected(record)) { | |
546 | committed = false; | |
547 | me.onSelectChange(record, false, suppressEvent, commit); | |
548 | if (!committed) { | |
549 | removalBlocked.push(record); | |
550 | } | |
551 | if (me.destroyed) { | |
552 | return false; | |
553 | } | |
554 | } | |
555 | } | |
556 | if (removalBlocked.length > 0) { | |
557 | records.remove(removalBlocked); | |
558 | } | |
559 | selected.remove(records); // [P] FAST(er) | |
560 | me.lastSelected = selected.last(); | |
561 | me.resumeChanges(); | |
562 | // fire selchange if there was a change and there is no suppressEvent flag | |
563 | me.maybeFireSelectionChange(records.length > 0 && !suppressEvent); | |
ea2b3fd7 TL |
564 | return records.length; |
565 | }, | |
566 | ||
567 | ||
568 | doMultiSelect: function(records, keepExisting, suppressEvent) { | |
569 | var me = this, | |
570 | selected = me.selected, | |
571 | change = false, | |
572 | result, i, len, record, commit; | |
573 | ||
574 | if (me.locked) { | |
575 | return; | |
576 | } | |
577 | ||
578 | records = !Ext.isArray(records) ? [records] : records; | |
579 | len = records.length; | |
580 | if (!keepExisting && selected.getCount() > 0) { | |
581 | result = me.deselectDuringSelect(records, suppressEvent); | |
582 | if (me.destroyed) { | |
583 | return; | |
584 | } | |
585 | if (result[0]) { | |
586 | // We had a failure during selection, so jump out | |
587 | // Fire selection change if we did deselect anything | |
588 | me.maybeFireSelectionChange(result[1] > 0 && !suppressEvent); | |
589 | return; | |
590 | } else { | |
591 | // Means something has been deselected, so we've had a change | |
592 | change = result[1] > 0; | |
593 | } | |
594 | } | |
595 | ||
596 | let gotBlocked, blockedRecords = []; | |
597 | commit = function() { | |
598 | if (!selected.getCount()) { | |
599 | me.selectionStart = record; | |
600 | } | |
601 | gotBlocked = false; | |
602 | change = true; | |
603 | }; | |
604 | ||
605 | for (i = 0; i < len; i++) { | |
606 | record = records[i]; | |
607 | if (me.isSelected(record)) { | |
608 | continue; | |
609 | } | |
610 | ||
611 | gotBlocked = true; | |
612 | me.onSelectChange(record, true, suppressEvent, commit); | |
613 | if (me.destroyed) { | |
614 | return; | |
615 | } | |
616 | if (gotBlocked) { | |
617 | blockedRecords.push(record); | |
618 | } | |
619 | } | |
620 | if (blockedRecords.length > 0) { | |
621 | records.remove(blockedRecords); | |
622 | } | |
623 | selected.add(records); | |
624 | me.lastSelected = record; | |
625 | ||
626 | // fire selchange if there was a change and there is no suppressEvent flag | |
627 | me.maybeFireSelectionChange(change && !suppressEvent); | |
628 | }, | |
629 | deselectDuringSelect: function(toSelect, suppressEvent) { | |
630 | var me = this, | |
631 | selected = me.selected.getRange(), | |
632 | changed = 0, | |
633 | failed = false; | |
634 | // Prevent selection change events from firing, will happen during select | |
635 | me.suspendChanges(); | |
636 | me.deselectingDuringSelect = true; | |
637 | let toDeselect = selected.filter(item => !Ext.Array.contains(toSelect, item)); | |
638 | if (toDeselect.length > 0) { | |
639 | changed = me.doDeselect(toDeselect, suppressEvent); | |
640 | if (!changed) { | |
641 | failed = true; | |
642 | } | |
643 | if (me.destroyed) { | |
644 | failed = true; | |
645 | changed = 0; | |
646 | } | |
647 | } | |
648 | me.deselectingDuringSelect = false; | |
649 | me.resumeChanges(); | |
650 | return [ | |
651 | failed, | |
652 | changed, | |
653 | ]; | |
1f628e9c | 654 | }, |
98d894d8 DC |
655 | }); |
656 | ||
bb64de6e DM |
657 | // force alert boxes to be rendered with an Error Icon |
658 | // since Ext.Msg is an object and not a prototype, we need to override it | |
659 | // after the framework has been initiated | |
660 | Ext.onReady(function() { | |
bb64de6e | 661 | Ext.override(Ext.Msg, { |
05a977a2 | 662 | alert: function(title, message, fn, scope) { // eslint-disable-line consistent-return |
bb64de6e | 663 | if (Ext.isString(title)) { |
05a977a2 | 664 | let config = { |
bb64de6e DM |
665 | title: title, |
666 | message: message, | |
667 | icon: this.ERROR, | |
668 | buttons: this.OK, | |
669 | fn: fn, | |
01031528 TL |
670 | scope: scope, |
671 | minWidth: this.minWidth, | |
bb64de6e DM |
672 | }; |
673 | return this.show(config); | |
674 | } | |
01031528 | 675 | }, |
bb64de6e | 676 | }); |
bb64de6e DM |
677 | }); |
678 | Ext.define('Ext.ux.IFrame', { | |
679 | extend: 'Ext.Component', | |
680 | ||
681 | alias: 'widget.uxiframe', | |
682 | ||
683 | loadMask: 'Loading...', | |
684 | ||
685 | src: 'about:blank', | |
686 | ||
687 | renderTpl: [ | |
01031528 | 688 | '<iframe src="{src}" id="{id}-iframeEl" data-ref="iframeEl" name="{frameName}" width="100%" height="100%" frameborder="0" allowfullscreen="true"></iframe>', |
bb64de6e DM |
689 | ], |
690 | childEls: ['iframeEl'], | |
691 | ||
01031528 | 692 | initComponent: function() { |
bb64de6e DM |
693 | this.callParent(); |
694 | ||
695 | this.frameName = this.frameName || this.id + '-frame'; | |
696 | }, | |
697 | ||
01031528 | 698 | initEvents: function() { |
05a977a2 | 699 | let me = this; |
bb64de6e DM |
700 | me.callParent(); |
701 | me.iframeEl.on('load', me.onLoad, me); | |
702 | }, | |
703 | ||
704 | initRenderData: function() { | |
705 | return Ext.apply(this.callParent(), { | |
706 | src: this.src, | |
01031528 | 707 | frameName: this.frameName, |
bb64de6e DM |
708 | }); |
709 | }, | |
710 | ||
711 | getBody: function() { | |
05a977a2 | 712 | let doc = this.getDoc(); |
bb64de6e DM |
713 | return doc.body || doc.documentElement; |
714 | }, | |
715 | ||
716 | getDoc: function() { | |
717 | try { | |
718 | return this.getWin().document; | |
719 | } catch (ex) { | |
720 | return null; | |
721 | } | |
722 | }, | |
723 | ||
724 | getWin: function() { | |
05a977a2 | 725 | let me = this, |
bb64de6e DM |
726 | name = me.frameName, |
727 | win = Ext.isIE | |
728 | ? me.iframeEl.dom.contentWindow | |
729 | : window.frames[name]; | |
730 | return win; | |
731 | }, | |
732 | ||
733 | getFrame: function() { | |
05a977a2 | 734 | let me = this; |
bb64de6e DM |
735 | return me.iframeEl.dom; |
736 | }, | |
737 | ||
01031528 | 738 | beforeDestroy: function() { |
bb64de6e DM |
739 | this.cleanupListeners(true); |
740 | this.callParent(); | |
741 | }, | |
742 | ||
01031528 | 743 | cleanupListeners: function(destroying) { |
05a977a2 | 744 | let doc, prop; |
bb64de6e DM |
745 | |
746 | if (this.rendered) { | |
747 | try { | |
748 | doc = this.getDoc(); | |
749 | if (doc) { | |
bb64de6e | 750 | Ext.get(doc).un(this._docListeners); |
bb64de6e DM |
751 | if (destroying && doc.hasOwnProperty) { |
752 | for (prop in doc) { | |
05a977a2 | 753 | if (Object.prototype.hasOwnProperty.call(doc, prop)) { |
bb64de6e DM |
754 | delete doc[prop]; |
755 | } | |
756 | } | |
757 | } | |
758 | } | |
05a977a2 TL |
759 | } catch (e) { |
760 | // do nothing | |
761 | } | |
bb64de6e DM |
762 | } |
763 | }, | |
764 | ||
765 | onLoad: function() { | |
05a977a2 | 766 | let me = this, |
bb64de6e DM |
767 | doc = me.getDoc(), |
768 | fn = me.onRelayedEvent; | |
769 | ||
770 | if (doc) { | |
771 | try { | |
772 | // These events need to be relayed from the inner document (where they stop | |
773 | // bubbling) up to the outer document. This has to be done at the DOM level so | |
774 | // the event reaches listeners on elements like the document body. The effected | |
775 | // mechanisms that depend on this bubbling behavior are listed to the right | |
776 | // of the event. | |
bb64de6e DM |
777 | Ext.get(doc).on( |
778 | me._docListeners = { | |
779 | mousedown: fn, // menu dismisal (MenuManager) and Window onMouseDown (toFront) | |
780 | mousemove: fn, // window resize drag detection | |
01031528 TL |
781 | mouseup: fn, // window resize termination |
782 | click: fn, // not sure, but just to be safe | |
783 | dblclick: fn, // not sure again | |
784 | scope: me, | |
785 | }, | |
bb64de6e | 786 | ); |
01031528 | 787 | } catch (e) { |
bb64de6e DM |
788 | // cannot do this xss |
789 | } | |
790 | ||
791 | // We need to be sure we remove all our events from the iframe on unload or we're going to LEAK! | |
792 | Ext.get(this.getWin()).on('beforeunload', me.cleanupListeners, me); | |
793 | ||
794 | this.el.unmask(); | |
795 | this.fireEvent('load', this); | |
bb64de6e | 796 | } else if (me.src) { |
bb64de6e DM |
797 | this.el.unmask(); |
798 | this.fireEvent('error', this); | |
799 | } | |
bb64de6e DM |
800 | }, |
801 | ||
01031528 | 802 | onRelayedEvent: function(event) { |
bb64de6e DM |
803 | // relay event from the iframe's document to the document that owns the iframe... |
804 | ||
05a977a2 | 805 | let iframeEl = this.iframeEl, |
bb64de6e DM |
806 | |
807 | // Get the left-based iframe position | |
808 | iframeXY = iframeEl.getTrueXY(), | |
809 | originalEventXY = event.getXY(), | |
810 | ||
811 | // Get the left-based XY position. | |
812 | // This is because the consumer of the injected event will | |
813 | // perform its own RTL normalization. | |
814 | eventXY = event.getTrueXY(); | |
815 | ||
816 | // the event from the inner document has XY relative to that document's origin, | |
817 | // so adjust it to use the origin of the iframe in the outer document: | |
818 | event.xy = [iframeXY[0] + eventXY[0], iframeXY[1] + eventXY[1]]; | |
819 | ||
820 | event.injectEvent(iframeEl); // blame the iframe for the event... | |
821 | ||
822 | event.xy = originalEventXY; // restore the original XY (just for safety) | |
823 | }, | |
824 | ||
01031528 | 825 | load: function(src) { |
05a977a2 | 826 | let me = this, |
bb64de6e DM |
827 | text = me.loadMask, |
828 | frame = me.getFrame(); | |
829 | ||
830 | if (me.fireEvent('beforeload', me, src) !== false) { | |
831 | if (text && me.el) { | |
832 | me.el.mask(text); | |
833 | } | |
834 | ||
01031528 | 835 | frame.src = me.src = src || me.src; |
bb64de6e | 836 | } |
01031528 | 837 | }, |
bb64de6e | 838 | }); |