Simple interface

2023-10-11 02:03:33 +02:00 · 2023-10-11 02:03:33 +02:00 · ad561a9519
commit ad561a9519
parent c2376c85a0
1 changed files with 74 additions and 0 deletions
--- a/src/index.html
+++ b/src/index.html
@ -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>