Added logs for each ping. Contains no data yet and estimates 15.7 mil rows a year. Considering adding log aggregation. Moved some folders and files into mem folder due to circular import.

2025-10-30 11:19:58 +00:00 · 2025-09-02 09:34:46 +02:00
parent 28493e5790
commit 1f88bcf396
21 changed files with 70 additions and 16 deletions
--- a/mem/templates/home.html
+++ b/mem/templates/home.html
@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<html lang="en" data-bs-theme="dark">
+
+<head>
+    <meta ame="viewport" content="width=device-width, initial-scale=1" charset=" UTF-8">
+    <title>Dashboard</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet"
+        integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB" crossorigin="anonymous">
+    <link rel="icon" type="image/svg+xml" href="/static/favicon.svg">
+</head>
+
+<body id="main_body" class="m-2 bg-light-subtle d-flex flex-wrap justify-content-center">
+</body>
+
+<script>
+    const main_body = document.getElementById("main_body");
+    const url = '/api/status';
+
+    function fetchData() {
+        fetch(url, { cache: 'no-store' })
+            .then(response => response.json())
+            .then(data => {
+                console.log(data)
+                updateWebpage(data)
+            })
+            .catch(error => console.error("Error fetching data", error))
+            .finally(() => {
+                setTimeout(fetchData, 5000); // schedule next request after 5 seconds
+            });
+    }
+
+    function updateWebpage(services) {
+        main_body.innerHTML = ''; // Clear webpage
+
+        // Build all service divs as a single string
+        main_body.innerHTML = services.map(s => `
+        <a href="${s.url}" class="d-block text-body text-decoration-none m-2 border border-3 ${s.online ? 'border-success' : 'border-danger'}" style="width: 200px">
+            <div class="bg-body-tertiary d-flex flex-column align-items-center">
+                <div class="bg-dark w-100">
+                    <h4 class="text-center text-truncate m-0 p-1" style="font-size: 1.9rem;">${s.label}</h4>
+                </div>
+                <div class="position-relative ratio ratio-1x1">
+                    <div class="d-flex justify-content-center align-items-center">
+                        <img src="static/icons/${s.id}.${s.icon_filetype}" class="img-fluid w-75">
+                    </div>
+                    <div>
+                        ${s.public ? `` : `<img src='static/lock.svg' class='img-fluid position-absolute bottom-0 end-0 w-25'>`}
+                        <div class="position-absolute bottom-0 text-body bg-dark bg-opacity-75 px-1 rounded">${s.online ? s.ping + "ms" : ""}</div>
+                    </div>
+                </div>
+            </div>
+        </a>
+    `).join(''); // join into a single string
+    }
+
+    fetchData(); // start the loop
+</script>
+
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"
+    integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI"
+    crossorigin="anonymous"></script>
+
+</html>