combat

apps/web/src/app/features/combat/combat-page/combat-page.component.ts

@@ -28,6 +28,8 @@ const SWING_MS = 540;
 const RECOIL_MS = 540;
 // Beat between the player's blow landing and the monster striking back.
 const RIPOSTE_DELAY_MS = 260;
+// Length of the stage jolt keyframes, see `stage-shake` in the stylesheet.
+const STAGE_SHAKE_MS = 200;
 
 @Component({
   selector: 'app-combat-page',
@@ -47,9 +49,15 @@ export class CombatPageComponent implements OnInit {
   private readonly displayed = signal<Combat | null>(null);
   private readonly replaying = signal(false);
 
+  // The stage jolt stays wired up but is no longer fired by an ordinary hit --
+  // it was too much for every single round. Call `shakeStage()` to bring it
+  // back for a specific ability.
+  private readonly stageShaking = signal(false);
+
   protected readonly combat = this.displayed.asReadonly();
   protected readonly phase = signal<CombatPhase>('idle');
   protected readonly monsterPhase = signal<MonsterPhase>('idle');
+  protected readonly stageShake = this.stageShaking.asReadonly();
   protected readonly busy = computed(() => this.replaying() || this.combatStore.actionPending());
   protected readonly playerIcon = PLAYER_ICON;
 
@@ -125,6 +133,16 @@ export class CombatPageComponent implements OnInit {
     }
   }
 
+  /** Jolts the whole stage once. Reserved for abilities; no attack triggers it. */
+  protected shakeStage(): void {
+    this.stageShaking.set(true);
+    setTimeout(() => {
+      if (!this.destroyed) {
+        this.stageShaking.set(false);
+      }
+    }, STAGE_SHAKE_MS);
+  }
+
   protected retry(): void {
     void this.loadFromRoute();
   }