@rpgjs/action-battle 5.0.0-beta.3 → 5.0.0-beta.4

package/dist/client/index7.js

@@ -1,34 +1,78 @@
-import { normalizeActionBattleOptions } from "./index2.js";
-import { setActionBattleOptions } from "./index3.js";
-import component from "./index4.js";
-import component$1 from "./index6.js";
-import { PrebuiltComponentAnimations, RpgClientEngine, RpgGui, inject } from "@rpgjs/client";
-import { defineModule } from "@rpgjs/common";
-//#region src/client.ts
-var createActionBattleClient = (options = {}) => {
-	const normalized = normalizeActionBattleOptions(options);
-	setActionBattleOptions(normalized);
-	const actionBarEnabled = normalized.ui?.actionBar?.enabled;
-	const targetingEnabled = normalized.ui?.targeting?.enabled;
-	const hitComponent = PrebuiltComponentAnimations?.Hit;
-	return defineModule({
-		componentAnimations: hitComponent ? [{
-			id: "hit",
-			component: hitComponent
-		}] : [],
-		gui: actionBarEnabled ? [{
-			id: "action-battle-action-bar",
-			component,
-			dependencies: () => {
-				return [inject(RpgClientEngine).scene.currentPlayer];
-			}
-		}] : [],
-		sprite: { componentsInFront: targetingEnabled ? [component$1] : [] },
-		sceneMap: { onAfterLoading() {
-			if (actionBarEnabled && normalized.ui?.actionBar?.autoOpen) inject(RpgGui).display("action-battle-action-bar");
-		} }
+import { actionBattleAttackPreviewState } from "./index3.js";
+import { RpgClientEngine, inject } from "@rpgjs/client";
+import { Container, Graphics, computed, cond, h, signal, tick, useDefineProps, useProps } from "canvasengine";
+//#region src/components/attack-preview.ce
+function component($$props) {
+	useProps($$props);
+	const { object } = useDefineProps($$props)();
+	const engine = inject(RpgClientEngine);
+	const now = signal(Date.now());
+	tick(() => {
+		if (actionBattleAttackPreviewState().active) now.set(Date.now());
 	});
-};
-var client_default = createActionBattleClient();
+	const isCurrentPlayer = computed(() => {
+		if (!object?.id) return false;
+		return (typeof object.id === "function" ? object.id() : object.id) === engine.playerId;
+	});
+	const preview = computed(() => actionBattleAttackPreviewState());
+	const progress = computed(() => {
+		const state = preview();
+		if (!state.active) return 1;
+		const elapsed = now() - state.startedAt;
+		return Math.max(0, Math.min(1, elapsed / state.durationMs));
+	});
+	const shouldRender = computed(() => {
+		const state = preview();
+		return isCurrentPlayer() && state.active && progress() < 1;
+	});
+	const getHitbox = () => object.hitbox?.() || {
+		w: 32,
+		h: 32
+	};
+	const drawRect = (g, x, y, width, height, color, alpha) => {
+		g.rect(x, y, width, height);
+		g.fill({
+			color,
+			alpha
+		});
+	};
+	const drawSlash = (g) => {
+		g.clear();
+		if (!shouldRender()) return;
+		const state = preview();
+		const p = progress();
+		const alpha = Math.sin(Math.PI * p);
+		if (alpha <= 0) return;
+		const hitbox = getHitbox();
+		const width = hitbox.w || 32;
+		const height = hitbox.h || 32;
+		const reach = 16 + 18 * p;
+		const thickness = 4 + 3 * (1 - p);
+		const color = state.color;
+		const accent = state.accentColor;
+		if (state.direction === "left") {
+			drawRect(g, -reach - 6, height * .24, reach, thickness, accent, alpha * .55);
+			drawRect(g, -reach - 10, height * .46, reach + 4, thickness + 2, color, alpha);
+			drawRect(g, -reach - 6, height * .7, reach, thickness, accent, alpha * .4);
+			return;
+		}
+		if (state.direction === "right") {
+			drawRect(g, width + 6, height * .24, reach, thickness, accent, alpha * .55);
+			drawRect(g, width + 6, height * .46, reach + 4, thickness + 2, color, alpha);
+			drawRect(g, width + 6, height * .7, reach, thickness, accent, alpha * .4);
+			return;
+		}
+		if (state.direction === "up") {
+			drawRect(g, width * .24, -reach - 6, thickness, reach, accent, alpha * .55);
+			drawRect(g, width * .46, -reach - 10, thickness + 2, reach + 4, color, alpha);
+			drawRect(g, width * .7, -reach - 6, thickness, reach, accent, alpha * .4);
+			return;
+		}
+		drawRect(g, width * .24, height + 6, thickness, reach, accent, alpha * .55);
+		drawRect(g, width * .46, height + 6, thickness + 2, reach + 4, color, alpha);
+		drawRect(g, width * .7, height + 6, thickness, reach, accent, alpha * .4);
+	};
+	return h(Container, null, cond(shouldRender, () => h(Graphics, { draw: drawSlash })));
+}
 //#endregion
-export { createActionBattleClient, client_default as default };
+export { component as default };

package/dist/client/index8.js

@@ -2,14 +2,34 @@ var DEFAULT_ANIMATION_BY_KEY = {
 	attack: "attack",
 	hurt: "hurt",
 	die: "die",
-	castSkill: "skill"
+	castSkill: "skill",
+	castSpell: "skill"
+};
+var getConfiguredAnimation = (key, animations) => {
+	if (!animations) return {
+		hasConfiguredAnimation: false,
+		configured: void 0
+	};
+	const hasConfiguredAnimation = Object.prototype.hasOwnProperty.call(animations, key);
+	if (hasConfiguredAnimation) return {
+		hasConfiguredAnimation,
+		configured: animations[key]
+	};
+	if (key === "castSkill") return {
+		hasConfiguredAnimation: Object.prototype.hasOwnProperty.call(animations, "castSpell"),
+		configured: animations.castSpell
+	};
+	return {
+		hasConfiguredAnimation: false,
+		configured: void 0
+	};
 };
 function resolveActionBattleAnimation(key, entity, animations, context, defaults = {}) {
 	const defaultAnimationName = defaults.animationName ?? DEFAULT_ANIMATION_BY_KEY[key];
 	const defaultRepeat = defaults.repeat ?? 1;
-	const hasConfiguredAnimation = animations ? Object.prototype.hasOwnProperty.call(animations, key) : false;
+	const { hasConfiguredAnimation, configured: configuredAnimation } = getConfiguredAnimation(key, animations);
 	if (!hasConfiguredAnimation && key !== "attack") return null;
-	const configured = hasConfiguredAnimation ? animations?.[key] : defaultAnimationName;
+	const configured = hasConfiguredAnimation ? configuredAnimation : defaultAnimationName;
 	const result = typeof configured === "function" ? configured(entity, context) : configured;
 	if (result == null) return null;
 	if (typeof result === "string") return {
@@ -38,4 +58,4 @@ function getActionBattleAnimationRemovalDelay(animation) {
 	return animation.waitEnd ? 500 : 0;
 }
 //#endregion
-export { getActionBattleAnimationRemovalDelay, playActionBattleAnimation };
+export { getActionBattleAnimationRemovalDelay, playActionBattleAnimation, resolveActionBattleAnimation };