@rpgjs/client 5.0.0-alpha.14 → 5.0.0-alpha.15

package/dist/index40.js

@@ -1,5 +1,5 @@
 import { useProps, useDefineProps, mount, signal, h, Container, loop, Howl, computed } from 'canvasengine';
-import component$1 from './index42.js';
+import component$1 from './index43.js';
 import { RpgClientEngine } from './index2.js';
 import { inject } from './index6.js';
 

package/dist/index41.js

@@ -1,4 +1,4 @@
-import * as external from './index38.js';
+import * as external from './index36.js';
 
 
 

package/dist/index42.js

@@ -1,20 +1,123 @@
-import { useProps, useDefineProps, animatedSignal, h, Container, Rect, Text } from 'canvasengine';
+import { RpgCommonPlayer, ModulesToken } from '@rpgjs/common';
+import { trigger, signal } from 'canvasengine';
+import { inject } from './index6.js';
+import { RpgClientEngine } from './index2.js';
 
-function component($$props) {
-        useProps($$props);
-        const defineProps = useDefineProps($$props);
-        var _a = defineProps(), text = _a.text, isSelected = _a.isSelected;
-var alpha = animatedSignal(1, {
-    repeatType: "reverse",
-    duration: 500,
-    repeat: Infinity,
-});
-alpha.set(0.5);
-var height = 40;
-var width = 256;
-        let $this = h(Container, null, [h(Rect, { width, height, color: '#595971', alpha, visible: isSelected }), h(Container, { flexDirection: 'row', alignItems: 'center', justifyContent: 'center' }, h(Text, { text, color: '#fff', fontSize: 18, margin: 10 }))]);
-        return $this
+class RpgClientObject extends RpgCommonPlayer {
+  constructor() {
+    super();
+    this.emitParticleTrigger = trigger();
+    this.particleName = signal("");
+    this.animationCurrentIndex = signal(0);
+    this.animationIsPlaying = signal(false);
+    this._param = signal({});
+    this.frames = [];
+    this.hooks.callHooks("client-sprite-onInit", this).subscribe();
+    this._frames.observable.subscribe(({ items }) => {
+      if (!this.id) return;
+      this.frames = [...this.frames, ...items];
+    });
+    this.engine.tick.pipe(
+      //throttleTime(10)
+    ).subscribe(() => {
+      const frame = this.frames.shift();
+      if (frame) {
+        const entity = this.engine.scene.getBody(this.id);
+        const isLocalPlayer = this.id === this.engine.playerIdSignal();
+        if (entity && !isLocalPlayer) {
+          const { x: oldX, y: oldY } = entity.position;
+          const dt = 1 / 60;
+          const velocity = {
+            x: (frame.x - oldX) / dt,
+            y: (frame.y - oldY) / dt
+          };
+          entity.setVelocity(velocity);
+        }
+        this.engine.scene.setBodyPosition(this.id, frame.x, frame.y);
       }
+    });
+  }
+  get hooks() {
+    return inject(ModulesToken);
+  }
+  get engine() {
+    return inject(RpgClientEngine);
+  }
+  flash(color, duration = 100) {
+    return new Promise((resolve) => {
+      const lastTint = this.tint();
+      this.tint.set(color);
+      setTimeout(() => {
+        this.tint.set(lastTint);
+        resolve(true);
+      }, duration);
+    });
+  }
+  /**
+   * Reset animation state when animation changes externally
+   * 
+   * This method should be called when the animation changes due to movement
+   * or other external factors to ensure the animation system doesn't get stuck
+   * 
+   * @example
+   * ```ts
+   * // Reset when player starts moving
+   * player.resetAnimationState();
+   * ```
+   */
+  resetAnimationState() {
+    this.animationIsPlaying.set(false);
+    this.animationCurrentIndex.set(0);
+    if (this.animationSubscription) {
+      this.animationSubscription.unsubscribe();
+      this.animationSubscription = void 0;
+    }
+  }
+  /**
+   * Set a custom animation for a specific number of times
+   * 
+   * Plays a custom animation for the specified number of repetitions.
+   * The animation system prevents overlapping animations and automatically
+   * returns to the previous animation when complete.
+   * 
+   * @param animationName - Name of the animation to play
+   * @param nbTimes - Number of times to repeat the animation (default: Infinity for continuous)
+   * 
+   * @example
+   * ```ts
+   * // Play attack animation 3 times
+   * player.setAnimation('attack', 3);
+   * 
+   * // Play continuous spell animation
+   * player.setAnimation('spell');
+   * ```
+   */
+  setAnimation(animationName, nbTimes = Infinity) {
+    if (this.animationIsPlaying()) return;
+    this.animationIsPlaying.set(true);
+    const previousAnimationName = this.animationName();
+    this.animationCurrentIndex.set(0);
+    if (this.animationSubscription) {
+      this.animationSubscription.unsubscribe();
+    }
+    this.animationSubscription = this.animationCurrentIndex.observable.subscribe((index) => {
+      if (index >= nbTimes) {
+        this.animationCurrentIndex.set(0);
+        this.animationName.set(previousAnimationName);
+        this.animationIsPlaying.set(false);
+        if (this.animationSubscription) {
+          this.animationSubscription.unsubscribe();
+          this.animationSubscription = void 0;
+        }
+      }
+    });
+    this.animationName.set(animationName);
+  }
+  showComponentAnimation(id, params) {
+    const engine = inject(RpgClientEngine);
+    engine.getComponentAnimation(id).displayEffect(params, this);
+  }
+}
 
-export { component as default };
+export { RpgClientObject };
 //# sourceMappingURL=index42.js.map

package/dist/index42.js.map

@@ -1 +1 @@
-{"version":3,"file":"index42.js","sources":["../src/components/gui/dialogbox/itemMenu.ce"],"sourcesContent":["<Container>\n    <Rect width height color=\"#595971\" alpha visible={isSelected} />\n    <Container flexDirection=\"row\" alignItems=\"center\" justifyContent=\"center\">\n        <Text text color=\"#fff\" fontSize={18} margin={10} />\n    </Container>\n</Container>\n\n<script>\nimport { animatedSignal } from \"canvasengine\";\n\nconst { text, isSelected } = defineProps();\n\nconst alpha = animatedSignal(1, {\n    repeatType: \"reverse\",\n    duration: 500,\n    repeat: Infinity,\n});\n\nalpha.set(0.5);\n\nconst height = 40;\nconst width = 256;\n</script>"],"names":[],"mappings":";;AAQqB,SAAS,SAAS,CAAC,OAAO,EAAE;AACjD,QAAuB,QAAQ,CAAC,OAAO;AACvC,QAAQ,MAAM,WAAW,GAAG,cAAc,CAAC,OAAO;AAClD,QAAQ,IAAI,EAAE,GAAG,WAAW,EAAE,EAAE,IAAI,GAAG,EAAE,CAAC,IAAI,EAAE,UAAU,GAAG,EAAE,CAAC,UAAU;AAC1E,IAAI,KAAK,GAAG,cAAc,CAAC,CAAC,EAAE;AAC9B,IAAI,UAAU,EAAE,SAAS;AACzB,IAAI,QAAQ,EAAE,GAAG;AACjB,IAAI,MAAM,EAAE,QAAQ;AACpB,CAAC,CAAC;AACF,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC;AACd,IAAI,MAAM,GAAG,EAAE;AACf,IAAI,KAAK,GAAG,GAAG;AACf,QAAQ,IAAI,KAAK,GAAG,CAAC,CAAC,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC,SAAS,EAAE,EAAE,aAAa,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAE,QAAQ,EAAE,EAAE,CAAC,CAAC,IAAI,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC;AACrQ,QAAQ,OAAO;AACf,MAAM;;;;"}
+{"version":3,"file":"index42.js","sources":["../src/Game/Object.ts"],"sourcesContent":["import { Hooks, ModulesToken, RpgCommonPlayer } from \"@rpgjs/common\";\nimport { sync } from \"@signe/sync\";\nimport { trigger, signal } from \"canvasengine\";\nimport { debounceTime, Subscription, throttleTime } from \"rxjs\";\nimport { inject } from \"../core/inject\";\nimport { RpgClientEngine } from \"../RpgClientEngine\";\n\nexport abstract class RpgClientObject extends RpgCommonPlayer {\n  abstract type: string;\n  emitParticleTrigger = trigger()\n  particleName = signal('')\n  animationCurrentIndex = signal(0)\n  animationIsPlaying = signal(false)\n  _param = signal({})\n  frames: { x: number; y: number; ts: number }[] = []\n\n  constructor() {\n    super()\n    this.hooks.callHooks(\"client-sprite-onInit\", this).subscribe();\n\n    this._frames.observable.subscribe(({ items }) => {\n      if (!this.id) return;\n      //if (this.id == this.engine.playerIdSignal()!) return;\n      this.frames = [...this.frames, ...items]\n    })\n\n    this.engine.tick\n      .pipe(\n      //throttleTime(10)\n    )\n      .subscribe(() => {\n        const frame = this.frames.shift()\n        if (frame) {\n          const entity = this.engine.scene.getBody(this.id)\n          const isLocalPlayer = this.id === this.engine.playerIdSignal()\n          if (entity && !isLocalPlayer) {\n            const { x: oldX, y: oldY } = entity.position\n            const dt = 1 / 60 // Assume 60 FPS for now\n            const velocity = {\n              x: (frame.x - oldX) / dt,\n              y: (frame.y - oldY) / dt\n            }\n            entity.setVelocity(velocity)\n          }\n          this.engine.scene.setBodyPosition(this.id, frame.x, frame.y)\n        }\n      })\n  }\n\n  get hooks() {\n    return inject<Hooks>(ModulesToken);\n  }\n\n  get engine() {\n    return inject(RpgClientEngine)\n  }\n\n  private animationSubscription?: Subscription\n\n  flash(color: string, duration: number = 100) {\n    return new Promise((resolve) => {\n      const lastTint = this.tint()\n      this.tint.set(color);\n      setTimeout(() => {\n        this.tint.set(lastTint)\n        resolve(true)\n      }, duration)\n    })\n  }\n\n  /**\n   * Reset animation state when animation changes externally\n   * \n   * This method should be called when the animation changes due to movement\n   * or other external factors to ensure the animation system doesn't get stuck\n   * \n   * @example\n   * ```ts\n   * // Reset when player starts moving\n   * player.resetAnimationState();\n   * ```\n   */\n  resetAnimationState() {\n    this.animationIsPlaying.set(false);\n    this.animationCurrentIndex.set(0);\n    if (this.animationSubscription) {\n      this.animationSubscription.unsubscribe();\n      this.animationSubscription = undefined;\n    }\n  }\n\n  /**\n   * Set a custom animation for a specific number of times\n   * \n   * Plays a custom animation for the specified number of repetitions.\n   * The animation system prevents overlapping animations and automatically\n   * returns to the previous animation when complete.\n   * \n   * @param animationName - Name of the animation to play\n   * @param nbTimes - Number of times to repeat the animation (default: Infinity for continuous)\n   * \n   * @example\n   * ```ts\n   * // Play attack animation 3 times\n   * player.setAnimation('attack', 3);\n   * \n   * // Play continuous spell animation\n   * player.setAnimation('spell');\n   * ```\n   */\n  setAnimation(animationName: string, nbTimes: number = Infinity) {\n    if (this.animationIsPlaying()) return;\n    this.animationIsPlaying.set(true);\n    const previousAnimationName = this.animationName();\n    this.animationCurrentIndex.set(0);\n\n    // Clean up any existing subscription\n    if (this.animationSubscription) {\n      this.animationSubscription.unsubscribe();\n    }\n\n    this.animationSubscription = this.animationCurrentIndex.observable.subscribe(index => {\n      if (index >= nbTimes) {\n        this.animationCurrentIndex.set(0);\n        this.animationName.set(previousAnimationName);\n        this.animationIsPlaying.set(false);\n        if (this.animationSubscription) {\n          this.animationSubscription.unsubscribe();\n          this.animationSubscription = undefined;\n        }\n      }\n    })\n    this.animationName.set(animationName);\n  }\n\n  showComponentAnimation(id: string, params: any) {\n    const engine = inject(RpgClientEngine)\n    engine.getComponentAnimation(id).displayEffect(params, this)\n  }\n}   "],"names":[],"mappings":"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"}

package/dist/index43.js

@@ -1,96 +1,20 @@
-import { RpgCommonPlayer, ModulesToken } from '@rpgjs/common';
-import { trigger, signal } from 'canvasengine';
-import { inject } from './index6.js';
-import { RpgClientEngine } from './index2.js';
+import { useProps, useDefineProps, animatedSignal, h, Container, Rect, Text } from 'canvasengine';
 
-class RpgClientObject extends RpgCommonPlayer {
-  constructor() {
-    super();
-    this.emitParticleTrigger = trigger();
-    this.particleName = signal("");
-    this.animationCurrentIndex = signal(0);
-    this.animationIsPlaying = signal(false);
-    this._param = signal({});
-    this.hooks.callHooks("client-sprite-onInit", this).subscribe();
-  }
-  get hooks() {
-    return inject(ModulesToken);
-  }
-  flash(color, duration = 100) {
-    return new Promise((resolve) => {
-      const lastTint = this.tint();
-      this.tint.set(color);
-      setTimeout(() => {
-        this.tint.set(lastTint);
-        resolve(true);
-      }, duration);
-    });
-  }
-  /**
-   * Reset animation state when animation changes externally
-   * 
-   * This method should be called when the animation changes due to movement
-   * or other external factors to ensure the animation system doesn't get stuck
-   * 
-   * @example
-   * ```ts
-   * // Reset when player starts moving
-   * player.resetAnimationState();
-   * ```
-   */
-  resetAnimationState() {
-    this.animationIsPlaying.set(false);
-    this.animationCurrentIndex.set(0);
-    if (this.animationSubscription) {
-      this.animationSubscription.unsubscribe();
-      this.animationSubscription = void 0;
-    }
-  }
-  /**
-   * Set a custom animation for a specific number of times
-   * 
-   * Plays a custom animation for the specified number of repetitions.
-   * The animation system prevents overlapping animations and automatically
-   * returns to the previous animation when complete.
-   * 
-   * @param animationName - Name of the animation to play
-   * @param nbTimes - Number of times to repeat the animation (default: Infinity for continuous)
-   * 
-   * @example
-   * ```ts
-   * // Play attack animation 3 times
-   * player.setAnimation('attack', 3);
-   * 
-   * // Play continuous spell animation
-   * player.setAnimation('spell');
-   * ```
-   */
-  setAnimation(animationName, nbTimes = Infinity) {
-    if (this.animationIsPlaying()) return;
-    this.animationIsPlaying.set(true);
-    const previousAnimationName = this.animationName();
-    this.animationCurrentIndex.set(0);
-    if (this.animationSubscription) {
-      this.animationSubscription.unsubscribe();
-    }
-    this.animationSubscription = this.animationCurrentIndex.observable.subscribe((index) => {
-      if (index >= nbTimes) {
-        this.animationCurrentIndex.set(0);
-        this.animationName.set(previousAnimationName);
-        this.animationIsPlaying.set(false);
-        if (this.animationSubscription) {
-          this.animationSubscription.unsubscribe();
-          this.animationSubscription = void 0;
-        }
+function component($$props) {
+        useProps($$props);
+        const defineProps = useDefineProps($$props);
+        var _a = defineProps(), text = _a.text, isSelected = _a.isSelected;
+var alpha = animatedSignal(1, {
+    repeatType: "reverse",
+    duration: 500,
+    repeat: Infinity,
+});
+alpha.set(0.5);
+var height = 40;
+var width = 256;
+        let $this = h(Container, null, [h(Rect, { width, height, color: '#595971', alpha, visible: isSelected }), h(Container, { flexDirection: 'row', alignItems: 'center', justifyContent: 'center' }, h(Text, { text, color: '#fff', fontSize: 18, margin: 10 }))]);
+        return $this
       }
-    });
-    this.animationName.set(animationName);
-  }
-  showComponentAnimation(id, params) {
-    const engine = inject(RpgClientEngine);
-    engine.getComponentAnimation(id).displayEffect(params, this);
-  }
-}
 
-export { RpgClientObject };
+export { component as default };
 //# sourceMappingURL=index43.js.map

package/dist/index43.js.map

@@ -1 +1 @@
-{"version":3,"file":"index43.js","sources":["../src/Game/Object.ts"],"sourcesContent":["import { Hooks, ModulesToken, RpgCommonPlayer } from \"@rpgjs/common\";\nimport { sync } from \"@signe/sync\";\nimport { trigger, signal } from \"canvasengine\";\nimport { Subscription } from \"rxjs\";\nimport { inject } from \"../core/inject\";\nimport { RpgClientEngine } from \"../RpgClientEngine\";\n\nexport abstract class RpgClientObject extends RpgCommonPlayer {\n  abstract type: string;\n  emitParticleTrigger = trigger()\n  particleName = signal('')\n  animationCurrentIndex = signal(0)\n  animationIsPlaying = signal(false)\n  _param = signal({})\n\n  constructor() {\n    super()\n    this.hooks.callHooks(\"client-sprite-onInit\", this).subscribe();\n  }\n\n  get hooks() {\n    return inject<Hooks>(ModulesToken);\n  }\n  \n  private animationSubscription?: Subscription\n\n  flash(color: string, duration: number = 100) {\n    return new Promise((resolve) => {\n      const lastTint = this.tint()\n      this.tint.set(color);\n      setTimeout(() => {\n        this.tint.set(lastTint)\n        resolve(true)\n      }, duration)\n    })\n  }\n\n  /**\n   * Reset animation state when animation changes externally\n   * \n   * This method should be called when the animation changes due to movement\n   * or other external factors to ensure the animation system doesn't get stuck\n   * \n   * @example\n   * ```ts\n   * // Reset when player starts moving\n   * player.resetAnimationState();\n   * ```\n   */\n  resetAnimationState() {\n    this.animationIsPlaying.set(false);\n    this.animationCurrentIndex.set(0);\n    if (this.animationSubscription) {\n      this.animationSubscription.unsubscribe();\n      this.animationSubscription = undefined;\n    }\n  }\n\n  /**\n   * Set a custom animation for a specific number of times\n   * \n   * Plays a custom animation for the specified number of repetitions.\n   * The animation system prevents overlapping animations and automatically\n   * returns to the previous animation when complete.\n   * \n   * @param animationName - Name of the animation to play\n   * @param nbTimes - Number of times to repeat the animation (default: Infinity for continuous)\n   * \n   * @example\n   * ```ts\n   * // Play attack animation 3 times\n   * player.setAnimation('attack', 3);\n   * \n   * // Play continuous spell animation\n   * player.setAnimation('spell');\n   * ```\n   */\n  setAnimation(animationName: string, nbTimes: number = Infinity) {\n    if (this.animationIsPlaying()) return;\n    this.animationIsPlaying.set(true);\n    const previousAnimationName = this.animationName();\n    this.animationCurrentIndex.set(0);\n    \n    // Clean up any existing subscription\n    if (this.animationSubscription) {\n      this.animationSubscription.unsubscribe();\n    }\n    \n    this.animationSubscription = this.animationCurrentIndex.observable.subscribe(index => {\n      if (index >= nbTimes) {\n        this.animationCurrentIndex.set(0);\n        this.animationName.set(previousAnimationName);\n        this.animationIsPlaying.set(false);\n        if (this.animationSubscription) {\n          this.animationSubscription.unsubscribe();\n          this.animationSubscription = undefined;\n        }\n      }\n    })\n    this.animationName.set(animationName);\n  }\n\n  showComponentAnimation(id: string, params: any) {\n    const engine = inject(RpgClientEngine)\n    engine.getComponentAnimation(id).displayEffect(params, this)\n  }\n}   "],"names":[],"mappings":"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"}
+{"version":3,"file":"index43.js","sources":["../src/components/gui/dialogbox/itemMenu.ce"],"sourcesContent":["<Container>\n    <Rect width height color=\"#595971\" alpha visible={isSelected} />\n    <Container flexDirection=\"row\" alignItems=\"center\" justifyContent=\"center\">\n        <Text text color=\"#fff\" fontSize={18} margin={10} />\n    </Container>\n</Container>\n\n<script>\nimport { animatedSignal } from \"canvasengine\";\n\nconst { text, isSelected } = defineProps();\n\nconst alpha = animatedSignal(1, {\n    repeatType: \"reverse\",\n    duration: 500,\n    repeat: Infinity,\n});\n\nalpha.set(0.5);\n\nconst height = 40;\nconst width = 256;\n</script>"],"names":[],"mappings":";;AAQqB,SAAS,SAAS,CAAC,OAAO,EAAE;AACjD,QAAuB,QAAQ,CAAC,OAAO;AACvC,QAAQ,MAAM,WAAW,GAAG,cAAc,CAAC,OAAO;AAClD,QAAQ,IAAI,EAAE,GAAG,WAAW,EAAE,EAAE,IAAI,GAAG,EAAE,CAAC,IAAI,EAAE,UAAU,GAAG,EAAE,CAAC,UAAU;AAC1E,IAAI,KAAK,GAAG,cAAc,CAAC,CAAC,EAAE;AAC9B,IAAI,UAAU,EAAE,SAAS;AACzB,IAAI,QAAQ,EAAE,GAAG;AACjB,IAAI,MAAM,EAAE,QAAQ;AACpB,CAAC,CAAC;AACF,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC;AACd,IAAI,MAAM,GAAG,EAAE;AACf,IAAI,KAAK,GAAG,GAAG;AACf,QAAQ,IAAI,KAAK,GAAG,CAAC,CAAC,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC,SAAS,EAAE,EAAE,aAAa,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAE,QAAQ,EAAE,EAAE,CAAC,CAAC,IAAI,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC;AACrQ,QAAQ,OAAO;AACf,MAAM;;;;"}

package/dist/index8.js

@@ -20,6 +20,14 @@ function provideClientModules(modules) {
           }
         };
       }
