mirror of
https://github.com/StefBuwalda/dashboard_test.git
synced 2025-10-30 03:09:59 +00:00
Compare commits
5 Commits
446f36fc5b
...
324f75d100
| Author | SHA1 | Date | |
|---|---|---|---|
| 324f75d100 | |||
| a63e313036 | |||
| 0c580bc9f1 | |||
| 5a42d998d6 | |||
| 7ad601fc14 |
@@ -2,20 +2,35 @@
|
|||||||
<html lang="en" data-bs-theme="dark">
|
<html lang="en" data-bs-theme="dark">
|
||||||
|
|
||||||
<head>
|
<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>
|
<title>Dashboard</title>
|
||||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet"
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||||
integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB" crossorigin="anonymous">
|
integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB" crossorigin="anonymous">
|
||||||
<link rel="icon" type="image/svg+xml" href="/static/favicon.svg">
|
<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>
|
</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>
|
</body>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
const main_body = document.getElementById("main_body");
|
const main_body = document.getElementById("main_body");
|
||||||
const url = '/api/status';
|
const url = '/api/status';
|
||||||
|
|
||||||
|
const interval = 5000; // 5 seconds between requests
|
||||||
|
const progressBar = document.getElementById('progressBar');
|
||||||
|
|
||||||
function fetchData() {
|
function fetchData() {
|
||||||
fetch(url, { cache: 'no-store' })
|
fetch(url, { cache: 'no-store' })
|
||||||
.then(response => response.json())
|
.then(response => response.json())
|
||||||
@@ -25,19 +40,45 @@
|
|||||||
})
|
})
|
||||||
.catch(error => console.error("Error fetching data", error))
|
.catch(error => console.error("Error fetching data", error))
|
||||||
.finally(() => {
|
.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) {
|
function updateWebpage(services) {
|
||||||
main_body.innerHTML = ''; // Clear webpage
|
main_body.innerHTML = ''; // Clear webpage
|
||||||
|
|
||||||
// Build all service divs as a single string
|
// Build all service divs as a single string
|
||||||
main_body.innerHTML = services.map(s => `
|
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-body-tertiary d-flex flex-column align-items-center">
|
||||||
<div class="bg-dark w-100">
|
<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>
|
||||||
<div class="position-relative ratio ratio-1x1">
|
<div class="position-relative ratio ratio-1x1">
|
||||||
<div class="d-flex justify-content-center align-items-center">
|
<div class="d-flex justify-content-center align-items-center">
|
||||||
|
|||||||
@@ -14,13 +14,14 @@ async def check_service(client: httpx.AsyncClient, s: service) -> log:
|
|||||||
r = await client.head(
|
r = await client.head(
|
||||||
url=s.url,
|
url=s.url,
|
||||||
follow_redirects=True,
|
follow_redirects=True,
|
||||||
timeout=1,
|
timeout=4,
|
||||||
)
|
)
|
||||||
case 1:
|
case 1:
|
||||||
r = await client.get(
|
r = await client.get(
|
||||||
url=s.url,
|
url=s.url,
|
||||||
follow_redirects=True,
|
follow_redirects=True,
|
||||||
timeout=1,
|
timeout=4,
|
||||||
|
headers={"Host": "plex.ihatemen.uk"},
|
||||||
)
|
)
|
||||||
case _:
|
case _:
|
||||||
raise httpx.HTTPError("Unknown ping type")
|
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_online(r.status_code == 200)
|
||||||
s.set_status(r.status_code)
|
s.set_status(r.status_code)
|
||||||
s.set_ping(int((after - before) * 1000))
|
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_error(str(e))
|
||||||
s.set_online(False)
|
s.set_online(False)
|
||||||
s.set_status(None)
|
s.set_status(None)
|
||||||
@@ -44,6 +51,11 @@ def start_async_loop():
|
|||||||
loop.run_forever()
|
loop.run_forever()
|
||||||
|
|
||||||
|
|
||||||
|
async def sleepTask():
|
||||||
|
await asyncio.sleep(5)
|
||||||
|
return log()
|
||||||
|
|
||||||
|
|
||||||
async def update_services(loop: asyncio.AbstractEventLoop):
|
async def update_services(loop: asyncio.AbstractEventLoop):
|
||||||
print("Starting service updates...")
|
print("Starting service updates...")
|
||||||
with app.app_context():
|
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)
|
check_service(public_client if s.public else local_client, s)
|
||||||
for s in services
|
for s in services
|
||||||
]
|
]
|
||||||
|
tasks.append(sleepTask())
|
||||||
logs = await asyncio.gather(*tasks)
|
logs = await asyncio.gather(*tasks)
|
||||||
|
logs = logs[:-1]
|
||||||
try:
|
try:
|
||||||
session.add_all(logs)
|
session.add_all(logs)
|
||||||
session.commit()
|
session.commit()
|
||||||
@@ -67,4 +81,3 @@ async def update_services(loop: asyncio.AbstractEventLoop):
|
|||||||
raise e
|
raise e
|
||||||
finally:
|
finally:
|
||||||
session.close()
|
session.close()
|
||||||
await asyncio.sleep(2)
|
|
||||||
|
|||||||
Reference in New Issue
Block a user