www/js/profile_fermentation.js

changeset 186
a7c2c61a01ad
child 189
6470e5c6a001
equal deleted inserted replaced
185:4c25db9e8102 186:a7c2c61a01ad
1 /*****************************************************************************
2 * Copyright (C) 2019
3 *
4 * Michiel Broek <mbroek at mbse dot eu>
5 *
6 * This file is part of BMS
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 * Brewery Management System is distributed in the hope that it will be useful,
14 * but 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 var url = "includes/db_profile_fermentation.php";
49 // tooltips
50 $("#name").jqxTooltip({ content: 'De naam voor dit vergisting profiel.' });
51 $("#inittemp_lo").jqxTooltip({ content: 'De minimale begin temperatuur van dit profiel.' });
52 $("#inittemp_hi").jqxTooltip({ content: 'De maximale begin temperatuur van dit profiel.' });
53 // $("#fridgemode").jqxTooltip({ content: 'Wanneer deze actief is dan wordt geregeld als koelkast op de lucht temperatuur sensor in plaats van op de bier sensor.' });
54 $("#grid").jqxTooltip({ content: 'De maisch stappen in dit profiel.'});
55 // prepare the data
56 var source = {
57 datatype: "json",
58 cache: false,
59 datafields: [
60 { name: 'record', type: 'number' },
61 { name: 'uuid', type: 'string' },
62 { name: 'name', type: 'string' },
63 { name: 'inittemp_lo', type: 'float' },
64 { name: 'inittemp_hi', type: 'float' },
65 { name: 'fridgemode', type: 'bool' },
66 { name: 'totalsteps', type: 'int' },
67 { name: 'duration', type: 'int' },
68 { name: 'steps', type: 'array' }
69 ],
70 id: 'record',
71 url: url,
72 deleterow: function (rowid, commit) {
73 // synchronize with the server - send delete command
74 var data = "delete=true&" + $.param({ record: rowid });
75 $.ajax({
76 dataType: 'json',
77 url: url,
78 cache: false,
79 data: data,
80 success: function (data, status, xhr) {
81 // delete command is executed.
82 commit(true);
83 },
84 error: function (jqXHR, textStatus, errorThrown) {
85 commit(false);
86 }
87 });
88 },
89 addrow: function (rowid, rowdata, position, commit) {
90 var data = "insert=true&" + $.param(rowdata);
91 $.ajax({
92 dataType: 'json',
93 url: url,
94 cache: false,
95 data: data,
96 success: function (data, status, xhr) {
97 commit(true);
98 },
99 error: function(jqXHR, textStatus, errorThrown) {
100 commit(false);
101 }
102 });
103 },
104 updaterow: function (rowid, rowdata, commit) {
105 var data = "update=true&" + $.param(rowdata);
106 $.ajax({
107 dataType: 'json',
108 url: url,
109 cache: false,
110 data: data,
111 success: function (data, status, xhr) {
112 // update command is executed.
113 commit(true);
114 },
115 error: function(jqXHR, textStatus, errorThrown) {
116 commit(false);
117 }
118 });
119 }
120 };
121 var dataAdapter = new $.jqx.dataAdapter(source);
122
123 // Inline steps editor
124 var editsteps = function (data) {
125 var generaterow = function () {
126 var row = {};
127 row["name"] = "Stap 1";
128 row['steptime'] = 12;
129 row['resttime'] = 24;
130 row['target_lo'] = 22.0;
131 row['target_hi'] = 23.0;
132 row['fridgemode'] = 0;
133 return row;
134 }
135 var stepSource = {
136 localdata: data.steps,
137 datatype: "local",
138 datafields: [
139 { name: 'name', type: 'string' },
140 { name: 'steptime', type: 'float' },
141 { name: 'resttime', type: 'float' },
142 { name: 'target_lo', type: 'float' },
143 { name: 'target_hi', type: 'float' },
144 { name: 'fridgemode', type: 'int' }
145 ],
146 addrow: function (rowid, rowdata, position, commit) {
147 commit(true);
148 },
149 deleterow: function (rowid, commit) {
150 commit(true);
151 }
152 };
153 var stepAdapter = new $.jqx.dataAdapter(stepSource);
154 $("#grid").jqxGrid({
155 width: 800,
156 height: 330,
157 source: stepAdapter,
158 theme: theme,
159 selectionmode: 'singlerow',
160 editmode: 'selectedcell',
161 editable: true,
162 showtoolbar: true,
163 rendertoolbar: function (toolbar) {
164 var me = this;
165 var container = $("<div style='margin: 5px;'></div>");
166 toolbar.append(container);
167 container.append('<input style="margin-left: 100px;" id="addrowbutton" type="button" value="Nieuwe stap" />');
168 container.append('<input style="margin-left: 290px;" id="deleterowbutton" type="button" value="Verwijder stap" />');
169 $("#addrowbutton").jqxButton({ theme: theme, width: 150 });
170 $("#deleterowbutton").jqxButton({ theme: theme, width: 150 });
171 // create new row.
172 $("#addrowbutton").on('click', function () {
173 var datarow = generaterow();
174 var commit = $("#grid").jqxGrid('addrow', null, datarow);
175 });
176 // delete row.
177 $("#deleterowbutton").on('click', function () {
178 var selectedrowindex = $("#grid").jqxGrid('getselectedrowindex');
179 var rowscount = $("#grid").jqxGrid('getdatainformation').rowscount;
180 if (selectedrowindex >= 0 && selectedrowindex < rowscount) {
181 var id = $("#grid").jqxGrid('getrowid', selectedrowindex);
182 var commit = $("#grid").jqxGrid('deleterow', id);
183 }
184 });
185 },
186 columns: [
187 { text: 'Stap naam', datafield: 'name' },
188 { text: 'Min temperatuur', datafield: 'target_lo', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1',
189 validation: function (cell, value) {
190 if (value < 0 || value > 40) {
191 return { result: false, message: "De temperatuur moet tussen 0 en 40 zijn." };
192 }
193 return true;
194 }
195 },
196 { text: 'Max temperatuur', datafield: 'target_hi', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1',
197 validation: function (cell, value) {
198 if (value < 0 || value > 40) {
199 return { result: false, message: "De temperatuur moet tussen 0 en 40 zijn." };
200 }
201 return true;
202 }
203 },
204 { text: 'Koelkast', datafield: 'fridgemode', columntype: 'checkbox', width: 80 },
205 { text: 'Stap tijd', datafield: 'steptime', width: 80, align: 'right', cellsalign: 'right',
206 validation: function (cell, value) {
207 if (value < 0 || value > 14400) {
208 return { result: false, message: "De tijd moet tussen 0 en 14400 zijn." };
209 }
210 return true;
211 }
212 },
213 { text: 'Rust tijd', datafield: 'resttime', width: 80, align: 'right', cellsalign: 'right',
214 validation: function (cell, value) {
215 if (value < 0 || value > 14400) {
216 return { result: false, message: "De tijd moet tussen 0 en 14400 zijn." };
217 }
218 return true;
219 }
220 }
221 ]
222 });
223 // $("#grid").on('cellendedit', function (event) {
224 // $('#grid').jqxGrid('sortby', 'step_temp', 'asc');
225 // });
226 };
227
228 // initialize the input fields.
229 $("#name").jqxInput({ theme: theme, width: 640, height: 23 });
230 $("#inittemp_lo").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 110, height: 23, min: 0, max: 40, decimalDigits: 1, spinButtons: true, spinButtonsStep: 0.1 });
231 $("#inittemp_hi").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 110, height: 23, min: 0, max: 40, decimalDigits: 1, spinButtons: true, spinButtonsStep: 0.1 });
232 $("#fridgemode").jqxCheckBox({ theme: theme, height: 23, enableContainerClick: false });
233
234 var editrow = -1;
235 // initialize jqxGrid
236 $("#jqxgrid").jqxGrid({
237 width: 1280,
238 height: 630,
239 source: dataAdapter,
240 theme: theme,
241 showstatusbar: true,
242 localization: getLocalization(),
243 renderstatusbar: function (statusbar) {
244 var container = $("<div style='overflow: hidden; position: relative; margin: 5px;'></div>");
245 var addButton = $("<div style='float: right; margin-right: 15px;'><img style='position: relative; margin-top: 2px;' src='images/add.png'/><span style='margin-left: 4px; position: relative; top: -3px;'>Nieuw</span></div>");
246 container.append(addButton);
247 statusbar.append(container);
248 addButton.jqxButton({ theme: theme, width: 120, height: 20 });
249 // add new row.
250 addButton.click(function (event) {
251 editrow = -1;
252 $("#popupWindow").jqxWindow({ position: { x: 110, y: 40 } });
253 $("#name").val('');
254 dataRecord.uuid = '';
255 $("#inittemp_lo").val('20.0');
256 $("#inittemp_hi").val('20.0');
257 $("#fridgemode").val('0');
258 dataRecord.totalsteps = 0;
259 dataRecord.duration = 0;
260 editsteps('');
261 $("#popupWindow").jqxWindow('open');
262 });
263 },
264 filterable: true,
265 filtermode: 'excel',
266 columns: [
267 { text: 'Vergisting profiel', datafield: 'name' },
268 { text: 'Min. temperatuur', datafield: 'inittemp_lo', width: 150, align: 'right', cellsalign: 'right', cellsformat: 'f1' },
269 { text: 'Max. temperatuur', datafield: 'inittemp_hi', width: 150, align: 'right', cellsalign: 'right', cellsformat: 'f1' },
270 { text: 'Stappen', datafield: 'totalsteps', width: 80, align: 'right', cellsalign: 'right' },
271 { text: 'Tijdsduur', datafield: 'duration', width: 150, align: 'right', cellsalign: 'right',
272 cellsrenderer: function (row, columnfield, value, defaulthtml, columnproperties) {
273 //var rowData = $("#fermentableGrid").jqxGrid('getrowdata', row);
274 if (value < 24) {
275 var show = value+" uur";
276 } else {
277 var days = Math.floor(value / 24);
278 var hours = value % 24;
279 if (days == 1)
280 var show = days+" dag, "+hours+" uur";
281 else
282 var show = days+" dagen, "+hours+" uur";
283 }
284 return "<span style='margin: 3px; margin-top: 6px; float: "+columnproperties.cellsalign+"'>"+show+"</span>";
285 }
286 },
287 { text: 'Wijzig', datafield: 'Edit', width: 120, align: 'center', columntype: 'button', cellsrenderer: function () {
288 return "Wijzig";
289 }, buttonclick: function (row) {
290 // open the popup window when the user clicks a button.
291 editrow = row;
292 $("#popupWindow").jqxWindow({ position: { x: 110, y: 40 } });
293 // get the clicked row's data and initialize the input fields.
294 dataRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow);
295 $("#name").val(dataRecord.name);
296 $("#inittemp_lo").val(parseFloat(dataRecord.inittemp_lo));
297 $("#inittemp_hi").val(parseFloat(dataRecord.inittemp_hi));
298 $("#fridgemode").val(parseFloat(dataRecord.fridgemode));
299 editsteps(dataRecord);
300 // show the popup window.
301 $("#popupWindow").jqxWindow('open');
302 }
303 }
304 ]
305 });
306 // initialize the popup window and buttons.
307 $("#popupWindow").jqxWindow({
308 width: 1050,
309 height: 550,
310 resizable: false,
311 theme: theme,
312 isModal: true,
313 autoOpen: false,
314 cancelButton: $("#Cancel"),
315 modalOpacity: 0.40
316 });
317 $("#popupWindow").on('open', function () {
318 $("#name").jqxInput('selectAll');
319 });
320 $("#Delete").jqxButton({ template: "danger", width: '90px', theme: theme });
321 $("#Delete").click(function () {
322 if (editrow >= 0) {
323 // Open a popup to confirm this action.
324 $('#eventWindow').jqxWindow('open');
325 $("#delOk").click(function () {
326 var rowID = $('#jqxgrid').jqxGrid('getrowid', editrow);
327 $("#jqxgrid").jqxGrid('deleterow', rowID);
328 });
329 }
330 $("#popupWindow").jqxWindow('hide');
331 });
332 $("#Cancel").jqxButton({ template: "primary", width: '90px', theme: theme });
333 $("#Save").jqxButton({ template: "success", width: '90px', theme: theme });
334 // update the edited row when the user clicks the 'Save' button.
335 $("#Save").click(function () {
336 var steprows = $('#grid').jqxGrid('getrows');
337 var rowID = -1;
338 if (editrow >= 0) {
339 var rowID = $('#jqxgrid').jqxGrid('getrowid', editrow);
340 }
341 var row = {
342 record: rowID,
343 uuid: dataRecord.uuid,
344 name: $("#name").val(),
345 inittemp_lo: parseFloat($("#inittemp_lo").jqxNumberInput('decimal')),
346 inittemp_hi: parseFloat($("#inittemp_hi").jqxNumberInput('decimal')),
347 fridgemode: $("#fridgemode").val(),
348 steps: steprows
349 };
350 if (editrow >= 0) {
351 $('#jqxgrid').jqxGrid('updaterow', rowID, row);
352 } else {
353 $('#jqxgrid').jqxGrid('addrow', null, row);
354 }
355 $("#popupWindow").jqxWindow('hide');
356 location.reload( true ); // reload ourself.
357 });
358 createDelElements();
359 });
360

mercurial