+      if (module.spritesheetResolver) {
+        const resolver = module.spritesheetResolver;
+        module.spritesheetResolver = {
+          load: (engine) => {
+            engine.setSpritesheetResolver(resolver);
+          }
+        };
+      }
       if (module.sounds) {
         const sounds = [...module.sounds];
         module.sounds = {

package/dist/index8.js.map

@@ -1 +1 @@
-{"version":3,"file":"index8.js","sources":["../src/module.ts"],"sourcesContent":["import { findModules, provideModules } from \"@rpgjs/common\";\nimport { RpgClientEngine } from \"./RpgClientEngine\";\nimport { RpgClient } from \"./RpgClient\";\nimport { inject } from \"@signe/di\";\nimport { RpgGui } from \"./Gui/Gui\";\n\nexport function provideClientModules(modules: RpgClient[]) {\n  return provideModules(modules, \"client\", (modules, context) => {\n    const mainModuleClient = findModules(context, 'Client')\n    modules = [...mainModuleClient, ...modules]\n    modules = modules.map((module) => {\n      if ('client' in module) {\n        module = module.client as any;\n      }\n      if (module.spritesheets) {\n        const spritesheets = [...module.spritesheets];\n        module.spritesheets = {\n          load: (engine: RpgClientEngine) => {\n            spritesheets.forEach((spritesheet) => {\n              engine.addSpriteSheet(spritesheet);\n            });\n          },\n        };\n      }\n      if (module.sounds) {\n        const sounds = [...module.sounds];\n        module.sounds = {\n          load: (engine: RpgClientEngine) => {\n            sounds.forEach((sound) => {\n              engine.addSound(sound);\n            });\n          },\n        };\n      }\n      if (module.gui) {\n        const gui = [...module.gui];\n        module.gui = {\n          load: (engine: RpgClientEngine) => {\n            const guiService = inject(engine.context, RpgGui);\n            gui.forEach((gui) => {\n              guiService.add(gui);\n            });\n          },\n        };\n      }\n      if (module.componentAnimations) {\n        const componentAnimations = [...module.componentAnimations];\n        module.componentAnimations = {\n          load: (engine: RpgClientEngine) => {\n            componentAnimations.forEach((componentAnimation) => {\n              engine.addComponentAnimation(componentAnimation);\n            });\n          },\n        };\n      }\n      if (module.particles) {\n        const particles = [...module.particles];\n        module.particles = {\n          load: (engine: RpgClientEngine) => {\n            particles.forEach((particle) => {\n              engine.addParticle(particle);\n            });\n          },\n        };\n      }\n      if (module.sprite) {\n        const sprite = {...module.sprite};\n        module.sprite = {\n          ...sprite,\n          load: (engine: RpgClientEngine) => {\n            if (sprite.componentsBehind) {\n              sprite.componentsBehind.forEach((component) => {\n                engine.addSpriteComponentBehind(component);\n              });\n            }\n            if (sprite.componentsInFront) {\n              sprite.componentsInFront.forEach((component) => {\n                engine.addSpriteComponentInFront(component);\n              });\n            }\n          },\n        };\n      }\n      return module;\n    });\n    return modules\n  });\n}\n\nexport const GlobalConfigToken = \"GlobalConfigToken\";\n\nexport function provideGlobalConfig(config: any) {\n  return {\n    provide: GlobalConfigToken,\n    useValue: config ?? {},\n  };\n}\n\nexport function provideClientGlobalConfig(config: any = {}) {\n  if (!config.keyboardControls) {\n    config.keyboardControls = {\n      up: 'up',\n      down: 'down',\n      left: 'left',\n      right: 'right',\n      action: 'space'\n    }\n  }\n  return provideGlobalConfig(config)\n}\n\n"],"names":["modules","gui"],"mappings":"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"}
+{"version":3,"file":"index8.js","sources":["../src/module.ts"],"sourcesContent":["import { findModules, provideModules } from \"@rpgjs/common\";\nimport { RpgClientEngine } from \"./RpgClientEngine\";\nimport { RpgClient } from \"./RpgClient\";\nimport { inject } from \"@signe/di\";\nimport { RpgGui } from \"./Gui/Gui\";\n\nexport function provideClientModules(modules: RpgClient[]) {\n  return provideModules(modules, \"client\", (modules, context) => {\n    const mainModuleClient = findModules(context, 'Client')\n    modules = [...mainModuleClient, ...modules]\n    modules = modules.map((module) => {\n      if ('client' in module) {\n        module = module.client as any;\n      }\n      if (module.spritesheets) {\n        const spritesheets = [...module.spritesheets];\n        module.spritesheets = {\n          load: (engine: RpgClientEngine) => {\n            spritesheets.forEach((spritesheet) => {\n              engine.addSpriteSheet(spritesheet);\n            });\n          },\n        };\n      }\n      if (module.spritesheetResolver) {\n        const resolver = module.spritesheetResolver;\n        module.spritesheetResolver = {\n          load: (engine: RpgClientEngine) => {\n            engine.setSpritesheetResolver(resolver);\n          },\n        };\n      }\n      if (module.sounds) {\n        const sounds = [...module.sounds];\n        module.sounds = {\n          load: (engine: RpgClientEngine) => {\n            sounds.forEach((sound) => {\n              engine.addSound(sound);\n            });\n          },\n        };\n      }\n      if (module.gui) {\n        const gui = [...module.gui];\n        module.gui = {\n          load: (engine: RpgClientEngine) => {\n            const guiService = inject(engine.context, RpgGui);\n            gui.forEach((gui) => {\n              guiService.add(gui);\n            });\n          },\n        };\n      }\n      if (module.componentAnimations) {\n        const componentAnimations = [...module.componentAnimations];\n        module.componentAnimations = {\n          load: (engine: RpgClientEngine) => {\n            componentAnimations.forEach((componentAnimation) => {\n              engine.addComponentAnimation(componentAnimation);\n            });\n          },\n        };\n      }\n      if (module.particles) {\n        const particles = [...module.particles];\n        module.particles = {\n          load: (engine: RpgClientEngine) => {\n            particles.forEach((particle) => {\n              engine.addParticle(particle);\n            });\n          },\n        };\n      }\n      if (module.sprite) {\n        const sprite = {...module.sprite};\n        module.sprite = {\n          ...sprite,\n          load: (engine: RpgClientEngine) => {\n            if (sprite.componentsBehind) {\n              sprite.componentsBehind.forEach((component) => {\n                engine.addSpriteComponentBehind(component);\n              });\n            }\n            if (sprite.componentsInFront) {\n              sprite.componentsInFront.forEach((component) => {\n                engine.addSpriteComponentInFront(component);\n              });\n            }\n          },\n        };\n      }\n      return module;\n    });\n    return modules\n  });\n}\n\nexport const GlobalConfigToken = \"GlobalConfigToken\";\n\nexport function provideGlobalConfig(config: any) {\n  return {\n    provide: GlobalConfigToken,\n    useValue: config ?? {},\n  };\n}\n\nexport function provideClientGlobalConfig(config: any = {}) {\n  if (!config.keyboardControls) {\n    config.keyboardControls = {\n      up: 'up',\n      down: 'down',\n      left: 'left',\n      right: 'right',\n      action: 'space'\n    }\n  }\n  return provideGlobalConfig(config)\n}\n\n"],"names":["modules","gui"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rpgjs/client",
-  "version": "5.0.0-alpha.14",
+  "version": "5.0.0-alpha.15",
   "description": "RPGJS is a framework for creating RPG/MMORPG games",
   "main": "dist/index.js",
   "types": "./dist/index.d.ts",
@@ -22,9 +22,9 @@
     "pixi.js": "^8.9.2"
   },
   "dependencies": {
-    "@rpgjs/client": "5.0.0-alpha.14",
-    "@rpgjs/common": "5.0.0-alpha.14",
-    "@rpgjs/server": "5.0.0-alpha.14",
+    "@rpgjs/client": "5.0.0-alpha.15",
+    "@rpgjs/common": "5.0.0-alpha.15",
+    "@rpgjs/server": "5.0.0-alpha.15",
     "@signe/di": "^2.4.6",
     "@signe/room": "^2.4.6",
     "@signe/sync": "^2.4.6",

package/src/Game/Map.ts

@@ -6,7 +6,7 @@ import { RpgClientEvent } from "./Event";
 import { RpgClientEngine } from "../RpgClientEngine";
 import { inject } from "../core/inject";
 
-export class RpgClientMap extends RpgCommonMap<RpgClientPlayer> {
+export class RpgClientMap extends RpgCommonMap<any> {
   engine: RpgClientEngine = inject(RpgClientEngine)
   @users(RpgClientPlayer) players = signal<Record<string, RpgClientPlayer>>({});
   @sync(RpgClientEvent) events = signal<Record<string, RpgClientEvent>>({});
@@ -20,4 +20,8 @@ export class RpgClientMap extends RpgCommonMap<RpgClientPlayer> {
     this.players.set({})
     this.events.set({})
   }
+
+  stepPredictionTick(): void {
+    this.forceSingleTick();
+  }
 }

package/src/Game/Object.ts

@@ -1,7 +1,7 @@
 import { Hooks, ModulesToken, RpgCommonPlayer } from "@rpgjs/common";
 import { sync } from "@signe/sync";
 import { trigger, signal } from "canvasengine";
-import { Subscription } from "rxjs";
+import { debounceTime, Subscription, throttleTime } from "rxjs";
 import { inject } from "../core/inject";
 import { RpgClientEngine } from "../RpgClientEngine";
 
@@ -12,16 +12,49 @@ export abstract class RpgClientObject extends RpgCommonPlayer {
   animationCurrentIndex = signal(0)
   animationIsPlaying = signal(false)
   _param = signal({})
+  frames: { x: number; y: number; ts: number }[] = []
 
   constructor() {
     super()
     this.hooks.callHooks("client-sprite-onInit", this).subscribe();
+
+    this._frames.observable.subscribe(({ items }) => {
+      if (!this.id) return;
+      //if (this.id == this.engine.playerIdSignal()!) return;
+      this.frames = [...this.frames, ...items]
+    })
+
+    this.engine.tick
+      .pipe(
+      //throttleTime(10)
+    )
+      .subscribe(() => {
+        const frame = this.frames.shift()
+        if (frame) {
+          const entity = this.engine.scene.getBody(this.id)
+          const isLocalPlayer = this.id === this.engine.playerIdSignal()
+          if (entity && !isLocalPlayer) {
+            const { x: oldX, y: oldY } = entity.position
+            const dt = 1 / 60 // Assume 60 FPS for now
+            const velocity = {
+              x: (frame.x - oldX) / dt,
+              y: (frame.y - oldY) / dt
+            }
+            entity.setVelocity(velocity)
+          }
+          this.engine.scene.setBodyPosition(this.id, frame.x, frame.y)
+        }
+      })
   }
 
   get hooks() {
     return inject<Hooks>(ModulesToken);
   }
-  
+
+  get engine() {
+    return inject(RpgClientEngine)
+  }
+
   private animationSubscription?: Subscription
 
   flash(color: string, duration: number = 100) {
@@ -80,12 +113,12 @@ export abstract class RpgClientObject extends RpgCommonPlayer {
     this.animationIsPlaying.set(true);
     const previousAnimationName = this.animationName();
     this.animationCurrentIndex.set(0);
-    
+
     // Clean up any existing subscription
     if (this.animationSubscription) {
       this.animationSubscription.unsubscribe();
     }
-    
+
     this.animationSubscription = this.animationCurrentIndex.observable.subscribe(index => {
       if (index >= nbTimes) {
         this.animationCurrentIndex.set(0);

package/src/RpgClient.ts

@@ -305,6 +305,46 @@ export interface RpgClient {
      * */
     spritesheets?: any[],
 
+    /** 
+     * Resolver function for dynamically creating spritesheets
+     * 
+     * This function is called when a spritesheet is requested but not found in the cache.
+     * It can be synchronous (returns directly) or asynchronous (returns a Promise).
+     * The resolved spritesheet is automatically cached for future use.
+     * 
+     * ```ts
+     * import { defineModule, RpgClient } from '@rpgjs/client'
+     * 
+     * defineModule<RpgClient>({
+     *      spritesheetResolver: (id: string) => {
+     *          // Synchronous resolver
+     *          if (id === 'dynamic-sprite') {
+     *              return {
+     *                  id: 'dynamic-sprite',
+     *                  image: 'path/to/image.png',
+     *                  framesWidth: 32,
+     *                  framesHeight: 32
+     *              };
+     *          }
+     *          return undefined;
+     *      }
+     * })
+     * 
+     * // Or asynchronous resolver
+     * defineModule<RpgClient>({
+     *      spritesheetResolver: async (id: string) => {
+     *          const response = await fetch(`/api/spritesheets/${id}`);
+     *          const data = await response.json();
+     *          return data;
+     *      }
+     * })
+     * ```
+     * 
+     * @prop {(id: string) => any | Promise<any>} [spritesheetResolver]
+     * @memberof RpgClient
+     * */
+    spritesheetResolver?: (id: string) => any | Promise<any>,
+
     /** 
      * Array containing the list of GUI components
      *