Merge branch 'main' of https://forge.univ-lyon1.fr/p1907037/elcrawlavers

client/src/components/Menu/Rooms/Modals/CreateModal.tsx

@@ -51,7 +51,9 @@ const CreateModal: FC<Props> = ({
       if (res.status === 200) {
         const data = await res.json();
         const roomId = data.roomId;
+        const pass = data.roomPass;
         localStorage.setItem("gameId", roomId);
+        localStorage.setItem("gamePassword", pass);
         setRoomName("");
         setNbPlayersMax(20);
         setBoardSize(50);

client/src/components/Menu/Rooms/RoomComponents/SingleRoom/SingleRoom.tsx

@@ -91,8 +91,10 @@ const singleRoom: FC<Props> = ({
       {joinModalOpen ? (
         <div className="single-room-container-modal">
           <JoinModal
+            gamePassword={gamePassword}
             setJoinModalOpen={setJoinModalOpen}
             setGamePassword={setGamePassword}
+            setIsGameStarted={setIsGameStarted}
           />
         </div>
       ) : (

client/src/components/Menu/Rooms/RoomComponents/SingleRoom/SingleRoomComponents/JoinModal.tsx

@@ -1,18 +1,36 @@
-import React, { FC } from "react";
+import React, { FC, useRef } from "react";
 import { BiArrowBack } from "react-icons/bi";
 import "./JoinModal.css";
+import {
+  getAuth,
+  onAuthStateChanged,
+  User as FirebaseUser,
+  updateProfile,
+} from "firebase/auth";
 
 interface Props {
+  gamePassword: string;
   setJoinModalOpen: React.Dispatch<React.SetStateAction<boolean>>;
   setGamePassword: React.Dispatch<React.SetStateAction<string>>;
+  setIsGameStarted: React.Dispatch<React.SetStateAction<boolean>>;
 }
 
-const JoinModal: FC<Props> = ({ setJoinModalOpen, setGamePassword }) => {
+const JoinModal: FC<Props> = ({
+  gamePassword,
+  setJoinModalOpen,
+  setGamePassword,
+  setIsGameStarted,
+}) => {
   const handleChange = (event: any): any => {
     event.preventDefault();
     setGamePassword(event.target.value);
   };
 
+  const onJoinCLick = () => {
+    localStorage.setItem("gamePassword", gamePassword);
+    setIsGameStarted(true);
+  };
+
   return (
     <div className="join-modal-container">
       <span className="back-icon" onClick={(e) => setJoinModalOpen(false)}>
@@ -28,7 +46,9 @@ const JoinModal: FC<Props> = ({ setJoinModalOpen, setGamePassword }) => {
         maxLength={10}
         onChange={(e) => handleChange(e)}
       />
-      <button className="submit-password">GO</button>
+      <button className="submit-password" onClick={() => onJoinCLick()}>
+        GO
+      </button>
     </div>
   );
 };

client/src/phaser/scenes/GameScene.ts

@@ -1,4 +1,4 @@
-import Phaser from "phaser";
+import Phaser, { Game } from "phaser";
 import Player from "../gameObjects/Player";
 import Board from "../gameObjects/Board";
 import io from "socket.io-client";
@@ -24,6 +24,8 @@ export default class GameScene extends Phaser.Scene {
     //get  value from localStorage selectedSkin as number
     const selectedSkin = Number(localStorage.getItem("selectedSkin")) || 0;
     const gameID = localStorage.getItem("gameId") || "default";
+    const password = localStorage.getItem("gamePassword") || "default";
+    console.log("PASSWORD : " + password);
 
     console.log("Player skin number " + selectedSkin);
     getAuth(app)
@@ -37,6 +39,7 @@ export default class GameScene extends Phaser.Scene {
           query: {
             playerSkin: selectedSkin,
             gameID: gameID,
+            password: password,
           },
         });
       });
@@ -234,9 +237,11 @@ export default class GameScene extends Phaser.Scene {
   }
 
   initGamePassword() {
-    const gameID = localStorage.getItem("gameId") || "default";
+    const gamePass = localStorage.getItem("gamePassword");
     const gamePassword = document.getElementById("gamePassword");
     if (!gamePassword) return;
-    gamePassword.textContent = "Password : " + gameID;
+    gamePassword.textContent = !gamePass
+      ? "No Password"
+      : "Password : " + gamePass;
   }
 }

server/src/GameManager.ts

@@ -12,6 +12,9 @@ class GameManager {
   createGame(settings: CreateGameSettings): Game {
     if (settings.isPrivate && !settings.password) {
       settings.password = Math.random().toString(36).substring(8);
+      if (typeof window !== "undefined") {
+        localStorage.setItem("gamePassword", settings.password);
+      }
     }
 
     const game = new Game(this.socketServeur, settings);
@@ -41,7 +44,7 @@ class GameManager {
     return game;
   }
 
-  getGame(gameID: string): Game | undefined {
+  getGame(gameID?: string): Game | undefined {
     return this.games.find((game) => game.gameID === gameID);
   }
 

server/src/api/game.ts

@@ -23,8 +23,9 @@ gameRouteur
         isPrivate: req.body.isPrivate,
       };
       gameManager.createGame(settings);
-      res.json({ roomId: settings.roomId });
-      console.log(settings.roomId);
+      const password = gameManager.getGame(settings.roomId)?.password;
+      console.log("Mot de pass du back :" + password);
+      res.json({ roomId: settings.roomId, roomPass: password });
     }
   );
 

server/src/index.ts

@@ -40,7 +40,7 @@ io.on("connection", (socket) => {
     const game = gameManager.getGame(gameID);
     if (game) {
       console.log("Game found, joining game");
-      game.join(socket);
+      game.join(socket, password);
     } else {
       console.log("Game not found, joining default game");
       gameManager.defaultGame.join(socket);