interface/BoardBuilder.ts

@@ -1,115 +0,0 @@
-import { CellType } from "./constants/CellType";
-import { Direction } from "./constants/Direction";
-import { ExitType } from "./constants/ExitType";
-import { Cell } from "./types/Cell";
-import { Exit } from "./types/Exit";
-
-const boardSize = 7;
-const universityLocations = [
-  [2, 0],
-  [4, 1],
-  [3, 3],
-];
-const factoryLocations = [
-  [0, 0],
-  [5, 2],
-  [4, 6],
-];
-const houseLocations = [
-  [0, 2],
-  [1, 5],
-  [2, 4],
-  [5, 4],
-];
-const mapPosition = (position: number[], type: CellType) => {
-  return {
-    row: position[0],
-    col: position[1],
-    type: type,
-  };
-};
-const specialUniversityCells = universityLocations.map((position) =>
-  mapPosition(position, CellType.UNIVERSITY),
-);
-const specialFactoryCells = factoryLocations.map((position) =>
-  mapPosition(position, CellType.FACTORY),
-);
-const specialHouseCells = houseLocations.map((position) =>
-  mapPosition(position, CellType.HOUSE),
-);
-const specialCells = specialUniversityCells
-  .concat(specialFactoryCells)
-  .concat(specialHouseCells);
-
-const specialExitIndexes1 = [1, 5];
-const specialExitIndexes2 = [3];
-
-function createBoard(): Cell[][] {
-  const indexes = Array.from(Array(boardSize).keys());
-  return indexes.map((rowIndex) =>
-    indexes.map((colIndex) => {
-      const specialCell = specialCells.find(
-        (specialCell) =>
-          specialCell.row === rowIndex && specialCell.col === colIndex,
-      );
-      return new Cell(specialCell ? specialCell.type : CellType.NORMAL);
-    }),
-  );
-}
-
-function connectAdjacentCells(board: Cell[][]) {
-  const indexes = Array.from(Array(boardSize).keys());
-  for (const rowIndex of indexes.slice(0, -1)) {
-    for (const colIndex of indexes) {
-      const cell = board[rowIndex][colIndex];
-      const bottomCell = board[rowIndex + 1][colIndex];
-      cell
-        .getNodeAt(Direction.SOUTH)
-        .linkToNode(bottomCell.getNodeAt(Direction.NORTH));
-    }
-  }
-
-  for (const rowIndex of indexes) {
-    for (const colIndex of indexes.slice(0, -1)) {
-      const cell = board[rowIndex][colIndex];
-      const rightCell = board[rowIndex][colIndex + 1];
-      cell
-        .getNodeAt(Direction.EAST)
-        .linkToNode(rightCell.getNodeAt(Direction.WEST));
-    }
-  }
-}
-
-function addExits(board: Cell[][]) {
-  // Add exits to top row
-  board[0].forEach((cell, colIndex) => {
-    let exitType = ExitType.AMBIVALENT;
-    if (specialExitIndexes1.includes(colIndex)) exitType = ExitType.ROAD;
-    if (specialExitIndexes2.includes(colIndex)) exitType = ExitType.RAIL;
-    cell.getNodeAt(Direction.NORTH).linkToNode(new Exit(exitType));
-  });
-
-  // Add exits to bottom row
-  board[boardSize - 1].forEach((cell, colIndex) => {
-    let exitType = ExitType.AMBIVALENT;
-    if (specialExitIndexes1.includes(colIndex)) exitType = ExitType.ROAD;
-    if (specialExitIndexes2.includes(colIndex)) exitType = ExitType.RAIL;
-    cell.getNodeAt(Direction.SOUTH).linkToNode(new Exit(exitType));
-  });
-
-  // Add exits to left and right columns
-  board.forEach((row, rowIndex) => {
-    let exitType = ExitType.AMBIVALENT;
-    if (specialExitIndexes1.includes(rowIndex)) exitType = ExitType.RAIL;
-    if (specialExitIndexes2.includes(rowIndex)) exitType = ExitType.ROAD;
-    row[0].getNodeAt(Direction.WEST).linkToNode(new Exit(exitType));
-    row[boardSize - 1].getNodeAt(Direction.EAST).linkToNode(new Exit(exitType));
-  });
-}
-
-export function buildBoard(): Cell[][] {
-  const board: Cell[][] = createBoard();
-  connectAdjacentCells(board);
-  addExits(board);
-  return board;
-}

interface/constants/CellType.ts

@@ -1,6 +0,0 @@
-export enum CellType {
-  NORMAL = "NORMAL",
-  HOUSE = "HOUSE",
-  FACTORY = "FACTORY",
-  UNIVERSITY = "UNIVERSITY",
-}

interface/constants/Direction.ts

@@ -1,13 +0,0 @@
-export enum Direction {
-  NORTH = "NORTH",
-  SOUTH = "SOUTH",
-  EAST = "EAST",
-  WEST = "WEST",
-}
-
-export const directions: Direction[] = [
-  Direction.NORTH,
-  Direction.SOUTH,
-  Direction.EAST,
-  Direction.WEST,
-];

