www/mon_co2meter.php

Mon, 18 May 2020 11:00:59 +0200

author
Michiel Broek <mbroek@mbse.eu>
date
Mon, 18 May 2020 11:00:59 +0200
changeset 679
48f8f3fce7c0
parent 505
c09b67fd8323
permissions
-rw-r--r--

Added reconnecting-websocket.js to automatic reconnect the websocket if the connection is lost. Usefull for mobile devices that go to sleep after a while. Changed mon_fermenters to use websockets instead of polling. Fixed wrong temperature color ranges on the fermenter monior. Increased the websocket receive buffer to 2048. In cannot overflow, but larger messages are chunked and the application does not handle these split messages. Needs termferm 0.9.9 or newer.

<?php
require_once($_SERVER['DOCUMENT_ROOT'].'/includes/global.inc.php');
page_header('Monitor CO2 meters', 'mon_co2meter');
?>

   <div id="co2meter">

    <div style="float: left; width: 970px;">
     <div id="co2meter_table">
      <div id="co2meter_info">
       <table style='width: 100%; padding: 10px;'>
	<col width="20%">
	<col width="40%">
        <col width="40%">
        <tr><th colspan=3>CO2 meter overzicht</th></tr>
        <tr><td colspan=3>&nbsp;</td></tr>
	<tr style="height: 25px;">
         <td>Uuid</td>
         <td colspan="2"><div id="info_uuid"></div></td>
        </tr>
	<tr style="height: 25px;">
         <td>Systeem</td>
	 <td><div id="info_system"></div></td>
         <td><div id="info_online"></div></td>
        </tr>
	<tr style="height: 25px;">
         <td>Code en bier</td>
         <td><div id="info_beer"></div></td>
         <td><div id="select_beer"></div></td>
        </tr>
	<tr style="height: 25px;">
         <td>Werking</td>
         <td colspan="2"><div id="info_mode"></div></td>
        </tr>
       </table>
      </div>
     </div>
     <div id='co2meter_meters'>
      <div id="gaugeContainer_temperature" style='float: left; margin-top: 10px; margin-left: 60px;'></div>
      <div id="gaugeContainer_pressure" style="float: right; margin-top: 10px; margin-right: 60px;"></div>
     </div>
    </div> <!-- End left side -->

    <div style="float: right; width: 295px;">
     <div id="co2meter_panel_top">
      <div id="co2meter_powerled"></div>
      <div id="co2meter_alarmled"></div>
     </div> <!-- co2meter_panel_top -->

     <div id="co2meter_panel_display">
      <div id="co2meter_display">
      </div>
      <div id="co2meter_display">
      </div>
     </div> <!-- co2meter_panel_display -->

     <div id="co2meter_panel_control">
     </div> <!-- co2meter_panel_control -->

     <div id="co2meter_panel_buttons">
      <input style="margin-top: 20px; margin-left: 70px;" type="button" id="FLog" value="CO2 log" />
     </div> <!-- co2meter_panel_buttons -->
    </div> <!-- End right side -->
   </div>

<?php
page_footer();
?>

mercurial