comparison: www/js/profile_fermentation.js
www/js/profile_fermentation.js
- changeset 217
- 318aab371497
- parent 189
- 6470e5c6a001
- child 245
- 3649c3d31d15
equal
deleted
inserted
replaced
| 216:fda7286871f2 | 217:318aab371497 |
|---|---|
| 48 var url = "includes/db_profile_fermentation.php"; | 48 var url = "includes/db_profile_fermentation.php"; |
| 49 // tooltips | 49 // tooltips |
| 50 $("#name").jqxTooltip({ content: 'De naam voor dit vergisting profiel.' }); | 50 $("#name").jqxTooltip({ content: 'De naam voor dit vergisting profiel.' }); |
| 51 $("#inittemp_lo").jqxTooltip({ content: 'De minimale begin temperatuur van dit 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.' }); | 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 | 53 // prepare the data |
| 56 var source = { | 54 var source = { |
| 57 datatype: "json", | 55 datatype: "json", |
| 58 cache: false, | 56 cache: false, |
| 59 datafields: [ | 57 datafields: [ |
| 75 $.ajax({ | 73 $.ajax({ |
| 76 dataType: 'json', | 74 dataType: 'json', |
| 77 url: url, | 75 url: url, |
| 78 cache: false, | 76 cache: false, |
| 79 data: data, | 77 data: data, |
| 78 type: "POST", | |
| 80 success: function (data, status, xhr) { | 79 success: function (data, status, xhr) { |
| 81 // delete command is executed. | 80 // delete command is executed. |
| 82 commit(true); | 81 commit(true); |
| 83 }, | 82 }, |
| 84 error: function (jqXHR, textStatus, errorThrown) { | 83 error: function (jqXHR, textStatus, errorThrown) { |
| 91 $.ajax({ | 90 $.ajax({ |
| 92 dataType: 'json', | 91 dataType: 'json', |
| 93 url: url, | 92 url: url, |
| 94 cache: false, | 93 cache: false, |
| 95 data: data, | 94 data: data, |
| 95 type: "POST", | |
| 96 success: function (data, status, xhr) { | 96 success: function (data, status, xhr) { |
| 97 commit(true); | 97 commit(true); |
| 98 }, | 98 }, |
| 99 error: function(jqXHR, textStatus, errorThrown) { | 99 error: function(jqXHR, textStatus, errorThrown) { |
| 100 commit(false); | 100 commit(false); |
| 106 $.ajax({ | 106 $.ajax({ |
| 107 dataType: 'json', | 107 dataType: 'json', |
| 108 url: url, | 108 url: url, |
| 109 cache: false, | 109 cache: false, |
| 110 data: data, | 110 data: data, |
| 111 type: "POST", | |
| 111 success: function (data, status, xhr) { | 112 success: function (data, status, xhr) { |
| 112 // update command is executed. | 113 // update command is executed. |
| 113 commit(true); | 114 commit(true); |
| 114 }, | 115 }, |
| 115 error: function(jqXHR, textStatus, errorThrown) { | 116 error: function(jqXHR, textStatus, errorThrown) { |
| 164 var me = this; | 165 var me = this; |
| 165 var container = $("<div style='margin: 5px;'></div>"); | 166 var container = $("<div style='margin: 5px;'></div>"); |
| 166 toolbar.append(container); | 167 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: 100px;" id="addrowbutton" type="button" value="Nieuwe stap" />'); |
| 168 container.append('<input style="margin-left: 290px;" id="deleterowbutton" type="button" value="Verwijder stap" />'); | 169 container.append('<input style="margin-left: 290px;" id="deleterowbutton" type="button" value="Verwijder stap" />'); |
| 169 $("#addrowbutton").jqxButton({ theme: theme, width: 150 }); | 170 $("#addrowbutton").jqxButton({ template: "primary", theme: theme, width: 150 }); |
| 170 $("#deleterowbutton").jqxButton({ theme: theme, width: 150 }); | 171 $("#deleterowbutton").jqxButton({ template: "danger", theme: theme, width: 150 }); |
| 171 // create new row. | 172 // create new row. |
| 172 $("#addrowbutton").on('click', function () { | 173 $("#addrowbutton").on('click', function () { |
| 173 var datarow = generaterow(); | 174 var datarow = generaterow(); |
| 174 var commit = $("#grid").jqxGrid('addrow', null, datarow); | 175 var commit = $("#grid").jqxGrid('addrow', null, datarow); |
| 175 }); | 176 }); |
| 183 } | 184 } |
| 184 }); | 185 }); |
| 185 }, | 186 }, |
| 186 columns: [ | 187 columns: [ |
| 187 { text: 'Stap naam', datafield: 'name' }, | 188 { text: 'Stap naam', datafield: 'name' }, |
| 188 { text: 'Min temperatuur', datafield: 'target_lo', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1', | 189 { text: 'Min. °C', datafield: 'target_lo', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1', |
| 189 validation: function (cell, value) { | 190 validation: function (cell, value) { |
| 190 if (value < 0 || value > 40) { | 191 if (value < 0 || value > 40) { |
| 191 return { result: false, message: "De temperatuur moet tussen 0 en 40 zijn." }; | 192 return { result: false, message: "De temperatuur moet tussen 0 en 40 zijn." }; |
| 192 } | 193 } |
| 193 return true; | 194 return true; |
| 194 } | 195 } |
| 195 }, | 196 }, |
| 196 { text: 'Max temperatuur', datafield: 'target_hi', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1', | 197 { text: 'Max. °C', datafield: 'target_hi', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1', |
| 197 validation: function (cell, value) { | 198 validation: function (cell, value) { |
| 198 if (value < 0 || value > 40) { | 199 if (value < 0 || value > 40) { |
| 199 return { result: false, message: "De temperatuur moet tussen 0 en 40 zijn." }; | 200 return { result: false, message: "De temperatuur moet tussen 0 en 40 zijn." }; |
| 200 } | 201 } |
| 201 return true; | 202 return true; |
| 218 return true; | 219 return true; |
| 219 } | 220 } |
| 220 } | 221 } |
| 221 ] | 222 ] |
| 222 }); | 223 }); |
| 223 // $("#grid").on('cellendedit', function (event) { | |
| 224 // $('#grid').jqxGrid('sortby', 'step_temp', 'asc'); | |
| 225 // }); | |
| 226 }; | 224 }; |
| 227 | 225 |
| 228 // initialize the input fields. | 226 // initialize the input fields. |
| 229 $("#name").jqxInput({ theme: theme, width: 640, height: 23 }); | 227 $("#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 }); | 228 $("#inittemp_lo").jqxNumberInput( Spin1dec5 ); |
| 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 }); | 229 $("#inittemp_lo").jqxNumberInput({ max: 40 }); |
| 230 $("#inittemp_hi").jqxNumberInput( Spin1dec5 ); | |
| 231 $("#inittemp_hi").jqxNumberInput({ max: 40 }); | |
| 232 $("#fridgemode").jqxCheckBox({ theme: theme, height: 23, enableContainerClick: false }); | 232 $("#fridgemode").jqxCheckBox({ theme: theme, height: 23, enableContainerClick: false }); |
| 233 | 233 |
| 234 var editrow = -1; | 234 var editrow = -1; |
| 235 // initialize jqxGrid | 235 // initialize jqxGrid |
| 236 $("#jqxgrid").jqxGrid({ | 236 $("#jqxgrid").jqxGrid({ |
| 243 renderstatusbar: function (statusbar) { | 243 renderstatusbar: function (statusbar) { |
| 244 var container = $("<div style='overflow: hidden; position: relative; margin: 5px;'></div>"); | 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>"); | 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); | 246 container.append(addButton); |
| 247 statusbar.append(container); | 247 statusbar.append(container); |
| 248 addButton.jqxButton({ theme: theme, width: 120, height: 20 }); | 248 addButton.jqxButton({ theme: theme, width: 90, height: 20 }); |
| 249 // add new row. | 249 // add new row. |
| 250 addButton.click(function (event) { | 250 addButton.click(function (event) { |
| 251 editrow = -1; | 251 editrow = -1; |
| 252 $("#popupWindow").jqxWindow({ position: { x: 110, y: 40 } }); | 252 $("#name").val('Nieuw vergist profiel'); |
| 253 $("#name").val(''); | |
| 254 dataRecord.uuid = ''; | 253 dataRecord.uuid = ''; |
| 255 $("#inittemp_lo").val('20.0'); | 254 $("#inittemp_lo").val(20.0); |
| 256 $("#inittemp_hi").val('20.0'); | 255 $("#inittemp_hi").val(20.0); |
| 257 $("#fridgemode").val('0'); | 256 $("#fridgemode").val(0); |
| 258 dataRecord.totalsteps = 0; | 257 dataRecord.totalsteps = 0; |
| 259 dataRecord.duration = 0; | 258 dataRecord.duration = 0; |
| 260 editsteps(''); | 259 editsteps(''); |
| 261 $("#popupWindow").jqxWindow('open'); | 260 $("#popupWindow").jqxWindow('open'); |
| 262 }); | 261 }); |
| 263 }, | 262 }, |
| 264 filterable: true, | 263 filterable: false, |
| 265 filtermode: 'excel', | |
| 266 columns: [ | 264 columns: [ |
| 267 { text: 'Vergisting profiel', datafield: 'name' }, | 265 { text: 'Vergisting profiel', datafield: 'name' }, |
| 268 { text: 'Min. temperatuur', datafield: 'inittemp_lo', width: 150, align: 'right', cellsalign: 'right', cellsformat: 'f1' }, | 266 { text: 'Min. start °C', 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' }, | 267 { text: 'Max. start °C', datafield: 'inittemp_hi', width: 150, align: 'right', cellsalign: 'right', cellsformat: 'f1' }, |
| 270 { text: 'Stappen', datafield: 'totalsteps', width: 80, align: 'right', cellsalign: 'right' }, | 268 { text: 'Stappen', datafield: 'totalsteps', width: 80, align: 'right', cellsalign: 'right' }, |
| 271 { text: 'Tijdsduur', datafield: 'duration', width: 150, align: 'right', cellsalign: 'right', | 269 { text: 'Tijdsduur', datafield: 'duration', width: 150, align: 'right', cellsalign: 'right', |
| 272 cellsrenderer: function (row, columnfield, value, defaulthtml, columnproperties) { | 270 cellsrenderer: function (row, columnfield, value, defaulthtml, columnproperties) { |
| 273 //var rowData = $("#fermentableGrid").jqxGrid('getrowdata', row); | 271 //var rowData = $("#fermentableGrid").jqxGrid('getrowdata', row); |
| 274 if (value < 24) { | 272 if (value < 24) { |
| 282 var show = days+" dagen, "+hours+" uur"; | 280 var show = days+" dagen, "+hours+" uur"; |
| 283 } | 281 } |
| 284 return "<span style='margin: 3px; margin-top: 6px; float: "+columnproperties.cellsalign+"'>"+show+"</span>"; | 282 return "<span style='margin: 3px; margin-top: 6px; float: "+columnproperties.cellsalign+"'>"+show+"</span>"; |
| 285 } | 283 } |
| 286 }, | 284 }, |
| 287 { text: 'Wijzig', datafield: 'Edit', width: 120, align: 'center', columntype: 'button', cellsrenderer: function () { | 285 { text: 'Wijzig', datafield: 'Edit', width: 100, align: 'center', columntype: 'button', cellsrenderer: function () { |
| 288 return "Wijzig"; | 286 return "Wijzig"; |
| 289 }, buttonclick: function (row) { | 287 }, buttonclick: function (row) { |
| 290 // open the popup window when the user clicks a button. | |
| 291 editrow = row; | 288 editrow = row; |
| 292 $("#popupWindow").jqxWindow({ position: { x: 110, y: 40 } }); | |
| 293 // get the clicked row's data and initialize the input fields. | 289 // get the clicked row's data and initialize the input fields. |
| 294 dataRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow); | 290 dataRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow); |
| 295 $("#name").val(dataRecord.name); | 291 $("#name").val(dataRecord.name); |
| 296 $("#inittemp_lo").val(parseFloat(dataRecord.inittemp_lo)); | 292 $("#inittemp_lo").val(parseFloat(dataRecord.inittemp_lo)); |
| 297 $("#inittemp_hi").val(parseFloat(dataRecord.inittemp_hi)); | 293 $("#inittemp_hi").val(parseFloat(dataRecord.inittemp_hi)); |
| 305 }); | 301 }); |
| 306 // initialize the popup window and buttons. | 302 // initialize the popup window and buttons. |
| 307 $("#popupWindow").jqxWindow({ | 303 $("#popupWindow").jqxWindow({ |
| 308 width: 1050, | 304 width: 1050, |
| 309 height: 550, | 305 height: 550, |
| 306 position: { x: 110, y: 30 }, | |
| 310 resizable: false, | 307 resizable: false, |
| 311 theme: theme, | 308 theme: theme, |
| 312 isModal: true, | 309 isModal: true, |
| 313 autoOpen: false, | 310 autoOpen: false, |
| 314 cancelButton: $("#Cancel"), | 311 cancelButton: $("#Cancel"), |
