Mercurial > bms / changeset

--- a/www/css/style.css	Tue Jan 08 21:54:19 2019 +0100
+++ b/www/css/style.css	Wed Jan 09 16:19:26 2019 +0100
@@ -111,9 +111,9 @@
  * |+-------------++--------------+|
  * +-------------------------------+
  * +---------panel_display---------+
- * |+--------++---------++--------+|
- * || disp 1 || disp 2  || disp 3 ||
- * |+--------++---------++--------+|
+ * |+-------------++--------------+|
+ * ||  display 1  ||  display 2   ||
+ * |+-------------++--------------+|
  * +-------------------------------+
  * +---------panel_control---------+
  * |+--------++---------++--------+|
@@ -163,17 +163,10 @@
 margin-left: 42px;
 }
 
-#fermenter_mode_control {
-width: 148px;
-height: 110px;
-float: left;
-margin-top: 10px;
-background-color: #ddd;
-}
 
 #fermenter_panel_display {
   width: 280px;
-  height: 80px;
+  height: 70px;
   float: right;
   margin: 5px;
   background-color: #252526;
@@ -182,45 +175,13 @@
   border-radius: 5px 5px 5px 5px;
   margin-bottom: 3px;
 }
-
-#fermenter_display1 {
-width: 93px;
-height: 76px;
-float: left;
-text-align: center;
-margin-top: 7px;
-}
-
-#fermenter_display2 {
-width: 93px;
-height: 76px;
-float: left;
-text-align: center;
-margin-top: 7px;
+#fermenter_display {
+  width: 140px;
+  height: 70px;
+  float: left;
+  text-align: center;
 }
 
-#fermenter_display3 {
-width: 93px;
-height: 76px;
-float: left;
-text-align: center;
-margin-top: 7px;
-}
-
-.dtemp {
-  font-weight: bold;
-  color: yellow;
-}
-
-.ltemp {
-  font-weight: bold;
-  color: green;
-}
-
-.htemp {
-  font-weight: bold;
-  color: red;
-}
 
 #fermenter_panel_control {
   width: 280px;

--- a/www/jqwidgets/styles/jqx.ui-mbse.css	Tue Jan 08 21:54:19 2019 +0100
+++ b/www/jqwidgets/styles/jqx.ui-mbse.css	Wed Jan 09 16:19:26 2019 +0100
@@ -254,3 +254,12 @@
     margin-left: -4px;
     margin-right: 4px;
  }
+.jqx-gauge-caption
+{
+    fill: #2226FF;
+    color: #2229FF;
+    font-size: 15px;
+    font-family: Verdana;
+    font-weight:bold;
+}
+

