fix: resolve asset paths relative to document base URI

Assets were 404ing because relative paths resolved against the wrong
base when the page was served from a subdirectory.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Jose Luis
2026-03-20 16:04:14 +01:00
parent c836ccbb21
commit bc9786ce49

View File

@@ -37,11 +37,14 @@ export async function preloadAssets() {
const loads = [];
// Resolve asset base path relative to the HTML document
const base = new URL('.', document.baseURI).href;
// Map backgrounds
loads.push(loadImage('map:lab', 'assets/map/lab.png'));
loads.push(loadImage('map:pallet-town', 'assets/map/pallet-town.png'));
loads.push(loadImage('map:house-a-1f', 'assets/map/house-a-1f.png'));
loads.push(loadImage('map:route-1', 'assets/map/route-1.png'));
loads.push(loadImage('map:lab', `${base}assets/map/lab.png`));
loads.push(loadImage('map:pallet-town', `${base}assets/map/pallet-town.png`));
loads.push(loadImage('map:house-a-1f', `${base}assets/map/house-a-1f.png`));
loads.push(loadImage('map:route-1', `${base}assets/map/route-1.png`));
// Character sprites (32x32 each)
const dirs = ['front', 'back', 'left', 'right'];
@@ -49,14 +52,14 @@ export async function preloadAssets() {
for (const dir of dirs) {
for (const frame of frames) {
const key = `char:${dir}-${frame}`;
loads.push(loadImage(key, `assets/character/${dir}-${frame}.png`));
loads.push(loadImage(key, `${base}assets/character/${dir}-${frame}.png`));
}
}
// NPC sprites (16x16 each)
const npcDirs = ['down', 'up', 'left', 'right'];
for (const d of npcDirs) {
loads.push(loadImage(`npc:a-${d}`, `assets/npcs/a-${d}.png`));
loads.push(loadImage(`npc:a-${d}`, `${base}assets/npcs/a-${d}.png`));
}
await Promise.all(loads);