--- a/www/mon_fermenter.php Mon Jan 07 12:46:27 2019 +0100 +++ b/www/mon_fermenter.php Mon Jan 07 16:35:55 2019 +0100 @@ -1,149 +1,8 @@ <?php require_once($_SERVER['DOCUMENT_ROOT'].'/includes/global.inc.php'); -page_header('Hoofdmenu', NULL); -$uuid = $_GET["uuid"]; +page_header('Monitor Fermentation', 'mon_fermenter'); ?> - <script> - $(document).ready(function () { - - var gaugeoptions = { - min: -5, max: 35, width: 275, height: 275, - ranges: [{ startValue: -5, endValue: 0, style: { fill: '#3399FF', stroke: '#3399FF' }, endWidth: 10, startWidth: 10 }, - { startValue: 0, endValue: 16, style: { fill: '#00CC33', stroke: '#00CC33' }, endWidth: 10, startWidth: 10 }, - { startValue: 16, endValue: 24, style: { fill: '#FCA76A', stroke: '#FCA76A' }, endWidth: 10, startWidth: 10 }, - { startValue: 24, endValue: 35, style: { fill: '#FC6A6A', stroke: '#FC6A6A' }, endWidth: 10, startWidth: 10 }], - ticksMinor: { interval: 1, size: '5%' }, - ticksMajor: { interval: 5, size: '9%' }, - labels: { interval: 5 }, - style: { fill: '#eeeeee', stroke: '#666666' }, - value: 0, - colorScheme: 'scheme05', - animationDuration: 1200 - }; - var gaugeSmalloptions = { - min: -20, max: 25, width: 150, height: 150, - ranges: [{ startValue: -20, endValue: 0, startWidth: 5, endWidth: 5, style: { fill: '#3399FF', stroke: '#3399FF' }}, - { startValue: 0, endValue: 25, startWidth: 5, endWidth: 5, style: { fill: '#FC6A6A', stroke: '#FC6A6A' }}], - ticksMinor: { interval: 1, size: '5%' }, - ticksMajor: { interval: 5, size: '9%' }, - labels: { interval: 5 }, - style: { fill: '#eeeeee', stroke: '#666666' }, - value: 0, - colorScheme: 'scheme05', - animationDuration: 1200, - caption: { value: 'Chiller', position: 'bottom', offset: [0, 10] } - }; - - $("#gaugeContainer_air").jqxGauge( gaugeoptions ); - $("#gaugeContainer_air").jqxGauge( { caption: { value: 'Air', position: 'bottom', offset: [0, 10] }} ); - $("#gaugeContainer_beer").jqxGauge( gaugeoptions ); - $("#gaugeContainer_beer").jqxGauge( { caption: { value: 'Beer', position: 'bottom', offset: [0, 10] }} ); - $("#gaugeContainer_chiller").jqxGauge( gaugeSmalloptions ); - var uuid = "<?php echo $uuid; ?>"; - var url = "getfermenter.php?uuid='" + uuid + "'"; - var source = { - datatype: "json", - datafields: [ - { name: 'record', type: 'int' }, - { name: 'uuid', type: 'string' }, - { name: 'alias', type: 'string' }, - { name: 'node', type: 'string' }, - { name: 'online', type: 'bool' }, - { name: 'beercode', type: 'string' }, - { name: 'beername', type: 'string' }, - { name: 'air_address', type: 'string' }, - { name: 'air_state', type: 'string' }, - { name: 'air_temperature', type: 'float' }, - { name: 'beer_address', type: 'string' }, - { name: 'beer_state', type: 'string' }, - { name: 'beer_temperature', type: 'float' }, - { name: 'chiller_address', type: 'string' }, - { name: 'chiller_state', type: 'string' }, - { name: 'chiller_temperature', type: 'float' }, - { name: 'heater_address', type: 'string' }, - { name: 'heater_state', type: 'int' }, - { name: 'heater_usage', type: 'int' }, - { name: 'cooler_address', type: 'string' }, - { name: 'cooler_state', type: 'int' }, - { name: 'cooler_usage', type: 'int' }, - { name: 'fan_address', type: 'string' }, - { name: 'fan_state', type: 'int' }, - { name: 'fan_usage', type: 'int' }, - { name: 'light_address', type: 'string' }, - { name: 'light_state', type: 'int' }, - { name: 'light_usage', type: 'int' }, - { name: 'door_address', type: 'string' }, - { name: 'door_state', type: 'int' }, - { name: 'psu_address', type: 'string' }, - { name: 'psu_state', type: 'int' }, - { name: 'mode', type: 'string' }, - { name: 'alarm', type: 'int' }, - { name: 'setpoint_high', type: 'float' }, - { name: 'setpoint_low', type: 'float' }, - { name: 'profile_uuid', type: 'string' }, - { name: 'profile_name', type: 'string' }, - { name: 'profile_state', type: 'string' }, - { name: 'profile_precent', type: 'int' }, - { name: 'profile_inittemp_high', type: 'float' }, - { name: 'profile_inittemp_low', type: 'float' }, - { name: 'profile_steps', type: 'string' }, - { name: 'stage', type: 'string' } - ], - id: 'record', - url: url - }; - var dataAdapter = new $.jqx.dataAdapter(source, { - loadComplete: function (records) { - var record = dataAdapter.records[0]; - var oline = (record.online) ? "On-line" : "Off-line"; - var html = "<div id='fermenter_table'>"; - html += "<table style='width: 100%; padding: 10px;'>"; - html += "<tr><th colspan=2>Klimaatkast overzicht</th></tr>"; - html += "<tr><td>Uuid</td><td>" + record.uuid + "</td></tr>"; - html += "<tr><td>Systeem</td><td>" + record.node + "/" + record.alias + " " + oline + "</td></tr>"; - html += "<tr><td>Bier</td><td>" + record.beercode + " - " + record.beername + "</td></tr>"; - html += "<tr><td>Werking</td><td>" + record.mode + "</td></tr>"; - html += "<tr><td>Fase</td><td>" + record.stage + "</td></tr>" - html += "</<table>"; - html += "</div>"; - $("#ContentPanel").html(html); - - $('#gaugeContainer_air').jqxGauge({ value: record.air_temperature }); - if (record.online && (record.air_state == "OK")) { - $("#gaugeContainer_air").jqxGauge({ disabled: false }); - } else { - $("#gaugeContainer_air").jqxGauge({ disabled: true }); - } - $('#gaugeContainer_beer').jqxGauge({ value: record.beer_temperature }); - if (record.online && (record.beer_state == "OK")) { - $("#gaugeContainer_beer").jqxGauge({ disabled: false }); - } else { - $("#gaugeContainer_beer").jqxGauge({ disabled: true }); - } - $("#gaugeContainer_chiller").jqxGauge({ value: record.chiller_temperature }); - if (record.online && (record.chiller_state == "OK")) { - $("#gaugeContainer_chiller").jqxGauge({ disabled: false }); - } else { - $("#gaugeContainer_chiller").jqxGauge({ disabled: true }); - } - - html = "<div>SpH <span class='temperature NUM'>" + record.setpoint_high.toFixed(1) + "</span></div>"; - html += "<div>SpL <span class='temperature NUM'>" + record.setpoint_low.toFixed(1) + "</span></div>"; - html += "<div>Air <span class='temperature NUM'>" + record.air_temperature.toFixed(3) + "</span></div>"; - html += "<div>Beer <span class='temperature NUM'>" + record.beer_temperature.toFixed(3) + "</span></div>"; - $("#fermenter_tempdigits").html(html); - } - }); - - // Get the data immediatly and then at regular intervals to refresh. - dataAdapter.dataBind(); - setInterval(function(){ - dataAdapter.dataBind(); - }, 10000); - - }); - </script> <div id="MainPanel"> <div id="ContentPanel"></div> <div id='fermenter_thermometers'> @@ -152,6 +11,9 @@ <div id="gaugeContainer_chiller" style="float: left; margin-top: 15px;"></div> <div id="fermenter_tempdigits"></div> </div> + <div style="float: right; margin-top: 20px; margin-bottom: 5px;"> + <input style="margin-right: 600px;" type="button" id="FLog" value="Vergisting log" /> + </div> </div> <?php