Fix bugs, add ordnance animation and undo button

Bugs fixed:
- Validate max 1 ordnance launch per ship per turn
- Ordnance now detonates on contact along entire path, not just
  final position
- Rematch requires both players to agree (was single-player restart)

New features:
- Ordnance movement animation: mines, torpedoes, and nukes interpolate
  along their path during movement phase, with detonation flash effect
- Undo button: clears selected ship's burn/overload during astrogation
- Rematch pending state: button shows "Waiting..." until both agree

138 tests passing.

Author: rgilks

src/client/main.ts

@@ -43,6 +43,7 @@ class GameClient {
     // Wire UI callbacks
     this.ui.onSelectScenario = (scenario) => this.createGame(scenario);
     this.ui.onJoin = (code) => this.joinGame(code);
+    this.ui.onUndo = () => this.undoSelectedShipBurn();
     this.ui.onConfirm = () => this.confirmOrders();
     this.ui.onLaunchOrdnance = (ordType) => this.sendOrdnanceLaunch(ordType);
     this.ui.onSkipOrdnance = () => this.sendSkipOrdnance();
@@ -233,7 +234,7 @@ class GameClient {
         this.renderer.setGameState(this.gameState);
         this.input.setGameState(this.gameState);
         this.setState('playing_movementAnim');
-        this.renderer.animateMovements(msg.movements, () => {
+        this.renderer.animateMovements(msg.movements, msg.ordnanceMovements, () => {
           this.onAnimationComplete();
         });
         break;
@@ -264,6 +265,10 @@ class GameClient {
         );
         break;
 
+      case 'rematchPending':
+        this.ui.showRematchPending();
+        break;
+
       case 'opponentDisconnected':
         this.setState('gameOver');
         this.ui.showGameOver(true, 'Opponent disconnected');
@@ -287,6 +292,17 @@ class GameClient {
 
   // --- Game actions ---
 
+  private undoSelectedShipBurn() {
+    if (!this.gameState || this.state !== 'playing_astrogation') return;
+    const shipId = this.renderer.planningState.selectedShipId;
+    if (shipId) {
+      this.renderer.planningState.burns.delete(shipId);
+      this.renderer.planningState.overloads.delete(shipId);
+      this.renderer.planningState.weakGravityChoices.delete(shipId);
+    }
+    this.updateHUD();
+  }
+
   private confirmOrders() {
     if (!this.gameState || this.state !== 'playing_astrogation') return;
 
@@ -420,12 +436,15 @@ class GameClient {
     const selectedId = this.renderer.planningState.selectedShipId;
     const selectedShip = myShips.find(s => s.id === selectedId) ?? myShips.find(s => !s.destroyed);
     const stats = selectedShip ? SHIP_STATS[selectedShip.type] : null;
+    // Check if any ship has a burn set (for undo button visibility)
+    const hasBurns = Array.from(this.renderer.planningState.burns.values()).some(b => b !== null);
     this.ui.updateHUD(
       this.gameState.turnNumber,
       this.gameState.phase,
       isMyTurn,
       selectedShip?.fuel ?? 0,
       stats?.fuel ?? 0,
+      hasBurns,
     );
     this.ui.updateShipList(
       myShips,

src/client/renderer.ts

@@ -8,7 +8,7 @@ import {
   HEX_DIRECTIONS,
   hexVecLength,
 } from '../shared/hex';
-import type { GameState, Ship, ShipMovement, SolarSystemMap, CelestialBody, CombatResult } from '../shared/types';
+import type { GameState, Ship, ShipMovement, OrdnanceMovement, SolarSystemMap, CelestialBody, CombatResult } from '../shared/types';
 import { MOVEMENT_ANIM_DURATION, CAMERA_LERP_SPEED, SHIP_STATS } from '../shared/constants';
 import { computeCourse, predictDestination } from '../shared/movement';
 import { computeOdds, computeRangeMod, computeVelocityMod, getCombatStrength, canAttack } from '../shared/combat';
@@ -122,6 +122,7 @@ function generateStars(count: number, range: number): Star[] {
 
 export interface AnimationState {
   movements: ShipMovement[];
+  ordnanceMovements: OrdnanceMovement[];
   startTime: number;
   duration: number;
   onComplete: () => void;
@@ -174,25 +175,27 @@ export class Renderer {
     this.playerId = id;
   }
 
-  animateMovements(movements: ShipMovement[], onComplete: () => void) {
+  animateMovements(movements: ShipMovement[], ordnanceMovements: OrdnanceMovement[], onComplete: () => void) {
     this.animState = {
       movements,
+      ordnanceMovements,
       startTime: performance.now(),
       duration: MOVEMENT_ANIM_DURATION,
       onComplete,
     };
 
-    // Frame camera on all moving ships
-    if (this.map && movements.length > 0) {
+    // Frame camera on all moving ships and ordnance
+    const allFrom = [...movements.map(m => m.from), ...ordnanceMovements.map(m => m.from)];
+    const allTo = [...movements.map(m => m.to), ...ordnanceMovements.map(m => m.to)];
+    const allHexes = [...allFrom, ...allTo];
+    if (this.map && allHexes.length > 0) {
       let minX = Infinity, maxX = -Infinity, minY = Infinity, maxY = -Infinity;
-      for (const m of movements) {
-        for (const h of [m.from, m.to]) {
-          const p = hexToPixel(h, HEX_SIZE);
-          minX = Math.min(minX, p.x);
-          maxX = Math.max(maxX, p.x);
-          minY = Math.min(minY, p.y);
-          maxY = Math.max(maxY, p.y);
-        }
+      for (const h of allHexes) {
+        const p = hexToPixel(h, HEX_SIZE);
+        minX = Math.min(minX, p.x);
+        maxX = Math.max(maxX, p.x);
+        minY = Math.min(minY, p.y);
+        maxY = Math.max(maxY, p.y);
       }
       this.camera.frameBounds(minX, maxX, minY, maxY, 150);
     }
@@ -705,7 +708,21 @@ export class Renderer {
 
     for (const ord of state.ordnance) {
       if (ord.destroyed) continue;
-      const p = hexToPixel(ord.position, HEX_SIZE);
+
+      let p: PixelCoord;
+      // During animation, interpolate ordnance position along its path
+      if (this.animState) {
+        const om = this.animState.ordnanceMovements.find(m => m.ordnanceId === ord.id);
+        if (om) {
+          const progress = Math.min((now - this.animState.startTime) / this.animState.duration, 1);
+          p = this.interpolatePath(om.path, progress);
+        } else {
+          p = hexToPixel(ord.position, HEX_SIZE);
+        }
+      } else {
+        p = hexToPixel(ord.position, HEX_SIZE);
+      }
+
       const color = ord.owner === this.playerId ? '#4fc3f7' : '#ff9800';
       const pulse = 0.6 + 0.3 * Math.sin(now / 400);
 
@@ -761,8 +778,8 @@ export class Renderer {
         ctx.restore();
       }
 
-      // Velocity vector for ordnance
-      if (ord.velocity.dq !== 0 || ord.velocity.dr !== 0) {
+      // Velocity vector for ordnance (hide during animation)
+      if (!this.animState && (ord.velocity.dq !== 0 || ord.velocity.dr !== 0)) {
         const dest = hexToPixel(hexAdd(ord.position, ord.velocity), HEX_SIZE);
         ctx.strokeStyle = color;
         ctx.globalAlpha = 0.3;
@@ -776,6 +793,39 @@ export class Renderer {
         ctx.globalAlpha = 1;
       }
     }
+
+    // During animation, also render ordnance that detonated (show until detonation point)
+    if (this.animState) {
+      const progress = Math.min((now - this.animState.startTime) / this.animState.duration, 1);
+      for (const om of this.animState.ordnanceMovements) {
+        if (!om.detonated) continue;
+        // Already removed from state.ordnance — render at interpolated position until detonation
+        if (progress < 0.9) {
+          const p = this.interpolatePath(om.path, progress);
+          ctx.fillStyle = '#ff4444';
+          ctx.globalAlpha = 0.7;
+          const s = 4;
+          ctx.beginPath();
+          ctx.moveTo(p.x, p.y - s);
+          ctx.lineTo(p.x + s, p.y);
+          ctx.lineTo(p.x, p.y + s);
+          ctx.lineTo(p.x - s, p.y);
+          ctx.closePath();
+          ctx.fill();
+          ctx.globalAlpha = 1;
+        } else {
+          // Flash at detonation point
+          const detP = hexToPixel(om.to, HEX_SIZE);
+          const flashSize = 12 * (1 - (progress - 0.9) / 0.1);
+          ctx.fillStyle = '#ffaa00';
+          ctx.globalAlpha = 0.8;
+          ctx.beginPath();
+          ctx.arc(detP.x, detP.y, flashSize, 0, Math.PI * 2);
+          ctx.fill();
+          ctx.globalAlpha = 1;
+        }
+      }
+    }
   }
 
   private renderTorpedoGuidance(ctx: CanvasRenderingContext2D, state: GameState, now: number) {

src/client/ui.ts

@@ -12,6 +12,7 @@ export class UIManager {
   // Callbacks
   onSelectScenario: ((scenario: string) => void) | null = null;
   onJoin: ((code: string) => void) | null = null;
+  onUndo: (() => void) | null = null;
   onConfirm: (() => void) | null = null;
   onLaunchOrdnance: ((type: 'mine' | 'torpedo' | 'nuke') => void) | null = null;
   onSkipOrdnance: (() => void) | null = null;
@@ -69,6 +70,7 @@ export class UIManager {
       });
     });
 
+    document.getElementById('undoBtn')!.addEventListener('click', () => this.onUndo?.());
     document.getElementById('confirmBtn')!.addEventListener('click', () => this.onConfirm?.());
     document.getElementById('launchMineBtn')!.addEventListener('click', () => this.onLaunchOrdnance?.('mine'));
     document.getElementById('launchTorpedoBtn')!.addEventListener('click', () => this.onLaunchOrdnance?.('torpedo'));
@@ -119,11 +121,14 @@ export class UIManager {
     this.shipListEl.style.display = 'flex';
   }
 
-  updateHUD(turn: number, phase: string, isMyTurn: boolean, fuel: number, maxFuel: number) {
+  updateHUD(turn: number, phase: string, isMyTurn: boolean, fuel: number, maxFuel: number, hasBurns = false) {
     document.getElementById('turnInfo')!.textContent = `Turn ${turn}`;
     document.getElementById('phaseInfo')!.textContent = isMyTurn ? phase.toUpperCase() : 'OPPONENT\'S TURN';
     document.getElementById('fuelGauge')!.textContent = `Fuel: ${fuel}/${maxFuel}`;
 
+    const undoBtn = document.getElementById('undoBtn')!;
+    undoBtn.style.display = isMyTurn && phase === 'astrogation' && hasBurns ? 'inline-block' : 'none';
+
     const confirmBtn = document.getElementById('confirmBtn')!;
     confirmBtn.style.display = isMyTurn && phase === 'astrogation' ? 'inline-block' : 'none';
 
@@ -212,5 +217,13 @@ export class UIManager {
     this.gameOverEl.style.display = 'flex';
     document.getElementById('gameOverText')!.textContent = won ? 'VICTORY' : 'DEFEAT';
     document.getElementById('gameOverReason')!.textContent = reason;
+    document.getElementById('rematchBtn')!.textContent = 'Rematch';
+    document.getElementById('rematchBtn')!.removeAttribute('disabled');
+  }
+
+  showRematchPending() {
+    const btn = document.getElementById('rematchBtn')!;
+    btn.textContent = 'Waiting...';
+    btn.setAttribute('disabled', 'true');
   }
 }

src/server/game-do.ts

@@ -122,7 +122,7 @@ export class GameDO extends DurableObject {
         await this.handleSkipCombat(playerId, ws);
         break;
       case 'rematch':
-        await this.initGame();
+        await this.handleRematch(playerId, ws);
         break;
       case 'ping':
         this.send(ws, { type: 'pong', t: msg.t });
@@ -242,6 +242,23 @@ export class GameDO extends DurableObject {
     await this.saveGameState(result.state);
   }
 
+  private async handleRematch(playerId: number, ws: WebSocket) {
+    const requests = await this.ctx.storage.get<number[]>('rematchRequests') ?? [];
+    if (!requests.includes(playerId)) {
+      requests.push(playerId);
+    }
+
+    if (requests.length >= 2) {
+      // Both players want a rematch — restart
+      await this.ctx.storage.delete('rematchRequests');
+      await this.initGame();
+    } else {
+      // First request — notify both players
+      await this.ctx.storage.put('rematchRequests', requests);
+      this.broadcast({ type: 'rematchPending' });
+    }
+  }
+
   private broadcastEndOrUpdate(state: GameState) {
     if (state.phase === 'gameOver') {
       this.broadcast({ type: 'gameOver', winner: state.winner!, reason: state.winReason! });

src/shared/__tests__/game-engine.test.ts

@@ -690,3 +690,24 @@ describe('nuke ordnance', () => {
     }
   });
 });
+
+describe('ordnance validation', () => {
+  it('rejects multiple launches from the same ship', () => {
+    // Set up a frigate with enough cargo for 2 mines but enforce 1-per-turn
+    const ship = initialState.ships[0];
+    ship.type = 'frigate';
+    ship.landed = false;
+    ship.fuel = 20;
+    initialState.phase = 'ordnance';
+
+    const launches: OrdnanceLaunch[] = [
+      { shipId: ship.id, ordnanceType: 'mine' },
+      { shipId: ship.id, ordnanceType: 'mine' },
+    ];
+    const result = processOrdnance(initialState, 0, launches, map);
+    expect('error' in result).toBe(true);
+    if ('error' in result) {
+      expect(result.error).toContain('one ordnance per turn');
+    }
+  });
+});