81 lines
2.4 KiB
C
81 lines
2.4 KiB
C
#include <ESPAsyncWebServer.h>
|
|
|
|
const char index_html[] PROGMEM = R"rawliteral(
|
|
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Blitzer</title>
|
|
<style type="text/css">
|
|
body, html {
|
|
padding: 0;
|
|
margin: 10px 20px;
|
|
font-family: sans-serif;
|
|
}
|
|
|
|
.btn {
|
|
width: 100%;
|
|
height: 70px;
|
|
background-color: red;
|
|
color: white;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>Blitzercontrol</h1>
|
|
<button onclick="getData()">Refresh</button>
|
|
<h2>Highscore</h2>
|
|
<span id="highscore">23km/h</span>
|
|
<h2>Letzte Messungen</h2>
|
|
<ul id="lastSpeeds">
|
|
<li></li>
|
|
<li></li>
|
|
<li></li>
|
|
<li></li>
|
|
<li></li>
|
|
<li></li>
|
|
<li></li>
|
|
<li></li>
|
|
<li></li>
|
|
<li></li>
|
|
</ul>
|
|
<h2>Manuelle Steuerung</h2>
|
|
<button class="btn" onclick="flash()">Flash</button>
|
|
<h2>Speed setting</h2>
|
|
<input id="threshold" type="text" /> km/h<br />
|
|
<button onclick="setSpeed()">Set Speed</button>
|
|
<script type="text/javascript">
|
|
const highscoreElem = document.getElementById("highscore");
|
|
const lastSpeeds = document.getElementById("lastSpeeds");
|
|
const thresholdFieldElem = document.getElementById("threshold");
|
|
function flash() {
|
|
fetch('/flash').then(() => {});
|
|
}
|
|
function setSpeed() {
|
|
console.log('/set?speed=' + thresholdFieldElem.value);
|
|
fetch('/set?speed=' + thresholdFieldElem.value);
|
|
}
|
|
function getData() {
|
|
const controller = new AbortController();
|
|
const id = setTimeout(() => controller.abort(), 1500);
|
|
fetch('/data.json', {
|
|
signal: controller.signal
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
clearTimeout(id);
|
|
highscoreElem.innerText = data.highscore + ' km/h';
|
|
let c = lastSpeeds.children;
|
|
for(let i=0; i<data.lastSpeeds.length; i++) {
|
|
c[i].innerText = data.lastSpeeds[i] + ' km/h';
|
|
}
|
|
thresholdFieldElem.value = data.threshold
|
|
});
|
|
}
|
|
getData();
|
|
</script>
|
|
</body>
|
|
</html>
|
|
)rawliteral"; |