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:
@@ -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);
|
||||
|
||||
Reference in New Issue
Block a user