comparison: www/js/log_fermentation.js
www/js/log_fermentation.js
- changeset 527
- 9dfefad3ae1d
- parent 494
- af28ebe4a779
- child 602
- 10b61aacb1c1
equal
deleted
inserted
replaced
| 526:2991acd35cdb | 527:9dfefad3ae1d |
|---|---|
| 19 * along with ThermFerm; see the file COPYING. If not, write to the Free | 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. | 20 * Software Foundation, 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA. |
| 21 *****************************************************************************/ | 21 *****************************************************************************/ |
| 22 | 22 |
| 23 | 23 |
| 24 $(document).ready(function () { | 24 $(document).ready(function() { |
| 25 | 25 |
| 26 $('#jqxMenu').jqxMenu('destroy'); | 26 $('#jqxMenu').jqxMenu('destroy'); |
| 27 | 27 |
| 28 $("#jqxLoader").jqxLoader({ | 28 $('#jqxLoader').jqxLoader({ |
| 29 width: 250, | 29 width: 250, |
| 30 height: 150, | 30 height: 150, |
| 31 isModal: true, | 31 isModal: true, |
| 32 text: "Opmaken grafiek ...", | 32 text: 'Opmaken grafiek ...', |
| 33 theme: theme | 33 theme: theme |
| 34 }); | 34 }); |
| 35 $('#jqxLoader').jqxLoader('open'); | 35 $('#jqxLoader').jqxLoader('open'); |
| 36 | 36 |
| 37 function getExportServer() { | 37 function getExportServer() { |
| 38 return "https://www.jqwidgets.com/export_server/export.php"; | 38 return 'https://www.jqwidgets.com/export_server/export.php'; |
| 39 } | 39 } |
| 40 | 40 |
| 41 var sourceA = { | 41 var sourceA = { |
| 42 datatype: "json", | 42 datatype: 'json', |
| 43 datafields: [ | 43 datafields: [ |
| 44 { name: "date", type: "date", format: "yyyy-MM-dd HH:mm" }, | 44 { name: 'date', type: 'date', format: 'yyyy-MM-dd HH:mm' }, |
| 45 { name: "air", type: "float" }, | 45 { name: 'air', type: 'float' }, |
| 46 { name: "beer", type: "float" }, | 46 { name: 'beer', type: 'float' }, |
| 47 { name: "chiller", type: "float" }, | 47 { name: 'chiller', type: 'float' }, |
| 48 { name: "room", type: "float" }, | 48 { name: 'room', type: 'float' }, |
| 49 { name: "tlo", type: "float" }, | 49 { name: 'tlo', type: 'float' }, |
| 50 { name: "thi", type: "float" }, | 50 { name: 'thi', type: 'float' }, |
| 51 { name: "heater", type: "int" }, | 51 { name: 'heater', type: 'int' }, |
| 52 { name: "cooler", type: "int" }, | 52 { name: 'cooler', type: 'int' }, |
| 53 { name: "event", type: "string" } | 53 { name: 'event', type: 'string' } |
| 54 ], | 54 ], |
| 55 url: 'getfermentlog.php?code=' + my_code + '&name=' + my_name | 55 url: 'getfermentlog.php?code=' + my_code + '&name=' + my_name |
| 56 }, | 56 }, |
| 57 dataAdapter = new $.jqx.dataAdapter(sourceA, { | 57 dataAdapter = new $.jqx.dataAdapter(sourceA, { |
| 58 autoBind: true, | 58 autoBind: true, |
| 59 async: false, | 59 async: false, |
| 60 loadComplete: function () { | 60 loadComplete: function() { |
| 61 $('#jqxLoader').jqxLoader('close'); | 61 $('#jqxLoader').jqxLoader('close'); |
| 62 }, | 62 }, |
| 63 loadError: function (jqXHR, status, error) { | 63 loadError: function(jqXHR, status, error) { |
| 64 } | 64 } |
| 65 }), | 65 }), |
| 66 settings = { | 66 settings = { |
| 67 title: my_code + ' "' + my_name + '"', | 67 title: my_code + ' "' + my_name + '"', |
| 68 description: "", | 68 description: '', |
| 69 source: dataAdapter, | 69 source: dataAdapter, |
| 70 xAxis: { | 70 xAxis: { |
| 71 dataField: 'date', | 71 dataField: 'date', |
| 72 type: 'date', | 72 type: 'date', |
| 73 formatFunction: function (value) { | 73 formatFunction: function(value) { |
| 74 return value.getDate() + '-' + (value.getMonth() + 1) + '-' + value.getFullYear(); | 74 return value.getDate() + '-' + (value.getMonth() + 1) + '-' + value.getFullYear(); |
| 75 }, | 75 }, |
| 76 toolTipFormatFunction: function (value) { | 76 toolTipFormatFunction: function(value) { |
| 77 var h = value.getHours(), | 77 var h = value.getHours(), m = value.getMinutes(); |
| 78 m = value.getMinutes(); | 78 return value.getDate() + '-' + (value.getMonth() + 1) + '-' + value.getFullYear() + |
| 79 return value.getDate() + '-' + (value.getMonth() + 1) + '-' + value.getFullYear() | 79 ' ' + (h < 10 ? '0' + h : h) + ':' + (m < 10 ? '0' + m : m); |
| 80 + ' ' + (h < 10 ? '0' + h : h) + ':' + (m < 10 ? '0' + m : m); | 80 }, |
| 81 }, | 81 textRotationAngle: 45, |
| 82 textRotationAngle: 45, | 82 howGridLines: false, |
| 83 howGridLines: false, | 83 rangeSelector: { |
| 84 rangeSelector: { | 84 size: 90, |
| 85 size: 90, | 85 dataField: 'beer', |
| 86 dataField: 'beer', | 86 serieType: 'line', |
| 87 serieType: 'line', | 87 gridLines: {visible: false}, |
| 88 gridLines: {visible: false}, | 88 } |
| 89 } | 89 }, |
| 90 }, | 90 colorScheme: 'scheme01', |
| 91 colorScheme: 'scheme01', | 91 seriesGroups: [ |
| 92 seriesGroups: [ | 92 { |
| 93 { | 93 type: 'area', |
| 94 type: "area", | 94 valueAxis: { |
| 95 valueAxis: { | 95 minValue: 0, |
| 96 minValue: 0, | 96 maxValue: 100, |
| 97 maxValue: 100, | 97 displayValueAxis: false, |
| 98 displayValueAxis: false, | 98 description: 'Verwarm/Koel %' |
| 99 description: "Heat/Cool %" | 99 }, |
| 100 }, | 100 series: [ |
| 101 series: [ | 101 { dataField: 'cooler', lineWidth: 1, displayText: 'Koel %', opacity: 0.4 }, |
| 102 { dataField: "cooler", lineWidth: 1, displayText: "Cool %", opacity: 0.4 }, | 102 { dataField: 'heater', lineWidth: 1, displayText: 'Verwarm %', opacity: 0.3 } |
| 103 { dataField: "heater", lineWidth: 1, displayText: "Heat %", opacity: 0.3 } | 103 ] |
| 104 ] | 104 }, |
| 105 }, | 105 { |
| 106 { | 106 type: 'spline', |
| 107 type: 'spline', | 107 valueAxis: { |
| 108 valueAxis: { | 108 minValue: 0, |
| 109 minValue: 0, | 109 description: 'Graden C' |
| 110 description: 'Graden C' | 110 }, |
| 111 }, | 111 series: [ |
| 112 series: [ | 112 { dataField: 'air', lineWidth: 1, displayText: 'Lucht' }, |
| 113 { dataField: "air", lineWidth: 1, displayText: "Air" }, | 113 { dataField: 'beer', lineWidth: 2, displayText: 'Bier' }, |
| 114 { dataField: "beer", lineWidth: 2, displayText: "Beer" }, | 114 { dataField: 'tlo', lineWidth: 1, displayText: 'Doel laag', opacity: 0.7 }, |
| 115 { dataField: "tlo", lineWidth: 1, displayText: "Target Lo", opacity: 0.7 }, | 115 { dataField: 'thi', lineWidth: 1, displayText: 'Doel hoog', opacity: 0.7 }, |
| 116 { dataField: "thi", lineWidth: 1, displayText: "Target Hi", opacity: 0.7 }, | 116 { dataField: 'room', lineWidth: 1, displayText: 'Ruimte', opacity: 0.5 }, |
| 117 { dataField: "room", lineWidth: 1, displayText: "Room", opacity: 0.5 }, | 117 { dataField: 'chiller', lineWidth: 1, displayText: 'Koeler', color: '#0000bb' } |
| 118 { dataField: "chiller", lineWidth: 1, displayText: "Chiller", color: '#0000bb' } | 118 ] |
| 119 ] | 119 } |
| 120 } | 120 ] |
| 121 ] | 121 }; |
| 122 }; | 122 $('#fermenter_chart').jqxChart(settings); |
| 123 $("#fermenter_chart").jqxChart(settings); | |
| 124 | 123 |
| 125 $("#print").click(function () { | 124 $('#print').click(function() { |
| 126 var content = $("#fermenter_chart")[0].outerHTML, | 125 var content = $('#fermenter_chart')[0].outerHTML, |
| 127 newWindow = window.open("", "", "width=865, height=425"), | 126 newWindow = window.open('', '', 'width=865, height=425'), |
| 128 document = newWindow.document.open(), | 127 document = newWindow.document.open(), |
| 129 pageContent = | 128 pageContent = |
| 130 '<!DOCTYPE html>' + | 129 '<!DOCTYPE html>' + |
| 131 '<html>' + | 130 '<html>' + |
| 132 '<head>' + | 131 '<head>' + |
| 133 '<link rel="stylesheet" href="jqwidgets/styles/jqx.base.css" type="text/css" />' + | 132 '<link rel="stylesheet" href="jqwidgets/styles/jqx.base.css" type="text/css" />' + |
| 134 '<meta charset="utf-8" />' + | 133 '<meta charset="utf-8" />' + |
| 135 '<title>' + my_code + ' ' + my_name + ' vergisting</title>' + | 134 '<title>' + my_code + ' ' + my_name + ' vergisting</title>' + |
| 136 '</head>' + | 135 '</head>' + |
| 137 '<body>' + content + '</body></html>'; | 136 '<body>' + content + '</body></html>'; |
| 138 document.write(pageContent); | 137 document.write(pageContent); |
| 139 document.close(); | 138 document.close(); |
| 140 newWindow.print(); | 139 newWindow.print(); |
| 141 }); | 140 }); |
| 142 $("#print").jqxButton({ template: "primary", width: 125, theme: theme }); | 141 $('#print').jqxButton({ template: 'primary', width: 125, theme: theme }); |
| 143 | 142 |
| 143 $('#pdfButton').click(function() { | |
| 144 $('#fermenter_chart').jqxChart('saveAsPDF', 'vergisting_' + my_code + '.pdf', getExportServer()); | |
| 145 }); | |
| 146 $('#pdfButton').jqxButton({ template: 'primary', width: 125, theme: theme }); | |
| 144 | 147 |
| 145 $("#pdfButton").click(function () { | 148 $('#pngButton').click(function() { |
| 146 $("#fermenter_chart").jqxChart("saveAsPDF", "vergisting_"+my_code+".pdf", getExportServer()); | 149 $('#fermenter_chart').jqxChart('saveAsPNG', 'vergisting_' + my_code + '.png', getExportServer()); |
| 147 }); | 150 }); |
| 148 $("#pdfButton").jqxButton({ template: "primary", width: 125, theme: theme }); | 151 $('#pngButton').jqxButton({ template: 'primary', width: 125, theme: theme }); |
| 149 | 152 |
| 150 $("#pngButton").click(function () { | 153 $('#Close').jqxButton({ template: 'success', width: 125, theme: theme }); |
| 151 $("#fermenter_chart").jqxChart("saveAsPNG", "vergisting_"+my_code+".png", getExportServer()); | 154 $('#Close').click(function() { |
| 152 }); | 155 window.close(); |
| 153 $("#pngButton").jqxButton({ template: "primary", width: 125, theme: theme }); | 156 }); |
| 154 | |
| 155 $("#Close").jqxButton({ template: "success", width: 125, theme: theme }); | |
| 156 $("#Close").click(function () { | |
| 157 window.close(); | |
| 158 }); | |
| 159 }); | 157 }); |
| 160 | 158 |
