pleb/beatsaber-overlay
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor async loading

Browse Source
This commit is contained in:
Isaiah Billingsley 2026-02-19 21:42:10 -05:00
parent 24abb71ee3
commit 92c2469b18
2 changed files with 22 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
main.js
View File

@ -26,7 +26,7 @@ function onMessage(e) {
case "event":
switch (data._event) {
case "gameState":
document.body.className = data.gameStateChanged;
document.body.dataset.gameState = data.gameStateChanged;
break;
case "mapInfo":
@ -59,7 +59,7 @@ const bsrKey = document.getElementById("bsrKey");
const type = document.getElementById("type");
/** @param {MapInfoChanged} data */
function updateMapInfo(data) {
async function updateMapInfo(data) {
const custom = data.level_id.startsWith("custom_level_");
cover.style.backgroundImage = data.coverRaw ? `url("data:image/jpeg;base64,${data.coverRaw}")` : "";
title.textContent = data.name || "";
@ -74,9 +74,10 @@ function updateMapInfo(data) {
// Fetch extra info from BeatSaver
if (custom) {
fetch(`https://api.beatsaver.com/maps/hash/${data.level_id.substring(13, 53)}`)
.then(response => response.json())
.then(map => {
document.body.classList.add("loading");
try {
const response = await fetch(`https://api.beatsaver.com/maps/hash/${data.level_id.substring(13, 53)}`);
const map = await response.json();
if (!map.id) return;
bsrKey.textContent = map.id;
mapper.textContent = map.metadata.levelAuthorName; // Replace mapper name with full authors list
@ -85,10 +86,14 @@ function updateMapInfo(data) {
d.characteristic === data.characteristic && d.difficulty === data.difficulty
);
if (diff.label) difficultyLabel.textContent = diff.label;
});
} finally {
document.body.classList.remove("loading");
}
}
}
connect();
document.documentElement.onclick = () => document.body.classList.toggle("Playing");
document.documentElement.onclick = function() {
document.body.dataset.gameState = document.body.dataset.gameState === "Playing" ? "Menu" : "Playing";
};

4
style.css
View File

@ -20,10 +20,10 @@ body {
color: white;
filter: drop-shadow(0 0 0.1rem black) drop-shadow(0 0 0.1rem black);
transition: opacity 300ms ease-out;
transition-delay: 200ms;
}
body:not(.Playing) {
body.loading,
body:not([data-game-state="Playing"]) {
opacity: 0;
}