variable d'environnement pour le path

cryptide_project/htaccess

@@ -1,9 +0,0 @@
-<FilesMatch "\.css$">
-    ForceType text/css
-    Header set Content-Type "text/css"
-</FilesMatch>
-
-<FilesMatch "\.js$">
-    ForceType application/javascript
-    Header set Content-Type "application/javascript"
-</FilesMatch>

cryptide_project/src/App.tsx

@@ -58,9 +58,13 @@ function App() {
     setLocale(newLocale);
   };
 
+  const basePath = process.env.REACT_APP_BASE_PATH || '';
+
+  console.log(basePath)
+
 
   //const location = useLocation();
-  const hasNavbarVisible = ["/containers/Crypteam-website/", "/containers/Crypteam-website/login", "/containers/Crypteam-website/signup", "/containers/Crypteam-website/play", "/containers/Crypteam-website/lobby", "/containers/Crypteam-website/endgame", "/containers/Crypteam-website/deduc"]//.includes(window.location.pathname);
+  const hasNavbarVisible = [basePath + "/", basePath + "/login", basePath + "/signup", basePath + "/play", basePath + "/lobby", basePath + "/endgame", basePath + "/deduc"]//.includes(window.location.pathname);
 
 
   return (
@@ -73,17 +77,18 @@ function App() {
               <BrowserRouter>  
                 {hasNavbarVisible && <AppNavbar changeLocale={changeLocale} />}
                 <Routes>
-                  <Route path="/containers/Crypteam-website/" element={<NewPlay/>} />
+                
-                  <Route path="/containers/Crypteam-website/login" element={<Login />} />
+                  <Route path={`${basePath}/`} element={<NewPlay/>} />
-                  <Route path="/containers/Crypteam-website/signup" element={<SignUp />} />
+                  <Route path={`${basePath}/login`} element={<Login />} />
-                  <Route path="/containers/Crypteam-website/presentation" element={<Home />} />
+                  <Route path={`${basePath}/signup`} element={<SignUp />} />
-                  <Route path="/containers/Crypteam-website/lobby" element={<Lobby/>} />
+                  <Route path={`${basePath}/presentation`} element={<Home />} />
-                  <Route path="/containers/Crypteam-website/endgame" element={<EndGame/>} />
+                  <Route path={`${basePath}/lobby`} element={<Lobby/>} />
-                  <Route path="/containers/Crypteam-website/game" element={<InGame locale={locale} changeLocale={changeLocale}/>}/>
+                  <Route path={`${basePath}/endgame`} element={<EndGame/>} />
-                  <Route path="/containers/Crypteam-website/info" element={<InfoPage locale={locale} changeLocale={changeLocale}/>} />
+                  <Route path={`${basePath}/game`} element={<InGame locale={locale} changeLocale={changeLocale}/>}/>
-                  <Route path="/containers/Crypteam-website/deduc" element={<DeducGrid/>} />
+                  <Route path={`${basePath}/info`} element={<InfoPage locale={locale} changeLocale={changeLocale}/>} />
-                  <Route path="/containers/Crypteam-website/profile" element={<Profile/>} />
+                  <Route path={`${basePath}/deduc`} element={<DeducGrid/>} />
-                  <Route path="/containers/Crypteam-website/join" element={<Lobbies/>}/>
+                  <Route path={`${basePath}/profile`} element={<Profile/>} />
+                  <Route path={`${basePath}/join`} element={<Lobbies/>}/>
                   {/* <Route path="/solo" element={<SoloGame locale={locale} changeLocale={changeLocale} />}/>   */}
 
                   <Route path="*" element={<ErrorPage code="404" msg='not found' />} /> {/* page 404 */}

cryptide_project/src/Components/GraphContainer.tsx

@@ -67,6 +67,8 @@ let cptBug = 0
 let cptUseEffect = 0
 let testPlayers: Player[] = []
 
+const basePath = process.env.REACT_APP_BASE_PATH || '';
+
 
 const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleShowTurnBar, handleTurnBarTextChange, playerTouched, setPlayerTouched, changecptTour, solo, isDaily, isEasy, addToHistory, showLast, setNetwork, setNetworkEnigme, setPlayerIndex, askedWrong, setAskedWrong, importToPdf, setImportToPdf}) => {
   let cptTour: number = 0
@@ -809,7 +811,7 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
           socket.off("put imossible grey")
           socket.off("who plays")
     
-          navigate("/endgame")
+          navigate(`${basePath}/endgame`)
         }        
       }
     })
