spacebar/SplatNet
spacebar/SplatNet
Watch
13
1
Fork
You've already forked SplatNet
 1
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

migrate to javascript from python

Browse source
This commit is contained in:
kittentm 2026-01-16 02:30:44 +01:00
commit 0406f77af7
3 changed files with 94 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

17
html/stages/stages.html
View file

@ -51,7 +51,8 @@
/* MAIN CONTENT */ /* MAIN CONTENT */
.content { .content {
display: flex; display: flex;
justify-content: center; flex-direction: column;
align-items: center;
padding-top: 24px; padding-top: 24px;
} }
@ -59,9 +60,19 @@
width: 65%; width: 65%;
max-width: 600px; max-width: 600px;
height: auto; height: auto;
margin-bottom: 20px;
}
.stages-container {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
gap: 30px;
} }
</style> </style>
</head> </head>
<body> <body>
<div class="header"> <div class="header">
@ -71,7 +82,11 @@
<div class="content"> <div class="content">
<img src="../../assets/stageinfo.png" class="stage-info" alt="Stage Info"> <img src="../../assets/stageinfo.png" class="stage-info" alt="Stage Info">
<div class="stages-container" id="stages-container"></div>
</div> </div>
<script src="stages.js"></script>
</body> </body>
</html> </html>

77
html/stages/stages.js Normal file
View file

@ -0,0 +1,77 @@
const API_URL = "https://api.splatcord.ink/prod/s1rotations";
function stageNames(stages, lang = "en-US") {
return stages.map(s => s.translatedNames[lang]);
}
function stageImagePath(stageName) {
const firstWord = stageName
.split(" ")[0]
.toLowerCase()
.replace(/['.]/g, "");
return `../../assets/stages/${firstWord}.jpg`;
}
async function fetchRotations() {
const res = await fetch(API_URL);
const data = await res.json();
const rotations = data?.pretendo?.rotations ?? {};
const now = new Date();
const timestamps = Object.keys(rotations).sort(
(a, b) => Number(a) - Number(b)
);
for (const ts of timestamps) {
const start = new Date(Number(ts));
const end = new Date(start.getTime() + 2 * 60 * 60 * 1000);
if (end < now) continue;
const r = rotations[ts];
return [{
turf: stageNames(r.turfStages).map(stageImagePath),
ranked: stageNames(r.rankedStages).map(stageImagePath),
ranked_mode: r.rankedMode?.translatedNames?.["en-US"] ?? "Ranked"
}];
}
return [];
}
async function renderStages() {
const container = document.getElementById("stages-container");
const rotations = await fetchRotations();
if (!rotations.length) {
container.innerHTML = "<h2>No rotations available</h2>";
return;
}
for (const rotation of rotations) {
container.innerHTML += `
<div class="stages-section">
<h2>Turf War</h2>
<div class="stages">
${rotation.turf.map(img =>
`<img src="${img}" alt="Turf Stage">`
).join("")}
</div>
</div>
<div class="stages-section">
<h2>Ranked Battle (${rotation.ranked_mode})</h2>
<div class="stages">
${rotation.ranked.map(img =>
`<img src="${img}" alt="Ranked Stage">`
).join("")}
</div>
</div>
`;
}
}
renderStages();

2
html/stages/styles.css
View file

@ -3,4 +3,4 @@
justify-content: center; justify-content: center;
padding-top: 24px; padding-top: 24px;
padding-bottom: 300px; /* forces scroll */ padding-bottom: 300px; /* forces scroll */
} }