correct connection handling to handle when socket is already connected, patch gap in HTTP code handling

client/src/modules/page_handlers/gameHandler.js

@@ -20,6 +20,17 @@ import { Ended } from '../game_state/states/Ended.js';
 export const gameHandler = (socket, window, gameDOM) => {
     document.body.innerHTML = gameDOM + document.body.innerHTML;
     injectNavbar();
+    const connectionHandler = () => {
+        if (stateBucket.timerWorker) {
+            stateBucket.timerWorker.terminate();
+            stateBucket.timerWorker = null;
+        }
+        syncWithGame(
+            socket,
+            UserUtility.validateAnonUserSignature(stateBucket.environment),
+            window
+        );
+    }
     return new Promise((resolve, reject) => {
         window.fetch(
             '/api/games/environment',
@@ -30,22 +41,17 @@ export const gameHandler = (socket, window, gameDOM) => {
         ).catch(() => {
             reject(new Error('There was a problem connecting to the room.'));
         }).then((response) => {
-            if (!response.ok) {
-                reject(new Error('HTTP ' + response.status + ': Could not connect to the room'));
+            if (!response.ok && !(response.status === 304)) {
+                reject(new Error('Could not connect to the room: HTTP ' + response.status + ': ' + response.statusText));
                 return;
             }
             response.text().then((text) => {
                 stateBucket.environment = text;
+                if (socket.connected) {
+                    connectionHandler();
+                }
                 socket.on('connect', () => {
-                    if (stateBucket.timerWorker) {
-                        stateBucket.timerWorker.terminate();
-                        stateBucket.timerWorker = null;
-                    }
-                    syncWithGame(
-                        socket,
-                        UserUtility.validateAnonUserSignature(stateBucket.environment),
-                        window
-                    );
+                    connectionHandler();
                 });
                 socket.on('connect_error', (err) => {
                     toast(err, 'error', true, false);

client/src/scripts/home.js

@@ -31,7 +31,7 @@ function attemptToJoinGame (event) {
                 mode: 'cors'
             }
         ).then((res) => {
-            if (!res.ok) {
+            if (!res.ok && !(res.status === 304)) {
                 switch (res.status) {
                     case 404:
                         toast('Game not found', 'error', true);

client/src/scripts/join.js

@@ -28,7 +28,7 @@ const joinHandler = (e) => {
     if (validateName(name)) {
         sendJoinRequest(e, name, accessCode)
             .then((res) => {
-                if (!res.ok) {
+                if (!res.ok && !(res.status === 304)) {
                     switch (res.status) {
                         case 404:
                             toast('Game not found', 'error', true);

client/src/view_templates/GameTemplate.js

@@ -18,7 +18,7 @@ const template =
                 <div></div>
                 <div></div>
             </div>
-            <p>Connecting to the Room...</p>
+            <p>Waiting for Connection to Room...</p>
         </div>
         <div id="mobile-menu-background-overlay"></div>
         <div id="navbar"></div>