# HG changeset patch # User Michiel Broek # Date 1537646929 -7200 # Node ID 12c5eae75d1e21b93dfb8f5639a8f80b1c1a4516 # Parent 3469979f83be4f2a4d9283d55adc8a7eb66281e4 Added inline mash steps editor framework, the rough parts are ready. diff -r 3469979f83be -r 12c5eae75d1e www/js/recipes.js --- a/www/js/recipes.js Sat Sep 22 19:14:02 2018 +0200 +++ b/www/js/recipes.js Sat Sep 22 22:08:49 2018 +0200 @@ -858,6 +858,139 @@ }; // editWater = function (data) { // inline mash editor + var editMash = function (data) { + var generaterow = function () { + var row = {}; + row["step_name"] = "Stap 1"; + row["step_type"] = "Infusion"; + row["step_infuse_amount"] = 15; + row["step_temp"] = 62.0; + row['step_time'] = 20.0; + row['ramp_time'] = 1.0; + row['end_temp'] = 62.0; + return row; + } + var mashSource = { + localdata: data.mashs, + datatype: "local", + cache: false, + datafields: [ + { name: 'step_name', type: 'string' }, + { name: 'step_type', type: 'string' }, + { name: 'step_infuse_amount', type: 'float' }, + { name: 'step_temp', type: 'float' }, + { name: 'step_time', type: 'float' }, + { name: 'ramp_time', type: 'float' }, + { name: 'end_temp', type: 'float' } + ], + addrow: function (rowid, rowdata, position, commit) { + commit(true); + }, + deleterow: function (rowid, commit) { + commit(true); + } + }; + var mashAdapter = new $.jqx.dataAdapter(mashSource); + // dropdownlist datasource from profile_mash + var mashUrl = "include/db_profile_mash.php"; + var mashInvSource = { + datatype: "json", + datafields: [ + { name: 'record', type: 'number' }, + { name: 'name', type: 'string' }, + { name: 'steps', type: 'array' } + ], + url: mashUrl, + async: true + }; + var mashlist = new $.jqx.dataAdapter(mashInvSource); + + $("#mashGrid").jqxGrid({ + width: 960, + height: 400, + source: mashAdapter, + theme: theme, + selectionmode: 'singlerow', + editmode: 'selectedrow', + editable: true, + localization: getLocalization(), + showtoolbar: true, + rendertoolbar: function (toolbar) { + var me = this; + var container = $("
"); + toolbar.append(container); + container.append(''); + container.append(''); + $("#saddrowbutton").jqxButton({ theme: theme, height: 27, width: 150 }); + $("#saddrowbutton").on('click', function () { + var datarow = generaterow(); + var commit = $("#mashGrid").jqxGrid('addrow', null, datarow); + }); + // delete selected yeast. + $("#sdeleterowbutton").jqxButton({ theme: theme, height: 27, width: 150 }); + $("#sdeleterowbutton").on('click', function () { + var selectedrowindex = $("#mashGrid").jqxGrid('getselectedrowindex'); + var rowscount = $("#mashGrid").jqxGrid('getdatainformation').rowscount; + if (selectedrowindex >= 0 && selectedrowindex < rowscount) { + var id = $("#mashGrid").jqxGrid('getrowid', selectedrowindex); + var commit = $("#mashGrid").jqxGrid('deleterow', id); + } + }); + }, + columns: [ + { text: 'Stap naam', datafield: 'step_name' }, + { text: 'Stap type', datafield: 'step_type', width: 110, columntype: 'dropdownlist', + createeditor: function (row, cellvalue, editor, celltext, cellwidth, cellheight) { + var dataSource = [ "Infusion", "Temperature", "Decoction" ]; + editor.jqxDropDownList({ source: dataSource, dropDownHeight: 105 }); + } + }, + { text: 'Temperatuur', datafield: 'step_temp', width: 80, align: 'right', cellsalign: 'right', cellsformat: 'f1', + validation: function (cell, value) { + if (value < 35 || value > 80) { + return { result: false, message: "De temperatuur moet tussen 35 en 80 zijn." }; + } + return true; + } + }, + { text: 'Eind', datafield: 'end_temp', width: 80, align: 'right', cellsalign: 'right', cellsformat: 'f1', + validation: function (cell, value) { + if (value < 35 || value > 80) { + return { result: false, message: "De temperatuur moet tussen 35 en 80 zijn." }; + } + return true; + } + }, + { text: 'Tijd', datafield: 'step_time', width: 70, align: 'right', cellsalign: 'right', + validation: function (cell, value) { + if (value < 1 || value > 360) { + return { result: false, message: "De tijd moet tussen 1 en 360 zijn." }; + } + return true; + } + }, + { text: 'Stap', datafield: 'ramp_time', width: 70, align: 'right', cellsalign: 'right', + validation: function (cell, value) { + if (value < 1 || value > 60) { + return { result: false, message: "De tijd moet tussen 1 en 60 zijn." }; + } + return true; + } + }, + { text: 'Infuse', datafield: 'step_infuse_amount', width: 70, align: 'right', cellsalign: 'right', + validation: function (cell, value) { + if (value < 0 || value > 60) { + return { result: false, message: "De waarde moet tussen 0 en 60 zijn." }; + } + return true; + } + } + ] + }); + $("#mashGrid").on('cellendedit', function (event) { + $('#mashGrid').jqxGrid('sortby', 'step_temp', 'asc'); + }); + }; // initialize the input fields. var srcType = [ "All Grain", "Partial Mash", "Extract" ]; @@ -926,6 +1059,7 @@ editMisc(''); editYeast(''); editWater(''); + editMash(''); $("#popupWindow").jqxWindow('open'); }); }, @@ -972,6 +1106,7 @@ editMisc(dataRecord); editYeast(dataRecord); editWater(dataRecord); + editMash(dataRecord); // show the popup window. $("#popupWindow").jqxWindow('open'); } @@ -1025,6 +1160,7 @@ var miscrow = $('#miscGrid').jqxGrid('getrows'); var yeastrow = $('#yeastGrid').jqxGrid('getrows'); var waterrow = $('#waterGrid').jqxGrid('getrows'); + var mashrow = $('#mashGrid').jqxGrid('getrows'); if (editrow >= 0) { var rowRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow); var rowID = $('#jqxgrid').jqxGrid('getrowid', editrow); @@ -1064,7 +1200,8 @@ hops: hoprow, miscs: miscrow, yeasts: yeastrow, - waters: waterrow + waters: waterrow, + mashs: mashrow }; $('#jqxgrid').jqxGrid('updaterow', rowID, row); } else { @@ -1105,7 +1242,8 @@ hops: hoprow, miscs: miscrow, yeasts: yeastrow, - waters: waterrow + waters: waterrow, + mashs: mashrow }; $('#jqxgrid').jqxGrid('addrow', null, newrow); }