Prevent starting race and joining the room on the server side #223 (#224

)
neu5 · Sep 15, 2023 · 642d1a9 · 642d1a9
1 parent d142cea
commit 642d1a9
Show file tree

Hide file tree

Showing 3 changed files with 61 additions and 56 deletions.
diff --git a/packages/client/src/index.html b/packages/client/src/index.html
@@ -1,52 +1,55 @@
 <html>
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <link rel="stylesheet" href="./styles/styles.scss" />
-    <title>Rally Online</title>
-  </head>
-  <body>
-    <canvas id="canvas"></canvas>
-    <div id="root">
-      <div id="speedometer">0</div>
-      <div id="fps">0</div>
-      <div class="mobile-controls acceleration hide">
-        <button data-type="accelerate">accelerate</button>
-        <button data-type="brake">brake</button>
-      </div>
-      <div class="mobile-controls turning hide">
-        <button data-type="left">left</button>
-        <button data-type="right">right</button>
-      </div>
-      <aside class="users-wrapper">
-        <section id="users">
-          <button id="start-race-btn" disabled>start</button>
-          <button id="stop-race-btn" class="hide">stop</button>
-          <h2>Users</h2>
-          <ul class="users-list"></ul>
-        </section>
-        <sections class="rooms">
-          <h2>Rooms</h2>
-          <button id="join-race-room-btn" class="hide">
-            Join the race room
-          </button>
-          <button id="leave-race-room-btn" class="hide">
-            Leave the race room
-          </button>
-          <ul class="room-list"></ul>
-        </sections>
-      </aside>
-      <section id="users-indicators"></section>
-      <div class="dialog-wrapper hide">
-        <div class="dialog">
-          <div class="dialog-header">
-            <button class="dialog-header__close-button">close</button>
-          </div>
-          <div class="dialog-content">content</div>
-          <div class="dialog-footer">footer</div>
+
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <link rel="stylesheet" href="./styles/styles.scss" />
+  <title>Rally Online</title>
+</head>
+
+<body>
+  <canvas id="canvas"></canvas>
+  <div id="root">
+    <div id="speedometer">0</div>
+    <div id="fps">0</div>
+    <div class="mobile-controls acceleration hide">
+      <button data-type="accelerate">accelerate</button>
+      <button data-type="brake">brake</button>
+    </div>
+    <div class="mobile-controls turning hide">
+      <button data-type="left">left</button>
+      <button data-type="right">right</button>
+    </div>
+    <aside class="users-wrapper">
+      <section id="users">
+        <button id="start-race-btn" disabled>start</button>
+        <button id="stop-race-btn" class="hide">stop</button>
+        <h2>Users</h2>
+        <ul class="users-list"></ul>
+      </section>
+      <sections class="rooms">
+        <h2>Rooms</h2>
+        <button id="join-race-room-btn" class="hide">
+          Join the race room
+        </button>
+        <button id="leave-race-room-btn" class="hide">
+          Leave the race room
+        </button>
+        <ul class="room-list"></ul>
+      </sections>
+    </aside>
+    <section id="users-indicators"></section>
+    <div class="dialog-wrapper hide">
+      <div class="dialog">
+        <div class="dialog-header">
+          <button class="dialog-header__close-button">close</button>
         </div>
+        <div class="dialog-content">content</div>
+        <div class="dialog-footer">footer</div>
       </div>
     </div>
-    <script type="module" src="main.ts"></script>
-  </body>
-</html>
+  </div>
+  <script type="module" src="main.ts"></script>
+</body>
+
+</html>
diff --git a/packages/client/src/main.ts b/packages/client/src/main.ts
@@ -11,14 +11,6 @@ import { debounce, toggleStartRaceBtns } from "./utils";
 import type { Game, GameConfig, GameObject, Position } from "@neu5/types/src";
 import type { Quaternion } from "@babylonjs/core";
 
-// import type {
-//   GameConfig,
-//   GameObject,
-//   Player,
-//   Position,
-//   ServerToClientEvents,
-// } from "@neu5/types/src";
-
 type PlayerFromServer = {
   color: string;
   userID: string;

diff --git a/packages/server/src/sockets/sockets.ts b/packages/server/src/sockets/sockets.ts
@@ -206,6 +206,11 @@ const createSocketHandlers = ({
   );
 
   socket.on("client:join race room", async () => {
+    if (game.race.isStarted) {
+      socket.emit("server:show error", { message: "The race is already going on! You can't join the room now." });
+      return;
+    }
+
     roomRace.join(socket.data.sessionID);
 
     emitRoomInfo({ io, room: roomRace, sessionStore });
@@ -224,6 +229,11 @@ const createSocketHandlers = ({
   });
 
   socket.on("client:start the race", async () => {
+    if (game.race.isStarted) {
+      socket.emit("server:show error", { message: "The race is already going on!" });
+      return;
+    }
+
     game.race.isStarted = true;
     game.config = {
       width: 100,