www/js/profile_styles.js

changeset 796
6ce2c2e6796e
parent 795
9472106a3143
child 797
d0fedeb32f05
equal deleted inserted replaced
795:9472106a3143 796:6ce2c2e6796e
1 /*****************************************************************************
2 * Copyright (C) 2014-2022
3 *
4 * Michiel Broek <mbroek at mbse dot eu>
5 *
6 * This file is part of Brewery Management System
7 *
8 * This is free software; you can redistribute it and/or modify it
9 * under the terms of the GNU General Public License as published by the
10 * Free Software Foundation; either version 2, or (at your option) any
11 * later version.
12 *
13 * BrewCloud is distributed in the hope that it will be useful, but
14 * WITHOUT ANY WARRANTY; without even the implied warranty of
15 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
16 * General Public License for more details.
17 *
18 * You should have received a copy of the GNU General Public License
19 * along with ThermFerm; see the file COPYING. If not, write to the Free
20 * Software Foundation, 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA.
21 *****************************************************************************/
22
23
24 function createDelElements() {
25 $('#eventWindow').jqxWindow({
26 theme: theme,
27 position: { x: 490, y: 210 },
28 width: 300,
29 height: 175,
30 resizable: false,
31 isModal: true,
32 modalOpacity: 0.4,
33 okButton: $('#delOk'),
34 cancelButton: $('#delCancel'),
35 initContent: function() {
36 $('#delOk').jqxButton({ template: 'danger', width: '65px', theme: theme });
37 $('#delCancel').jqxButton({ template: 'success', width: '65px', theme: theme });
38 $('#delCancel').focus();
39 }
40 });
41 $('#eventWindow').jqxWindow('hide');
42 }
43
44
45 $(document).ready(function() {
46
47 var dataRecord = {},
48 url = 'includes/db_profile_styles.php',
49 source = {
50 datatype: 'json',
51 cache: false,
52 datafields: [
53 { name: 'record', type: 'number' },
54 { name: 'uuid', type: 'string' },
55 { name: 'name', type: 'string' },
56 { name: 'category', type: 'string' },
57 { name: 'category_number', type: 'number' },
58 { name: 'style_letter', type: 'string' },
59 { name: 'style_guide', type: 'string' },
60 { name: 'type', type: 'int' },
61 { name: 'og_min', type: 'float' },
62 { name: 'og_max', type: 'float' },
63 { name: 'fg_min', type: 'float' },
64 { name: 'fg_max', type: 'float' },
65 { name: 'ibu_min', type: 'float' },
66 { name: 'ibu_max', type: 'float' },
67 { name: 'color_min', type: 'float' },
68 { name: 'color_max', type: 'float' },
69 { name: 'carb_min', type: 'float' },
70 { name: 'carb_max', type: 'float' },
71 { name: 'abv_min', type: 'float' },
72 { name: 'abv_max', type: 'float' },
73 { name: 'notes', type: 'string' },
74 { name: 'profile', type: 'string' },
75 { name: 'ingredients', type: 'string' },
76 { name: 'examples', type: 'string' }
77 ],
78 id: 'record',
79 url: url,
80 deleterow: function(rowid, commit) {
81 // synchronize with the server - send delete command
82 var data = 'delete=true&' + $.param({ record: rowid });
83 $.ajax({
84 dataType: 'json',
85 url: url,
86 cache: false,
87 data: data,
88 type: 'POST',
89 success: function(data) {
90 if (data.error) {
91 console.log('delete: ' + data.msg);
92 alert('Fout: ' + data.msg);
93 } else {
94 console.log('delete: success');
95 }
96 location.reload(true);
97 },
98 error: function(jqXHR, textStatus, errorThrown) { commit(false); }
99 });
100 },
101 addrow: function(rowid, rowdata, position, commit) {
102 var data = 'insert=true&' + $.param(rowdata);
103 $.ajax({
104 dataType: 'json',
105 url: url,
106 cache: false,
107 data: data,
108 type: 'POST',
109 success: function(data) {
110 if (data.error) {
111 console.log('insert: ' + data.msg);
112 alert('Fout: ' + data.msg);
113 } else {
114 console.log('insert: success');
115 }
116 location.reload(true);
117 },
118 error: function(jqXHR, textStatus, errorThrown) { commit(false); }
119 });
120 },
121 updaterow: function(rowid, rowdata, commit) {
122 var data = 'update=true&' + $.param(rowdata);
123 $.ajax({
124 dataType: 'json',
125 url: url,
126 cache: false,
127 data: data,
128 type: 'POST',
129 success: function(data) {
130 if (data.error) {
131 console.log('updaterow: ' + data.msg);
132 alert('Fout: ' + data.msg);
133 } else {
134 console.log('updaterow: success');
135 }
136 location.reload(true);
137 },
138 error: function(jqXHR, textStatus, errorThrown) { commit(false); }
139 });
140 }
141 },
142 dataAdapter = new $.jqx.dataAdapter(source),
143 editrow = -1;
144
145 // initialize the input fields.
146 $('#name').jqxInput({ theme: theme, width: 320, height: 23 });
147 $('#category').jqxInput({ theme: theme, width: 320, height: 23 });
148 $('#category_number').jqxNumberInput(PosInt);
149 $('#style_letter').jqxInput({ theme: theme, width: 250, height: 23 });
150 $('#style_guide').jqxInput({ theme: theme, width: 320, height: 23 });
151 $('#type').jqxDropDownList({
152 theme: theme,
153 source: StyleTypeAdapter,
154 valueMember: 'id',
155 displayMember: 'nl',
156 width: 180,
157 height: 23,
158 autoDropDownHeight: true
159 });
160 $('#og_min').jqxNumberInput(SGopts);
161 $('#og_max').jqxNumberInput(SGopts);
162 $('#fg_min').jqxNumberInput(SGopts);
163 $('#fg_max').jqxNumberInput(SGopts);
164 $('#ibu_min').jqxNumberInput(PosInt);
165 $('#ibu_min').jqxNumberInput({ max: 200 });
166 $('#ibu_max').jqxNumberInput(PosInt);
167 $('#ibu_max').jqxNumberInput({ max: 200 });
168 $('#color_min').jqxNumberInput(PosInt);
169 $('#color_min').jqxNumberInput({ max: 200 });
170 $('#color_max').jqxNumberInput(PosInt);
171 $('#color_max').jqxNumberInput({ max: 200 });
172 $('#carb_min').jqxNumberInput(Spin1dec);
173 $('#carb_min').jqxNumberInput({ max: 5 });
174 $('#carb_max').jqxNumberInput(Spin1dec);
175 $('#carb_max').jqxNumberInput({ max: 5 });
176 $('#abv_min').jqxNumberInput(Spin1dec);
177 $('#abv_min').jqxNumberInput({ max: 20 });
178 $('#abv_max').jqxNumberInput(Spin1dec);
179 $('#abv_max').jqxNumberInput({ max: 20 });
180 $('#notes').jqxInput({ theme: theme, width: 800, height: 100 });
181 $('#profile').jqxInput({ theme: theme, width: 800, height: 48 });
182 $('#ingredients').jqxInput({ theme: theme, width: 800, height: 23 });
183 $('#examples').jqxInput({ theme: theme, width: 800, height: 48 });
184
185 var localizationobj = {};
186 localizationobj.filterchoosestring= "Keuze:";
187
188 // initialize jqxGrid
189 $('#jqxgrid').jqxGrid({
190 width: 1280,
191 height: 630,
192 source: dataAdapter,
193 theme: theme,
194 showstatusbar: true,
195 renderstatusbar: function(statusbar) {
196 var rowCount = $("#jqxgrid").jqxGrid('getrows').length;
197 statusbar.append('<div style="float: left; margin: 8px; color: orange !important;">Aantal items: ' + rowCount + '</div>');
198 var container, addButton, impButton;
199 container = $('<div style="overflow: hidden; position: relative; margin: 5px;"></div>');
200 addButton = $('<div style="float: right; margin-right: 15px;"><img style="position: relative; margin-top: 2px;" ' +
201 'src="images/add.png"/><span style="margin-left: 4px; position: relative; top: -4px;">Nieuw</span></div>');
202 impButton = $('<div style="float: right; margin-right: 50px;"><img style="position: relative; margin-top: 2px;" ' +
203 'src="images/add.png"/><span style="margin-left: 4px; position: relative; top: -4px;">Import</span></div>');
204 expButton = $('<div style="float: right; margin-right: 50px;"><img style="position: relative; margin-top: 2px;" ' +
205 'src="images/database.png"/><span style="margin-left: 4px; position: relative; top: -10px;">Export</span></div>');
206 container.append(addButton);
207 container.append(impButton);
208 container.append(expButton);
209 statusbar.append(container);
210 addButton.jqxButton({ theme: theme, width: 90, height: 17 });
211 impButton.jqxButton({ theme: theme, width: 90, height: 17 });
212 expButton.jqxButton({ theme: theme, width: 90, height: 17 });
213 // add new row.
214 addButton.click(function(event) {
215 editrow = -1;
216 $('#name').val('Nieuwe stijl');
217 dataRecord.uuid = '';
218 $('#category').val('');
219 $('#category_number').val('');
220 $('#style_letter').val('');
221 $('#style_guide').val('BKG 2015');
222 $('#type').val(0);
223 $('#og_min').val(1.030);
224 $('#og_max').val(1.050);
225 $('#fg_min').val(1.005);
226 $('#fg_max').val(1.010);
227 $('#ibu_min').val(20);
228 $('#ibu_max').val(30);
229 $('#color_min').val(52);
230 $('#color_max').val(79);
231 $('#carb_min').val(2.0);
232 $('#carb_max').val(2.5);
233 $('#abv_min').val(4.0);
234 $('#abv_max').val(5.0);
235 $('#notes').val('');
236 $('#profile').val('');
237 $('#ingredients').val('');
238 $('#examples').val('');
239 $('#popupWindow').jqxWindow('open');
240 });
241 impButton.click(function(event) {
242 window.location.href = 'import_ingredients.php?select=styles';
243 });
244 expButton.click(function(event) {
245 window.open('export_styles.php');
246 });
247 },
248 ready: function () {
249 $("#jqxgrid").jqxGrid('localizestrings', localizationobj);
250 },
251 filterable: true,
252 showfilterrow: true,
253 columns: [
254 { text: 'Gids', datafield: 'style_guide', width: 100, filtertype: 'list' },
255 { text: 'Groep', datafield: 'style_letter', width: 30, filtertype: 'list' },
256 { text: 'Style Name', menu: false, datafield: 'name', filtertype: 'textbox' },
257 { text: 'OG', menu: false, datafield: 'og_min', width: 60, align: 'right', cellsalign: 'right', cellsformat: 'f3', filterable: false },
258 { text: 'OG', menu: false, datafield: 'og_max', width: 60, align: 'right', cellsalign: 'right', cellsformat: 'f3', filterable: false },
259 { text: 'FG', menu: false, datafield: 'fg_min', width: 60, align: 'right', cellsalign: 'right', cellsformat: 'f3', filterable: false },
260 { text: 'FG', menu: false, datafield: 'fg_max', width: 60, align: 'right', cellsalign: 'right', cellsformat: 'f3', filterable: false },
261 { text: 'IBU', menu: false, datafield: 'ibu_min', width: 50, align: 'right', cellsalign: 'right', cellsformat: 'f0', filterable: false },
262 { text: 'IBU', menu: false, datafield: 'ibu_max', width: 50, align: 'right', cellsalign: 'right', cellsformat: 'f0', filterable: false },
263 { text: 'EBC', menu: false, datafield: 'color_min', width: 50, align: 'right', cellsalign: 'right', cellsformat: 'f0', filterable: false },
264 { text: 'EBC', menu: false, datafield: 'color_max', width: 50, align: 'right', cellsalign: 'right', cellsformat: 'f0', filterable: false },
265 { text: 'Co2', menu: false, datafield: 'carb_min', width: 50, align: 'right', cellsalign: 'right', cellsformat: 'f1', filterable: false },
266 { text: 'Co2', menu: false, datafield: 'carb_max', width: 50, align: 'right', cellsalign: 'right', cellsformat: 'f1', filterable: false },
267 { text: 'ABV', menu: false, datafield: 'abv_min', width: 50, align: 'right', cellsalign: 'right', cellsformat: 'f1', filterable: false },
268 { text: 'ABV', menu: false, datafield: 'abv_max', width: 50, align: 'right', cellsalign: 'right', cellsformat: 'f1', filterable: false },
269 { text: '', menu: false, datafield: 'Edit', width: 100, align: 'center', columntype: 'button', filterable: false, cellsrenderer: function() {
270 return 'Wijzig';
271 }, buttonclick: function(row) {
272 // open the popup window when the user clicks a button.
273 editrow = row;
274 // get the clicked row's data and initialize the input fields.
275 dataRecord = $('#jqxgrid').jqxGrid('getrowdata', editrow);
276 $('#name').val(dataRecord.name);
277 $('#category').val(dataRecord.category);
278 $('#category_number').val(dataRecord.category_number);
279 $('#style_letter').val(dataRecord.style_letter);
280 $('#style_guide').val(dataRecord.style_guide);
281 $('#type').val(dataRecord.type);
282 $('#og_min').val(dataRecord.og_min);
283 $('#og_max').val(dataRecord.og_max);
284 $('#fg_min').val(dataRecord.fg_min);
285 $('#fg_max').val(dataRecord.fg_max);
286 $('#ibu_min').val(dataRecord.ibu_min);
287 $('#ibu_max').val(dataRecord.ibu_max);
288 $('#color_min').val(dataRecord.color_min);
289 $('#color_max').val(dataRecord.color_max);
290 $('#carb_min').val(dataRecord.carb_min);
291 $('#carb_max').val(dataRecord.carb_max);
292 $('#abv_min').val(dataRecord.abv_min);
293 $('#abv_max').val(dataRecord.abv_max);
294 $('#notes').val(dataRecord.notes);
295 $('#profile').val(dataRecord.profile);
296 $('#ingredients').val(dataRecord.ingredients);
297 $('#examples').val(dataRecord.examples);
298 // show the popup window.
299 $('#popupWindow').jqxWindow('open');
300 }
301 }
302 ]
303 });
304 // initialize the popup window and buttons.
305 $('#popupWindow').jqxWindow({
306 width: 1050,
307 position: { x: 110, y: 30 },
308 resizable: false,
309 theme: theme,
310 isModal: true,
311 autoOpen: false,
312 cancelButton: $('#Cancel'),
313 modalOpacity: 0.40
314 });
315 $('#popupWindow').on('open', function() {
316 $('#name').jqxInput('selectAll');
317 });
318 $('#Delete').jqxButton({ template: 'danger', width: '90px', theme: theme });
319 $('#Delete').click(function() {
320 if (editrow >= 0) {
321 // Open a popup to confirm this action.
322 $('#eventWindow').jqxWindow('open');
323 $('#delOk').click(function() {
324 var rowID = $('#jqxgrid').jqxGrid('getrowid', editrow);
325 $('#jqxgrid').jqxGrid('deleterow', rowID);
326 });
327 }
328 $('#popupWindow').jqxWindow('hide');
329 });
330 $('#Cancel').jqxButton({ template: 'primary', width: '90px', theme: theme });
331 $('#Save').jqxButton({ template: 'success', width: '90px', theme: theme });
332 // update the edited row when the user clicks the 'Save' button.
333 $('#Save').click(function() {
334 var row, rowID = -1;
335 if (editrow >= 0) {
336 rowID = $('#jqxgrid').jqxGrid('getrowid', editrow);
337 }
338 row = {
339 record: rowID,
340 uuid: dataRecord.uuid,
341 name: $('#name').val(),
342 category: $('#category').val(),
343 category_number: parseFloat($('#category_number').jqxNumberInput('decimal')),
344 style_letter: $('#style_letter').val(),
345 style_guide: $('#style_guide').val(),
346 type: $('#type').val(),
347 og_min: parseFloat($('#og_min').jqxNumberInput('decimal')),
348 og_max: parseFloat($('#og_max').jqxNumberInput('decimal')),
349 fg_min: parseFloat($('#fg_min').jqxNumberInput('decimal')),
350 fg_max: parseFloat($('#fg_max').jqxNumberInput('decimal')),
351 ibu_min: parseFloat($('#ibu_min').jqxNumberInput('decimal')),
352 ibu_max: parseFloat($('#ibu_max').jqxNumberInput('decimal')),
353 color_min: parseFloat($('#color_min').jqxNumberInput('decimal')),
354 color_max: parseFloat($('#color_max').jqxNumberInput('decimal')),
355 carb_min: parseFloat($('#carb_min').jqxNumberInput('decimal')),
356 carb_max: parseFloat($('#carb_max').jqxNumberInput('decimal')),
357 abv_min: parseFloat($('#abv_min').jqxNumberInput('decimal')),
358 abv_max: parseFloat($('#abv_max').jqxNumberInput('decimal')),
359 notes: $('#notes').val(),
360 profile: $('#profile').val(),
361 ingredients: $('#ingredients').val(),
362 examples: $('#examples').val()
363 };
364 if (editrow >= 0) {
365 $('#jqxgrid').jqxGrid('updaterow', rowID, row);
366 } else {
367 $('#jqxgrid').jqxGrid('addrow', null, row);
368 }
369 $('#popupWindow').jqxWindow('hide');
370 });
371 createDelElements();
372 });
373

mercurial