huskee/therminator
huskee/therminator
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Add datetime to web interface

Browse source
This commit is contained in:
huskee 2023-12-13 20:30:06 +02:00
parent f35f52156d
commit cfd5f4e11f
3 changed files with 30 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
data/index.html
View file

@ -6,6 +6,7 @@
<body>
<p class="reading">A: <span id="tempA"></span></p>
<p class="reading">B: <span id="tempB"></span></p>
<p>time: <span id="time"></span></p>
<script src="script.js"></script>
</body>
</html>

48
data/script.js
View file

@ -1,44 +1,50 @@
var gateway = `ws://${window.location.hostname}/ws`;
var websocket;
// Init web socket when the page loads
window.addEventListener('load', onload);
window.addEventListener("load", onload);
function onload(event) {
initWebSocket();
initWebSocket();
}
function getReadings(){
websocket.send("getReadings");
function getReadings() {
websocket.send("getReadings");
}
function initWebSocket() {
console.log('Trying to open a WebSocket connection...');
websocket = new WebSocket(gateway);
websocket.onopen = onOpen;
websocket.onclose = onClose;
websocket.onmessage = onMessage;
console.log("Trying to open a WebSocket connection...");
websocket = new WebSocket(gateway);
websocket.onopen = onOpen;
websocket.onclose = onClose;
websocket.onmessage = onMessage;
}
// When websocket is established, call the getReadings() function
function onOpen(event) {
console.log('Connection opened');
getReadings();
console.log("Connection opened");
getReadings();
}
function onClose(event) {
console.log('Connection closed');
setTimeout(initWebSocket, 2000);
console.log("Connection closed");
setTimeout(initWebSocket, 2000);
}
// Function that receives the message from the ESP32 with the readings
function onMessage(event) {
console.log(event.data);
var myObj = JSON.parse(event.data);
var keys = Object.keys(myObj);
console.log(event.data);
var myObj = JSON.parse(event.data);
var keys = Object.keys(myObj);
for (var i = 0; i < keys.length; i++){
var key = keys[i];
document.getElementById(key).innerHTML = myObj[key];
}
for (var i = 0; i < keys.length - 1; i++) {
var key = keys[i];
document.getElementById(key).innerHTML = myObj[key];
}
var today = new Date();
var date =
today.getFullYear() + "-" + (today.getMonth() + 1) + "-" + today.getDate();
var time =
today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
var dateTime = date + " " + time;
document.getElementById("time").innerHTML = dateTime;
}

1
src/main.cpp
View file

@ -52,6 +52,7 @@ String getSensorReadings() {
double tempB = thermocoupleB.readCelsius();
readings["tempA"] = String(tempA) + "°C";
readings["tempB"] = String(tempB) + "°C";
readings["time"] = String(lastTime);
}
String jsonString = JSON.stringify(readings);
return jsonString;