fix online status not updating after changing pages

This commit is contained in:
2024-09-14 16:31:28 +02:00
parent dacb27b7a8
commit 13f8b6b6dc
+11 -4
View File
@@ -63,13 +63,18 @@ const permalink = Astro?.site?.href ?? '/';
</div>
</BaseLayout>
<script lang="ts" client:load>
const status = document.querySelector("#online-status");
const game = document.querySelector("#online-game");
<script>
let task = -1;
document.addEventListener('astro:page-load', () => {
updateOnlineStatus();
});
async function updateOnlineStatus() {
clearTimeout(task);
const status = document.querySelector("#online-status");
const game = document.querySelector("#online-game");
if (!status || !game) return;
console.debug("Updating online status...");
const response = await fetch("https://api.youhavetrouble.me/online");
const data = await response.json();
@@ -78,7 +83,7 @@ const permalink = Astro?.site?.href ?? '/';
status.textContent = online ? "Online" : "Offline";
status.classList.value = online ? "online" : "offline";
game.textContent = gameName ? `, playing: ${gameName}` : "";
setTimeout(updateOnlineStatus, 10000);
setTimeout(updateOnlineStatus, 5000);
}
</script>
@@ -119,9 +124,11 @@ const permalink = Astro?.site?.href ?? '/';
background-color: #cc8d2e;
transition: background-color 0.2s;
}
&.online::before {
background-color: #2ecc71;
}
&.offline::before {
background-color: #e74c3c;
}