blob: c2da55ecc1d35f729aaf28f578c539f983ec4ee1 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
|
import ReconnectingEventSource from "./reconnecting-eventsource.min.js";
function main() {
const sse = new ReconnectingEventSource("/stream", {
// Retry time after browser fails to reconnect (e.g. HTTP 502).
// This is pretty sus, so let's wait a little longer...
max_retry_time: 5_000,
});
sse.addEventListener("open", (event) => {
addSpecialMessage("info", "Connection to log server established!");
});
sse.addEventListener("error", (event) => {
console.error("SSE Error: ", event);
addSpecialMessage("error", "Connection to log server lost! Retrying connection...");
});
sse.addEventListener("entry", (event) => {
const line = JSON.parse(event.data);
addEntry(line);
});
}
function addEntry(json) {
const $container = document.createElement("span");
$container.classList.add("regular");
const $time = document.createElement("time");
const timestamp = new Date(+json["__REALTIME_TIMESTAMP"] / 1000);
$time.textContent = `[${timestamp.toISOString()}]: `;
$time.dateTime = timestamp;
$container.append($time)
const $unit = document.createElement("span");
$unit.textContent = json["_SYSTEMD_UNIT"];
$container.append($unit);
$container.append(": ")
const $message = document.createElement("span");
$message.textContent = json["MESSAGE"];
$container.append($message);
$container.append("\n");
addToOutput($container);
}
function addSpecialMessage(klass, message) {
const $message = document.createElement("span");
$message.classList.add(klass);
$message.textContent = message;
$message.textContent += "\n";
addToOutput($message);
}
function addToOutput($elem) {
// TODO: Maybe allow for a little wiggle-room?
const wasAtBottom = window.innerHeight + window.scrollY >= document.body.offsetHeight;
const $target = document.getElementById("target");
$target.appendChild($elem);
if (wasAtBottom) {
window.scrollTo(0, document.body.scrollHeight);
}
}
main();
|
