kenrick95 · kenrick95 · Jun 27, 2024 · Jun 27, 2024 · Jun 27, 2024
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
@@ -15,12 +15,12 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [18]
+        node-version: [18, 20]
 
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4.1.7
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4.0.2
         with:
           node-version: ${{ matrix.node-version }}
           cache: 'yarn'
@@ -29,7 +29,7 @@ jobs:
       - name: Build
         run: yarn workspace @kenrick95/c4-browser run build-gh-pages
       - name: Deploy
-        uses: JamesIves/github-pages-deploy-action@v4.4.1
+        uses: JamesIves/github-pages-deploy-action@v4.6.1
         with:
           branch: gh-pages
           folder: browser/dist
@@ -42,6 +42,6 @@ jobs:
       FLY_API_TOKEN: ${{ secrets.FLY_API_TOKEN }}
 
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4.1.7
       - uses: superfly/flyctl-actions/setup-flyctl@master
       - run: flyctl deploy --remote-only
diff --git a/.yarn/releases/yarn-4.0.1.cjs b/.yarn/releases/yarn-4.0.1.cjs
diff --git a/.yarn/releases/yarn-4.3.1.cjs b/.yarn/releases/yarn-4.3.1.cjs
diff --git a/.yarnrc.yml b/.yarnrc.yml
@@ -4,4 +4,4 @@ enableGlobalCache: false
 
 nodeLinker: node-modules
 
-yarnPath: .yarn/releases/yarn-4.0.1.cjs
+yarnPath: .yarn/releases/yarn-4.3.1.cjs
diff --git a/browser/package.json b/browser/package.json
@@ -2,6 +2,7 @@
   "name": "@kenrick95/c4-browser",
   "private": true,
   "version": "1.0.0",
+  "type": "module",
   "description": "Connect Four game in browser",
   "repository": {
     "type": "git",
@@ -40,6 +41,6 @@
   "devDependencies": {
     "prettier": "3.3.2",
     "typescript": "~5.5.2",
-    "vite": "^4.5.3"
+    "vite": "^5.3.1"
   }
 }
diff --git a/browser/public/demo/index.html b/browser/public/demo/index.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html>
   <head>
     <meta charset="utf-8" />

diff --git a/browser/src/board/index.ts b/browser/src/board/index.ts
@@ -1,5 +1,5 @@
 import { BoardBase, BoardPiece } from '@kenrick95/c4'
-import { Player } from '@kenrick95/c4' 
+import { Player } from '@kenrick95/c4'
 import { onresize, drawMask, drawCircle, clearCanvas } from './utils'
 import { animationFrame } from '../utils/animate-frame'
 
@@ -63,7 +63,7 @@ export class Board extends BoardBase {
   private async animateAction(
     newRow: number,
     column: number,
-    boardPiece: BoardPiece
+    boardPiece: BoardPiece,
   ): Promise<void> {
     const fillStyle = this.getPlayerColor(boardPiece)
     let currentY = 0

diff --git a/browser/src/board/utils.ts b/browser/src/board/utils.ts
@@ -44,7 +44,7 @@ export function onresize(): { add: Function } {
 
 export function drawCircle(
   context: CanvasRenderingContext2D,
-  { x = 0, y = 0, r = 0, fillStyle = '', strokeStyle = '' }
+  { x = 0, y = 0, r = 0, fillStyle = '', strokeStyle = '' },
 ) {
   context.save()
   context.fillStyle = fillStyle
@@ -73,13 +73,13 @@ export function drawMask(board: Board) {
         tripleRadius * y + Board.MASK_Y_BEGIN + doubleRadius,
         Board.PIECE_RADIUS,
         0,
-        2 * Math.PI
+        2 * Math.PI,
       )
       context.rect(
         tripleRadius * x + Board.MASK_X_BEGIN + 2 * doubleRadius,
         tripleRadius * y + Board.MASK_Y_BEGIN,
         -2 * doubleRadius,
-        2 * doubleRadius
+        2 * doubleRadius,
       )
     }
   }

diff --git a/browser/src/game/game-ai-vs-ai.ts b/browser/src/game/game-ai-vs-ai.ts
@@ -7,7 +7,7 @@ import { animationFrame } from '../utils/animate-frame'
 const statusbox = document.querySelector('.statusbox')
 const statusboxBodyGame = document.querySelector('.statusbox-body-game')
 const statusboxBodyConnection = document.querySelector(
-  '.statusbox-body-connection'
+  '.statusbox-body-connection',
 )
 const statusboxBodyPlayer = document.querySelector('.statusbox-body-player')
 

diff --git a/browser/src/game/game-local.ts b/browser/src/game/game-local.ts
@@ -74,10 +74,10 @@ export class GameLocal extends GameBase {
         winnerBoardPiece === BoardPiece.DRAW
           ? `It's a draw`
           : winnerPlayer
-          ? `${winnerPlayer.label} ${winnerPlayer.boardPiece} won`
-          : `Player ${
-              winnerBoardPiece === BoardPiece.PLAYER_1 ? '1 🔴' : '2 🔵'
-            } won`
+            ? `${winnerPlayer.label} ${winnerPlayer.boardPiece} won`
+            : `Player ${
+                winnerBoardPiece === BoardPiece.PLAYER_1 ? '1 🔴' : '2 🔵'
+              } won`
     }
   }
 }

