From 1725fc779df89e5fb151ab0225b77c4dfea881cc Mon Sep 17 00:00:00 2001 From: neu5 Date: Mon, 18 Sep 2023 10:04:50 +0200 Subject: [PATCH] Clean up client types #225 (#226) * Clean up client types #225 * Fix linter * Cleaned up TS in the client package * Add file with shared types * Add missing empty lines at the end and remove excluding needed files from tsconfigs --- .eslintignore | 3 -- .eslintrc | 45 ++++++++++++++---- packages/client/src/main.ts | 14 ++---- packages/client/tsconfig.json | 18 ++++++-- packages/server/src/index.ts | 2 +- packages/server/src/scene/scene.ts | 10 ++-- packages/server/tsconfig.json | 15 ++++-- packages/types/src/client.ts | 37 +++++++++++++++ packages/types/src/index.ts | 73 ++++-------------------------- packages/types/src/server.ts | 24 ++++++++++ packages/types/src/shared.ts | 16 +++++++ 11 files changed, 155 insertions(+), 102 deletions(-) create mode 100644 packages/types/src/client.ts create mode 100644 packages/types/src/server.ts create mode 100644 packages/types/src/shared.ts diff --git a/.eslintignore b/.eslintignore index 5ad2764..6bf8f2d 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,6 +1,3 @@ node_modules/ dist/ packages/**/refactor.ts -packages/client/**/scene/*.ts -packages/server/**/scene/*.ts -packages/server/**/utils/*.ts diff --git a/.eslintrc b/.eslintrc index aacfae1..3567b98 100644 --- a/.eslintrc +++ b/.eslintrc @@ -10,11 +10,22 @@ "parserOptions": { "ecmaVersion": 2021, "requireConfigFile": false, - "project": ["packages/**/tsconfig.json"] + "project": [ + "packages/**/tsconfig.json" + ] }, - "plugins": ["import", "@typescript-eslint"], - "extends": ["airbnb-typescript"], + "plugins": [ + "import", + "@typescript-eslint" + ], + "extends": [ + "airbnb-typescript" + ], "rules": { + "eol-last": [ + "error", + "always" + ], "import/no-unresolved": 2, "import/no-commonjs": 2, "no-console": 0, @@ -27,16 +38,34 @@ "ts": "never" } ], - "import/no-extraneous-dependencies": ["error", { "devDependencies": true }], - "no-param-reassign": ["error", { "props": false }], - "sort-imports": ["error", { "ignoreDeclarationSort": true }], + "import/no-extraneous-dependencies": [ + "error", + { + "devDependencies": true + } + ], + "no-param-reassign": [ + "error", + { + "props": false + } + ], + "sort-imports": [ + "error", + { + "ignoreDeclarationSort": true + } + ], "@typescript-eslint/indent": "off", "@typescript-eslint/quotes": "off", "@typescript-eslint/comma-dangle": "off", "@typescript-eslint/consistent-type-imports": [ "error", - { "prefer": "type-imports", "disallowTypeAnnotations": true } + { + "prefer": "type-imports", + "disallowTypeAnnotations": true + } ], "react/jsx-filename-extension": "off" } -} +} \ No newline at end of file diff --git a/packages/client/src/main.ts b/packages/client/src/main.ts index 8a3c569..319610a 100644 --- a/packages/client/src/main.ts +++ b/packages/client/src/main.ts @@ -8,27 +8,19 @@ import { loginDialog } from "./ui/dialog-login"; import { startRace } from "./scene/scene"; // import { UIDialogWrapper, UIcreatePlayersList, UIsetCurrentPlayer } from "./ui"; import { debounce, toggleStartRaceBtns } from "./utils"; -import type { Game, GameConfig, GameObject, Position } from "@neu5/types/src"; +import type { Game, GameConfig, GameObject, PlayerFromServer, PlayersFromServer, Position } from "@neu5/types/src"; import type { Quaternion } from "@babylonjs/core"; -type PlayerFromServer = { - color: string; - userID: string; - username: string; +export type Player = PlayerFromServer & { + isCurrentPlayer: boolean; vehicle: { body: { position: Vector3; rotationQuaternion: Quaternion; quaternion: Quaternion }; wheels: Array<{ position: Vector3; rotationQuaternion: Quaternion; quaternion: Quaternion }>; }; }; -export type Player = PlayerFromServer & { - isCurrentPlayer: boolean; -}; - export type PlayersMap = Array; -type PlayersFromServer = Array; - const joinRaceRoomBtn = document.getElementById( "join-race-room-btn" ) as HTMLAnchorElement; diff --git a/packages/client/tsconfig.json b/packages/client/tsconfig.json index b1e31c9..df4502f 100644 --- a/packages/client/tsconfig.json +++ b/packages/client/tsconfig.json @@ -14,11 +14,19 @@ "sourceMap": true, "skipLibCheck": true, "isolatedModules": true, - "types": ["node"], + "types": [ + "node" + ], "paths": { - "~/*": ["./*"] + "~/*": [ + "./*" + ] } }, - "include": ["src/**/*.ts"], - "exclude": ["src/refactor.ts", "src/scene/*.ts"] -} + "include": [ + "src/**/*.ts" + ], + "exclude": [ + "src/refactor.ts" + ] +} \ No newline at end of file diff --git a/packages/server/src/index.ts b/packages/server/src/index.ts index 654a568..8add9c7 100644 --- a/packages/server/src/index.ts +++ b/packages/server/src/index.ts @@ -6,7 +6,7 @@ import { createServer } from "http"; import type { Socket } from "socket.io"; import { Server } from "socket.io"; -import type { GameConfig, GameObject, ServerToClientEvents /*UsersMap*/ } from "@neu5/types/src"; +import type { GameConfig, GameObject, ServerToClientEvents } from "@neu5/types/src"; import { InMemorySessionStore } from "./sessionStore"; import { createSocketHandlers } from "./sockets/sockets"; diff --git a/packages/server/src/scene/scene.ts b/packages/server/src/scene/scene.ts index e022666..d0412f7 100644 --- a/packages/server/src/scene/scene.ts +++ b/packages/server/src/scene/scene.ts @@ -162,25 +162,25 @@ const startRace = async ({ loop = setInterval(() => { physicsWorld.fixedStep(); - playersMap.forEach(({ actions, vehicle }) => { + playersMap.forEach(({ actions: playersActions, vehicle }) => { if (!vehicle) { return; } - if (actions.accelerate) { + if (playersActions.accelerate) { vehicle.physicalVehicle.setWheelForce(maxForce, 2); vehicle.physicalVehicle.setWheelForce(maxForce, 3); - } else if (actions.brake) { + } else if (playersActions.brake) { vehicle.physicalVehicle.setWheelForce(-maxForce / 2, 2); vehicle.physicalVehicle.setWheelForce(-maxForce / 2, 3); } else { vehicle.physicalVehicle.setWheelForce(0, 2); vehicle.physicalVehicle.setWheelForce(0, 3); } - if (actions.left) { + if (playersActions.left) { vehicle.physicalVehicle.setSteeringValue(maxSteerVal, 0); vehicle.physicalVehicle.setSteeringValue(maxSteerVal, 1); - } else if (actions.right) { + } else if (playersActions.right) { vehicle.physicalVehicle.setSteeringValue(-maxSteerVal, 0); vehicle.physicalVehicle.setSteeringValue(-maxSteerVal, 1); } else { diff --git a/packages/server/tsconfig.json b/packages/server/tsconfig.json index d1e182f..405c92a 100644 --- a/packages/server/tsconfig.json +++ b/packages/server/tsconfig.json @@ -10,8 +10,15 @@ "esModuleInterop": true, "skipLibCheck": true, "isolatedModules": true, - "types": ["node", "express"] + "types": [ + "node", + "express" + ] }, - "include": ["src/**/*.ts"], - "exclude": ["src/refactor.ts", "src/scene/*.ts", "src/utils/*.ts"] -} + "include": [ + "src/**/*.ts" + ], + "exclude": [ + "src/refactor.ts" + ] +} \ No newline at end of file diff --git a/packages/types/src/client.ts b/packages/types/src/client.ts new file mode 100644 index 0000000..b191de9 --- /dev/null +++ b/packages/types/src/client.ts @@ -0,0 +1,37 @@ +import type { RoomList, UsersList } from './shared'; + +type ActionTypes = "accelerate" | "brake" | "left" | "right"; + +type Class = { new(...args: any[]): any }; + +type PlayerFromServer = { + color: string; + userID: string; + username: string; + vehicle: { + body: { position: any; rotationQuaternion: any; quaternion: any }; + wheels: Array<{ position: any; rotationQuaternion: any; quaternion: any }>; + }; +}; + +type PlayersFromServer = Array; + +type UI = { + createPlayersList: (list: UsersList) => void; + createRoomList: (list: RoomList) => void; + hideElement: (element: HTMLElement) => void; + setCurrentPlayer: (id: string) => void; + showElement: (element: HTMLElement) => void; + DialogWrapper: Class; +}; + +interface ClientEvents { + "client-dev:stop the race": () => void; + "client:action": (data: { playerActions: Array, id: string }) => void; + "client:join race room": () => void; + "client:leave race room": () => void; + "client:set name": (data: { userID: string; username: string }) => void; + "client:start the race": () => void; +} + +export type { ActionTypes, ClientEvents, PlayerFromServer, PlayersFromServer, UI }; diff --git a/packages/types/src/index.ts b/packages/types/src/index.ts index a18e652..cdc009c 100644 --- a/packages/types/src/index.ts +++ b/packages/types/src/index.ts @@ -1,21 +1,6 @@ -type UsersMap = Map< - string, - { - socketId: string; - displayName: string; - } ->; - -type Class = { new(...args: any[]): any }; - -type UI = { - createPlayersList: (list: UsersList) => void; - createRoomList: (list: RoomList) => void; - hideElement: (element: HTMLElement) => void; - setCurrentPlayer: (id: string) => void; - showElement: (element: HTMLElement) => void; - DialogWrapper: Class; -}; +import type { RoomList, User, UsersList } from './shared'; +import type { ActionTypes, ClientEvents, PlayerFromServer, PlayersFromServer, UI } from "./client"; +import type { ServerEvents } from './server'; type Game = { elements: { @@ -43,12 +28,6 @@ type GameConfig = { depth: number; }; -type User = { - connected: boolean; - userID: string; - username: string; -}; - type GameQuaternion = { x: number; y: number; @@ -66,44 +45,7 @@ type GameObject = { depth: number; }; -type UsersList = Array; - -type RoomUser = { - username: string; -}; -type RoomList = Array; - -type SessionInfo = { - sessionID: string; - userID: string; -}; - -type ActionTypes = "accelerate" | "brake" | "left" | "right"; - -interface ServerToClientEvents { - "client-dev:stop the race": () => void; - "client:action": (data: { playerActions: Array, id: string }) => void; - "client:join race room": () => void; - "client:leave race room": () => void; - "client:set name": (data: { userID: string; username: string }) => void; - "client:start the race": () => void; - "server:action": (data: Object) => void; - // "server:game-info": (data: GameInfo) => void; - "server:close dialog": () => void; - "server:send users": (data: UsersList) => void; - "server:send room users": (data: RoomList) => void; - "server:session": (data: SessionInfo) => void; - "server:show error": (data: { message: string }) => void; - "server:start-race": (data: Object) => void; - // "server:stop-race": (data: Object) => void; - "server:user can join the room": () => void; - "server:user can leave the room": () => void; - "server:user can start the race": () => void; - "server:user cannot start the race": () => void; - "server:user connected": (data: User) => void; - "server:user disconnected": (data: { userID: string }) => void; - "server:users-list-update": (playersList: UsersList) => void; -} +interface ServerToClientEvents extends ClientEvents, ServerEvents { } export type { ActionTypes, @@ -111,13 +53,14 @@ export type { GameConfig, GameObject, GameQuaternion, + PlayerFromServer, + PlayersFromServer, Position, RoomList, + UI, User, UsersList, - ServerToClientEvents, - UI, - UsersMap, + ServerToClientEvents }; export { FEATURES_NAMES, features } from "./features"; diff --git a/packages/types/src/server.ts b/packages/types/src/server.ts new file mode 100644 index 0000000..cb37dce --- /dev/null +++ b/packages/types/src/server.ts @@ -0,0 +1,24 @@ +import type { RoomList, User, UsersList } from './shared'; + +type SessionInfo = { + sessionID: string; + userID: string; +}; + +interface ServerEvents { + "server:action": (data: Object) => void; + "server:close dialog": () => void; + "server:send users": (data: UsersList) => void; + "server:send room users": (data: RoomList) => void; + "server:session": (data: SessionInfo) => void; + "server:show error": (data: { message: string }) => void; + "server:start-race": (data: Object) => void; + "server:user can join the room": () => void; + "server:user can leave the room": () => void; + "server:user can start the race": () => void; + "server:user cannot start the race": () => void; + "server:user connected": (data: User) => void; + "server:user disconnected": (data: { userID: string }) => void; +} + +export type { ServerEvents }; diff --git a/packages/types/src/shared.ts b/packages/types/src/shared.ts new file mode 100644 index 0000000..7e00b24 --- /dev/null +++ b/packages/types/src/shared.ts @@ -0,0 +1,16 @@ + +type RoomUser = { + username: string; +}; + +type RoomList = Array; + +type User = { + connected: boolean; + userID: string; + username: string; +}; + +type UsersList = Array; + +export type { RoomList, User, UsersList };