When Ever you are ready

.gitignore

@@ -62,4 +62,6 @@ node_modules
 *.pem
 
 
+backend/output.json
+
 docker/data

frontend/public/404.html

@@ -40,7 +40,7 @@
         counter--;
         setTimeout(updateCounter, 1150);
       } else {
-        window.location.href = '/Transcendence/';
+        window.location.href = '/';
       }
     }
 

frontend/src/App.js

@@ -3,13 +3,11 @@ import { I18nextProvider, useTranslation } from "react-i18next";
 import Translation from "./components/Translation";
 import Home from "./pages/Home";
 import Chat from "./pages/Chat";
-import Games from "./pages/Games/Games";
 import About from "./pages/About";
 import NotFound from "./components/404";
 import Sidebar from "./components/hamburger_menu/Hamburger";
 import Welcome from "./pages/Welcome";
 import Profile from "./pages/Profile";
-import Matchmaking from "./pages/Games/Matchmaking";
 import OriginalPong from "./pages/Games/OriginalPong";
 import PongAi from "./pages/Games/PongAi";
 import Pong3D from "./pages/Games/Pong3D";
@@ -47,7 +45,6 @@ const PageWrapper = ({ children, image, showSidebar = true, redirectUri }) => {
 function App() {
   const { i18n } = useTranslation();
   const basename = "";
-  // process.env.NODE_ENV === "production" ? "/Transcendence" : "";
   let REDIRECT_URI;
 
   if (process.env.NODE_ENV === "development") {
@@ -99,22 +96,6 @@ function App() {
               </PageWrapper>
             }
           />
-          <Route
-            path="matchmaking"
-            element={
-              <PageWrapper image={Background} redirectUri={REDIRECT_URI}>
-                <Matchmaking />
-              </PageWrapper>
-            }
-          />
-          <Route
-            path="games"
-            element={
-              <PageWrapper image={Background} redirectUri={REDIRECT_URI}>
-                <Games />
-              </PageWrapper>
-            }
-          />
           <Route
             path="profile"
             element={
@@ -173,7 +154,7 @@ function App() {
               </PageWrapper>
             }
           />
-		  <Route
+          <Route
             path="tournament"
             element={
               <PageWrapper image={Background} redirectUri={REDIRECT_URI}>

frontend/src/components/game/HowToPlay.js

@@ -50,6 +50,18 @@ const HowToPlay = ({ isOpen, setIsOpen, background, backgroundimage }) => {
             {t("If the blackhole swallows your planets, you lose.")}
           </p>
         </div>
+        <div className="text-center">
+          <h1 className="text-4xl mb-10">{t("Tournament")}</h1>
+          <p>
+            {t("Play a Tournament against other players.")}
+            <br />
+            {t("This mode is played in multiple rounds.")}
+            <br />
+            {t("You need to provide the nicknames for the participants")}
+            <br />
+            {t("Choose if they are real players or an AI.")}
+          </p>
+        </div>
         <div className="text-center">
           <h1 className="text-4xl mb-10">{t("Keybinds")}</h1>
           <div className="flex justify-between">

frontend/src/components/hamburger_menu/HamburgerMenu.js

@@ -34,7 +34,7 @@ const HamburgerMenu = ({
         <SidebarIcon
           icon={<SiGameandwatch size="32" />}
           text={t("Play or Watch Games")}
-          to="/games"
+          to="/choosepongmode"
         />
         <SidebarIcon
           icon={<FaUser size="32" />}

frontend/src/components/home/Readme.js

@@ -23,7 +23,6 @@ function Readme() {
   const [pong, visiblePong] = useOnScreen();
   const [pongai, visiblePongai] = useOnScreen();
   const [pong3d, visiblePong3d] = useOnScreen();
-  const [game, visibleGame] = useOnScreen();
   const [contributors, visibleContributors] = useOnScreen();
   const [github, visibleGithub] = useOnScreen();
   const [isOpen, setIsOpen] = useState(false);

frontend/src/components/sidebar/Logout.js

@@ -2,27 +2,31 @@ import axios from "axios";
 import Cookies from "js-cookie";
 
 const userLogout = async ({ redirectUri }) => {
-	try {
-		const token = Cookies.get('access');
-		const response = await axios.post(
-			`${redirectUri}/api/logout`,
-			{},
-			{
-				withCredentials: true,
-				headers: {
-					Authorization: `Bearer ${token}`,
-				},
-			}
-		);
+  try {
+    const token = Cookies.get("access");
+    const response = await axios.post(
+      `${redirectUri}/api/logout`,
+      {},
+      {
+        withCredentials: true,
+        headers: {
+          Authorization: `Bearer ${token}`,
+        },
+      }
+    );
 
-		if (response.status === 200) {
-			Cookies.remove('access');
-		} else {
-			console.log('Logout failed', response);
-		}
-	} catch (error) {
-		console.log(error);
-	}
+    if (response.status === 200) {
+      // Cookies.remove('access');
+      const allCookies = Cookies.get();
+      for (let cookie in allCookies) {
+        Cookies.remove(cookie);
+      }
+    } else {
+      console.log("Logout failed", response);
+    }
+  } catch (error) {
+    console.log(error);
+  }
 };
 
 export default userLogout;

frontend/src/components/sidebar/Sidebar_Monitor.js

@@ -27,7 +27,7 @@ const SidebarContent = ({ t, changeLanguage, redirectUri }) => {
         <SidebarIcon
           icon={<SiGameandwatch size="32" />}
           text={t("Play or Watch Games")}
-          to="/games"
+          to="/choosepongmode"
         />
         <SidebarIcon
           icon={<FaUser size="32" />}

frontend/src/components/welcome_page/RegisterButton.js

@@ -23,14 +23,26 @@ const RegisterButt = ({ t, redirectToHome, redirect_uri }) => {
         },
         { withCredentials: true }
       );
-	  const token = response.data.access;
+
+      const token = response.data.access;
+
       if (token) {
         Cookies.set("access", token, {
           expires: 7,
           sameSite: "Strict",
           secure: true,
         });
-        redirectToHome();
+        const login = await axios.post(
+          `${redirect_uri}/api/login`,
+          {
+            email: email,
+            password: password,
+          },
+          { withCredentials: true }
+        );
+        if (login) {
+          redirectToHome();
+        }
       }
     } catch (error) {
       if (error.response && error.response.data) {

frontend/src/locales/de/translation.json

@@ -12,6 +12,10 @@
   "The Project": "Das Projekt",
   "16 Major & 11 Minor modules": "16 Haupt- und 11 Nebenmodule",
   "Web": "Web",
+  "Play a Tournament against other players.": "Spielen Sie ein Turnier gegen andere Spieler.",
+  "This mode is played in multiple rounds.": "Dieser Modus wird in mehreren Runden gespielt.",
+  "You need to provide the nicknames for the participants": "Sie müssen die Nicknamen der Teilnehmer angeben.",
+  "Choose if they are real players or an AI.": "Wählen Sie aus, ob es sich um echte Spieler oder eine KI handelt.",
   "Use a framework as backend": "Verwenden Sie ein Framework als Backend",
   "Use a front-end framework or toolkit": "Verwenden Sie ein Front-End-Framework oder -Toolkit",
   "Use a database for the backend": "Verwenden Sie eine Datenbank für das Backend",

frontend/src/locales/en/translation.json

@@ -1,16 +1,20 @@
 {
   "Delete Account": "Delete Account",
-  "Are you sure you want to delete your account?" : "Are you sure you want to delete your account?",
+  "Are you sure you want to delete your account?": "Are you sure you want to delete your account?",
   "Submit": "Submit",
   "New Password ": "New Password ",
   "Confirm New Password ": "Confirm New Password ",
   "2 Factor Authentication": "2 Factor Authentication",
   "Settings": "Settings",
   "Passwords do not match": "Passwords do not match",
   "Tournament": "Tournament",
-  
+
   "Private": "Private",
   "Expanding browser compatibility": "Expanding browser compatibility",
+  "Play a Tournament against other players.": "Play a Tournament against other players.",
+  "This mode is played in multiple rounds.": "This mode is played in multiple rounds.",
+  "You need to provide the nicknames for the participants": "You need to provide the nicknames for the participants",
+  "Choose if they are real players or an AI.": "Choose if they are real players or an AI.",
 
   "The Project": "The Project",
   "16 Major & 11 Minor modules": "16 Major & 11 Minor modules",
@@ -69,10 +73,6 @@
   "Can you navigate thru the asteroid fields?": "Can you navigate thru the asteroid fields?",
   "Contributors": "Contributors",
 
-
-
-
-
   "How to play": "How to play",
   "The classic game of Pong.": "The classic game of Pong.",
   "Hit the ball back and forth": "Hit the ball back and forth",

frontend/src/locales/fr/translation.json

@@ -12,6 +12,10 @@
   "The Project": "Le Projet",
   "16 Major & 11 Minor modules": "16 Modules Majeurs & 11 Modules Mineurs",
   "Web": "Web",
+  "Play a Tournament against other players.": "Jouez un tournoi contre d'autres joueurs.",
+  "This mode is played in multiple rounds.": "Ce mode se joue en plusieurs rounds.",
+  "You need to provide the nicknames for the participants": "Vous devez fournir les surnoms des participants.",
+  "Choose if they are real players or an AI.": "Choisissez s'ils sont de vrais joueurs ou une IA.",
   "Use a framework as backend": "Utiliser un framework en tant que backend",
   "Use a front-end framework or toolkit": "Utiliser un framework ou une boîte à outils en front-end",
   "Use a database for the backend": "Utiliser une base de données pour le backend",

frontend/src/locales/hu/translation.json

@@ -12,6 +12,10 @@
   "The Project": "A Projekt",
   "16 Major & 11 Minor modules": "16 fő és 11 kisebb modul",
   "Web": "Web",
+  "Play a Tournament against other players.": "Játsszon egy versenyt más játékosok ellen.",
+  "This mode is played in multiple rounds.": "Ez a mód több fordulóban játszható.",
+  "You need to provide the nicknames for the participants": "Meg kell adnia a résztvevők becenevét.",
+  "Choose if they are real players or an AI.": "Válasszon valódi játékos vagy mesterséges intelligencia ellenfelet.",
   "Use a framework as backend": "Használjon egy keretrendszert a háttérben",
   "Use a front-end framework or toolkit": "Használjon egy front-end keretrendszert vagy eszköztárat",
   "Use a database for the backend": "Használjon adatbázist a háttérben",

frontend/src/locales/jp/translation.json

@@ -12,6 +12,10 @@
   "The Project": "プロジェクト",
   "16 Major & 11 Minor modules": "16のメジャーモジュールと11のマイナーモジュール",
   "Web": "ウェブ",
+  "Play a Tournament against other players.": "他のプレイヤーとトーナメントをプレイします。",
+  "This mode is played in multiple rounds.": "このモードは複数のラウンドでプレイされます。",
+  "You need to provide the nicknames for the participants": "参加者のニックネームを提供する必要があります。",
+  "Choose if they are real players or an AI.": "彼らが実際のプレイヤーかAIかを選択してください。",
   "Use a framework as backend": "バックエンドとしてフレームワークを使用する",
   "Use a front-end framework or toolkit": "フロントエンドのフレームワークやツールキットを使用する",
   "Use a database for the backend": "バックエンドにデータベースを使用する",

frontend/src/pages/About.js

@@ -9,8 +9,19 @@ import zsolt from "../images/about/zsolt.jpeg";
 import jamshidbek from "../images/about/jamshidbek.jpg";
 import karlis from "../images/about/karlis.png";
 import laszlo from "../images/about/laszlo.png";
+import Cookies from "js-cookie";
 
 function About() {
+  useEffect(() => {
+    setTimeout(() => {
+      const accessToken = Cookies.get("access");
+
+      if (!accessToken) {
+        window.location.href = "/404.html";
+      }
+    }, 1000);
+  }, []);
+
   const [selectedCard, setSelectedCard] = React.useState(null);
   const { t } = useTranslation();
   const teamMembers = [
@@ -121,10 +132,10 @@ function About() {
 				flex flex-col items-center justify-start transition-all duration-800
 				ease-in-out transform-gpu shadow-2xl
 				${
-				selectedCard === index
-					? "w-96 absolute top-1/2 transform -translate-y-1/2"
-					: ""
-				}`}
+          selectedCard === index
+            ? "w-96 absolute top-1/2 transform -translate-y-1/2"
+            : ""
+        }`}
                 style={{
                   backgroundImage: `url(${backgroundImage})`,
                   transition: "transform 0.0s ease-in-out",

frontend/src/pages/Chat.js

@@ -12,8 +12,19 @@ import {
   unblockUser,
   getBlockedUsers,
 } from "../components/API";
+import Cookies from "js-cookie";
 
 function Chat({ redirectUri }) {
+  useEffect(() => {
+    setTimeout(() => {
+      const accessToken = Cookies.get("access");
+
+      if (!accessToken) {
+        window.location.href = "/404.html";
+      }
+    }, 1000);
+  }, []);
+
   const { t } = useTranslation();
   const navigate = useNavigate();
   const [currentChannel, setCurrentChannel] = useState("General");
@@ -349,7 +360,7 @@ function Chat({ redirectUri }) {
                   </span>
                   <img
                     className="w-24 h-24 rounded-full mb-4 mx-auto"
-                    src={userDetails.user.profile_picture}
+                    src={userDetails.user.profile_picture ? userDetails.user.profile_picture : "https://raw.githubusercontent.com/zstenger93/Transcendence/master/images/transcendence.webp"}
                     alt="Profile"
                   />
                   <p className="font-nosifer mb-2">

frontend/src/pages/Games/ChoosePongMode.js

@@ -1,13 +1,24 @@
-import React, { useState } from "react";
+import React, { useState, useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { Link, useNavigate } from "react-router-dom";
 import BackButton from "../../components/buttons/BackButton";
 import { ButtonStyle } from "../../components/buttons/ButtonStyle";
 import backgroundimage from "../../images/pongbg.png";
 import background from "../../images/welcomebg.jpg";
 import HowToPlay from "../../components/game/HowToPlay";
+import Cookies from "js-cookie";
 
 function ChoosePongMode() {
+  useEffect(() => {
+    setTimeout(() => {
+      const accessToken = Cookies.get("access");
+
+      if (!accessToken) {
+        window.location.href = "/404.html";
+      }
+    }, 1000);
+  }, []);
+
   const [isOpen, setIsOpen] = useState(false);
   const navigate = useNavigate();
   const { t } = useTranslation();
@@ -30,7 +41,7 @@ function ChoosePongMode() {
         <Link to="/multiplayer" className={`mb-8 ${ButtonStyle}`}>
           {t("Multiplayer")}
         </Link>
-		<Link to="/tournament" className={`mb-8 ${ButtonStyle}`}>
+        <Link to="/tournament" className={`mb-8 ${ButtonStyle}`}>
           {t("Tournament")}
         </Link>
         <Link
@@ -45,7 +56,7 @@ function ChoosePongMode() {
         <BackButton navigate={navigate} t={t} />
         <HowToPlay
           isOpen={isOpen}
-		  setIsOpen={setIsOpen}
+          setIsOpen={setIsOpen}
           background={background}
           backgroundimage={backgroundimage}
         />