boardgame-core/src/samples/tic-tac-toe.ts

import {createGameCommand, createGameCommandRegistry, IGameContext} from '../core/game';
import type { Part } from '../core/part';

type PlayerType = 'X' | 'O';
type WinnerType = 'X' | 'O' | 'draw' | null;
export function createInitialState() {
    return {
        currentPlayer: 'O' as PlayerType,
        winner: null as WinnerType,
        turn: 0,
    };
}
export type TicTacToeState = ReturnType<typeof createInitialState>;
export const registry = createGameCommandRegistry<TicTacToeState>();

createGameCommand(registry, 'setup', async function() {
    const {regions, state} = this.context;
    regions.add({
        id: 'board',
        axes: [
            { name: 'x', min: 0, max: 2 },
            { name: 'y', min: 0, max: 2 },
        ],
        children: [],
    });

    while (true) {
        let player = 'X' as PlayerType;
        let turn = 0;
        state.produce(state => {
            player = state.currentPlayer = state.currentPlayer === 'X' ? 'O' : 'X';
            turn = ++state.turn;
        });
        const turnOutput = await this.run<{winner: WinnerType}>(`turn ${player} ${turn}`);
        if (!turnOutput.success) throw new Error(turnOutput.error);

        state.produce(state => {
            state.winner = turnOutput.result.winner;
        });
        if (state.value.winner) break;
    }

    return state.value;
});

createGameCommand(registry, 'turn <player> <turn:number>', async function(cmd) {
    const [turnPlayer, turnNumber] = cmd.params as [string, number];
    while (true) {
        const playCmd = await this.prompt('play <player> <row:number> <col:number>');
        const [player, row, col] = playCmd.params as [string, number, number];
        if(turnPlayer !== player) continue;

        if (isNaN(row) || isNaN(col) || row < 0 || row > 2 || col < 0 || col > 2) continue;
        if (isCellOccupied(this.context, row, col)) continue;

        placePiece(this.context, row, col, turnNumber);

        const winner = checkWinner(this.context);
        if (winner) return { winner : winner as WinnerType };

        if (turnNumber >= 9) return { winner: 'draw' as WinnerType};
    }
});

export function getBoardRegion(host: IGameContext<TicTacToeState>) {
    return host.regions.get('board');
}

export function isCellOccupied(host: IGameContext<TicTacToeState>, row: number, col: number): boolean {
    const board = getBoardRegion(host);
    return board.value.children.some(
        part => {
            return part.value.position[0] === row && part.value.position[1] === col;
        }
    );
}

export function hasWinningLine(positions: number[][]): boolean {
    const lines = [
        [[0, 0], [0, 1], [0, 2]],
        [[1, 0], [1, 1], [1, 2]],
        [[2, 0], [2, 1], [2, 2]],
        [[0, 0], [1, 0], [2, 0]],
        [[0, 1], [1, 1], [2, 1]],
        [[0, 2], [1, 2], [2, 2]],
        [[0, 0], [1, 1], [2, 2]],
        [[0, 2], [1, 1], [2, 0]],
    ];

    return lines.some(line =>
        line.every(([r, c]) =>
            positions.some(([pr, pc]) => pr === r && pc === c)
        )
    );
}

export function checkWinner(host: IGameContext<TicTacToeState>): 'X' | 'O' | 'draw' | null {
    const parts = Object.values(host.parts.collection.value).map((s: { value: Part }) => s.value);

    const xPositions = parts.filter((_: Part, i: number) => i % 2 === 0).map((p: Part) => p.position);
    const oPositions = parts.filter((_: Part, i: number) => i % 2 === 1).map((p: Part) => p.position);

    if (hasWinningLine(xPositions)) return 'X';
    if (hasWinningLine(oPositions)) return 'O';

    return null;
}

export function placePiece(host: IGameContext<TicTacToeState>, row: number, col: number, moveCount: number) {
    const board = getBoardRegion(host);
    const piece: Part = {
        id: `piece-${moveCount}`,
        region: board,
        position: [row, col],
    };
    host.parts.add(piece);
    board.produce(draft => {
        draft.children.push(host.parts.get(piece.id));
    });
}