177 lines
7.4 KiB
HTML
177 lines
7.4 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Hestia Web Portal</title>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<!-- Bootstrap -->
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>
|
|
<link rel="stylesheet" href="/main.css">
|
|
</head>
|
|
<body onload="refreshData()" class="container">
|
|
<script>
|
|
// Get the config file
|
|
const config = <%- config %>;
|
|
console.log(<%- config %>);
|
|
</script>
|
|
<%- include('trial.html') -%>
|
|
<div id="title" class="text-center mb-4">
|
|
<a href='./'>Hestia Web Portal</a>
|
|
</div>
|
|
<div id="status" class="row">
|
|
<!--
|
|
| Igniter | rows[0].cells[1]
|
|
| Exhaust | rows[1].cells[1]
|
|
| Auger | rows[2].cells[1]
|
|
| Feed Rate | rows[3].cells[1]
|
|
-->
|
|
|
|
<table id="status-table" class="table table-bordered col-sm-12 col-md-6">
|
|
<tr>
|
|
<td>Igniter</td>
|
|
<td></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Exhaust</td>
|
|
<td></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Auger</td>
|
|
<td></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Feed Rate</td>
|
|
<td></td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="controls-container">
|
|
<form action="/" method="post">
|
|
<!-- Start | Shutdown | Reload Settings -->
|
|
<div class="button-container d-flex justify-content-between">
|
|
<input class="btn btn-outline-secondary" type="submit" id="igniter-on" value="Enable Igniter" name="igniterOn">
|
|
<input class="btn btn-outline-secondary" type="submit" id="igniter-off" value="Disable Igniter" name="igniterOff">
|
|
</div>
|
|
<div class="button-container d-flex justify-content-between">
|
|
<input class="btn btn-outline-secondary" type="submit" id="exhaust-on" value="Enable Exhaust" name="exhaustOn">
|
|
<input class="btn btn-outline-secondary" type="submit" id="exhaust-off" value="Disable Exhaust" name="exhaustOff">
|
|
</div>
|
|
<div class="button-container d-flex justify-content-between">
|
|
<input class="btn btn-outline-secondary" type="submit" id="auger-on" value="Enable Auger" name="augerOn">
|
|
<input class="btn btn-outline-secondary" type="submit" id="auger-off" value="Disable Auger" name="augerOff">
|
|
</div>
|
|
|
|
|
|
<!-- Set feed rates -->
|
|
<div class="form-group">
|
|
<label for="feedRate">Feed Rate: </label>
|
|
<select name="feedRate" class="form-control" id="feed-rate-select">
|
|
<option value="500">Low</option>
|
|
<option value="625">Medium-Low</option>
|
|
<option value="750">Medium</option>
|
|
<option value="875">Medium-High</option>
|
|
<option value="1000">High</option>
|
|
</select>
|
|
</div>
|
|
<div class="button-container d-flex justify-content-end">
|
|
<input class="btn btn-outline-secondary" type="submit" id="reload" value="Set Feed Rate" name="reload">
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="text-center my-4">
|
|
<img src="./dancing_jesus.gif" class="img-fluid">
|
|
</div>
|
|
<div class="controls-container">
|
|
<form action="/" method="POST">
|
|
<input class="btn btn-danger" type="submit" id="quit" value="Quit!!" name="quit">
|
|
</form>
|
|
</div>
|
|
<!-- <script src="./main.js"></script> -->
|
|
<script>
|
|
function sleep(ms) {
|
|
return new Promise((resolve, reject) => {
|
|
setTimeout(() => {
|
|
resolve();
|
|
}, ms);
|
|
});
|
|
}
|
|
|
|
function readJSON(path) {
|
|
var request = new XMLHttpRequest();
|
|
request.open("GET", path, false);
|
|
request.send(null)
|
|
var JSONObj = JSON.parse(request.responseText);
|
|
return JSONObj;
|
|
}
|
|
|
|
function parseStatus(data) {
|
|
switch (data) {
|
|
case "0":
|
|
return "Off";
|
|
break;
|
|
case "1":
|
|
return "On";
|
|
break
|
|
default:
|
|
return "Error: " + data;
|
|
break;
|
|
}
|
|
}
|
|
|
|
function refreshData() {
|
|
// const log = document.getElementById('log-area');
|
|
// log.contentWindow.location.reload();
|
|
// sleep(100).then(() => {
|
|
// document.getElementById('log-area').contentWindow.scrollTo(0, 9999999999);
|
|
// });
|
|
|
|
// Get the elements we need to update
|
|
const statusTable = document.getElementById('status-table');
|
|
const igniterStatus = statusTable.rows[0].cells[1];
|
|
const exhaustStatus = statusTable.rows[1].cells[1];
|
|
const augerStatus = statusTable.rows[2].cells[1];
|
|
const feedRate = statusTable.rows[3].cells[1];
|
|
const feedRateSelect = document.getElementById('feed-rate-select');
|
|
|
|
// console.log(config);
|
|
|
|
igniterStatus.innerHTML = parseStatus(config.status.igniter);
|
|
exhaustStatus.innerHTML = parseStatus(config.status.exhaust);
|
|
augerStatus.innerHTML = parseStatus(config.status.auger);
|
|
|
|
switch (config.intervals.augerOn) {
|
|
case '500':
|
|
feedRate.innerHTML = 'Low';
|
|
feedRateSelect.selectedIndex = 0;
|
|
break;
|
|
case '625':
|
|
feedRate.innerHTML = 'Medium-Low';
|
|
feedRateSelect.selectedIndex = 1;
|
|
break;
|
|
case '750':
|
|
feedRate.innerHTML = 'Medium';
|
|
feedRateSelect.selectedIndex = 2;
|
|
break;
|
|
case '875':
|
|
feedRate.innerHTML = 'Medium-High';
|
|
feedRateSelect.selectedIndex = 3;
|
|
break;
|
|
case '1000':
|
|
feedRate.innerHTML = 'High';
|
|
feedRateSelect.selectedIndex = 4;
|
|
break;
|
|
default:
|
|
feedRate.innerHTML = 'Unknown';
|
|
break;
|
|
}
|
|
feedRate.value = config.intervals.augerOn;
|
|
};
|
|
</script>
|
|
</body>
|
|
</html>
|
|
|