74 lines
No EOL
2.4 KiB
HTML
74 lines
No EOL
2.4 KiB
HTML
<!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> |