m.giller/matrix-clock
1
0
Fork 0
Code Issues 2 Pull requests Projects Releases 4 Packages Wiki Activity

Simple interface

Browse source
This commit is contained in:
Maximilian Giller 2023-10-11 02:03:33 +02:00
parent c2376c85a0
commit ad561a9519
1 changed files with 74 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

74
src/index.html Normal file
View file

@ -0,0 +1,74 @@
<!DOCTYPE html>
<html>
<head>
<title>Matrix Display Controller</title>
</head>
<body>
<h1>Matrix Display Controller</h1>
<form>
<label for="message">Message:</label>
<input type="text" id="message" name="message">
<br>
<button type="button" onclick="displayMessage()">Display Message</button>
</form>
<form>
<label for="message">Counts:</label>
<input type="number" id="message" name="counts">
<br>
<button type="button" onclick="flash()">Flash</button>
</form>
<button type="button" onclick="displayTime()">Display Time</button>
<button type="button" onclick="off()">Turn Off</button>
<script>
const targetHost = "http://192.168.178.54:8000";
function displayMessage() {
const message = document.getElementById("message").value;
const url = targetHost + "/message";
const data = { message: message };
fetch(url, {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify(data),
})
.then((response) => response.json())
.then((data) => console.log(data))
.catch((error) => console.error(error));
}
function flash() {
const counts = document.getElementById("counts").value;
const url = targetHost + "/flash?count=" + counts;
fetch(url, {
method: "POST",
headers: { "Content-Type": "application/json" },
})
.then((response) => response.json())
.then((data) => console.log(data))
.catch((error) => console.error(error));
}
function off() {
const url = targetHost + "/off";
fetch(url, {
method: "POST",
headers: { "Content-Type": "application/json" },
})
.then((response) => response.json())
.then((data) => console.log(data))
.catch((error) => console.error(error));
}
function displayTime() {
const url = targetHost + "/time";
fetch(url, { method: "POST" })
.then((response) => response.json())
.then((data) => console.log(data))
.catch((error) => console.error(error));
}
</script>
</body>
</html>