@@ -1018,8 +1020,7 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
                     catch(error){
                       console.log(error);
                     }
-
+                    navigate(`${basePath}/endgame?solo=true+${isDaily}`)
-                    navigate("/endgame?solo=true&daily=" + isDaily)
                   }
                   
                 }

cryptide_project/src/Components/LobbyContainer.tsx

@@ -20,6 +20,8 @@ interface LobbyContainerProps {
     //? mettre un "nbplayermax" si le nombre de joueur max peut etre fixé ?
 }
 
+const basePath = process.env.REACT_APP_BASE_PATH || '';
+
 const LobbyContainer: React.FC<LobbyContainerProps> = ({roomNum, HeadPlayer, nbPlayer, setFirst, started}) => {
     const theme=useTheme();
 
@@ -47,7 +49,7 @@ const LobbyContainer: React.FC<LobbyContainerProps> = ({roomNum, HeadPlayer, nbP
             if (nbPlayer < 6 && !started) {
                 socket.off("request lobbies")
                 setFirst(true)
-                navigate(dest);
+                navigate(`${basePath}/${dest}`);
             }
             else if(started){
                 handleShowStart()

cryptide_project/src/Components/NavBar.tsx

@@ -25,6 +25,9 @@ import { useTheme } from '../Style/ThemeContext';
 import { useAuth } from '../Contexts/AuthContext';
 import { useNavigate } from 'react-router-dom';
 
+const basePath = process.env.REACT_APP_BASE_PATH || '';
+
+
 // @ts-ignore
 function AppNavbar({changeLocale}) {
     const theme = useTheme();
@@ -34,11 +37,11 @@ function AppNavbar({changeLocale}) {
 
 
     function navigateToProfile(){
-        navigate("/profile")
+        navigate(`${basePath}/profile`)
     }
 
     function navigateToHome(){
-        navigate("/")
+        navigate(`${basePath}/`)
     }
 
     return (

cryptide_project/src/Error/ErrorPage.tsx

@@ -6,6 +6,7 @@ import './ErrorStyle.css';
 import { FormattedMessage } from 'react-intl';
 import { Button } from 'react-bootstrap';
 
+const basePath = process.env.REACT_APP_BASE_PATH || '';
 
 
 //@ts-ignore
@@ -28,7 +29,7 @@ function ErrorPage({ code = "", msg = "Something is wrong"}) {
             </div>
 
             <div className='centerDivH' style={{margin: "20px"}}>
-                <Button href='/' variant='danger'>Retour à l'accueil</Button>
+                <Button href={`${basePath}/join`} variant='danger'>Retour à l'accueil</Button>
             </div>
         </div>
     );

cryptide_project/src/Pages/InGame.tsx

@@ -52,6 +52,8 @@ import Indice from '../model/Indices/Indice';
 
 let cptNavigation = 0
 
+const basePath = process.env.REACT_APP_BASE_PATH || '';
+
 //@ts-ignore
 const InGame = ({locale, changeLocale}) => {
   
@@ -66,7 +68,7 @@ const InGame = ({locale, changeLocale}) => {
     if (cptNavigation % 2 == 0){
         if (navigationType.toString() == "POP"){
             socket.emit("player quit")
-            navigate("/play")
+            navigate(`${basePath}/play`)
         }
     }
   

cryptide_project/src/Pages/Lobby.tsx

@@ -50,6 +50,8 @@ import { DataSet } from 'vis-network';
 
 let gameStarted = false
 let firstLaunch = true
+const basePath = process.env.REACT_APP_BASE_PATH || '';
+
 
 function Lobby() {
     const theme=useTheme();
@@ -134,7 +136,7 @@ function Lobby() {
         gameStarted = true
         //socket.off("player left")
         //socket.off("new player")
-        navigate('/game?solo=false&daily=false');
+        navigate(`${basePath}/game?solo=false&daily=false`);
     });
 
 
@@ -170,7 +172,7 @@ function Lobby() {
         setIndicesData(choosenIndices)
         first = true
         gameStarted = true
-        navigate('/game?solo=false&daily=false');
+        navigate(`${basePath}/game?solo=false&daily=false`)
     });
 
     socket.on("new player", (tab) =>{
@@ -185,17 +187,17 @@ function Lobby() {
 
     socket.on("room full", () => {
         //TODO POP UP pour quand la room est pleine
-        navigate("/play")
+        navigate(`${basePath}/play`)
     })
 
     socket.on("game started", () => {
         //TODO POP UP pour quand la room est pleine
-        navigate("/play")
+        navigate(`${basePath}/play`)
     })
 
     socket.on("game already started", () => {
         //TODO POP UP pour quand la room est pleine
-        navigate("/play")
+        navigate(`${basePath}/play`)
     })
 
     socket.on("player left", (tab, i) => {

cryptide_project/src/Pages/LoginForm.tsx

@@ -5,6 +5,8 @@ import { useAuth } from '../Contexts/AuthContext';
 import AuthService from '../services/AuthService';
 import '../Style/Global.css';
 
+const basePath = process.env.REACT_APP_BASE_PATH || '';
+
 const SignIn = () => {
     const navigate = useNavigate();
     const { login } = useAuth(); 
@@ -35,7 +37,7 @@ const SignIn = () => {
                 setShowConfirmation(true);
                 setTimeout(async () => {
                     await login();
-                    navigate('/');
+                    navigate(`${basePath}/`);
                 }, 1250);
             }
         } catch (error: any) {

cryptide_project/src/Pages/NewPlay.tsx

@@ -34,6 +34,9 @@ import Lobbies from './Lobbies';
 
 let cptNavigation = 0
 
+const basePath = process.env.REACT_APP_BASE_PATH || '';
+
+
 
 function NewPlay() {
     let first = true
@@ -97,7 +100,7 @@ function NewPlay() {
         setPersonNetworkData(networkPerson)
         setIndicesData(choosenIndices)
         setIndicesData(choosenIndices)
-        navigate('/game?solo=true&daily=false');
+        navigate(`${basePath}/game?solo=true&daily=false`);
     }
 
     
@@ -128,12 +131,12 @@ function NewPlay() {
     useEffect(() => {
         if (room !== null) {
             const nouvelleURL = `/lobby?room=${room}`;
-            navigate(nouvelleURL);
+            navigate(`${basePath}${nouvelleURL}`)
         }
     }, [room, navigate]);
 
     const goBack = () => {
-        navigate("/lobby?room=" + goBackRoom)
+        navigate(`${basePath}/lobby?room=${goBackRoom}`)
     }
 
 
@@ -156,7 +159,7 @@ function NewPlay() {
         setIndicesData(choosenIndices)
         setIndicesData(choosenIndices)
 
-        navigate('/game?solo=true&daily=true&easy=true');
+        navigate(`${basePath}/game?solo=true&daily=true&easy=true`);
         setShowOverlay(false);
     };
 
@@ -174,7 +177,7 @@ function NewPlay() {
             const map = EnigmeDuJourCreator.createEnigme(networkPerson, choosenIndices, choosenPerson, Stub.GenerateIndice())
             setDailyEnigmeData(map)
         }
-        navigate('/game?solo=true&daily=true&easy=false');
+        navigate(`${basePath}/game?solo=true&daily=true&easy=false`);
         setShowOverlay(false);
     };
 

cryptide_project/src/Pages/Play.tsx

@@ -32,6 +32,8 @@ import Info from '../res/icon/infoGreen.png';
 
 let cptNavigation = 0
 
+const basePath = process.env.REACT_APP_BASE_PATH || '';
+
 
 function Play() {
     let first = true
@@ -98,7 +100,7 @@ function Play() {
         setPersonNetworkData(networkPerson)
         setIndicesData(choosenIndices)
         setIndicesData(choosenIndices)
-        navigate('/game?solo=true&daily=false');
+        navigate(`${basePath}/game?solo=true&daily=false`);
     }
 
     
@@ -129,12 +131,12 @@ function Play() {
     useEffect(() => {
         if (room !== null) {
             const nouvelleURL = `/lobby?room=${room}`;
-            navigate(nouvelleURL);
+            navigate(`${basePath}${nouvelleURL}`);
         }
     }, [room, navigate]);
 
     const goBack = () => {
-        navigate("/lobby?room=" + goBackRoom)
+        navigate(`${basePath}/lobby?room=${goBackRoom}`)
     }
 
 
@@ -157,7 +159,7 @@ function Play() {
         setIndicesData(choosenIndices)
         setIndicesData(choosenIndices)
 
-        navigate('/game?solo=true&daily=true&easy=true');
+        navigate(`${basePath}/game?solo=true&daily=true&easy=true`);
         setShowOverlay(false);
     };
 
@@ -175,7 +177,7 @@ function Play() {
             const map = EnigmeDuJourCreator.createEnigme(networkPerson, choosenIndices, choosenPerson, Stub.GenerateIndice())
             setDailyEnigmeData(map)
         }
-        navigate('/game?solo=true&daily=true&easy=false');
+        navigate(`${basePath}/game?solo=true&daily=true&easy=false`);
         setShowOverlay(false);
     };
 
@@ -238,7 +240,7 @@ function Play() {
 
 
                     <button onClick={createLobby} className="ButtonNav" style={{backgroundColor: theme.colors.primary, borderColor: theme.colors.secondary}}> Créer une partie </button>
-                    <button onClick= {() => navigate("/join")} className="ButtonNav" style={{backgroundColor: theme.colors.primary, borderColor: theme.colors.secondary}}> Rejoindre </button>
+                    <button onClick= {() => navigate(`${basePath}/join`)} className="ButtonNav" style={{backgroundColor: theme.colors.primary, borderColor: theme.colors.secondary}}> Rejoindre </button>
                 </div>
             </div>
             <div className='rightContainer'>

cryptide_project/src/Pages/Profile.tsx

@@ -25,6 +25,8 @@ import Form from 'react-bootstrap/Form';
 import ProgressBar from 'react-bootstrap/ProgressBar';
 
 
+const basePath = process.env.REACT_APP_BASE_PATH || '';
+
 //@ts-ignore
 const Profile = () => {
   
@@ -184,7 +186,7 @@ const Profile = () => {
       }
       handleCloseDeleteModal();
 
-      navigate("/")
+      navigate(`${basePath}/`)
 
     } else {
       console.error('Phrase de confirmation incorrecte.');

cryptide_project/src/Pages/SignUpForm.tsx

@@ -4,6 +4,9 @@ import { useNavigate } from 'react-router-dom';
 import AuthService from '../services/AuthService';
 import '../Style/Global.css';
 
+const basePath = process.env.REACT_APP_BASE_PATH || '';
+
+
 const SignUp = () => {
     const navigate = useNavigate(); 
 
@@ -32,7 +35,7 @@ const SignUp = () => {
 
                 setShowConfirmation(true);
                 setTimeout(() => {
-                    navigate('/login');         // 3 secondes avant de rediriger vers la page de connexion
+                    navigate(`${basePath}/login`);         // 3 secondes avant de rediriger vers la page de connexion
                 }, 1250);
             }
         } catch (error: any) {