]>
Commit | Line | Data |
---|---|---|
52e4096b DM |
1 | // ExtJS related things |
2 | ||
a764c5f7 | 3 | PVE.Utils.toolkit = 'extjs'; |
52e4096b DM |
4 | |
5 | // do not send '_dc' parameter | |
6 | Ext.Ajax.disableCaching = false; | |
7 | ||
8 | // custom Vtypes | |
9 | Ext.apply(Ext.form.field.VTypes, { | |
10 | IPAddress: function(v) { | |
c15c61d3 | 11 | return PVE.Utils.IP4_match.test(v); |
52e4096b DM |
12 | }, |
13 | IPAddressText: gettext('Example') + ': 192.168.1.1', | |
14 | IPAddressMask: /[\d\.]/i, | |
15 | ||
16 | IPCIDRAddress: function(v) { | |
c15c61d3 | 17 | var result = PVE.Utils.IP4_cidr_match.exec(v); |
368df92e DC |
18 | // limits according to JSON Schema see |
19 | // pve-common/src/PVE/JSONSchema.pm | |
20 | return (result !== null && result[1] >= 8 && result[1] <= 32); | |
52e4096b | 21 | }, |
368df92e | 22 | IPCIDRAddressText: gettext('Example') + ': 192.168.1.1/24' + "<br>" + gettext('Valid CIDR Range') + ': 8-32', |
52e4096b DM |
23 | IPCIDRAddressMask: /[\d\.\/]/i, |
24 | ||
25 | IP6Address: function(v) { | |
c15c61d3 | 26 | return PVE.Utils.IP6_match.test(v); |
52e4096b DM |
27 | }, |
28 | IP6AddressText: gettext('Example') + ': 2001:DB8::42', | |
29 | IP6AddressMask: /[A-Fa-f0-9:]/, | |
30 | ||
31 | IP6CIDRAddress: function(v) { | |
c15c61d3 | 32 | var result = PVE.Utils.IP6_cidr_match.exec(v); |
368df92e DC |
33 | // limits according to JSON Schema see |
34 | // pve-common/src/PVE/JSONSchema.pm | |
35 | return (result !== null && result[1] >= 8 && result[1] <= 120); | |
52e4096b | 36 | }, |
368df92e | 37 | IP6CIDRAddressText: gettext('Example') + ': 2001:DB8::42/64' + "<br>" + gettext('Valid CIDR Range') + ': 8-120', |
52e4096b DM |
38 | IP6CIDRAddressMask: /[A-Fa-f0-9:\/]/, |
39 | ||
40 | IP6PrefixLength: function(v) { | |
41 | return v >= 0 && v <= 128; | |
42 | }, | |
43 | IP6PrefixLengthText: gettext('Example') + ': X, where 0 <= X <= 128', | |
44 | IP6PrefixLengthMask: /[0-9]/, | |
3d9bc0a2 | 45 | |
52e4096b | 46 | IP64Address: function(v) { |
c15c61d3 | 47 | return PVE.Utils.IP64_match.test(v); |
52e4096b DM |
48 | }, |
49 | IP64AddressText: gettext('Example') + ': 192.168.1.1 2001:DB8::42', | |
50 | IP64AddressMask: /[A-Fa-f0-9\.:]/, | |
51 | ||
52 | MacAddress: function(v) { | |
53 | return (/^([a-fA-F0-9]{2}:){5}[a-fA-F0-9]{2}$/).test(v); | |
54 | }, | |
55 | MacAddressMask: /[a-fA-F0-9:]/, | |
56 | MacAddressText: gettext('Example') + ': 01:23:45:67:89:ab', | |
57 | ||
58 | BridgeName: function(v) { | |
59 | return (/^vmbr\d{1,4}$/).test(v); | |
60 | }, | |
61 | BridgeNameText: gettext('Format') + ': vmbr<b>N</b>, where 0 <= <b>N</b> <= 9999', | |
62 | ||
63 | BondName: function(v) { | |
64 | return (/^bond\d{1,4}$/).test(v); | |
65 | }, | |
66 | BondNameText: gettext('Format') + ': bond<b>N</b>, where 0 <= <b>N</b> <= 9999', | |
67 | ||
68 | InterfaceName: function(v) { | |
69 | return (/^[a-z][a-z0-9_]{1,20}$/).test(v); | |
70 | }, | |
f02c063d DC |
71 | InterfaceNameText: gettext("Allowed characters") + ": 'a-z', '0-9', '_'" + "<br />" + |
72 | gettext("Minimum characters") + ": 2" + "<br />" + | |
73 | gettext("Maximum characters") + ": 21" + "<br />" + | |
74 | gettext("Must start with") + ": 'a-z'", | |
52e4096b DM |
75 | |
76 | QemuStartDate: function(v) { | |
77 | return (/^(now|\d{4}-\d{1,2}-\d{1,2}(T\d{1,2}:\d{1,2}:\d{1,2})?)$/).test(v); | |
78 | }, | |
79 | QemuStartDateText: gettext('Format') + ': "now" or "2006-06-17T16:01:21" or "2006-06-17"', | |
80 | ||
81 | StorageId: function(v) { | |
82 | return (/^[a-z][a-z0-9\-\_\.]*[a-z0-9]$/i).test(v); | |
83 | }, | |
f02c063d DC |
84 | StorageIdText: gettext("Allowed characters") + ": 'A-Z', 'a-z', '0-9', '-', '_', '.'" + "<br />" + |
85 | gettext("Minimum characters") + ": 2" + "<br />" + | |
86 | gettext("Must start with") + ": 'A-Z', 'a-z'<br />" + | |
87 | gettext("Must end with") + ": 'A-Z', 'a-z', '0-9'<br />", | |
24bf5bd4 DM |
88 | |
89 | ConfigId: function(v) { | |
90 | return (/^[a-z][a-z0-9\_]+$/i).test(v); | |
91 | }, | |
f02c063d DC |
92 | ConfigIdText: gettext("Allowed characters") + ": 'A-Z', 'a-z', '0-9', '_'" + "<br />" + |
93 | gettext("Minimum characters") + ": 2" + "<br />" + | |
94 | gettext("Must start with") + ": " + gettext("letter"), | |
52e4096b DM |
95 | |
96 | HttpProxy: function(v) { | |
97 | return (/^http:\/\/.*$/).test(v); | |
98 | }, | |
99 | HttpProxyText: gettext('Example') + ": http://username:password@host:port/", | |
100 | ||
101 | DnsName: function(v) { | |
c15c61d3 | 102 | return PVE.Utils.DnsName_match.test(v); |
52e4096b | 103 | }, |
8ca163bd EK |
104 | DnsNameText: gettext('This is not a valid DNS name'), |
105 | ||
106 | // workaround for https://www.sencha.com/forum/showthread.php?302150 | |
107 | pveMail: function(v) { | |
108 | return (/^(\w+)([\-+.][\w]+)*@(\w[\-\w]*\.){1,5}([A-Za-z]){2,63}$/).test(v); | |
109 | }, | |
70e779e4 DC |
110 | pveMailText: gettext('Example') + ": user@example.com", |
111 | ||
112 | HostList: function(v) { | |
113 | var list = v.split(/[\ \,\;]+/); | |
114 | var i; | |
115 | for (i = 0; i < list.length; i++) { | |
116 | if (list[i] == "") { | |
117 | continue; | |
118 | } | |
119 | ||
c15c61d3 EK |
120 | if (!PVE.Utils.HostPort_match.test(list[i]) && |
121 | !PVE.Utils.HostPortBrackets_match.test(list[i]) && | |
122 | !PVE.Utils.IP6_dotnotation_match.test(list[i])) { | |
70e779e4 DC |
123 | return false; |
124 | } | |
125 | } | |
126 | ||
127 | return true; | |
128 | }, | |
129 | HostListText: gettext('Not a valid list of hosts') | |
52e4096b DM |
130 | }); |
131 | ||
ccf32efa DC |
132 | // since we always want the number in |
133 | // x.y format and never in e.g. x,y | |
134 | Ext.define('PVE.form.field.Number', { | |
135 | override: 'Ext.form.field.Number', | |
136 | submitLocaleSeparator: false | |
137 | }); | |
138 | ||
ee231e79 DC |
139 | // ExtJs 5-6 has an issue with caching |
140 | // see https://www.sencha.com/forum/showthread.php?308989 | |
141 | Ext.define('PVE.UnderlayPool', { | |
142 | override: 'Ext.dom.UnderlayPool', | |
143 | ||
144 | checkOut: function () { | |
145 | var cache = this.cache, | |
146 | len = cache.length, | |
147 | el; | |
148 | ||
149 | // do cleanup because some of the objects might have been destroyed | |
150 | while (len--) { | |
151 | if (cache[len].destroyed) { | |
152 | cache.splice(len, 1); | |
153 | } | |
154 | } | |
155 | // end do cleanup | |
156 | ||
157 | el = cache.shift(); | |
158 | ||
159 | if (!el) { | |
160 | el = Ext.Element.create(this.elementConfig); | |
161 | el.setVisibilityMode(2); | |
162 | //<debug> | |
163 | // tell the spec runner to ignore this element when checking if the dom is clean | |
164 | el.dom.setAttribute('data-sticky', true); | |
165 | //</debug> | |
166 | } | |
167 | ||
168 | return el; | |
169 | } | |
170 | }); | |
171 | ||
02c92261 DC |
172 | // 'Enter' in Textareas and aria multiline fields should not activate the |
173 | // defaultbutton, fixed in extjs 6.0.2 | |
174 | Ext.define('PVE.panel.Panel', { | |
175 | override: 'Ext.panel.Panel', | |
176 | ||
177 | fireDefaultButton: function(e) { | |
178 | if (e.target.getAttribute('aria-multiline') === 'true' || | |
179 | e.target.tagName === "TEXTAREA") { | |
180 | return true; | |
181 | } | |
182 | return this.callParent(arguments); | |
183 | } | |
184 | }); | |
185 | ||
05694e6d DC |
186 | // if the order of the values are not the same in originalValue and value |
187 | // extjs will not overwrite value, but marks the field dirty and thus | |
188 | // the reset button will be enabled (but clicking it changes nothing) | |
189 | // so if the arrays are not the same after resetting, we | |
190 | // clear and set it | |
191 | Ext.define('PVE.form.ComboBox', { | |
192 | override: 'Ext.form.field.ComboBox', | |
193 | ||
194 | reset: function() { | |
195 | // copied from combobox | |
196 | var me = this; | |
197 | me.callParent(); | |
05694e6d DC |
198 | |
199 | // clear and set when not the same | |
7be50bef DC |
200 | var value = me.getValue(); |
201 | if (Ext.isArray(me.originalValue) && Ext.isArray(value) && !Ext.Array.equals(value, me.originalValue)) { | |
05694e6d DC |
202 | me.clearValue(); |
203 | me.setValue(me.originalValue); | |
204 | } | |
205 | } | |
206 | }); | |
207 | ||
598ee8e6 TL |
208 | // should be fixed with ExtJS 6.0.2, see: |
209 | // https://www.sencha.com/forum/showthread.php?307244-Bug-with-datefield-in-window-with-scroll | |
210 | Ext.define('PVE.Datepicker', { | |
211 | override: 'Ext.picker.Date', | |
212 | hideMode: 'visibility' | |
213 | }); | |
214 | ||
026b7601 EK |
215 | // force alert boxes to be rendered with an Error Icon |
216 | // since Ext.Msg is an object and not a prototype, we need to override it | |
217 | // after the framework has been initiated | |
218 | Ext.onReady(function() { | |
ec0bd652 | 219 | /*jslint confusion: true */ |
026b7601 EK |
220 | Ext.override(Ext.Msg, { |
221 | alert: function(title, message, fn, scope) { | |
222 | if (Ext.isString(title)) { | |
223 | var config = { | |
224 | title: title, | |
225 | message: message, | |
226 | icon: this.ERROR, | |
227 | buttons: this.OK, | |
228 | fn: fn, | |
229 | scope : scope, | |
230 | minWidth: this.minWidth | |
231 | }; | |
232 | return this.show(config); | |
233 | } | |
234 | } | |
235 | }); | |
ec0bd652 | 236 | /*jslint confusion: false */ |
026b7601 | 237 | }); |
52e4096b DM |
238 | Ext.define('Ext.ux.IFrame', { |
239 | extend: 'Ext.Component', | |
240 | ||
241 | alias: 'widget.uxiframe', | |
242 | ||
243 | loadMask: 'Loading...', | |
244 | ||
245 | src: 'about:blank', | |
246 | ||
247 | renderTpl: [ | |
8fae05ea | 248 | '<iframe src="{src}" id="{id}-iframeEl" data-ref="iframeEl" name="{frameName}" width="100%" height="100%" frameborder="0" allowfullscreen="true"></iframe>' |
52e4096b | 249 | ], |
06366d35 | 250 | childEls: ['iframeEl'], |
52e4096b DM |
251 | |
252 | initComponent: function () { | |
253 | this.callParent(); | |
254 | ||
06366d35 | 255 | this.frameName = this.frameName || this.id + '-frame'; |
52e4096b DM |
256 | }, |
257 | ||
258 | initEvents : function() { | |
259 | var me = this; | |
260 | me.callParent(); | |
261 | me.iframeEl.on('load', me.onLoad, me); | |
262 | }, | |
263 | ||
264 | initRenderData: function() { | |
265 | return Ext.apply(this.callParent(), { | |
266 | src: this.src, | |
267 | frameName: this.frameName | |
268 | }); | |
269 | }, | |
270 | ||
271 | getBody: function() { | |
272 | var doc = this.getDoc(); | |
273 | return doc.body || doc.documentElement; | |
274 | }, | |
275 | ||
276 | getDoc: function() { | |
277 | try { | |
278 | return this.getWin().document; | |
279 | } catch (ex) { | |
280 | return null; | |
281 | } | |
282 | }, | |
283 | ||
284 | getWin: function() { | |
285 | var me = this, | |
286 | name = me.frameName, | |
287 | win = Ext.isIE | |
288 | ? me.iframeEl.dom.contentWindow | |
289 | : window.frames[name]; | |
290 | return win; | |
291 | }, | |
292 | ||
293 | getFrame: function() { | |
294 | var me = this; | |
295 | return me.iframeEl.dom; | |
296 | }, | |
297 | ||
298 | beforeDestroy: function () { | |
299 | this.cleanupListeners(true); | |
300 | this.callParent(); | |
301 | }, | |
3d9bc0a2 | 302 | |
52e4096b DM |
303 | cleanupListeners: function(destroying){ |
304 | var doc, prop; | |
305 | ||
306 | if (this.rendered) { | |
307 | try { | |
06366d35 | 308 | doc = this.getDoc(); |
52e4096b | 309 | if (doc) { |
ca90044d | 310 | /*jslint nomen: true*/ |
06366d35 | 311 | Ext.get(doc).un(this._docListeners); |
ca90044d DC |
312 | /*jslint nomen: false*/ |
313 | if (destroying && doc.hasOwnProperty) { | |
52e4096b | 314 | for (prop in doc) { |
ca90044d | 315 | if (doc.hasOwnProperty(prop)) { |
52e4096b DM |
316 | delete doc[prop]; |
317 | } | |
318 | } | |
319 | } | |
320 | } | |
321 | } catch(e) { } | |
322 | } | |
323 | }, | |
324 | ||
325 | onLoad: function() { | |
326 | var me = this, | |
327 | doc = me.getDoc(), | |
328 | fn = me.onRelayedEvent; | |
329 | ||
330 | if (doc) { | |
331 | try { | |
52e4096b DM |
332 | // These events need to be relayed from the inner document (where they stop |
333 | // bubbling) up to the outer document. This has to be done at the DOM level so | |
334 | // the event reaches listeners on elements like the document body. The effected | |
335 | // mechanisms that depend on this bubbling behavior are listed to the right | |
336 | // of the event. | |
ca90044d | 337 | /*jslint nomen: true*/ |
06366d35 DC |
338 | Ext.get(doc).on( |
339 | me._docListeners = { | |
340 | mousedown: fn, // menu dismisal (MenuManager) and Window onMouseDown (toFront) | |
341 | mousemove: fn, // window resize drag detection | |
342 | mouseup: fn, // window resize termination | |
343 | click: fn, // not sure, but just to be safe | |
344 | dblclick: fn, // not sure again | |
345 | scope: me | |
346 | } | |
347 | ); | |
ca90044d | 348 | /*jslint nomen: false*/ |
52e4096b DM |
349 | } catch(e) { |
350 | // cannot do this xss | |
351 | } | |
352 | ||
353 | // We need to be sure we remove all our events from the iframe on unload or we're going to LEAK! | |
06366d35 | 354 | Ext.get(this.getWin()).on('beforeunload', me.cleanupListeners, me); |
52e4096b DM |
355 | |
356 | this.el.unmask(); | |
357 | this.fireEvent('load', this); | |
358 | ||
06366d35 | 359 | } else if (me.src) { |
52e4096b DM |
360 | |
361 | this.el.unmask(); | |
362 | this.fireEvent('error', this); | |
363 | } | |
364 | ||
365 | ||
366 | }, | |
367 | ||
06366d35 DC |
368 | onRelayedEvent: function (event) { |
369 | // relay event from the iframe's document to the document that owns the iframe... | |
370 | ||
371 | var iframeEl = this.iframeEl, | |
372 | ||
373 | // Get the left-based iframe position | |
374 | iframeXY = iframeEl.getTrueXY(), | |
375 | originalEventXY = event.getXY(), | |
376 | ||
377 | // Get the left-based XY position. | |
378 | // This is because the consumer of the injected event will | |
379 | // perform its own RTL normalization. | |
380 | eventXY = event.getTrueXY(); | |
381 | ||
382 | // the event from the inner document has XY relative to that document's origin, | |
383 | // so adjust it to use the origin of the iframe in the outer document: | |
384 | event.xy = [iframeXY[0] + eventXY[0], iframeXY[1] + eventXY[1]]; | |
385 | ||
386 | event.injectEvent(iframeEl); // blame the iframe for the event... | |
387 | ||
388 | event.xy = originalEventXY; // restore the original XY (just for safety) | |
389 | }, | |
390 | ||
52e4096b DM |
391 | load: function (src) { |
392 | var me = this, | |
393 | text = me.loadMask, | |
394 | frame = me.getFrame(); | |
395 | ||
396 | if (me.fireEvent('beforeload', me, src) !== false) { | |
397 | if (text && me.el) { | |
398 | me.el.mask(text); | |
399 | } | |
400 | ||
401 | frame.src = me.src = (src || me.src); | |
402 | } | |
403 | } | |
404 | }); |