All checks were successful
Compilie project and upload binaries / test (push) Successful in 3m59s
165 lines
5.7 KiB
JavaScript
165 lines
5.7 KiB
JavaScript
function roundToTwo(num) {
|
|
return Math.round(num*100)/100;
|
|
}
|
|
|
|
function fetchElectricData() {
|
|
const apiUrl = '/sensor_data';
|
|
// Fetching data from the API
|
|
fetch(apiUrl)
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
document.getElementById('voltage').textContent = data.bus_voltage ? (roundToTwo(data.bus_voltage) + ' V') : 'XXX';
|
|
document.getElementById('current').textContent = data.current ? (roundToTwo(data.current) + ' mA') : 'XXX';
|
|
document.getElementById('shunt_voltage').textContent = data.current ? (roundToTwo(data.shunt_voltage) + ' mV') : 'XXX';
|
|
})
|
|
.catch(error => {
|
|
console.error("There was an error fetching data from the API", error);
|
|
});
|
|
}
|
|
|
|
function fetchTelemetryData() {
|
|
const apiUrl = '/telemetry';
|
|
// Fetching data from the API
|
|
fetch(apiUrl)
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
document.getElementById('uptime').textContent = data.uptime_seconds ? (roundToTwo(data.uptime_seconds) + ' s') : 'XXX';
|
|
document.getElementById('heap').textContent = data.heap_percent ? (roundToTwo(data.heap_percent) + ' %%') : 'XXX';
|
|
document.getElementById('temperature').textContent = data.heap_percent ? (roundToTwo(data.temperature) + ' °C') : 'XXX';
|
|
})
|
|
.catch(error => {
|
|
console.error("There was an error fetching data from the API", error);
|
|
});
|
|
}
|
|
|
|
function fetchWaterData(gauge) {
|
|
const apiUrl = '/water_data';
|
|
// Fetching data from the API
|
|
fetch(apiUrl)
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
document.getElementById('level').textContent = roundToTwo(data.water_height)+ ' cm' || 'N/A';
|
|
document.getElementById('liters').textContent = roundToTwo(data.liters)+ ' l' || 'N/A';
|
|
document.getElementById('percentage').textContent = roundToTwo(data.percentage)+ ' %%' || 'N/A';
|
|
gauge.value = data.liters;
|
|
})
|
|
.catch(error => {
|
|
console.error("There was an error fetching data from the API", error);
|
|
});
|
|
}
|
|
|
|
function fetchUpdateData(gauge) {
|
|
const apiUrl = '/ota_update_status';
|
|
// Fetching data from the API
|
|
fetch(apiUrl)
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
document.getElementById('current_fw').textContent = data.current_version || 'N/A';
|
|
document.getElementById('server_fw').textContent = data.new_version || 'N/A';
|
|
if (data.update_available == true) {
|
|
document.getElementById("update_button").style.visibility = 'visible';
|
|
} else {
|
|
document.getElementById("update_button").style.visibility = 'hidden';
|
|
};
|
|
})
|
|
.catch(error => {
|
|
console.error("There was an error fetching data from the API for OTA Data", error);
|
|
});
|
|
|
|
}
|
|
|
|
function fetchConnectionData() {
|
|
const apiUrl = '/network_info';
|
|
fetch(apiUrl)
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
document.getElementById('wifi_ip').textContent = data.wifi.ip || 'N/A';
|
|
document.getElementById('wifi_rssi').textContent = data.wifi.rssi || 'N/A';
|
|
document.getElementById('wifi_link').textContent = data.wifi.link || 'N/A';
|
|
document.getElementById('wifi_ssid').textContent = data.wifi.ssid || 'N/A';
|
|
document.getElementById('eth_link').textContent = data.ethernet.link || 'N/A';
|
|
document.getElementById('eth_ip').textContent = data.ethernet.ip || 'N/A';
|
|
document.getElementById('eth_speed').textContent = data.ethernet.rssi || 'N/A';
|
|
})
|
|
.catch(error => {
|
|
console.error("There was an error fetching data from the API", error);
|
|
});
|
|
|
|
}
|
|
|
|
window.addEventListener('DOMContentLoaded', (event) => {
|
|
var water_volume = %water_volume%;
|
|
console.log(water_volume);
|
|
console.log(water_volume/10);
|
|
|
|
var gauge = new RadialGauge({
|
|
renderTo: 'main_gauge',
|
|
// width: 300,
|
|
// height: 300,
|
|
units: "l",
|
|
minValue: 0,
|
|
maxValue: water_volume,
|
|
majorTicks: generateValueList(water_volume),
|
|
minorTicks: 2,
|
|
strokeTicks: true,
|
|
highlights: [
|
|
{
|
|
"from": water_volume/10,
|
|
"to": (water_volume/10)*2,
|
|
"color": "rgba(255, 255, 0, .75)"
|
|
},
|
|
{
|
|
"from": 0,
|
|
"to": water_volume/10,
|
|
"color": "rgba(255, 0, 50, .75)"
|
|
}
|
|
],
|
|
colorPlate: "#fff",
|
|
borderShadowWidth: 0,
|
|
borders: false,
|
|
needleType: "arrow",
|
|
needleWidth: 2,
|
|
needleCircleSize: 7,
|
|
needleCircleOuter: true,
|
|
needleCircleInner: false,
|
|
animationDuration: 1500,
|
|
animationRule: "linear"
|
|
}).draw();
|
|
// URL of your API
|
|
|
|
|
|
fetchWaterData(gauge);
|
|
fetchTelemetryData();
|
|
fetchElectricData();
|
|
fetchConnectionData();
|
|
fetchUpdateData();
|
|
setInterval(function(){fetchWaterData(gauge);}, 5000);
|
|
setInterval(fetchTelemetryData, 5000);
|
|
setInterval(fetchElectricData, 5000);
|
|
setInterval(fetchConnectionData, 5000);
|
|
setInterval(fetchUpdateData, 5000);
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
function generateValueList(maxValue) {
|
|
let interval = 10;
|
|
let numberOfValues = Math.floor(maxValue / interval) + 1;
|
|
|
|
while (numberOfValues > 10) {
|
|
interval += 10;
|
|
numberOfValues = Math.floor(maxValue / interval) + 1;
|
|
}
|
|
|
|
const valueList = [];
|
|
for (let i = 0; i < numberOfValues; i++) {
|
|
valueList.push(i * interval);
|
|
}
|
|
|
|
valueList[numberOfValues - 1] = maxValue;
|
|
|
|
return valueList;
|
|
}
|