--- a/www/js/mon_fermenter.js	Tue Jan 08 21:54:19 2019 +0100
+++ b/www/js/mon_fermenter.js	Wed Jan 09 16:19:26 2019 +0100
@@ -23,12 +23,13 @@
 
 $(document).ready(function () {
 
-	var	bname = '';
-	var	bcode = '';
+	var	record = {};
+	var	newBase = false;
+	var	newProduct = false;
+	var	newSwitch = false;
+	var	newProfile = false;
 	var	yl = 12;	// Normal yeast temp range
 	var	yh = 24;
-	var	bstage = '';
-	var	bmode = '';
 
 	var gaugeoptions = {
 		min: 0, max: 40, width: 375, height: 375,
@@ -57,6 +58,12 @@
 		animationDuration: 1200,
 		caption: { value: 'Chiller', position: 'bottom', offset: [0, 10] }
 	};
+	$("#gaugeContainer_air").jqxGauge( gaugeoptions );
+	$("#gaugeContainer_air").jqxGauge( { caption: { value: 'Air: 00.000' }} );
+	$("#gaugeContainer_beer").jqxGauge( gaugeoptions );
+	$("#gaugeContainer_beer").jqxGauge( { caption: { value: 'Beer: 00.000' }} );
+	$("#gaugeContainer_chiller").jqxGauge( gaugeSmalloptions );
+
 	var switchoptions = {
 		height: 68,
 		width: 35,
@@ -64,26 +71,34 @@
 		thumbSize:'50%',
 		orientation: 'vertical'
 	};
-
-	srcMode = [ "OFF", "NONE", "FRIDGE", "BEER", "PROFILE" ];
-	srcStage = [ "PRIMARY", "SECONDARY", "TERTIARY", "CARBONATION" ];
-	$("#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 );
 	$("#fermenter_toggle1").jqxSwitchButton( switchoptions );
 	$("#fermenter_toggle2").jqxSwitchButton( switchoptions );
 	$("#fermenter_toggle3").jqxSwitchButton( switchoptions );
 
+	srcMode = [ "OFF", "NONE", "FRIDGE", "BEER", "PROFILE" ];
+	srcStage = [ "PRIMARY", "SECONDARY", "TERTIARY", "CARBONATION" ];
 	$("#info_mode").jqxDropDownList({ theme: theme, source: srcMode, width: 100, height: 23, dropDownHeight: 156 });
 	$("#info_stage").jqxDropDownList({ theme: theme, source: srcStage, width: 150, height: 23, dropDownHeight: 125 });
 
-	function sendBase(stage, mode) {
+	var targetoptions = {
+		inputMode: 'simple',
+		spinMode: 'simple',
+		theme: theme,
+		width: 70,
+		height: 23,
+		min:0, max: 40,
+		decimalDigits: 1,
+		spinButtons: true,
+		spinButtonsStep: 0.1
+	};
+	$("#target_lo").jqxNumberInput( targetoptions );
+	$("#target_hi").jqxNumberInput( targetoptions );
 
-		console.log("sendBase("+stage+", "+mode+")");
-		var data  = 'node=rpi01&alias=unit0&payload={"stage":"' + stage;
-		    data += '","mode":"' + mode + '","setpoint":{"low":17.8,"high":18.2}}';
+	function sendBase(stage, mode, tlo, thi) {
+
+		console.log("sendBase("+stage+", "+mode+", "+tlo+", "+thi+")");
+		var data  = 'node=rpi01&alias=unit0&payload={"stage":"'+stage;
+		    data += '","mode":"'+mode+'","setpoint":{"low":'+tlo+',"high":'+thi+'}}';
 		$.ajax({
 			url: "cmd_fermenter.php",
 			data: data,
@@ -143,17 +158,22 @@
 
 	var dataAdapter = new $.jqx.dataAdapter(source, {
 		loadComplete: function (records) {
-			var record = dataAdapter.records[0];
+			record = dataAdapter.records[0];
 			var oline = (record.online) ? "On-line" : "Off-line";
 			$("#info_uuid").html(record.uuid);
 			$("#info_system").html(record.node +  "/" + record.alias + " " + oline);
 			$("#info_beer").html(record.beercode + " - " + record.beername);
-			bcode = record.beercode;
-			bname = record.beername;
-			bstage = record.stage;
-			bmode = record.mode;
 			$("#info_mode").jqxDropDownList('selectItem', record.mode);
 			$("#info_stage").jqxDropDownList('selectItem', record.stage);
+			$("#target_lo").val(record.setpoint_low);
+			$("#target_hi").val(record.setpoint_high);
+			if (record.online && ((record.mode == "FRIDGE") || (record.mode == "BEER"))) {
+				$("#target_lo").jqxNumberInput({ readOnly: false, Width: 70, spinButtons: true });
+				$("#target_hi").jqxNumberInput({ readOnly: false, Width: 70, spinButtons: true });
+			} else {
+				$("#target_lo").jqxNumberInput({ readOnly: true, Width: 50, spinButtons: false });
+				$("#target_hi").jqxNumberInput({ readOnly: true, Width: 50, spinButtons: false });
+			}
 
 			if (record.online && (record.mode != "OFF")) {
 				$("#fermenter_powerled").html('<div class="LEDblue_on"></div>Power');
@@ -166,11 +186,6 @@
 				$("#fermenter_alarmled").html('<div class="LEDred_off"></div>Alarm');
 			}
 
-			$("#target_lo").html(record.setpoint_low.toFixed(1));
-			$("#target_hi").html(record.setpoint_high.toFixed(1));
-			$("#load_air").html(record.air_temperature.toFixed(3));
-			$("#load_beer").html(record.beer_temperature.toFixed(3));
-
 			if (record.online && (record.heater_state != "0")) {
 				$("#fermenter_led1").html('<div class="LEDgreen_on"></div>Heat');
 			} else {
@@ -199,12 +214,14 @@
 				$("#fermenter_toggle3").val( (record.fan_state != "0") );
 			}
 
+			$("#gaugeContainer_air").jqxGauge( { caption: { value: 'Air: '+record.air_temperature.toFixed(3) }});
 			$('#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( { caption: { value: 'Beer: '+record.beer_temperature.toFixed(3) }});
 			$('#gaugeContainer_beer').jqxGauge({ value: record.beer_temperature });
 			if (record.online && (record.beer_state == "OK")) {
 				$("#gaugeContainer_beer").jqxGauge({ disabled: false });
@@ -222,22 +239,46 @@
 
 	// Get the data immediatly and then at regular intervals to refresh.
 	dataAdapter.dataBind();
-	setInterval(function(){
+	setInterval(function() {
+		if (newBase) {
+			sendBase(record.stage, record.mode, record.setpoint_low, record.setpoint_high);
+			newBase = false;
+		}
 		dataAdapter.dataBind();
 	}, 10000);
 
 	$('#info_mode').on('change', function (event) {
-		sendBase(bstage, args.item.value);
+		record.mode = args.item.value;
+		newBase = true;
 	});
 	$('#info_stage').on('change', function (event) {
-		sendBase(args.item.value, bmode);
+		record.stage = args.item.value;
+		newBase = true;
+	});
+	$('#target_lo').on('change', function (event) {
+		record.setpoint_low = parseFloat(event.args.value);
+		// Keep the high target above the low.
+		if (record.setpoint_low > (record.setpoint_high - 0.2)) {
+			record.setpoint_high = record.setpoint_low + 0.2;
+			$("#target_hi").val(record.setpoint_high);
+		}
+		newBase = true;
+	});
+	$('#target_hi').on('change', function (event) {
+		record.setpoint_high = parseFloat(event.args.value);
+		// Keep the low target below the high.
+		if (record.setpoint_high < (record.setpoint_low + 0.2)) {
+			record.setpoint_low = record.setpoint_high - 0.2;
+			$("#target_lo").val(record.setpoint_low);
+		}
+		newBase = true;
 	});
 
 
 	// The chart button.
    	$("#FLog").jqxButton({ template: "info", width: '150px', theme: theme });
 	$("#FLog").click(function () {
-		var url="log_fermentation.php?code=" + bcode + "&name=" + bname;
+		var url="log_fermentation.php?code=" + record.beercode + "&name=" + record.beername;
 		window.open(url);
 	});
 });

--- a/www/mon_fermenter.php	Tue Jan 08 21:54:19 2019 +0100
+++ b/www/mon_fermenter.php	Wed Jan 09 16:19:26 2019 +0100
@@ -25,7 +25,7 @@
      </div>
     </div> <!-- End left side -->
 
-    <div style="float: right; width: 295px;  background-color: #ddd;">
+    <div style="float: right; width: 295px;">
      <div id="fermenter_panel_top">
       <div id="fermenter_selector">
       </div>
@@ -34,15 +34,13 @@
      </div> <!-- fermenter_panel_top -->
 
      <div id="fermenter_panel_display">
-      <div id="fermenter_display1">
-       <div id="target_hi" class="htemp"></div>
-       <div id="target_lo" class="ltemp"></div>Sp
+      <div id="fermenter_display">
+       <div id="target_lo" style="margin-left: 40px; margin-top: 15px;"></div>
+       <div style="margin-top: 5px;">&deg;C laag</div>
       </div>
-      <div id="fermenter_display2">
-       <div id="load_air" class="dtemp"></div>Air
-      </div>
-      <div id="fermenter_display3">
-       <div id="load_beer" class="dtemp"></div>Beer
+      <div id="fermenter_display">
+       <div id="target_hi" style="margin-left: 40px; margin-top: 15px;"></div>
+       <div style="margin-top: 5px;">&deg;C hoog</div>
       </div>
      </div> <!-- fermenter_panel_display -->