martials/pac-man-board-game
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Persist the player in sessionStorage, fixed typo in BoxProps

Browse Source
This commit is contained in:
martin 2023-07-08 15:39:34 +02:00
parent d6fa74455e
commit 920a941156
5 changed files with 19 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
pac-man-board-game/ClientApp/src/game/box.ts
View File

@ -5,9 +5,9 @@ export default class Box {
public Pellets: Pellet[]; public Pellets: Pellet[];
public readonly Colour: Colour; public readonly Colour: Colour;
public constructor({colour, pellets = []}: BoxProps) { public constructor({Colour, Pellets = []}: BoxProps) {
this.Colour = colour; this.Colour = Colour;
this.Pellets = pellets; this.Pellets = Pellets;
} }
get powerPellet(): Pellet | undefined { get powerPellet(): Pellet | undefined {

2
pac-man-board-game/ClientApp/src/game/player.ts
View File

@ -18,7 +18,7 @@ export default class Player {
constructor(props: PlayerProps) { constructor(props: PlayerProps) {
this.Name = props.Name; this.Name = props.Name;
this.Colour = props.Colour; this.Colour = props.Colour;
this.Box = new Box(props.Box ?? {colour: props.Colour}); this.Box = new Box(props.Box ?? {Colour: props.Colour});
this.PacMan = new Character(props.PacMan ?? { this.PacMan = new Character(props.PacMan ?? {
Colour: props.Colour, Colour: props.Colour,
Type: CharacterType.pacMan Type: CharacterType.pacMan

11
pac-man-board-game/ClientApp/src/pages/game.tsx
View File

@ -1,17 +1,18 @@
import React, {useEffect} from "react"; import React, {useEffect} from "react";
import {GameComponent} from "../components/gameComponent"; import {GameComponent} from "../components/gameComponent";
import {useAtom} from "jotai"; import {useAtomValue} from "jotai";
import {thisPlayerAtom} from "../utils/state"; import {thisPlayerAtom} from "../utils/state";
const Game: Component = () => { const Game: Component = () => {
const [player] = useAtom(thisPlayerAtom); // TODO get player from session storage const player = useAtomValue(thisPlayerAtom);
useEffect(() => { useEffect(() => {
console.debug(player);
if (!player) { if (!player) {
// TODO state dissapears on refresh // TODO player is undefined on first render, then defined on second render
window.location.href = "/"; // window.location.href = "/";
} }
}, []); }, [player]);
if (player) { if (player) {
return <GameComponent player={player}/>; return <GameComponent player={player}/>;

4
pac-man-board-game/ClientApp/src/types/props.d.ts vendored
View File

@ -28,8 +28,8 @@ interface CharacterProps {
} }
interface BoxProps { interface BoxProps {
pellets?: import("../game/pellet").default[], Pellets?: import("../game/pellet").default[],
readonly colour: import("../game/colour").Colour, readonly Colour: import("../game/colour").Colour,
} }
interface PlayerProps { interface PlayerProps {

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

@ -8,7 +8,13 @@ const playerStorage = createJSONStorage<Player | undefined>(() => sessionStorage
// TODO merge character and player atoms, since the player is the owner of the character // TODO merge character and player atoms, since the player is the owner of the character
export const charactersAtom = atom<Character[] | undefined>(undefined); export const charactersAtom = atom<Character[] | undefined>(undefined);
export const playersAtom = atom<Player[]>([]); export const playersAtom = atom<Player[]>([]);
export const thisPlayerAtom = atomWithStorage<Player | undefined>("player", undefined, playerStorage); export const thisPlayerAtom = atomWithStorage<Player | undefined>("player", undefined, {
...playerStorage,
getItem(key, initialValue): Player | undefined {
const playerProps = playerStorage.getItem(key, initialValue) as PlayerProps | undefined;
return playerProps ? new Player(playerProps) : undefined;
},
});
export const diceAtom = atom<number[] | undefined>(undefined); export const diceAtom = atom<number[] | undefined>(undefined);
export const selectedDiceAtom = atom<SelectedDice | undefined>(undefined); export const selectedDiceAtom = atom<SelectedDice | undefined>(undefined);
export const currentPlayerAtom = atom<Player | undefined>(undefined); export const currentPlayerAtom = atom<Player | undefined>(undefined);