fix: clean URL management

apps/playground-2d/src/level.ts

@@ -3,7 +3,7 @@ import { FSprite } from '@fibbojs/2d'
 
 function addBelowGround(scene: FScene, position: { x: number, y: number }) {
   const ground = new FSprite(scene, {
-    texture: '/fibbo/playground-2d/ground_0122.jpeg',
+    texture: 'ground_0122.jpeg',
     position,
   })
   ground.initCollider()
@@ -12,7 +12,7 @@ function addBelowGround(scene: FScene, position: { x: number, y: number }) {
 
 function addGround(scene: FScene, position: { x: number, y: number }) {
   const ground = new FSprite(scene, {
-    texture: '/fibbo/playground-2d/ground_0022.png',
+    texture: 'ground_0022.png',
     position,
   })
   ground.initCollider()
@@ -21,7 +21,7 @@ function addGround(scene: FScene, position: { x: number, y: number }) {
 
 function addBackground(scene: FScene, position: { x: number, y: number }) {
   const background = new FSprite(scene, {
-    texture: '/fibbo/playground-2d/background_0000.jpg',
+    texture: 'background_0000.jpg',
     position,
   })
   background.onLoaded(() => {
@@ -32,7 +32,7 @@ function addBackground(scene: FScene, position: { x: number, y: number }) {
 
 function addBackgroundDark(scene: FScene, position: { x: number, y: number }) {
   const background = new FSprite(scene, {
-    texture: '/fibbo/playground-2d/background_0016.png',
+    texture: 'background_0016.png',
     position,
   })
   background.onLoaded(() => {
@@ -44,12 +44,12 @@ function addBackgroundDark(scene: FScene, position: { x: number, y: number }) {
 function addBackgroundVariation(scene: FScene, position: { x: number, y: number }, variation = 0) {
   const background = new FSprite(scene, {
     texture: variation === 0
-      ? '/fibbo/playground-2d/background_0008.webp'
+      ? 'background_0008.webp'
       : variation === 1
-        ? '/fibbo/playground-2d/background_0009.png'
+        ? 'background_0009.png'
         : variation === 2
-          ? '/fibbo/playground-2d/background_0010.png'
-          : '/fibbo/playground-2d/background_0011.png',
+          ? 'background_0010.png'
+          : 'background_0011.png',
     position,
   })
   background.onLoaded(() => {

apps/playground-2d/src/main.ts

@@ -72,7 +72,7 @@ import { loadLevel } from './level'
 
   // Create a sprite
   const sprite = new FSprite(scene, {
-    texture: '/fibbo/playground-2d/bunny.png',
+    texture: 'bunny.png',
     position: { x: 2, y: 3 },
   })
   sprite.onLoaded(() => {

packages/2d/src/sprite/FSprite.ts

@@ -50,8 +50,26 @@ export class FSprite extends FComponent {
    * @param texture The path to the texture.
    */
   async loadTexture(texture: string) {
+    // Interpret path function
+    function interpretPath(path: string) {
+      // Resource URL (if it starts http, treat as a URL)
+      if (path.startsWith('http')) {
+        return path
+      }
+      // Absolute path (if it starts with /), add the current domain + path
+      else if (path.startsWith('/')) {
+        return `${window.location.href}${path}`
+      }
+      // Otherwise, treat as a relative path starting to the assets folder
+      else {
+        return `${window.location.href}/assets/${path}`
+      }
+    }
+
+    // Interpret the path
+    const path = interpretPath(texture)
     // Load the texture
-    this.texture = await PIXI.Assets.load(texture)
+    this.texture = await PIXI.Assets.load(path)
     this.texture.source.scaleMode = 'nearest'
     // Create a sprite
     this.container = new PIXI.Sprite(this.texture)

packages/3d/src/model/FModel.ts

@@ -61,7 +61,7 @@ export abstract class FModel extends FComponent {
 
     // Apply default options
     const DEFAULT_OPTIONS = {
-      path: `/models/${options.name}/${options.name}.${options.fileExtension || 'obj'}`,
+      path: `/assets/${options.name}/${options.name}.${options.fileExtension || 'obj'}`,
       textures: {},
       fileExtension: 'obj',
     }
@@ -86,9 +86,9 @@ export abstract class FModel extends FComponent {
       else if (path.startsWith('/')) {
         return `${window.location.href}${path}`
       }
-      // Otherwise, treat as a relative path starting to the models folder
+      // Otherwise, treat as a relative path starting to the assets folder
       else {
-        return `${window.location.href}/models/${path}`
+        return `${window.location.href}/assets/${path}`
       }
     }
 
@@ -165,7 +165,7 @@ export abstract class FModel extends FComponent {
       }
       else {
         // Otherwise, use a default path
-        texturePath = `models/${this.name}/Textures/colormap.png`
+        texturePath = `assets/${this.name}/Textures/colormap.png`
       }
       // Load the texture
       textureLoader.load(texturePath, (texture) => {