soruh/centralex
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

minor ui changes

Browse Source
This commit is contained in:
soruh 2023-06-11 06:44:14 +02:00
parent 2aedf86736
commit 5fe2177a14
3 changed files with 23 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
web/index.html
View File

@ -10,10 +10,13 @@
</head>
<body>
<div id="header">
<p id="free_ports" />
<p id="last_change" />
</div>
<div id="connected_box">
<div id="connected" class="hidden"><!--INSERT SVG HERE--></div>
<p id="last_update" />
<p id="last_ping" />
</div>
<table id="table">

10
web/main.css
View File

@ -10,6 +10,16 @@ body {
height: 5%;
}
#free_ports,
#last_change {
display: inline-block;
}
#free_ports {
margin-right: 10%;
}
td,
th {

11
web/main.js
View File

@ -1,6 +1,7 @@
window.onload = () => {
const table_elem = document.getElementById("table");
const last_update = document.getElementById("last_update");
const last_change = document.getElementById("last_change");
const last_ping = document.getElementById("last_ping");
const connected = document.getElementById("connected");
const free_ports = document.getElementById("free_ports");
@ -87,6 +88,9 @@ window.onload = () => {
print_table();
};
let format_event = event => format_date(new Date(+event.data * 1000));
let connect_event_source = () => {
clearTimeout(reconnect_timeout);
@ -97,7 +101,7 @@ window.onload = () => {
evtSource = new EventSource("/events");
evtSource.addEventListener("change", event => {
last_update.innerText = `Letzte Änderung: ${format_date(new Date(+event.data * 1000))}`;
last_ping.innerText = `Letzter Serverkontakt: ${format_event(event)}`;
fetch("/data")
.then(res => res.json())
@ -108,8 +112,9 @@ window.onload = () => {
clearTimeout(ping_timeout);
ping_timeout = setTimeout(connect_event_source, timeout_duration);
last_change.innerHTML = `Letzte Änderung: ${format_event(event)}`;
last_update.innerText = `Letzte Änderung: ${format_date(new Date(+event.data * 1000))}`;
last_ping.innerText = `Letzter Serverkontakt: ${format_event(event)}`;
connected.className = "visible";
setTimeout(() => connected.className = "hidden", 1000);
});