patrick/Sensor4
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

INDEX_HTML

Browse Source
This commit is contained in:
Patrick Haßel 2025-01-07 18:51:17 +01:00
parent 33f7a3cfda
commit 3a1003b0af
1 changed files with 56 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
src/patrix/INDEX_HTML.cpp
View File

@ -3,27 +3,66 @@
const char *INDEX_HTML = R"(<!DOCTYPE html> const char *INDEX_HTML = R"(<!DOCTYPE html>
<html lang="de"> <html lang="de">
<head> <head>
<meta name="viewport" content="width=device-width, user-scalable=no">
<title>TEST</title> <title>TEST</title>
<style>
body {
font-size: 4vw;
}
@media (min-width: 1200px) {
body {
font-size: 16px;
}
}
</style>
</head>
<body>
<pre id="content"></pre>
<pre id="time"></pre>
<script> <script>
const time = document.getElementById("time");
const content = document.getElementById("content");
let last = null;
function updateTime() {
if (last === null) {
time.innerText = "Noch keine Daten";
return;
}
const ageSeconds = Math.floor((Date.now() - last) / 1000);
if (ageSeconds === 0) {
time.innerText = "Gerade eben";
} else {
time.innerText = "Vor " + ageSeconds + " Sekunde" + (ageSeconds === 1 ? "" : "n");
}
}
function connect() { function connect() {
console.log("connecting"); console.log("connecting websocket...");
const socket = new WebSocket('ws://10.0.0.119/ws'); const host = location.host || "10.0.0.119";
const port = location.port || "80";
const socket = new WebSocket(`ws://${host}:${port}/ws`);
socket.timeout = 1; socket.timeout = 1;
socket.addEventListener('open', _ => console.log('connected')); socket.addEventListener('open', _ => console.log('websocket connected'));
socket.addEventListener('message', event => { socket.addEventListener('message', event => {
document.getElementById("content").innerText = JSON.stringify(JSON.parse(event.data), null, 2); last = Date.now();
updateTime();
const parsed = JSON.parse(event.data);
console.log("websocket received", parsed);
content.innerText = JSON.stringify(parsed, null, 2);
}); });
socket.addEventListener('close', _ => { socket.addEventListener('close', _ => {
console.log('disconnected'); console.log('websocket disconnected');
connect(); connect();
}); });
} }
updateTime();
connect(); connect();
setInterval(updateTime, 1000);
</script> </script>
</head>
<body>
<pre id="content"></pre>
</body> </body>
</html> </html>
)"; )";