kitten/SplatNet
Watch
0
0
Fork
You've already forked SplatNet
 0
forked from spacebar/SplatNet
Code Pull requests Activity

Ranking: dont display content until finished loading

Browse source
This commit is contained in:
kittentm 2026-03-22 16:51:18 +01:00
commit 7b586bbd5e
No known key found for this signature in database
GPG key ID: AC43DFDBC1F44A91
2 changed files with 33 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

4
ranking/index.html
View file

@ -34,7 +34,7 @@
</div> </div>
</div> </div>
<div class="mode-selection"> <div class="mode-selection" style="display: none;">
<a href="?mode=regular" class="mode-button" id="link-regular"> <a href="?mode=regular" class="mode-button" id="link-regular">
<img id="img-regular" src="../assets/en/svg/ui/btn_tab_regular-40682de5f47922c608c0ddf6eddd44efcf4b0516092041cdb48977f777030487.svg" alt="Turf War"> <img id="img-regular" src="../assets/en/svg/ui/btn_tab_regular-40682de5f47922c608c0ddf6eddd44efcf4b0516092041cdb48977f777030487.svg" alt="Turf War">
</a> </a>
@ -46,7 +46,7 @@
</a> </a>
</div> </div>
<div class="rank-glass-panel"> <div class="rank-glass-panel" style="display: none;">
<div class="rank-header-area"> <div class="rank-header-area">
<img id="rank-mode-title" src="/assets/en/svg/text/scene/rank/tx_splatfest-7a0ef00ee7f4877df0c7b32998f6bad81fd3f8c28e287168dfffe7d6efb09f77.svg" class="splatfest-title-svg"> <img id="rank-mode-title" src="/assets/en/svg/text/scene/rank/tx_splatfest-7a0ef00ee7f4877df0c7b32998f6bad81fd3f8c28e287168dfffe7d6efb09f77.svg" class="splatfest-title-svg">
<div class="splatfest-subtitle">Rice VS Bread</div> <div class="splatfest-subtitle">Rice VS Bread</div>

51
ranking/rank.js
View file

@ -203,6 +203,12 @@ window.loadHeader(async function(headerContainer) {
const modeTitleImg = document.getElementById('rank-mode-title'); const modeTitleImg = document.getElementById('rank-mode-title');
const splatfestSubtitle = document.querySelector('.splatfest-subtitle'); const splatfestSubtitle = document.querySelector('.splatfest-subtitle');
const modeSelection = document.querySelector('.mode-selection');
const glassPanel = document.querySelector('.rank-glass-panel');
if (modeSelection) modeSelection.style.display = 'flex';
if (glassPanel) glassPanel.style.display = 'block';
const images = { const images = {
regular: "../assets/en/svg/ui/btn_tab_regular_selected-b636e3d21ace9434120061a32658b21a34feb6468553b6d6da30ce890b85ec1f.svg", regular: "../assets/en/svg/ui/btn_tab_regular_selected-b636e3d21ace9434120061a32658b21a34feb6468553b6d6da30ce890b85ec1f.svg",
gachi: "../assets/en/svg/ui/btn_tab_gachi_selected-4796f167399dca12cb274dcb0348cdf709a1f722ddd241210e55a3e04fdb6ff4.svg", gachi: "../assets/en/svg/ui/btn_tab_gachi_selected-4796f167399dca12cb274dcb0348cdf709a1f722ddd241210e55a3e04fdb6ff4.svg",
@ -230,30 +236,35 @@ window.loadHeader(async function(headerContainer) {
renderRankings(mode); renderRankings(mode);
}; };
const init = () => { const init = async () => {
const cachedUser = sessionStorage.getItem('user_cache'); const cachedUser = sessionStorage.getItem('user_cache');
if (cachedUser) renderData(JSON.parse(cachedUser)); if (cachedUser) renderData(JSON.parse(cachedUser));
fetch("/api/v1/me", { credentials: 'include' }) try {
.then(res => res.ok ? res.json() : Promise.reject(res)) await Promise.all([
.then(data => { fetch("/api/v1/me", { credentials: 'include' })
if (!data) return; .then(res => res.ok ? res.json() : Promise.reject(res))
sessionStorage.setItem('user_cache', JSON.stringify(data)); .then(data => {
renderData(data); if (!data) return;
}).catch(() => {}); sessionStorage.setItem('user_cache', JSON.stringify(data));
renderData(data);
}).catch(() => {}),
fetch("/api/v1/leaderboard") fetch("/api/v1/leaderboard")
.then(res => res.json()) .then(res => res.json())
.then(data => { .then(data => {
cachedLeaderboardData = data; cachedLeaderboardData = data;
const urlParams = new URLSearchParams(window.location.search); const urlParams = new URLSearchParams(window.location.search);
const mode = urlParams.get('mode') || 'regular'; const mode = urlParams.get('mode') || 'regular';
updateTabUI(mode); updateTabUI(mode);
})
const loadingOverlay = document.getElementById("loading-overlay"); ]);
if (loadingOverlay) loadingOverlay.style.display = "none"; } catch (err) {
}) console.error("Initialization failed:", err);
.catch(err => console.error("Leaderboard preload failed:", err)); } finally {
const loadingOverlay = document.getElementById("loading-overlay");
if (loadingOverlay) loadingOverlay.style.display = "none";
}
}; };
document.querySelectorAll('.mode-selection a').forEach(link => { document.querySelectorAll('.mode-selection a').forEach(link => {