interface/constants/ExitType.ts

@@ -1,5 +0,0 @@
-export enum ExitType {
-  RAIL = "RAIL",
-  ROAD = "ROAD",
-  AMBIVALENT = "AMBIVALENT",
-}

interface/index.ts

@@ -1,10 +1 @@
-export * from "./constants/CellType";
-export * from "./constants/Direction";
-export * from "./constants/ExitType";
 export * from "./constants/TrackType";
-export * from "./types/Border";
-export * from "./types/Cell";
-export * from "./types/Exit";
-export * from "./types/ExternalNode";
-export * from "./types/Node";
-export * from "./BoardBuilder";

interface/types/Border.ts

@@ -1,22 +0,0 @@
-import { Exit } from "./Exit";
-import { ExternalNode } from "./ExternalNode";
-
-export class Border {
-  private readonly firstNode: ExternalNode;
-  private readonly secondNode: ExternalNode | Exit;
-
-  constructor(firstNode: ExternalNode, secondNode: ExternalNode | Exit) {
-    this.firstNode = firstNode;
-    this.secondNode = secondNode;
-  }
-
-  public traverseFrom(node: ExternalNode): ExternalNode | Exit {
-    if (node === this.firstNode) {
-      return this.secondNode;
-    }
-    if (node === this.secondNode) {
-      return this.firstNode;
-    }
-    throw Error("Unable to traverse border");
-  }
-}

interface/types/Cell.ts

@@ -1,24 +0,0 @@
-import { CellType } from "../constants/CellType";
-import { Direction } from "../constants/Direction";
-import { ExternalNode } from "./ExternalNode";
-
-export class Cell {
-  public readonly externalNodes: Map<Direction, ExternalNode>;
-  public readonly cellType: CellType;
-
-  constructor(cellType: CellType) {
-    this.externalNodes = new Map([
-      [Direction.NORTH, new ExternalNode(this, Direction.NORTH)],
-      [Direction.SOUTH, new ExternalNode(this, Direction.SOUTH)],
-      [Direction.EAST, new ExternalNode(this, Direction.EAST)],
-      [Direction.WEST, new ExternalNode(this, Direction.WEST)],
-    ]);
-    this.cellType = cellType;
-  }
-
-  public getNodeAt(direction: Direction): ExternalNode {
-    const node = this.externalNodes.get(direction);
-    if (!node) throw Error(`Could not find node at ${direction}`);
-    return this.externalNodes.get(direction) as ExternalNode;
-  }
-}

interface/types/Exit.ts

@@ -1,9 +0,0 @@
-import { ExitType } from "../constants/ExitType";
-
-export class Exit {
-  public readonly type: ExitType;
-
-  constructor(type: ExitType) {
-    this.type = type;
-  }
-}

interface/types/ExternalNode.ts

@@ -1,29 +0,0 @@
-import { Direction } from "../constants/Direction";
-import { Border } from "./Border";
-import { Cell } from "./Cell";
-import { Exit } from "./Exit";
-import { Node } from "./Node";
-
-export class ExternalNode extends Node {
-  public readonly direction: Direction;
-  private border?: Border;
-
-  constructor(cell: Cell, direction: Direction) {
-    super(cell);
-    this.direction = direction;
-  }
-
-  public linkToNode(other: ExternalNode | Exit) {
-    this.border = new Border(this, other);
-    if (other instanceof ExternalNode) {
-      other.border = this.border;
-    }
-  }
-
-  public traverseBorder(): ExternalNode | Exit {
-    if (!this.border) {
-      throw Error(`Missing border for node`);
-    }
-    return (this.border as Border).traverseFrom(this);
-  }
-}

interface/types/Node.ts

@@ -1,9 +0,0 @@
-import { Cell } from "./Cell";
-
-export abstract class Node {
-  public readonly cell: Cell;
-
-  constructor(cell: Cell) {
-    this.cell = cell;
-  }
-}

web/.eslintrc.js

@@ -13,12 +13,5 @@ module.exports = {
     jest: true,
   },
   ignorePatterns: [".eslintrc.js", "dist/"],
-  rules: {
+  rules: {},
-    "prettier/prettier": [
-      "error",
-      {
-        endOfLine: "auto",
-      },
-    ],
-  },
 };

web/src/App.scss

@@ -1,6 +1,3 @@
 @use "node_modules/@picocss/pico/scss/pico" with (
     $theme-color: "pumpkin"
 );
-
-@import "./pages/game/GamePage.scss";
-@import "./pages/game/components/GameBoard.scss";

web/src/App.tsx

@@ -1,15 +1,20 @@
+import React from "react";
 import { io } from "socket.io-client";
