Documentation updates
This commit is contained in:
Binary file not shown.
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 14 KiB |
@@ -28,12 +28,12 @@ getIt = function (aUrl, callback) {
|
||||
|
||||
function RefreshStatus() {
|
||||
getIt(url,
|
||||
function (data) {
|
||||
obj = JSON.parse(data);
|
||||
UpdateGraph(obj.raw, obj.sense); // raw and averaged
|
||||
document.getElementById('uptime').innerHTML = 'Uptime: ' + obj.uptime;
|
||||
document.getElementById('currText').innerHTML = 'raw: ' + obj.raw + ', avg: ' + obj.sense;
|
||||
}
|
||||
function (data) {
|
||||
obj = JSON.parse(data);
|
||||
UpdateGraph(obj.raw, obj.sense); // raw and averaged
|
||||
document.getElementById('uptime').innerHTML = 'Uptime: ' + obj.uptime;
|
||||
document.getElementById('currText').innerHTML = 'raw: ' + obj.raw + ', avg: ' + obj.sense;
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@@ -39,7 +39,7 @@
|
||||
<div class='SoilTemp_C' id='SoilTemp_C' >--.- °F</div>
|
||||
<div class='SoilMoisture_X' id='SoilMoisture_X' >-- %</div>
|
||||
|
||||
<div class='DrumDoorIcon' id='DrumDoorIcon' ><img src='open.png' title='Open' /></div>
|
||||
<div class='DrumState' id='DrumState' ><img src='open.png' title='Open' /></div>
|
||||
<div class='DrumOpenSensor' id='DrumOpenSensor' >O</div>
|
||||
<div class='DrumClosedSensor' id='DrumClosedSensor' >C</div>
|
||||
<div class='DrumMotorLabel' id='DrumMotorLabel' >Motor</div>
|
||||
@@ -57,7 +57,7 @@
|
||||
<div class='WaterCycleOn_sec' id='WaterCycleOn_sec' >8 s</div>
|
||||
<div class='WaterCycle_sec' id='WaterCycle_sec' >10 s</div>
|
||||
<div class='WaterCycleOnBox' id='WaterCycleOnBox' ></div>
|
||||
<div class='WaterCycleStatusIcon' id='WaterCycleStatusIcon' ><img src='pointer.png' title='Pump On Time' /></div>
|
||||
<div class='WaterCyclePointer_sec' id='WaterCyclePointer_sec' ><img src='pointer.png' title='Pump On Time' /></div>
|
||||
</div>
|
||||
</td>
|
||||
<td width='10%' align='center'>
|
||||
|
||||
@@ -1,9 +1,13 @@
|
||||
//
|
||||
// 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, 2500);
|
||||
setInterval(RefreshStatus, 1000); // @todo speed this up to 500 msec or even 250
|
||||
|
||||
getIt = function (aUrl, callback) {
|
||||
var xhr = new XMLHttpRequest();
|
||||
@@ -19,28 +23,24 @@ getIt = function (aUrl, callback) {
|
||||
|
||||
function ConvertTempToString(tempC, showF) {
|
||||
var tempF = tempC * 9 / 5 + 32;
|
||||
if (showF)
|
||||
return tempF.toFixed(1) + "°F";
|
||||
if (showF == 0)
|
||||
return tempF.toFixed(0) + "°F";
|
||||
else
|
||||
return tempC.toFixed(1) + "°C";
|
||||
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);
|
||||
if (obj.state === 1)
|
||||
state = "On";
|
||||
else
|
||||
state = "Off";
|
||||
document.getElementById('version').innerHTML = obj.version;
|
||||
document.getElementById('name').innerHTML = obj.name;
|
||||
//document.getElementById('state').innerHTML = 'Output: ' + state;
|
||||
//document.getElementById('raw').innerHTML = 'raw: ' + obj.raw;
|
||||
//document.getElementById('sense').innerHTML = 'Sense: ' + obj.sense;
|
||||
//document.getElementById('toggle').innerHTML = 'Toggle: ' + obj.toggle;
|
||||
//document.getElementById('reset').innerHTML = 'Reset: ' + obj.reset;
|
||||
//document.getElementById('countdown').innerHTML = 'Countdown: ' + obj.countdown;
|
||||
document.getElementById('uptime').innerHTML = 'Uptime: ' + obj.uptime;
|
||||
document.getElementById('wifimode').innerHTML = 'WiFi Mode: ' + obj.wifimode;
|
||||
// IP Address
|
||||
@@ -67,7 +67,7 @@ function RefreshStatus() {
|
||||
}
|
||||
|
||||
if (typeof obj.SoilHeater != "undefined") {
|
||||
document.getElementById('SoilHeater').innerHTML = obj.SoilHeater;
|
||||
document.getElementById('SoilHeater').innerHTML = (obj.SoilHeater) ? "Heat On" : "Heat Off";
|
||||
} else {
|
||||
document.getElementById('SoilHeater').innerHTML = "--";
|
||||
}
|
||||
@@ -83,24 +83,34 @@ function RefreshStatus() {
|
||||
document.getElementById('SoilMoisture_X').innerHTML = "--";
|
||||
}
|
||||
|
||||
if (obj.DrumDoorIcon == 1) {
|
||||
document.getElementById('DrumDoorIcon').style.display === "none";
|
||||
if (obj.DrumState == 1) { // closed, hide the "open" image
|
||||
document.getElementById('DrumState').style.display === "none";
|
||||
} else {
|
||||
document.getElementById('DrumDoorIcon').style.display === "block";
|
||||
document.getElementById('DrumState').style.display === "block";
|
||||
}
|
||||
document.getElementById('DrumOpenSensor').innerHTML = obj.DrumOpenSensor;
|
||||
document.getElementById('DrumClosedSensor').innerHTML = obj.DrumClosedSensor;
|
||||
document.getElementById('DrumMotorStatus').innerHTML = obj.DrumMotorStatus;
|
||||
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('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;
|
||||
document.getElementById('WaterMotor_V').innerHTML = parseFloat(obj.WaterMotor_V).toFixed(1) + "V";
|
||||
document.getElementById('WaterCyclePeriod_sec').innerHTML = obj.WaterCyclePeriod_sec + "s";
|
||||
document.getElementById('WaterCycleOn_sec').innerHTML = obj.WaterCycleOn_sec + "s";
|
||||
document.getElementById('WaterCycle_sec').innerHTML = obj.WaterCycle_sec + "s";
|
||||
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;
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
@@ -53,7 +53,7 @@ div.ChamberHumi {
|
||||
}
|
||||
div.SoilMoisture_X {
|
||||
position: absolute;
|
||||
left: 130px;
|
||||
left: 135px;
|
||||
top: 135px;
|
||||
color: white;
|
||||
}
|
||||
@@ -64,12 +64,12 @@ div.SoilHumiIcon {
|
||||
}
|
||||
div.SoilThermoIcon {
|
||||
position: absolute;
|
||||
left: 170px;
|
||||
left: 175px;
|
||||
top: 100px;
|
||||
}
|
||||
div.SoilTemp_C {
|
||||
position: absolute;
|
||||
left: 165px;
|
||||
left: 170px;
|
||||
top: 135px;
|
||||
color: white;
|
||||
}
|
||||
@@ -90,7 +90,7 @@ div.SoilHeaterOffIcon {
|
||||
top: 181px;
|
||||
}
|
||||
|
||||
div.DrumDoorIcon {
|
||||
div.DrumState {
|
||||
position: absolute;
|
||||
transform: rotate(180deg);
|
||||
left: 14px;
|
||||
@@ -109,7 +109,7 @@ div.DrumClosedSensor {
|
||||
div.DrumMotorLabel {
|
||||
position: absolute;
|
||||
left: 95px;
|
||||
top: 270px;
|
||||
top: 260px;
|
||||
width: 50px;
|
||||
text-align: center;
|
||||
color: white;
|
||||
@@ -117,7 +117,7 @@ div.DrumMotorLabel {
|
||||
div.DrumMotorStatus {
|
||||
position: absolute;
|
||||
left: 95px;
|
||||
top: 290px;
|
||||
top: 280px;
|
||||
width: 50px;
|
||||
text-align: center;
|
||||
color: white;
|
||||
@@ -231,19 +231,19 @@ div.WaterCycleOnBox {
|
||||
height: 20px;
|
||||
background-color: #BDD7EE;
|
||||
z-index: -35;
|
||||
//border-color: red;
|
||||
border-color: red;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
}
|
||||
div.WaterCycleStatusIcon {
|
||||
div.WaterCyclePointer_sec {
|
||||
position: absolute;
|
||||
left: 80px;
|
||||
top: 469px;
|
||||
width: 25px;
|
||||
width: 24px;
|
||||
text-align: center;
|
||||
z-index: -25;
|
||||
border-color: green;
|
||||
//border-style: solid;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user