diff --git a/browser/src/game/game-online-2p.ts b/browser/src/game/game-online-2p.ts
@@ -266,10 +266,10 @@ export class GameOnline2p extends GameBase {
             winnerBoardPiece === BoardPiece.DRAW
               ? `It's a draw`
               : winnerPlayer
-              ? `${winnerPlayer.label} ${winnerPlayer.boardPiece} won`
-              : `Player ${
-                  winnerBoardPiece === BoardPiece.PLAYER_1 ? '1 🔴' : '2 🔵'
-                } won`
+                ? `${winnerPlayer.label} ${winnerPlayer.boardPiece} won`
+                : `Player ${
+                    winnerBoardPiece === BoardPiece.PLAYER_1 ? '1 🔴' : '2 🔵'
+                  } won`
 
           showMessage(
             `<h1>Thank you for playing</h1>` +

diff --git a/browser/src/utils/animate-frame.ts b/browser/src/utils/animate-frame.ts
@@ -4,7 +4,7 @@
 export function animationFrame(): Promise<Function> {
   let resolve: Function | null = null
   const promise: Promise<Function> = new Promise(
-    (r: Function): Function => (resolve = r)
+    (r: Function): Function => (resolve = r),
   )
 
   if (resolve) window.requestAnimationFrame(resolve)

diff --git a/browser/src/utils/message.ts b/browser/src/utils/message.ts
@@ -6,7 +6,7 @@ export function showMessage(message: string = ''): void {
     return
   }
   const messageContentDOM: HTMLDivElement | null = document.querySelector(
-    '.message-body-content'
+    '.message-body-content',
   )
   if (!messageContentDOM) {
     console.error('.message-body-content not found')

diff --git a/core/package.json b/core/package.json
@@ -2,6 +2,7 @@
   "name": "@kenrick95/c4",
   "version": "5.0.0",
   "description": "Building blocks for a Connect Four game",
+  "type": "module",
   "repository": {
     "type": "git",
     "url": "https://github.com/kenrick95/c4.git"
@@ -53,9 +54,9 @@
   "devDependencies": {
     "prettier": "3.3.2",
     "typescript": "~5.5.2",
-    "vite": "^4.5.3",
+    "vite": "^5.3.1",
     "vite-dts": "^1.0.4",
-    "vite-plugin-dts": "^3.6.3",
-    "vitest": "^0.34.6"
+    "vite-plugin-dts": "^3.9.1",
+    "vitest": "^1.6.0"
   }
 }
diff --git a/core/src/__testHelpers/test-game.ts b/core/src/__testHelpers/test-game.ts
@@ -26,7 +26,7 @@ export class TestGame extends GameBase {
 
   renewAfterMovePromise() {
     this.afterMovePromise = new Promise(
-      (resolve) => (this.afterMoveResolve = resolve)
+      (resolve) => (this.afterMoveResolve = resolve),
     )
   }
 }
diff --git a/core/src/__testHelpers/test-player.ts b/core/src/__testHelpers/test-player.ts
@@ -19,7 +19,7 @@ export class TestPlayer extends Player {
   }
   renewPromise() {
     this.getActionWaiting = new Promise(
-      (resolve) => (this.getActionWaitingResolver = resolve)
+      (resolve) => (this.getActionWaitingResolver = resolve),
     )
   }
   async getAction() {

diff --git a/core/src/board/base.ts b/core/src/board/base.ts
@@ -53,13 +53,13 @@ export class BoardBase {
       Math.max(
         0,
         BoardBase.CANVAS_WIDTH -
-          (3 * BoardBase.COLUMNS + 1) * BoardBase.PIECE_RADIUS
+          (3 * BoardBase.COLUMNS + 1) * BoardBase.PIECE_RADIUS,
       ) / 2
     BoardBase.MASK_Y_BEGIN =
       Math.max(
         0,
         BoardBase.CANVAS_HEIGHT -
-          (3 * BoardBase.ROWS + 1) * BoardBase.PIECE_RADIUS
+          (3 * BoardBase.ROWS + 1) * BoardBase.PIECE_RADIUS,
       ) / 2
     BoardBase.MESSAGE_WIDTH = BoardBase.SCALE * 400
     BoardBase.MESSAGE_X_BEGIN =
@@ -76,7 +76,7 @@ export class BoardBase {
     const { success: actionSuccessful, map: nextState } = getMockPlayerAction(
       this.map,
       player.boardPiece,
-      column
+      column,
     )
 
     this.map = nextState
@@ -108,7 +108,7 @@ export class BoardBase {
       j: number,
       playerPiece: BoardPiece,
       dir: Array<number>,
-      count: number
+      count: number,
     ): boolean => {
       if (count >= 4) {
         return true
@@ -127,7 +127,7 @@ export class BoardBase {
         j + dir[1],
         playerPiece,
         dir,
-        count + 1
+        count + 1,
       )
     }
     let countEmpty = 0
@@ -141,7 +141,7 @@ export class BoardBase {
               j + direction[k][1],
               playerPiece,
               direction[k],
-              1
+              1,
             )
             if (isWon) {
               return (this.winnerBoardPiece = playerPiece)

diff --git a/core/src/game/game-base.ts b/core/src/game/game-base.ts
@@ -62,7 +62,7 @@ export abstract class GameBase<P extends Player = Player> {
       this.beforeMoveApplied(action)
       actionSuccesful = await this.board.applyPlayerAction(
         currentPlayer,
-        action
+        action,
       )
       this.isMoveAllowed = true
       if (!actionSuccesful) {

diff --git a/core/src/game/game-online/shared.ts b/core/src/game/game-online/shared.ts
@@ -34,7 +34,10 @@ export type GameOnlineMessage =
     }
   | { type: 'NEW_MATCH_REQUEST'; payload: { playerId: PlayerId } }
   | { type: 'NEW_MATCH_OK'; payload: { matchId: MatchId } }
-  | { type: 'GAME_READY'; payload: { matchId: MatchId; otherPlayerName: string } }
+  | {
+      type: 'GAME_READY'
+      payload: { matchId: MatchId; otherPlayerName: string }
+    }
   | {
       type: 'GAME_ENDED'
       payload: {

diff --git a/core/src/player/player-ai.ts b/core/src/player/player-ai.ts
@@ -24,8 +24,8 @@ export class PlayerAi extends Player {
     return boardPiece === BoardPiece.EMPTY
       ? 0
       : boardPiece === this.boardPiece
-      ? 1
-      : -1
+        ? 1
+        : -1
   }
   private getStateValue(state: Array<Array<BoardPiece>>): {
     winnerBoardPiece: BoardPiece
@@ -96,7 +96,7 @@ export class PlayerAi extends Player {
   private transformValues(
     returnValue: number,
     winnerBoardPiece: BoardPiece,
-    depth: number
+    depth: number,
   ): number {
     const isWon = winnerBoardPiece === this.boardPiece
     const isLost = winnerBoardPiece === this.enemyBoardPiece
@@ -114,7 +114,7 @@ export class PlayerAi extends Player {
     state: Array<Array<BoardPiece>>,
     depth: number,
     alpha: number,
-    beta: number
+    beta: number,
   ): {
     value: number
     move: number
@@ -129,7 +129,7 @@ export class PlayerAi extends Player {
           this.transformValues(
             stateValue.chain,
             stateValue.winnerBoardPiece,
-            depth
+            depth,
           ) * this.ownBoardPieceValue,
         move: -1, // leaf node
       }
@@ -144,7 +144,7 @@ export class PlayerAi extends Player {
     state: Array<Array<BoardPiece>>,
     depth: number,
     alpha: number,
-    beta: number
+    beta: number,
   ): {
     value: number
     move: number
@@ -155,7 +155,7 @@ export class PlayerAi extends Player {
       const { success: actionSuccessful, map: nextState } = getMockPlayerAction(
         state,
         this.boardPiece,
-        column
+        column,
       )
       if (!actionSuccessful) {
         continue
@@ -187,7 +187,7 @@ export class PlayerAi extends Player {
     state: Array<Array<BoardPiece>>,
     depth: number,
     alpha: number,
-    beta: number
+    beta: number,
   ): {
     value: number
     move: number
@@ -198,7 +198,7 @@ export class PlayerAi extends Player {
       const { success: actionSuccessful, map: nextState } = getMockPlayerAction(
         state,
         this.enemyBoardPiece,
-        column
+        column,
       )
       if (!actionSuccessful) {
         continue
@@ -233,10 +233,10 @@ export class PlayerAi extends Player {
       state,
       0,
       BIG_NEGATIVE_NUMBER,
-      BIG_POSITIVE_NUMBER
+      BIG_POSITIVE_NUMBER,
     )
     console.log(
-      `AI ${this.boardPiece} choose column ${action.move} with value of ${action.value}`
+      `AI ${this.boardPiece} choose column ${action.move} with value of ${action.value}`,
     )
     return action.move
   }

diff --git a/core/src/utils.ts b/core/src/utils.ts
@@ -12,7 +12,7 @@ export const BIG_NEGATIVE_NUMBER: number = -BIG_POSITIVE_NUMBER
 export function isCoordOnColumn(
   coord: { x: number; y: number },
   columnXBegin: number,
-  radius: number
+  radius: number,
 ): boolean {
   return (coord.x - columnXBegin) * (coord.x - columnXBegin) <= radius * radius
 }
@@ -25,7 +25,7 @@ export function getColumnFromCoord(coord: { x: number; y: number }): number {
         3 * BoardBase.PIECE_RADIUS * i +
           BoardBase.MASK_X_BEGIN +
           2 * BoardBase.PIECE_RADIUS,
-        BoardBase.PIECE_RADIUS
+        BoardBase.PIECE_RADIUS,
       )
     )
       return i
@@ -52,7 +52,7 @@ export function clone<T>(array: Array<Array<T>>): Array<Array<T>> {
 export function getMockPlayerAction(
   map: Array<Array<BoardPiece>>,
   boardPiece: BoardPiece,
-  column: number
+  column: number,
 ): {
   success: boolean
   map: Array<Array<BoardPiece>>

diff --git a/package.json b/package.json
@@ -21,10 +21,10 @@
     "url": "https://github.com/kenrick95/c4/issues"
   },
   "engines": {
-    "node": "18.x",
+    "node": "18.x || 20.x",
     "yarn": "4.x"
   },
-  "packageManager": "yarn@4.0.1",
+  "packageManager": "yarn@4.3.1",
   "homepage": "https://github.com/kenrick95/c4",
   "license": "MIT",
   "keywords": [