Fixed bugs, sending players instead of characters

pac-man-board-game/ClientApp/src/components/gameBoard.tsx

@@ -3,9 +3,10 @@ import {Character, PacMan} from "../game/character";
 import findPossiblePositions from "../game/possibleMovesAlgorithm";
 import {GameTile} from "./gameTile";
 import {TileType} from "../game/tileType";
+import {useAtomValue} from "jotai";
+import {allCharactersAtom} from "../utils/state";
 
 interface BoardProps extends ComponentProps {
-  characters: Character[],
   selectedDice?: SelectedDice,
   onMove?: Action<Position[]>,
   map: GameMap
@@ -14,12 +15,12 @@ interface BoardProps extends ComponentProps {
 const Board: Component<BoardProps> = (
   {
     className,
-    characters,
     selectedDice,
     onMove,
     map
   }) => {
 
+  const characters = useAtomValue(allCharactersAtom);
   const [selectedCharacter, setSelectedCharacter] = useState<Character>();
   const [possiblePositions, setPossiblePositions] = useState<Path[]>([]); // TODO reset when other client moves a character
   const [hoveredPosition, setHoveredPosition] = useState<Path>();

pac-man-board-game/ClientApp/src/components/gameComponent.tsx

@@ -6,19 +6,17 @@ import WebSocketService from "../websockets/WebSocketService";
 import {testMap} from "../game/map";
 import Player, {State} from "../game/player";
 import PlayerStats from "../components/playerStats";
-import {useAtom} from "jotai";
+import {getDefaultStore, useAtom, useAtomValue} from "jotai";
-import {charactersAtom, currentPlayerAtom, diceAtom, playersAtom, selectedDiceAtom} from "../utils/state";
+import {currentPlayerAtom, diceAtom, ghostsAtom, playersAtom, selectedDiceAtom} from "../utils/state";
 
 const wsService = new WebSocketService(import.meta.env.VITE_API);
 
 export const GameComponent: Component<{ player: Player }> = ({player}) => {
-  // TODO find spawn points
+  const players = useAtomValue(playersAtom);
-  const [characters] = useAtom(charactersAtom);
-  const [players] = useAtom(playersAtom);
 
-  const [dice] = useAtom(diceAtom);
+  const dice = useAtomValue(diceAtom);
   const [selectedDice, setSelectedDice] = useAtom(selectedDiceAtom);
-  const [currentPlayer] = useAtom(currentPlayerAtom);
+  const currentPlayer = useAtomValue(currentPlayerAtom);
 
   function startGameLoop(): void {
     if (currentPlayer?.Name !== player.Name) return;
@@ -35,9 +33,10 @@ export const GameComponent: Component<{ player: Player }> = ({player}) => {
     const data: ActionMessage = {
       Action: GameAction.moveCharacter,
       Data: {
-        dice: dice?.length ?? 0 > 0 ? dice : null,
+        Dice: dice?.length ?? 0 > 0 ? dice : null,
-        characters: characters,
+        Players: players,
-        eatenPellets: eatenPellets
+        Ghosts: getDefaultStore().get(ghostsAtom),
+        EatenPellets: eatenPellets
       }
     };
     wsService.send(data);
@@ -70,13 +69,10 @@ export const GameComponent: Component<{ player: Player }> = ({player}) => {
         }
       </div>
       <AllDice values={dice} selectedDiceIndex={selectedDice?.index}/>
-      {players?.map(p => <PlayerStats key={p.Name} player={p} isCurrentPlayer={currentPlayer === p}/>)}
+      {players?.map(p => <PlayerStats key={p.Name} player={p} isCurrentPlayer={currentPlayer?.Name === p.Name}/>)}
-      {characters &&
+      <GameBoard className={"mx-auto my-2"}
-        <GameBoard className={"mx-auto my-2"}
+                 selectedDice={selectedDice}
-                   characters={characters}
+                 onMove={onCharacterMove} map={testMap}/>
-                   selectedDice={selectedDice}
-                   onMove={onCharacterMove} map={testMap}/>
-      }
     </>
   );
 };

pac-man-board-game/ClientApp/src/types/props.d.ts

@@ -34,7 +34,7 @@ interface BoxProps {
 
 interface PlayerProps {
   readonly Name: string,
-  readonly PacMan?: CharacterProps,
+  readonly PacMan: CharacterProps,
   readonly Colour: import("../game/colour").Colour,
   readonly Box?: BoxProps,
   State?: import("../game/player").State,

pac-man-board-game/ClientApp/src/utils/actions.ts

@@ -1,9 +1,9 @@
 import Player from "../game/player";
-import {Character, CharacterType, Ghost, PacMan} from "../game/character";
+import {CharacterType, Ghost} from "../game/character";
 import {getCharacterSpawns, testMap} from "../game/map";
 import {TileType} from "../game/tileType";
 import {getDefaultStore} from "jotai";
-import {charactersAtom, currentPlayerAtom, diceAtom, playersAtom} from "./state";
+import {currentPlayerAtom, diceAtom, ghostsAtom, playersAtom} from "./state";
 import {Colour} from "../game/colour";
 
 export enum GameAction {
@@ -13,19 +13,20 @@ export enum GameAction {
   ready,
 }
 
+const store = getDefaultStore();
+
 const ghostsProps: CharacterProps[] = [
   {Colour: Colour.Purple},
   {Colour: Colour.Purple},
 ];
-
 let spawns = getCharacterSpawns(testMap).filter(spawn => spawn.type === CharacterType.ghost);
 ghostsProps.forEach(ghost => {
   ghost.SpawnPosition = spawns.pop()?.position;
-});
 
+});
 const ghosts = ghostsProps.map(props => new Ghost(props));
 
-const store = getDefaultStore();
+store.set(ghostsAtom, ghosts);
 
 export const doAction: MessageEventFunction<string> = (event): void => { // TODO divide into smaller functions
   const message: ActionMessage = JSON.parse(event.data);
@@ -51,28 +52,41 @@ function setDice(data?: number[]): void {
   store.set(diceAtom, data);
 }
 
-type MoveCharacterData = { dice: number[], characters: CharacterProps[], eatenPellets: Position[] };
+type MoveCharacterData = { Dice: number[], Players: PlayerProps[], Ghosts: CharacterProps[], EatenPellets: Position[] };
 
 function moveCharacter(data?: MoveCharacterData): void {
-  store.set(diceAtom, data?.dice);
+  store.set(diceAtom, data?.Dice);
-  updateCharacters(data);
+  updatePlayers(data);
+  updateGhosts(data);
   removeEatenPellets(data);
 }
 
-function updateCharacters(data?: MoveCharacterData): void {
+function updatePlayers(data?: MoveCharacterData): void {
-  const updatedCharacters = data?.characters;
+  const updatedPlayers = data?.Players;
 
-  if (updatedCharacters) {
+  if (updatedPlayers) {
-    const newList: Character[] = [];
+    const newList: Player[] = [];
-    for (const character of updatedCharacters) {
+    for (const player of updatedPlayers) {
-      newList.push(new Character(character));
+      newList.push(new Player(player));
     }
-    store.set(charactersAtom, newList);
+    store.set(playersAtom, newList);
+  }
+}
+
+function updateGhosts(data?: MoveCharacterData): void {
+  const updatedGhosts = data?.Ghosts;
+
+  if (updatedGhosts) {
+    const newList: Ghost[] = [];
+    for (const ghost of updatedGhosts) {
+      newList.push(new Ghost(ghost));
+    }
+    store.set(ghostsAtom, newList);
   }
 }
 
 function removeEatenPellets(data?: MoveCharacterData): void {
-  const pellets = data?.eatenPellets;
+  const pellets = data?.EatenPellets;
 
   for (const pellet of pellets ?? []) {
     testMap[pellet.y][pellet.x] = TileType.empty;
@@ -81,20 +95,15 @@ function removeEatenPellets(data?: MoveCharacterData): void {
 
 function playerInfo(data?: PlayerProps[]): void {
   const playerProps = data ?? [];
-  store.set(playersAtom, playerProps.map(p => new Player(p)));
-
   spawns = getCharacterSpawns(testMap).filter(spawn => spawn.type === CharacterType.pacMan);
-  const pacMen = playerProps.filter(p => p.PacMan).map(p => {
+  store.set(playersAtom, playerProps.map(p => {
-    if (!p.PacMan!.SpawnPosition) {
+    if (!p.PacMan.SpawnPosition) {
-      p.PacMan!.SpawnPosition = spawns.pop()?.position;
+      p.PacMan.SpawnPosition = spawns.pop()?.position;
     }
-    return new PacMan(p.PacMan!);
+    return new Player(p);
-  });
+  }));
-
-  store.set(charactersAtom, [...pacMen, ...ghosts]);
 }
 
-
 type ReadyData =
   | { AllReady: true, Starter: PlayerProps, Players: PlayerProps[] }
   | { AllReady: false, Players: PlayerProps[] }
@@ -102,8 +111,7 @@ type ReadyData =
 
 function ready(data?: ReadyData): void {
   if (data && typeof data !== "string") {
-    const isReady = data.AllReady;
+    if (data.AllReady) {
-    if (isReady) {
       store.set(currentPlayerAtom, new Player(data.Starter));
     }
     store.set(playersAtom, data.Players.map(p => new Player(p)));

pac-man-board-game/ClientApp/src/utils/state.ts

@@ -1,13 +1,15 @@
 import Player from "../game/player";
 import {atom} from "jotai";
-import {Character} from "../game/character";
 import {atomWithStorage, createJSONStorage} from "jotai/utils";
+import {Ghost} from "../game/character";
 
 const playerStorage = createJSONStorage<Player | undefined>(() => sessionStorage);
 
-// TODO merge character and player atoms, since the player is the owner of the character
+// TODO derived from playersAtom
-export const charactersAtom = atom<Character[] | undefined>(undefined);
 export const playersAtom = atom<Player[]>([]);
+export const playerCharactersAtom = atom(get => get(playersAtom).map(player => player.PacMan));
+export const ghostsAtom = atom<Ghost[]>([]);
+export const allCharactersAtom = atom(get => [...get(playerCharactersAtom), ...get(ghostsAtom)]);
 export const thisPlayerAtom = atomWithStorage<Player | undefined>("player", undefined, {
   ...playerStorage,
   getItem(key, initialValue): Player | undefined {

pac-man-board-game/Services/GameGroup.cs

@@ -11,12 +11,12 @@ public class GameGroup // TODO tests
     public IPlayer RandomPlayer => Players[_random.Next(Players.Count)];
     public event Func<ArraySegment<byte>, Task>? Connections;
 
-    public bool AddPlayer(IPlayer player)
+    public bool AddPlayer(IPlayer player) // TODO if name exists, use that player instead
     {
         if (Players.Count >= Rules.MaxPlayers) return false;
-        if (Players.Exists(p => p.Name == player.Name)) return false;
 
         player.State = State.WaitingForPlayers;
+        if (Players.Exists(p => p.Name == player.Name)) return true;
         Players.Add(player);
         return true;
     }