]>
Commit | Line | Data |
---|---|---|
07c3dd23 DM |
1 | Ext.define('PVE.window.Edit', { |
2 | extend: 'Ext.window.Window', | |
3 | alias: 'widget.pveWindowEdit', | |
4 | ||
5 | resizable: false, | |
6 | ||
7 | // use this tio atimatically generate a title like | |
8 | // Create: <subject> | |
9 | subject: undefined, | |
10 | ||
d5e771ce | 11 | // set isCreate to true if you want a Create button (instead of |
07c3dd23 | 12 | // OK and RESET) |
d5e771ce | 13 | isCreate: false, |
07c3dd23 DM |
14 | |
15 | // set to true if you want an Add button (instead of Create) | |
16 | isAdd: false, | |
17 | ||
18 | // set to true if you want an Remove button (instead of Create) | |
19 | isRemove: false, | |
20 | ||
21 | backgroundDelay: 0, | |
22 | ||
23 | showProgress: false, | |
24 | ||
25 | isValid: function() { | |
26 | var me = this; | |
27 | ||
28 | var form = me.formPanel.getForm(); | |
29 | return form.isValid(); | |
30 | }, | |
31 | ||
32 | getValues: function(dirtyOnly) { | |
33 | var me = this; | |
34 | ||
35 | var values = {}; | |
36 | ||
37 | var form = me.formPanel.getForm(); | |
38 | ||
39 | form.getFields().each(function(field) { | |
40 | if (!field.up('inputpanel') && (!dirtyOnly || field.isDirty())) { | |
41 | PVE.Utils.assemble_field_data(values, field.getSubmitData()); | |
42 | } | |
43 | }); | |
44 | ||
45 | Ext.Array.each(me.query('inputpanel'), function(panel) { | |
46 | PVE.Utils.assemble_field_data(values, panel.getValues(dirtyOnly)); | |
47 | }); | |
48 | ||
49 | return values; | |
50 | }, | |
51 | ||
52 | setValues: function(values) { | |
53 | var me = this; | |
54 | ||
55 | var form = me.formPanel.getForm(); | |
56 | ||
57 | Ext.iterate(values, function(fieldId, val) { | |
58 | var field = form.findField(fieldId); | |
59 | if (field && !field.up('inputpanel')) { | |
60 | field.setValue(val); | |
61 | if (form.trackResetOnLoad) { | |
62 | field.resetOriginalValue(); | |
63 | } | |
64 | } | |
65 | }); | |
66 | ||
67 | Ext.Array.each(me.query('inputpanel'), function(panel) { | |
68 | panel.setValues(values); | |
69 | }); | |
70 | }, | |
71 | ||
72 | submit: function() { | |
73 | var me = this; | |
74 | ||
75 | var form = me.formPanel.getForm(); | |
76 | ||
77 | var values = me.getValues(); | |
78 | Ext.Object.each(values, function(name, val) { | |
79 | if (values.hasOwnProperty(name)) { | |
80 | if (Ext.isArray(val) && !val.length) { | |
81 | values[name] = ''; | |
82 | } | |
83 | } | |
84 | }); | |
85 | ||
86 | if (me.digest) { | |
87 | values.digest = me.digest; | |
88 | } | |
89 | ||
90 | if (me.backgroundDelay) { | |
91 | values.background_delay = me.backgroundDelay; | |
92 | } | |
93 | ||
94 | var url = me.url; | |
95 | if (me.method === 'DELETE') { | |
96 | url = url + "?" + Ext.Object.toQueryString(values); | |
97 | values = undefined; | |
98 | } | |
99 | ||
100 | PVE.Utils.API2Request({ | |
101 | url: url, | |
102 | waitMsgTarget: me, | |
103 | method: me.method || (me.backgroundDelay ? 'POST' : 'PUT'), | |
104 | params: values, | |
105 | failure: function(response, options) { | |
106 | if (response.result && response.result.errors) { | |
107 | form.markInvalid(response.result.errors); | |
108 | } | |
109 | Ext.Msg.alert(gettext('Error'), response.htmlStatus); | |
110 | }, | |
111 | success: function(response, options) { | |
42edc4df EK |
112 | var hasProgressBar = (me.backgroundDelay || me.showProgress) && |
113 | response.result.data ? true : false; | |
114 | ||
115 | if (hasProgressBar) { | |
116 | // stay around so we can trigger our close events | |
117 | // when background action is completed | |
118 | me.hide(); | |
119 | ||
07c3dd23 DM |
120 | var upid = response.result.data; |
121 | var win = Ext.create('PVE.window.TaskProgress', { | |
42edc4df EK |
122 | upid: upid, |
123 | listeners: { | |
124 | destroy: function () { | |
125 | me.close(); | |
126 | } | |
127 | } | |
07c3dd23 DM |
128 | }); |
129 | win.show(); | |
42edc4df EK |
130 | } else { |
131 | me.close(); | |
07c3dd23 DM |
132 | } |
133 | } | |
134 | }); | |
135 | }, | |
136 | ||
137 | load: function(options) { | |
138 | var me = this; | |
139 | ||
140 | var form = me.formPanel.getForm(); | |
141 | ||
142 | options = options || {}; | |
143 | ||
144 | var newopts = Ext.apply({ | |
145 | waitMsgTarget: me | |
146 | }, options); | |
147 | ||
148 | var createWrapper = function(successFn) { | |
149 | Ext.apply(newopts, { | |
150 | url: me.url, | |
151 | method: 'GET', | |
152 | success: function(response, opts) { | |
153 | form.clearInvalid(); | |
154 | me.digest = response.result.data.digest; | |
155 | if (successFn) { | |
156 | successFn(response, opts); | |
157 | } else { | |
158 | me.setValues(response.result.data); | |
159 | } | |
160 | // hack: fix ExtJS bug | |
161 | Ext.Array.each(me.query('radiofield'), function(f) { | |
162 | f.resetOriginalValue(); | |
163 | }); | |
164 | }, | |
165 | failure: function(response, opts) { | |
166 | Ext.Msg.alert(gettext('Error'), response.htmlStatus, function() { | |
167 | me.close(); | |
168 | }); | |
169 | } | |
170 | }); | |
171 | }; | |
172 | ||
173 | createWrapper(options.success); | |
174 | ||
175 | PVE.Utils.API2Request(newopts); | |
176 | }, | |
177 | ||
178 | initComponent : function() { | |
179 | var me = this; | |
180 | ||
181 | if (!me.url) { | |
182 | throw "no url specified"; | |
183 | } | |
184 | ||
d5e771ce EK |
185 | if (me.create) {throw "deprecated parameter, use isCreate";} |
186 | ||
07c3dd23 DM |
187 | var items = Ext.isArray(me.items) ? me.items : [ me.items ]; |
188 | ||
189 | me.items = undefined; | |
190 | ||
191 | me.formPanel = Ext.create('Ext.form.Panel', { | |
192 | url: me.url, | |
193 | method: me.method || 'PUT', | |
194 | trackResetOnLoad: true, | |
195 | bodyPadding: 10, | |
196 | border: false, | |
197 | defaults: { | |
198 | border: false | |
199 | }, | |
200 | fieldDefaults: Ext.apply({}, me.fieldDefaults, { | |
201 | labelWidth: 100, | |
202 | anchor: '100%' | |
203 | }), | |
204 | items: items | |
205 | }); | |
206 | ||
207 | var form = me.formPanel.getForm(); | |
208 | ||
b0a94fee | 209 | var submitText; |
d5e771ce | 210 | if (me.isCreate) { |
b0a94fee EK |
211 | if (me.isAdd) { |
212 | submitText = gettext('Add'); | |
213 | } else if (me.isRemove) { | |
214 | submitText = gettext('Remove'); | |
215 | } else { | |
216 | submitText = gettext('Create'); | |
217 | } | |
218 | } else { | |
219 | submitText = gettext('OK'); | |
220 | } | |
221 | ||
07c3dd23 | 222 | var submitBtn = Ext.create('Ext.Button', { |
b0a94fee | 223 | text: submitText, |
d5e771ce | 224 | disabled: !me.isCreate, |
07c3dd23 DM |
225 | handler: function() { |
226 | me.submit(); | |
227 | } | |
228 | }); | |
229 | ||
230 | var resetBtn = Ext.create('Ext.Button', { | |
231 | text: 'Reset', | |
232 | disabled: true, | |
233 | handler: function(){ | |
234 | form.reset(); | |
235 | } | |
236 | }); | |
237 | ||
238 | var set_button_status = function() { | |
239 | var valid = form.isValid(); | |
240 | var dirty = form.isDirty(); | |
d5e771ce | 241 | submitBtn.setDisabled(!valid || !(dirty || me.isCreate)); |
07c3dd23 DM |
242 | resetBtn.setDisabled(!dirty); |
243 | }; | |
244 | ||
245 | form.on('dirtychange', set_button_status); | |
246 | form.on('validitychange', set_button_status); | |
247 | ||
248 | var colwidth = 300; | |
249 | if (me.fieldDefaults && me.fieldDefaults.labelWidth) { | |
250 | colwidth += me.fieldDefaults.labelWidth - 100; | |
251 | } | |
252 | ||
253 | ||
254 | var twoColumn = items[0].column1 || items[0].column2; | |
255 | ||
256 | if (me.subject && !me.title) { | |
d5e771ce | 257 | me.title = PVE.Utils.dialog_title(me.subject, me.isCreate, me.isAdd); |
07c3dd23 DM |
258 | } |
259 | ||
d5e771ce | 260 | if (me.isCreate) { |
398459d1 EK |
261 | me.buttons = [ submitBtn ] ; |
262 | } else { | |
263 | me.buttons = [ submitBtn, resetBtn ]; | |
264 | } | |
265 | ||
e9ee1006 EK |
266 | if (items[0].onlineHelp) { |
267 | var helpButton = Ext.create('PVE.button.Help'); | |
268 | me.buttons.unshift(helpButton, '->'); | |
269 | Ext.GlobalEvents.fireEvent('pveShowHelp', items[0].onlineHelp); | |
270 | } | |
271 | ||
07c3dd23 DM |
272 | Ext.applyIf(me, { |
273 | modal: true, | |
07c3dd23 DM |
274 | width: twoColumn ? colwidth*2 : colwidth, |
275 | border: false, | |
22f2f9d6 | 276 | items: [ me.formPanel ] |
07c3dd23 DM |
277 | }); |
278 | ||
279 | me.callParent(); | |
280 | ||
281 | // always mark invalid fields | |
282 | me.on('afterlayout', function() { | |
eef36351 DC |
283 | // on touch devices, the isValid function |
284 | // triggers a layout, which triggers an isValid | |
285 | // and so on | |
286 | // to prevent this we disable the layouting here | |
287 | // and enable it afterwards | |
288 | me.suspendLayout = true; | |
07c3dd23 | 289 | me.isValid(); |
eef36351 | 290 | me.suspendLayout = false; |
07c3dd23 DM |
291 | }); |
292 | } | |
293 | }); |