-import GamePage from "./pages/game/GamePage";
 
 function App() {
   const socket = io("http://localhost:3010");
+  const emitData = () =>
+    console.log(socket.emit("example-request", "custom-request"));
   socket.on("example-response", (data) =>
     console.log(`Received response in front end with data: ${data}`),
   );
 
   return (
     <div className="App">
-      <GamePage />
+      <header className="App-header">
+        <button onClick={emitData}>Emit Data</button>
+        Hello World! Front
+      </header>
     </div>
   );
 }

web/src/pages/game/GamePage.scss

@@ -1,5 +0,0 @@
-h1 {
-    text-align: center;
-    padding: 10px;
-    margin: 0;
-}

web/src/pages/game/GamePage.tsx

@@ -1,15 +0,0 @@
-import React from "react";
-import GameBoard from "./components/GameBoard";
-
-const GamePage = () => {
-  return (
-    <React.Fragment>
-      <h1>Game Page Title</h1>
-      <div className="game-panel">
-        <GameBoard />
-      </div>
-    </React.Fragment>
-  );
-};
-
-export default GamePage;

web/src/pages/game/components/GameBoard.scss

@@ -1,125 +0,0 @@
-.game-board {
-    height: 850px;
-    width: 850px;
-    display: grid;
-    grid-template-columns: repeat(7, auto);
-    gap: auto;
-    padding: 50px;
-
-    .cell {
-        width: 100px;
-        height: 100px;
-        border: 2px solid black;
-        border-radius: 10%;
-
-        &.house {
-            background-color: blue;
-        }
-
-        &.university {
-            background-color: orange;
-        }
-
-        &.factory {
-            background-color: grey;
-        }
-
-        .exit:has(.exit-road) {
-            border: solid black;
-            border-width: 0 1px;
-
-            .exit-road {
-                margin: auto;
-                width: 0;
-                height: 100%;
-                border: dashed black;
-                border-width: 0 1px;
-                transform: translate(calc(50% - 1px));
-            }
-        }
-        
-        .exit:has(.exit-road) {
-            border: solid black;
-            border-width: 0 1px;
-
-            .exit-road {
-                margin: auto;
-                width: 0;
-                height: 100%;
-                border: dashed black;
-                border-width: 0 1px;
-                transform: translate(calc(50% - 1px));
-            }
-        }
-
-        .exit:has(.exit-rail) {
-            border-width: 0 1px;
-
-            .exit-rail {
-                margin: auto;
-                width: 0;
-                height: 100%;
-                border: solid black;
-                border-width: 0 1px;
-                transform: translate(calc(50% - 1px));
-            }
-        }
-
-        .exit:has(.exit-ambivalent) {
-            border-width: 0 1px;
-            border-style: dotted;
-
-            .exit-ambivalent {
-                margin: auto;
-                width: 0;
-                height: 100%;
-                border: dotted black;
-                border-width: 0 1px 0 0;
-                transform: translate(calc(50%));
-            }
-        }
-    }
-}
-
-.exit {
-    position: relative;
-    width: 20px;
-    height: 20px;
-
-    &:has(.exit-north) {
-        left: 50%;
-        transform: translate(calc(-50% - 1px), -100%);
-    }
-
-    &:has(.exit-south) {
-        left: 50%;
-        top: 100%;
-        transform: translate(calc(-50% - 1px), 0%);
-    }
-
-    &:has(.exit-east) {
-        left: 100%;
-        top: 50%;
-        transform: rotate(90deg) translate(-50%, 0);
-    }
-
-    &:has(.exit-west) {
-        left: 0%;
-        top: 50%;
-        transform: rotate(90deg) translate(-50%, 100%);
-    }
-
-    &:has(.exit-north), &:has(.exit-south) {
-        + .exit:has(.exit-east) {
-            left: 100%;
-            transform: rotate(90deg) translate(-150%, 0);
-        }
-    }
-
-    &:has(.exit-north), &:has(.exit-south) {
-        + .exit:has(.exit-west) {
-            top: 50%;
-            transform: rotate(90deg) translate(-150%, 100%);
-        }
-    }
-}

web/src/pages/game/components/GameBoard.tsx

@@ -1,31 +0,0 @@
-import { buildBoard, Cell, directions, Exit } from "interface";
-
-const GameBoard = () => {
-  const board: Cell[][] = buildBoard();
-
-  return (
-    <div className="game-board">
-      {board.flatMap((row) =>
-        row.map((cell) => (
-          <div className={"cell " + cell.cellType.toLowerCase()}>
-            {directions.map((direction) => {
-              const traversedNode = cell.getNodeAt(direction).traverseBorder();
-              const isExit = traversedNode instanceof Exit;
-              if (!isExit) return;
-              const className =
-                `exit-${direction.toLowerCase()}` +
-                ` exit-${(traversedNode as Exit).type.toLowerCase()}`;
-              return (
-                <div className="exit">
-                  <div className={className} />
-                </div>
-              );
-            })}
-          </div>
-        )),
-      )}
-    </div>
-  );
-};
-
-export default GameBoard;