stef_buwalda/dashboard_test
1
0
Fork 0
mirror of https://github.com/StefBuwalda/dashboard_test.git synced 2025-10-29 10:49:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

Compare commits

base: stef_buwalda:446f36fc5b89dcc9cd3de26157b27aeae211a92b
Branches Tags
stef_buwalda:main
...
compare: stef_buwalda:324f75d100ee27c2c23d56462b42e63229bbb1d9
Branches Tags
stef_buwalda:main

5 Commits
446f36fc5b ... 324f75d100

Author SHA1 Message Date
Stef
324f75d100 Fixed margin and padding top 2025-09-02 22:09:52 +02:00
Stef
a63e313036 Increased wait bar size and fixed mobile viewing 2025-09-02 22:01:55 +02:00
Stef
0c580bc9f1 Improved the progress bar / waiting bar 2025-09-02 21:43:20 +02:00
Stef
5a42d998d6 Scuffed progress bar 2025-09-02 20:26:32 +02:00
Stef
7ad601fc14 Increased timeout to 4s and runs every 5s. Added a 5s wait in parralel with the pings to set it to a minimum of 5s but allows it to go longer. 2025-09-02 20:26:23 +02:00
2 changed files with 63 additions and 9 deletions
Expand all files Collapse all files

51
mem/templates/home.html
View File

@@ -2,20 +2,35 @@
<html lang="en" data-bs-theme="dark">
<head>
<meta ame="viewport" content="width=device-width, initial-scale=1" charset=" UTF-8">
<meta name="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">
<style>
/* Prevent Bootstrap's default 0.6s width tween that causes lag */
.progress-bar {
transition: none !important;
}
</style>
</head>
<body id="main_body" class="m-2 bg-light-subtle d-flex flex-wrap justify-content-center">
<body class="m-2 bg-light-subtle pt-3">
<div class="progress fixed-top mt-1" style="height: auto;">
<div id="progressBar" class="progress-bar rounded-pill" role="progressbar" style="width: 100%; margin: 0 auto;">
<h5 class="m-0">5s</h5>
</div>
</div>
<div id="main_body" class="d-flex flex-wrap justify-content-center"></div>
</body>
<script>
const main_body = document.getElementById("main_body");
const url = '/api/status';
const interval = 5000; // 5 seconds between requests
const progressBar = document.getElementById('progressBar');
function fetchData() {
fetch(url, { cache: 'no-store' })
.then(response => response.json())
@@ -25,19 +40,45 @@
})
.catch(error => console.error("Error fetching data", error))
.finally(() => {
setTimeout(fetchData, 5000); // schedule next request after 5 seconds
// Animate progress bar over 'interval' before next fetch
animateProgress(interval, () => {
fetchData(); // next fetch after animation
});
});
}
function animateProgress(duration, callback) {
const start = performance.now();
function frame(now) {
const elapsed = now - start;
const ratio = Math.min(elapsed / duration, 1);
progressBar.style.width = 100 * (1 - ratio) + "%";
progressBar.innerHTML = "<h5 class='m-0'>" + (interval * (1 - ratio) / 1000).toFixed(1) + "s</h5>";
if (ratio < 1) {
requestAnimationFrame(frame);
} else {
callback();
}
}
// reset bar and start animation
progressBar.style.width = '100%';
progressBar.textContent = '100%';
requestAnimationFrame(frame);
}
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">
<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: 175px">
<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>
<h4 class="text-center text-truncate m-0 p-1">${s.label}</h4>
</div>
<div class="position-relative ratio ratio-1x1">
<div class="d-flex justify-content-center align-items-center">

21
poll_services.py
View File

@@ -14,13 +14,14 @@ async def check_service(client: httpx.AsyncClient, s: service) -> log:
r = await client.head(
url=s.url,
follow_redirects=True,
timeout=1,
timeout=4,
)
case 1:
r = await client.get(
url=s.url,
follow_redirects=True,
timeout=1,
timeout=4,
headers={"Host": "plex.ihatemen.uk"},
)
case _:
raise httpx.HTTPError("Unknown ping type")
@@ -29,7 +30,13 @@ async def check_service(client: httpx.AsyncClient, s: service) -> log:
s.set_online(r.status_code == 200)
s.set_status(r.status_code)
s.set_ping(int((after - before) * 1000))
except httpx.HTTPError as e:
except httpx.ConnectTimeout:
s.set_error("Connection Timeout")
s.set_online(False)
s.set_status(None)
s.set_ping(None)
except Exception as e:
print(type(e))
s.set_error(str(e))
s.set_online(False)
s.set_status(None)
@@ -44,6 +51,11 @@ def start_async_loop():
loop.run_forever()
async def sleepTask():
await asyncio.sleep(5)
return log()
async def update_services(loop: asyncio.AbstractEventLoop):
print("Starting service updates...")
with app.app_context():
@@ -58,7 +70,9 @@ async def update_services(loop: asyncio.AbstractEventLoop):
check_service(public_client if s.public else local_client, s)
for s in services
]
tasks.append(sleepTask())
logs = await asyncio.gather(*tasks)
logs = logs[:-1]
try:
session.add_all(logs)
session.commit()
@@ -67,4 +81,3 @@ async def update_services(loop: asyncio.AbstractEventLoop):
raise e
finally:
session.close()
await asyncio.sleep(2)