117 lines
4.9 KiB
JavaScript
117 lines
4.9 KiB
JavaScript
//
|
|
// Main Page period status update
|
|
//
|
|
// @todo Draw the 'drum' as an arc instead of trying to rotate a picture of an arc.
|
|
// which will work better to reflect the opening.
|
|
//
|
|
//
|
|
// var mySite = 'http://192.168.1.23'; // from myip.js
|
|
var url = mySite + '/state';
|
|
setInterval(RefreshStatus, 1000); // @todo speed this up to 500 msec or even 250
|
|
|
|
getIt = function (aUrl, callback) {
|
|
var xhr = new XMLHttpRequest();
|
|
xhr.open('GET', aUrl, true);
|
|
xhr.responseType = 'text';
|
|
xhr.onload = function (e) {
|
|
if (this.status === 200) {
|
|
callback(this.response);
|
|
}
|
|
};
|
|
xhr.send();
|
|
};
|
|
|
|
function ConvertTempToString(tempC, showF) {
|
|
var tempF = tempC * 9 / 5 + 32;
|
|
if (showF == 0)
|
|
return tempF.toFixed(0) + "°F";
|
|
else
|
|
return tempC.toFixed(0) + "°C";
|
|
}
|
|
|
|
function ConvertSecToMMSS(sec) {
|
|
mm = parseInt(sec/60).toString().padStart(4,'0');
|
|
ss = (sec%60).toString().padStart(2,'0');
|
|
return mm + ":" + ss;
|
|
}
|
|
|
|
function RefreshStatus() {
|
|
getIt(url,
|
|
function(data) {
|
|
obj = JSON.parse(data);
|
|
document.getElementById('version').innerHTML = obj.version;
|
|
document.getElementById('name').innerHTML = obj.name;
|
|
document.getElementById('uptime').innerHTML = 'Uptime: ' + obj.uptime;
|
|
document.getElementById('wifimode').innerHTML = 'WiFi Mode: ' + obj.wifimode;
|
|
// IP Address
|
|
var elms = document.querySelectorAll('.' + 'ip'), i;
|
|
for (i = 0; i < elms.length; ++i) {
|
|
elms[i].textContent = obj.ip;
|
|
}
|
|
// Plant status
|
|
document.getElementById('TimeOfDay').innerHTML = obj.TimeOfDay;
|
|
var userF = obj.Fahrenheit;
|
|
|
|
if (typeof obj.AmbientTemp_C != "undefined") {
|
|
document.getElementById('AmbientTemp_C').innerHTML = ConvertTempToString(obj.AmbientTemp_C, userF);
|
|
} else {
|
|
document.getElementById('AmbientTemp_C').innerHTML = "--";
|
|
}
|
|
|
|
if (typeof obj.ChamberTemp_C != "undefined") {
|
|
document.getElementById('ChamberTemp_C').innerHTML = ConvertTempToString(obj.ChamberTemp_C, userF);
|
|
document.getElementById('ChamberHumi').innerHTML = parseInt(obj.ChamberHumi) + "%";
|
|
} else {
|
|
document.getElementById('ChamberTemp_C').innerHTML = "--";
|
|
document.getElementById('ChamberHumi').innerHTML = "--"
|
|
}
|
|
|
|
if (typeof obj.SoilHeater != "undefined") {
|
|
document.getElementById('SoilHeater').innerHTML = (obj.SoilHeater) ? "Heat On" : "Heat Off";
|
|
} else {
|
|
document.getElementById('SoilHeater').innerHTML = "--";
|
|
}
|
|
|
|
if (typeof obj.SoilTemp_C != "undefined") {
|
|
document.getElementById('SoilTemp_C').innerHTML = ConvertTempToString(obj.SoilTemp_C, userF);
|
|
} else {
|
|
document.getElementById('SoilTemp_C').innerHTML = "--";
|
|
}
|
|
if (typeof obj.SoilTemp_C != "undefined") {
|
|
document.getElementById('SoilMoisture_X').innerHTML = obj.SoilMoisture_X;
|
|
} else {
|
|
document.getElementById('SoilMoisture_X').innerHTML = "--";
|
|
}
|
|
|
|
if (obj.DrumState == 1) { // closed, hide the "open" image
|
|
document.getElementById('DrumState').style.display === "none";
|
|
} else {
|
|
document.getElementById('DrumState').style.display === "block";
|
|
}
|
|
document.getElementById('DrumOpenSensor').innerHTML = (obj.DrumOpenSensor) ? "O" : "!O";
|
|
document.getElementById('DrumClosedSensor').innerHTML = (obj.DrumClosedSensor) ? "C" : "!C";
|
|
document.getElementById('DrumMotorStatus').innerHTML = (obj.DrumMotorStatus == 0) ? "stopped" : (obj.DrumMotorStatus == 1) ? "CW" : "CCW";
|
|
document.getElementById('DrumMotorOn_sec').innerHTML = obj.DrumMotorOn_sec + "s";
|
|
document.getElementById('DrumMotor_V').innerHTML = parseFloat(obj.DrumMotor_V).toFixed(1) + " V";
|
|
document.getElementById('DrumMotor_I').innerHTML = parseFloat(obj.DrumMotor_I).toFixed(1) + " A";
|
|
|
|
document.getElementById('WaterInTank').innerHTML = obj.WaterInTank;
|
|
document.getElementById('WaterPumpStatus').innerHTML = (obj.WaterPumpStatus) ? "On" : "Off";
|
|
document.getElementById('WaterMotor_V').innerHTML = parseFloat(obj.WaterMotor_V).toFixed(1) + " V";
|
|
document.getElementById('WaterCyclePeriod_sec').innerHTML = ConvertSecToMMSS(obj.WaterCyclePeriod_sec);
|
|
document.getElementById('WaterCycleOn_sec').innerHTML = ConvertSecToMMSS(obj.WaterCycleOn_sec);
|
|
document.getElementById('WaterCycle_sec').innerHTML = ConvertSecToMMSS(obj.WaterCycle_sec);
|
|
|
|
// The full-scale pump timer box ranges from 22 to 234px
|
|
// The WaterCycleOnBox.width is proportional to the WaterCyclePeriod_sec and the (234 - 22)px width
|
|
var boxW = (234 - 22);
|
|
// The WaterCyclePointer_sec.width (24) is positioned from 22 to 234 - 1/2 width.
|
|
var onW = (obj.WaterCycleOn_sec/obj.WaterCyclePeriod_sec) * boxW;
|
|
var ptrX = 22 + (obj.WaterCycle_sec/obj.WaterCyclePeriod_sec) * boxW - 12;
|
|
console.log("onW: " + onW + ", ptrX: " + ptrX);
|
|
document.getElementById('WaterCycleOnBox').width = onW;
|
|
document.getElementById('WaterCyclePointer_sec').left = ptrX;
|
|
}
|
|
);
|
|
}
|