@rpgjs/client 5.0.0-beta.2 → 5.0.0-beta.22

package/src/components/animations/fx.ce

@@ -0,0 +1,101 @@
+<Fx
+  name={name}
+  preset={preset}
+  trigger={trigger}
+  autostart={autostart}
+  loop={loop}
+  enabled={enabled}
+  x={x}
+  y={y}
+  rotation={rotation}
+  scale={scale}
+  alpha={alpha}
+  timeScale={timeScale}
+  maxParticles={maxParticles}
+  preload={preload}
+  missingTexture={missingTexture}
+  zIndex={zIndex}
+  onStart={onStart}
+  onComplete={finish}
+  onParticleSpawn={onParticleSpawn}
+/>
+
+<script>
+  import { tick } from "canvasengine";
+  import { Fx } from "@canvasengine/presets";
+
+  const {
+    name,
+    preset,
+    trigger,
+    onFinish,
+    onStart,
+    onComplete,
+    onParticleSpawn,
+    displayDuration,
+    duration,
+    autostart,
+    loop,
+    enabled,
+    x,
+    y,
+    rotation,
+    scale,
+    alpha,
+    timeScale,
+    maxParticles,
+    preload,
+    missingTexture,
+    zIndex,
+  } = defineProps({
+    autostart: {
+      default: true,
+    },
+    loop: {
+      default: false,
+    },
+    enabled: {
+      default: true,
+    },
+    rotation: {
+      default: 0,
+    },
+    scale: {
+      default: 1,
+    },
+    alpha: {
+      default: 1,
+    },
+    timeScale: {
+      default: 1,
+    },
+    maxParticles: {
+      default: 600,
+    },
+    preload: {
+      default: true,
+    },
+    missingTexture: {
+      default: "shape",
+    },
+  });
+
+  let elapsedTime = 0;
+  let finished = false;
+
+  function finish(instance) {
+    if (finished) return;
+    finished = true;
+    onComplete?.(instance);
+    onFinish?.(instance);
+  }
+
+  tick(({ deltaTime }) => {
+    const maxDuration = displayDuration?.() ?? (loop() ? duration?.() : undefined);
+    if (!maxDuration || finished) return;
+    elapsedTime += deltaTime;
+    if (elapsedTime >= maxDuration) {
+      finish();
+    }
+  });
+</script>

package/src/components/animations/index.ts

@@ -1,7 +1,9 @@
 import Hit from "./hit.ce";
 import Animation from "./animation.ce";
+import Fx from "./fx.ce";
 
 export const PrebuiltComponentAnimations = {
     Hit,
-    Animation
-}
+    Animation,
+    Fx
+}