Add animations messages

public/index.html

@@ -53,6 +53,7 @@
       <script src="scripts/copy-game-link.js"></script>
       <script src="scripts/handle-redirects.js"></script>
       <script src="scripts/make-sounds.js"></script>
+      <script src="scripts/make-animations.js"></script>
     </div>
   </body>
 </html>

public/scripts/make-animations.js

@@ -0,0 +1,18 @@
+const animations = {};
+// animations['victory'] = TODO: implement victory animation
+// animations['defeat'] = TODO: implement defeat animation
+// animations['draw'] = TODO: implement draw animation
+
+document.addEventListener('htmx:wsAfterMessage', function (e) {
+  let msg;
+  try {
+    msg = JSON.parse(e.detail.message);
+  } catch (_) {
+    return;
+  }
+  if (msg.type !== 'animation') {
+    return;
+  }
+  // TODO: implement animation playback
+  console.log('Animation requested:', msg.animation);
+});

src/view/animation-renderer.tsx

@@ -0,0 +1,18 @@
+import { PlayerConnection } from '../player-connection';
+import { GameServer } from '../game-server';
+
+export function broadcastAnimation(server: GameServer, animation: string) {
+  server.connections.forEach((conn: PlayerConnection) =>
+    broadcastAnimationToPlayer(conn, animation),
+  );
+}
+
+export function broadcastAnimationToPlayer(
+  conn: PlayerConnection,
+  animation: string,
+) {
+  conn.ws.send({
+    type: 'animation',
+    animation: animation,
+  });
+}