From 51832e59471cbc11dd8715e05b895c7c9b006c13 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Thu, 11 Apr 2024 23:48:50 +0200 Subject: [PATCH 01/71] Changed apiEndpoint reference --- webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx | 2 +- webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx | 2 +- webapp/src/components/game/singleplayer/GameSinglePlayer.tsx | 2 +- .../components/game/singleplayer/PlayingGameSinglePlayer.tsx | 2 +- webapp/src/components/group/GroupTable.tsx | 2 +- webapp/src/components/group/NoGroup.tsx | 2 +- webapp/src/components/login/Login.tsx | 2 +- webapp/src/components/register/Register.tsx | 2 +- webapp/src/pages/groups/index.tsx | 2 +- 9 files changed, 9 insertions(+), 9 deletions(-) diff --git a/webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx b/webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx index 88bd8b79..529c3c94 100644 --- a/webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx +++ b/webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx @@ -18,7 +18,7 @@ const LobbyMultiPlayer: FC = ({socket, handleCurrentStage const fetchQuestions = async () => { setFetched(false) - const apiEndpoint = 'http://74.234.241.249:8000' + const apiEndpoint = 'http://localhost:800' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; try { diff --git a/webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx b/webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx index 127435b6..aa66f05f 100644 --- a/webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx +++ b/webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx @@ -26,7 +26,7 @@ const QuestionsMultiPlayer: FC = ({socket, questions, }, [questions]); const uuid = localStorage.getItem("userUUID"); - const apiEndpoint = 'http://74.234.241.249:8000' + const apiEndpoint = 'http://localhost:800' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; const [currentQuestion, setCurrentQuestion] = useState(0); diff --git a/webapp/src/components/game/singleplayer/GameSinglePlayer.tsx b/webapp/src/components/game/singleplayer/GameSinglePlayer.tsx index 4a948148..6c6296a5 100644 --- a/webapp/src/components/game/singleplayer/GameSinglePlayer.tsx +++ b/webapp/src/components/game/singleplayer/GameSinglePlayer.tsx @@ -32,7 +32,7 @@ const GameSinglePlayer = () => { useEffect(() => { const fetchQuestions = async () => { - const apiEndpoint = 'http://74.234.241.249:8000' + const apiEndpoint = 'http://localhost:800' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; try { diff --git a/webapp/src/components/game/singleplayer/PlayingGameSinglePlayer.tsx b/webapp/src/components/game/singleplayer/PlayingGameSinglePlayer.tsx index 84417f38..6b6bb984 100644 --- a/webapp/src/components/game/singleplayer/PlayingGameSinglePlayer.tsx +++ b/webapp/src/components/game/singleplayer/PlayingGameSinglePlayer.tsx @@ -12,7 +12,7 @@ interface PlayingGameProps { const PlayingGame: FC = ({questions, setCurrentStage, setPlayers, players}) => { const uuid = localStorage.getItem("userUUID"); - const apiEndpoint = 'http://74.234.241.249:8000' + const apiEndpoint = 'http://localhost:800' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; const [currentQuestion, setCurrentQuestion] = useState(0); diff --git a/webapp/src/components/group/GroupTable.tsx b/webapp/src/components/group/GroupTable.tsx index 55fe7209..db841089 100644 --- a/webapp/src/components/group/GroupTable.tsx +++ b/webapp/src/components/group/GroupTable.tsx @@ -21,7 +21,7 @@ let groupName = ""; let total = 0; let numberMembers = 0; -const apiEndpoint = 'http://74.234.241.249:8000' +const apiEndpoint = 'http://localhost:800' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; export const GroupTable = (props: TableProps) => { diff --git a/webapp/src/components/group/NoGroup.tsx b/webapp/src/components/group/NoGroup.tsx index 00203245..cf19f387 100644 --- a/webapp/src/components/group/NoGroup.tsx +++ b/webapp/src/components/group/NoGroup.tsx @@ -3,7 +3,7 @@ import { Button, Container, Snackbar, TextField, Grid, Stack, RadioGroup, FormCo import { ChangeEvent, useEffect, useState } from 'react'; import axios from 'axios'; -const apiEndpoint = 'http://74.234.241.249:8000' +const apiEndpoint = 'http://localhost:800' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; interface Group { diff --git a/webapp/src/components/login/Login.tsx b/webapp/src/components/login/Login.tsx index f1d865dc..699d190e 100644 --- a/webapp/src/components/login/Login.tsx +++ b/webapp/src/components/login/Login.tsx @@ -18,7 +18,7 @@ const Login = (props: ActionProps) => { const [error, setError] = useState(''); const [openSnackbar, setOpenSnackbar] = useState(false); - const apiEndpoint = 'http://74.234.241.249:8000' + const apiEndpoint = 'http://localhost:800' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; const handleReturnButtonClick = () => { diff --git a/webapp/src/components/register/Register.tsx b/webapp/src/components/register/Register.tsx index 5201b2d8..532ec717 100644 --- a/webapp/src/components/register/Register.tsx +++ b/webapp/src/components/register/Register.tsx @@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next'; import './Register.scss'; import { useNavigate } from "react-router-dom"; -const apiEndpoint = 'http://74.234.241.249:8000' +const apiEndpoint = 'http://localhost:800' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; type ActionProps = { diff --git a/webapp/src/pages/groups/index.tsx b/webapp/src/pages/groups/index.tsx index 7884b923..053d8784 100644 --- a/webapp/src/pages/groups/index.tsx +++ b/webapp/src/pages/groups/index.tsx @@ -5,7 +5,7 @@ import "./groups-page.scss"; import NoGroup from 'src/components/group/NoGroup'; import { GroupTable } from 'src/components/group/GroupTable'; -const apiEndpoint = 'http://74.234.241.249:8000' +const apiEndpoint = 'http://localhost:800' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; let groupUUID: string = ""; From 644dadbaa69a51e34419a1379b745160e47e70bd Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Fri, 12 Apr 2024 00:32:25 +0200 Subject: [PATCH 02/71] Warnings corrected --- webapp/src/components/group/GroupTable.tsx | 15 +++++++-------- webapp/src/components/group/NoGroup.tsx | 4 ++-- webapp/src/pages/groups/index.tsx | 4 ++-- 3 files changed, 11 insertions(+), 12 deletions(-) diff --git a/webapp/src/components/group/GroupTable.tsx b/webapp/src/components/group/GroupTable.tsx index db841089..579d2528 100644 --- a/webapp/src/components/group/GroupTable.tsx +++ b/webapp/src/components/group/GroupTable.tsx @@ -13,7 +13,7 @@ interface Member { role: string; } -let members: Member[] = new Array(); +let members: Member[] = []; let membersCharged = false; let adminUUID = ""; @@ -28,12 +28,12 @@ export const GroupTable = (props: TableProps) => { const aFunction = async ()=>{ await axios.get(`${apiEndpoint}/getGroup/`+props.groupUUID).then(res => { console.log(res.data); - members = new Array(); + members = []; numberMembers=0; total = 0; for(let member of res.data.members){ let memberRole = "Member"; - if(member.uuid == res.data.admin.uuid){ + if(member.uuid === res.data.admin.uuid){ memberRole = "Leader"; } members.push({ @@ -51,7 +51,8 @@ export const GroupTable = (props: TableProps) => { membersCharged = true; }); - } + } + const leaveGroup = async () => { try{ const expelledUUID = JSON.stringify(localStorage.getItem("userUUID")).replace("\"", "").replace("\"", ""); @@ -67,11 +68,10 @@ export const GroupTable = (props: TableProps) => { useEffect(()=>{ aFunction(); - - }, [groupName]); + }); + return( - { membersCharged && ( @@ -109,6 +109,5 @@ export const GroupTable = (props: TableProps) => { - ) } \ No newline at end of file diff --git a/webapp/src/components/group/NoGroup.tsx b/webapp/src/components/group/NoGroup.tsx index cf19f387..1537cf15 100644 --- a/webapp/src/components/group/NoGroup.tsx +++ b/webapp/src/components/group/NoGroup.tsx @@ -17,7 +17,7 @@ type ActionProps = { nowHasGroup:()=> void; } -let groups: Group[] = new Array(); +let groups: Group[] = []; let groupsCharged = false; const NoGroup = (props: ActionProps) => @@ -62,7 +62,7 @@ const NoGroup = (props: ActionProps) => const findGroups = async () =>{ try{ await axios.get(`${apiEndpoint}/getGroups`).then( res => { - groups = new Array(); + groups = []; for(let group of res.data){ let isPublic = JSON.stringify(group.isPublic).replace("\"", "").replace("\"", ""); let comprobacion = isPublic === "true"; diff --git a/webapp/src/pages/groups/index.tsx b/webapp/src/pages/groups/index.tsx index 053d8784..b9c4bc29 100644 --- a/webapp/src/pages/groups/index.tsx +++ b/webapp/src/pages/groups/index.tsx @@ -1,5 +1,5 @@ import { useState, useEffect } from 'react'; -import { Button, Container } from "@mui/material"; +import { Container } from "@mui/material"; import axios from 'axios'; import "./groups-page.scss"; import NoGroup from 'src/components/group/NoGroup'; @@ -21,7 +21,7 @@ export const GroupsPage: React.FC<{}> = () => { for(var group of groups.data){ for(var member of group.members){ const uuid = JSON.stringify(member).replace("\"", "").replace("\"", ""); - if(userUuid == uuid){ + if(userUuid === uuid){ inGroup = true; groupUUID = JSON.stringify(group.uuid).replace("\"", "").replace("\"", ""); } From b4b7e8aa35621ead65c6152246a724ebf7511336 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Fri, 12 Apr 2024 00:34:38 +0200 Subject: [PATCH 03/71] Corrected error in apiEndpoint value --- webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx | 2 +- webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx | 2 +- webapp/src/components/game/singleplayer/GameSinglePlayer.tsx | 2 +- .../components/game/singleplayer/PlayingGameSinglePlayer.tsx | 2 +- webapp/src/components/group/GroupTable.tsx | 2 +- webapp/src/components/group/NoGroup.tsx | 2 +- webapp/src/components/login/Login.tsx | 2 +- webapp/src/components/register/Register.tsx | 2 +- webapp/src/pages/groups/index.tsx | 2 +- 9 files changed, 9 insertions(+), 9 deletions(-) diff --git a/webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx b/webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx index 529c3c94..e29c5032 100644 --- a/webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx +++ b/webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx @@ -18,7 +18,7 @@ const LobbyMultiPlayer: FC = ({socket, handleCurrentStage const fetchQuestions = async () => { setFetched(false) - const apiEndpoint = 'http://localhost:800' + const apiEndpoint = 'http://localhost:8000' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; try { diff --git a/webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx b/webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx index aa66f05f..b1017fd1 100644 --- a/webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx +++ b/webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx @@ -26,7 +26,7 @@ const QuestionsMultiPlayer: FC = ({socket, questions, }, [questions]); const uuid = localStorage.getItem("userUUID"); - const apiEndpoint = 'http://localhost:800' + const apiEndpoint = 'http://localhost:8000' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; const [currentQuestion, setCurrentQuestion] = useState(0); diff --git a/webapp/src/components/game/singleplayer/GameSinglePlayer.tsx b/webapp/src/components/game/singleplayer/GameSinglePlayer.tsx index 6c6296a5..fa25aa65 100644 --- a/webapp/src/components/game/singleplayer/GameSinglePlayer.tsx +++ b/webapp/src/components/game/singleplayer/GameSinglePlayer.tsx @@ -32,7 +32,7 @@ const GameSinglePlayer = () => { useEffect(() => { const fetchQuestions = async () => { - const apiEndpoint = 'http://localhost:800' + const apiEndpoint = 'http://localhost:8000' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; try { diff --git a/webapp/src/components/game/singleplayer/PlayingGameSinglePlayer.tsx b/webapp/src/components/game/singleplayer/PlayingGameSinglePlayer.tsx index 6b6bb984..df087de4 100644 --- a/webapp/src/components/game/singleplayer/PlayingGameSinglePlayer.tsx +++ b/webapp/src/components/game/singleplayer/PlayingGameSinglePlayer.tsx @@ -12,7 +12,7 @@ interface PlayingGameProps { const PlayingGame: FC = ({questions, setCurrentStage, setPlayers, players}) => { const uuid = localStorage.getItem("userUUID"); - const apiEndpoint = 'http://localhost:800' + const apiEndpoint = 'http://localhost:8000' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; const [currentQuestion, setCurrentQuestion] = useState(0); diff --git a/webapp/src/components/group/GroupTable.tsx b/webapp/src/components/group/GroupTable.tsx index 579d2528..ce807bf8 100644 --- a/webapp/src/components/group/GroupTable.tsx +++ b/webapp/src/components/group/GroupTable.tsx @@ -21,7 +21,7 @@ let groupName = ""; let total = 0; let numberMembers = 0; -const apiEndpoint = 'http://localhost:800' +const apiEndpoint = 'http://localhost:8000' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; export const GroupTable = (props: TableProps) => { diff --git a/webapp/src/components/group/NoGroup.tsx b/webapp/src/components/group/NoGroup.tsx index 1537cf15..6f0dc711 100644 --- a/webapp/src/components/group/NoGroup.tsx +++ b/webapp/src/components/group/NoGroup.tsx @@ -3,7 +3,7 @@ import { Button, Container, Snackbar, TextField, Grid, Stack, RadioGroup, FormCo import { ChangeEvent, useEffect, useState } from 'react'; import axios from 'axios'; -const apiEndpoint = 'http://localhost:800' +const apiEndpoint = 'http://localhost:8000' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; interface Group { diff --git a/webapp/src/components/login/Login.tsx b/webapp/src/components/login/Login.tsx index 699d190e..31915a72 100644 --- a/webapp/src/components/login/Login.tsx +++ b/webapp/src/components/login/Login.tsx @@ -18,7 +18,7 @@ const Login = (props: ActionProps) => { const [error, setError] = useState(''); const [openSnackbar, setOpenSnackbar] = useState(false); - const apiEndpoint = 'http://localhost:800' + const apiEndpoint = 'http://localhost:8000' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; const handleReturnButtonClick = () => { diff --git a/webapp/src/components/register/Register.tsx b/webapp/src/components/register/Register.tsx index 532ec717..f3140cd9 100644 --- a/webapp/src/components/register/Register.tsx +++ b/webapp/src/components/register/Register.tsx @@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next'; import './Register.scss'; import { useNavigate } from "react-router-dom"; -const apiEndpoint = 'http://localhost:800' +const apiEndpoint = 'http://localhost:8000' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; type ActionProps = { diff --git a/webapp/src/pages/groups/index.tsx b/webapp/src/pages/groups/index.tsx index b9c4bc29..b186f972 100644 --- a/webapp/src/pages/groups/index.tsx +++ b/webapp/src/pages/groups/index.tsx @@ -5,7 +5,7 @@ import "./groups-page.scss"; import NoGroup from 'src/components/group/NoGroup'; import { GroupTable } from 'src/components/group/GroupTable'; -const apiEndpoint = 'http://localhost:800' +const apiEndpoint = 'http://localhost:8000' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; let groupUUID: string = ""; From b571d05961aae1638173c6802eb87bcbe29a0bdb Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Fri, 12 Apr 2024 19:32:07 +0200 Subject: [PATCH 04/71] Personal information at profile --- webapp/src/pages/userProfile/index.tsx | 148 ++++++++++++++----------- 1 file changed, 85 insertions(+), 63 deletions(-) diff --git a/webapp/src/pages/userProfile/index.tsx b/webapp/src/pages/userProfile/index.tsx index 756855da..7473513c 100644 --- a/webapp/src/pages/userProfile/index.tsx +++ b/webapp/src/pages/userProfile/index.tsx @@ -1,83 +1,105 @@ -import { useEffect, useState } from 'react'; import { useTranslation } from 'react-i18next'; import { Container, Grid, Paper, Typography } from '@mui/material'; -import axios from 'axios'; import './profile-page.scss'; +import { useEffect, useState } from 'react'; +import axios from 'axios'; const ProfilePage = () => { - const { t } = useTranslation(); - const user = JSON.stringify(localStorage.getItem("username")).replace("\"", "").replace("\"", ""); - const email = JSON.stringify(localStorage.getItem("email")).replace("\"", "").replace("\"", ""); - const createdAt = localStorage.getItem("createdAt"); - const score = localStorage.getItem("totalScore"); - const nwins = localStorage.getItem("nwins"); - const nCorrectAnswers = localStorage.getItem("nCorrectAnswers"); - const nWrongAnswers = localStorage.getItem("nWrongAnswers"); - const [gameInfo, setGameInfo] = useState(null); - const uuid = localStorage.getItem('uuid'); + const { t } = useTranslation(); + const score = localStorage.getItem("totalScore"); + const nwins = localStorage.getItem("nwins"); + const nCorrectAnswers = localStorage.getItem("nCorrectAnswers"); + const nWrongAnswers = localStorage.getItem("nWrongAnswers"); + const apiEndpoint = 'http://localhost:8000' + const uuid = localStorage.getItem('uuid'); + const [profileInfo, setProfileInfo] = useState(null); - useEffect(() => { - const fetchGameInfo = async () => { - try { - const response = await axios.get(`http://localhost:8000/getStats/${uuid}`); - setGameInfo(response.data); - } catch (error) { - console.error('Error fetching game information:', error); - } - }; - fetchGameInfo(); - }, [uuid]); - - const formatDate = (date: any) => { - if (!date) return ""; - const options = { year: 'numeric', month: 'long', day: 'numeric' }; - return date.toLocaleDateString(undefined, options); + useEffect(() => { + const fetchData = async () => { + try { + const response = await axios.get(`${apiEndpoint}/getStats/${uuid}`); + setProfileInfo(response.data); + } catch (error) { + console.error('Error fetching data:', error); + } }; + fetchData(); + }, [apiEndpoint, uuid]); + + const formatDate = (dateString: string) => { + if (!dateString) return ""; + const date = new Date(dateString); + const options = { year: 'numeric', month: 'long', day: 'numeric' } as const; + return date.toLocaleDateString('en-US', options); + }; - return( - - Profile - - - - Personal Information + return( + + Profile + + + + Personal Information + {profileInfo && (
    -
  • {t('profile_uuid')} { uuid }
    • -
  • {t('profile_name')} { user }
    • -
  • {t('profile_created_at')} {formatDate(createdAt) }
    • +
  • + + {t('profile_uuid')} { JSON.stringify(profileInfo.userStats.uuid) + .replace("\"", "").replace("\"", "") } + +
    • +
  • + + {t('profile_name')} { JSON.stringify(profileInfo.userStats.username) + .replace("\"", "").replace("\"", "") } + +
    • +
  • + + {t('profile_created_at')} {formatDate(JSON.stringify(profileInfo.userStats.createdAt) + .replace("\"", "").replace("\"", "")) } + +
- - - - - Performance Statistics + )} + + + + + Performance Statistics + {profileInfo && (
  • {t('profile_points')} { JSON.stringify(Number(score)) }
  • {t('profile_nwins')} { JSON.stringify(Number(nwins)) }
  • {t('profile_n_correct_answers')} { JSON.stringify(Number(nCorrectAnswers)) }
  • {t('profile_n_wrong_answers')} { JSON.stringify(Number(nWrongAnswers)) }
- - - - - {t('profile_last_game_questions')} - {gameInfo ? ( -
    -
- ) : ( - {t('profile_last_game_questions_warning')} - )} - - - - - Additional Information - - + )} + + + + + {t('profile_last_game_questions')} + {profileInfo && ( +
    + +
+ )} + + + + + Additional Information + {profileInfo && ( +
    + +
+ )} + - - ) + + + ) } export default ProfilePage; \ No newline at end of file From 2ec290655b7b93604661ca4b35013ba4ded38c76 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Fri, 12 Apr 2024 21:38:50 +0200 Subject: [PATCH 05/71] Profile performance statistics --- webapp/src/pages/userProfile/index.tsx | 30 ++++++++++++++++++-------- 1 file changed, 21 insertions(+), 9 deletions(-) diff --git a/webapp/src/pages/userProfile/index.tsx b/webapp/src/pages/userProfile/index.tsx index 7473513c..3d22a058 100644 --- a/webapp/src/pages/userProfile/index.tsx +++ b/webapp/src/pages/userProfile/index.tsx @@ -6,10 +6,6 @@ import axios from 'axios'; const ProfilePage = () => { const { t } = useTranslation(); - const score = localStorage.getItem("totalScore"); - const nwins = localStorage.getItem("nwins"); - const nCorrectAnswers = localStorage.getItem("nCorrectAnswers"); - const nWrongAnswers = localStorage.getItem("nWrongAnswers"); const apiEndpoint = 'http://localhost:8000' const uuid = localStorage.getItem('uuid'); const [profileInfo, setProfileInfo] = useState(null); @@ -69,10 +65,26 @@ const ProfilePage = () => { Performance Statistics {profileInfo && (
    -
  • {t('profile_points')} { JSON.stringify(Number(score)) }
    • -
  • {t('profile_nwins')} { JSON.stringify(Number(nwins)) }
    • -
  • {t('profile_n_correct_answers')} { JSON.stringify(Number(nCorrectAnswers)) }
    • -
  • {t('profile_n_wrong_answers')} { JSON.stringify(Number(nWrongAnswers)) }
    • +
  • + + {t('profile_points')} { JSON.stringify(Number(profileInfo.userStats.totalScore)) } + +
    • +
  • + + {t('profile_nwins')} { JSON.stringify(Number(profileInfo.userStats.nWins)) } + +
    • +
  • + + {t('profile_n_correct_answers')} { JSON.stringify(Number(profileInfo.userStats.nCorrectAnswers)) } + +
    • +
  • + + {t('profile_n_wrong_answers')} { JSON.stringify(Number(profileInfo.userStats.nWrongAnswers)) } + +
)} @@ -82,7 +94,7 @@ const ProfilePage = () => { {t('profile_last_game_questions')} {profileInfo && (
    - +
)} From c44858c7cdf4c7d26bfb905e4949c1891d7a2394 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Fri, 12 Apr 2024 22:27:31 +0200 Subject: [PATCH 06/71] Last game info at profile --- webapp/src/i18n.ts | 4 +-- webapp/src/pages/userProfile/index.tsx | 47 ++++++++++++++++++++++++-- 2 files changed, 46 insertions(+), 5 deletions(-) diff --git a/webapp/src/i18n.ts b/webapp/src/i18n.ts index d770bd95..9d506f16 100644 --- a/webapp/src/i18n.ts +++ b/webapp/src/i18n.ts @@ -28,7 +28,7 @@ i18n profile_nwins: 'Number of victories:', profile_n_correct_answers: 'Correct answers:', profile_n_wrong_answers: 'Wrong answers:', - profile_last_game_questions: 'Last game questions', + profile_last_game_questions: 'Last Game', profile_last_game_questions_question: 'Question:', profile_last_game_questions_warning: 'You have not played any games yet', profile_last_game_questions_correct_answer: 'Correct answer:', @@ -55,7 +55,7 @@ i18n profile_nwins: 'Número de victorias:', profile_n_correct_answers: 'Respuestas correctas:', profile_n_wrong_answers: 'Respuestas incorrectas:', - profile_last_game_questions: 'Preguntas de la última partida', + profile_last_game_questions: 'Última Partida', profile_last_game_questions_warning: 'Todavía no has jugado ninguna partida', profile_last_game_questions_question: 'Pregunta:', profile_last_game_questions_correct_answer: 'Respuesta correcta:', diff --git a/webapp/src/pages/userProfile/index.tsx b/webapp/src/pages/userProfile/index.tsx index 3d22a058..810ce477 100644 --- a/webapp/src/pages/userProfile/index.tsx +++ b/webapp/src/pages/userProfile/index.tsx @@ -93,9 +93,50 @@ const ProfilePage = () => { {t('profile_last_game_questions')} {profileInfo && ( -
    - -
+
+ + Last game ID: { JSON.stringify(profileInfo.userStats.lastGameID) } + + Questions: +
    + { + profileInfo.lastGame.map((question, index) => ( +
  • + + Question { index } +
      +
    • + + Question: { JSON.stringify(question.question) } + +
      • +
    • + + Correct answer: { JSON.stringify(question.correctAnswer) } + +
      • +
    • + + Incorrect answer 1: { JSON.stringify(question.incorrectAnswer1) } + +
      • +
    • + + Incorrect answer 2: { JSON.stringify(question.incorrectAnswer2) } + +
      • +
    • + + Incorrect answer 3: { JSON.stringify(question.incorrectAnswer3) } + +
      • +
    +     +
    • + )) + } +
+
)} From fdabf339fc5c696cfe218b0e54c3d42b8a93c26f Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Sat, 13 Apr 2024 19:39:31 +0200 Subject: [PATCH 07/71] Making profile responsive --- webapp/src/pages/userProfile/index.tsx | 201 ++++++++++++++++--------- 1 file changed, 129 insertions(+), 72 deletions(-) diff --git a/webapp/src/pages/userProfile/index.tsx b/webapp/src/pages/userProfile/index.tsx index 810ce477..1ea1d0a1 100644 --- a/webapp/src/pages/userProfile/index.tsx +++ b/webapp/src/pages/userProfile/index.tsx @@ -6,7 +6,7 @@ import axios from 'axios'; const ProfilePage = () => { const { t } = useTranslation(); - const apiEndpoint = 'http://localhost:8000' + const apiEndpoint = 'http://localhost:8000'; const uuid = localStorage.getItem('uuid'); const [profileInfo, setProfileInfo] = useState(null); @@ -25,35 +25,52 @@ const ProfilePage = () => { const formatDate = (dateString: string) => { if (!dateString) return ""; const date = new Date(dateString); - const options = { year: 'numeric', month: 'long', day: 'numeric' } as const; + const options: Intl.DateTimeFormatOptions = { year: 'numeric', month: 'long', day: 'numeric' }; return date.toLocaleDateString('en-US', options); }; - return( + return ( - Profile + + Profile + - Personal Information + + Personal Information + {profileInfo && (
  • - - {t('profile_uuid')} { JSON.stringify(profileInfo.userStats.uuid) - .replace("\"", "").replace("\"", "") } + + {t('profile_uuid')}{' '} + {JSON.stringify(profileInfo.userStats.uuid) + .replace('"', '') + .replace('"', '')}
  • - - {t('profile_name')} { JSON.stringify(profileInfo.userStats.username) - .replace("\"", "").replace("\"", "") } + + {t('profile_name')}{' '} + {JSON.stringify(profileInfo.userStats.username) + .replace('"', '') + .replace('"', '')}
  • - - {t('profile_created_at')} {formatDate(JSON.stringify(profileInfo.userStats.createdAt) - .replace("\"", "").replace("\"", "")) } + + {t('profile_created_at')}{' '} + {formatDate( + JSON.stringify(profileInfo.userStats.createdAt) + .replace('"', '') + .replace('"', '') + )}
@@ -62,27 +79,42 @@ const ProfilePage = () => { - Performance Statistics - {profileInfo && ( + + Performance Statistics + + {profileInfo && (
  • - - {t('profile_points')} { JSON.stringify(Number(profileInfo.userStats.totalScore)) } + + {t('profile_points')}{' '} + {JSON.stringify(Number(profileInfo.userStats.totalScore))}
  • - - {t('profile_nwins')} { JSON.stringify(Number(profileInfo.userStats.nWins)) } + + {t('profile_nwins')}{' '} + {JSON.stringify(Number(profileInfo.userStats.nWins))}
  • - - {t('profile_n_correct_answers')} { JSON.stringify(Number(profileInfo.userStats.nCorrectAnswers)) } + + {t('profile_n_correct_answers')}{' '} + {JSON.stringify( + Number(profileInfo.userStats.nCorrectAnswers) + )}
  • - - {t('profile_n_wrong_answers')} { JSON.stringify(Number(profileInfo.userStats.nWrongAnswers)) } + + {t('profile_n_wrong_answers')}{' '} + {JSON.stringify( + Number(profileInfo.userStats.nWrongAnswers) + )}
@@ -91,50 +123,72 @@ const ProfilePage = () => { - {t('profile_last_game_questions')} + + {t('profile_last_game_questions')} + {profileInfo && (
- - Last game ID: { JSON.stringify(profileInfo.userStats.lastGameID) } + + Last game ID: {JSON.stringify(profileInfo.userStats.lastGameID)} + + + Questions: - Questions:
    - { - profileInfo.lastGame.map((question, index) => ( -
  • - - Question { index } -
      -
    • - - Question: { JSON.stringify(question.question) } - -
      • -
    • - - Correct answer: { JSON.stringify(question.correctAnswer) } - -
      • -
    • - - Incorrect answer 1: { JSON.stringify(question.incorrectAnswer1) } - -
      • -
    • - - Incorrect answer 2: { JSON.stringify(question.incorrectAnswer2) } - -
      • -
    • - - Incorrect answer 3: { JSON.stringify(question.incorrectAnswer3) } - -
      • -
    -     -
    • - )) - } + {profileInfo.lastGame.map((question, index) => ( +
  • + + Question {index} +
      +
    • + + Question: {JSON.stringify(question.question)} + +
      • +
    • + + Correct answer: {JSON.stringify(question.correctAnswer)} + +
      • +
    • + + Incorrect answer 1: {JSON.stringify(question.incorrectAnswer1)} + +
      • +
    • + + Incorrect answer 2: {JSON.stringify(question.incorrectAnswer2)} + +
      • +
    • + + Incorrect answer 3: {JSON.stringify(question.incorrectAnswer3)} + +
      • +
    +     +
    • + ))}
)} @@ -142,17 +196,20 @@ const ProfilePage = () => { - Additional Information - {profileInfo && ( -
    - -
- )} + + Additional Information + + {profileInfo &&
    }     - ) -} + ); +}; export default ProfilePage; \ No newline at end of file From 76b4c4a97fe6900f6f338c76656f79f06c4272b0 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Sat, 13 Apr 2024 19:43:55 +0200 Subject: [PATCH 08/71] Single player AI button --- webapp/src/pages/game/GamePage.css | 2 +- webapp/src/pages/game/index.tsx | 3 +++ 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/webapp/src/pages/game/GamePage.css b/webapp/src/pages/game/GamePage.css index 45d63edf..50503524 100644 --- a/webapp/src/pages/game/GamePage.css +++ b/webapp/src/pages/game/GamePage.css @@ -7,7 +7,7 @@ } .game-page-button { - width: 220px; + width: 250px; font-size: 1.5em; padding: 15px 30px; margin: 10px; diff --git a/webapp/src/pages/game/index.tsx b/webapp/src/pages/game/index.tsx index 4f2fcb77..3a9d259b 100644 --- a/webapp/src/pages/game/index.tsx +++ b/webapp/src/pages/game/index.tsx @@ -8,6 +8,9 @@ export const GamePage: React.FC<{}> = () => { + From c37bf10e7196fbdfbd56b2c7b8f9a025c472d848 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Sat, 13 Apr 2024 19:45:08 +0200 Subject: [PATCH 09/71] Game mode buttons direction and margin adjustments --- webapp/src/pages/game/GamePage.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/webapp/src/pages/game/GamePage.css b/webapp/src/pages/game/GamePage.css index 50503524..8c889926 100644 --- a/webapp/src/pages/game/GamePage.css +++ b/webapp/src/pages/game/GamePage.css @@ -1,6 +1,6 @@ .game-page-container { display: flex; - flex-direction: column; + flex-direction: row; align-items: center; justify-content: center; height: 100vh; @@ -10,7 +10,7 @@ width: 250px; font-size: 1.5em; padding: 15px 30px; - margin: 10px; + margin: 20px; text-decoration: none; background-color: #007bff; color: #ffffff; From 6c92c64ae11d7525831373f2c02310415bfc442a Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Sun, 14 Apr 2024 00:56:59 +0200 Subject: [PATCH 10/71] Warning on links --- webapp/src/components/game-layout/GameLayout.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/webapp/src/components/game-layout/GameLayout.tsx b/webapp/src/components/game-layout/GameLayout.tsx index 877af3be..515928b8 100644 --- a/webapp/src/components/game-layout/GameLayout.tsx +++ b/webapp/src/components/game-layout/GameLayout.tsx @@ -16,13 +16,13 @@ return(

    Game

  • - setCurrentView("Game")}>Game +
  • - setCurrentView("Group")} >Groups +
  • - setCurrentView("Scoreboard")}>Scoreboard +
    • From 8ea14a2a2550e6cc380c76fd7355a3a00202bbae Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Sun, 14 Apr 2024 01:01:51 +0200 Subject: [PATCH 11/71] Application logo redirecting and pointing --- webapp/src/common/Nav.tsx | 2 +- webapp/src/common/nav.scss | 1 + 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/webapp/src/common/Nav.tsx b/webapp/src/common/Nav.tsx index c8fa12c7..6526abfd 100644 --- a/webapp/src/common/Nav.tsx +++ b/webapp/src/common/Nav.tsx @@ -73,7 +73,7 @@ const NavBar: React.FC<{}> = () => > -
    +
    navigate("/game")}> {t('app_name')}
    - + + - {error && ( setError('')} message={`Error: ${error}`} /> )} From 20bfcc3768ca468b133e4cebf28a4ff9be457b74 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Sun, 14 Apr 2024 01:59:40 +0200 Subject: [PATCH 15/71] Corrected group button sizes and direction --- webapp/src/components/group/Group.scss | 4 ++-- webapp/src/components/group/NoGroup.tsx | 6 +++--- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/webapp/src/components/group/Group.scss b/webapp/src/components/group/Group.scss index b8434da3..4ca75961 100644 --- a/webapp/src/components/group/Group.scss +++ b/webapp/src/components/group/Group.scss @@ -1,6 +1,6 @@ .groups-container { display: flex; - flex-direction: row; + flex-direction: column; align-items: center; justify-content: center; height: 100vh; @@ -10,7 +10,7 @@ width: 250px; font-size: 1.5em; padding: 15px 30px; - margin: 20px; + margin: 5px; text-decoration: none; background-color: #007bff; color: #ffffff; diff --git a/webapp/src/components/group/NoGroup.tsx b/webapp/src/components/group/NoGroup.tsx index aaa580bf..569c32bc 100644 --- a/webapp/src/components/group/NoGroup.tsx +++ b/webapp/src/components/group/NoGroup.tsx @@ -114,9 +114,9 @@ const NoGroup = (props: ActionProps) => return ( -

    You are not part of a group...

    - - +

    You are not part of a group yet...

    + +     {error && ( setError('')} message={`Error: ${error}`} /> From 3a3e92c354a3820329001f69b9cd9895c28a37b0 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Sun, 14 Apr 2024 02:55:44 +0200 Subject: [PATCH 16/71] General changes to groups page --- webapp/src/components/group/Group.scss | 3 +-- webapp/src/components/group/NoGroup.tsx | 2 +- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/webapp/src/components/group/Group.scss b/webapp/src/components/group/Group.scss index 4ca75961..692c7e15 100644 --- a/webapp/src/components/group/Group.scss +++ b/webapp/src/components/group/Group.scss @@ -1,9 +1,8 @@ .groups-container { - display: flex; + display: flex !important; flex-direction: column; align-items: center; justify-content: center; - height: 100vh; } .group-button { diff --git a/webapp/src/components/group/NoGroup.tsx b/webapp/src/components/group/NoGroup.tsx index 569c32bc..32241c06 100644 --- a/webapp/src/components/group/NoGroup.tsx +++ b/webapp/src/components/group/NoGroup.tsx @@ -112,7 +112,7 @@ const NoGroup = (props: ActionProps) => return ( - +

    You are not part of a group yet...

    From 5132ab33d230fd5f1bdc6efd77a45782a7473e1a Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Sun, 14 Apr 2024 12:55:33 +0200 Subject: [PATCH 17/71] Centering group buttons --- webapp/src/pages/groups/groups-page.scss | 2 +- webapp/src/pages/groups/index.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/webapp/src/pages/groups/groups-page.scss b/webapp/src/pages/groups/groups-page.scss index 866157b2..419a3ade 100644 --- a/webapp/src/pages/groups/groups-page.scss +++ b/webapp/src/pages/groups/groups-page.scss @@ -3,5 +3,5 @@ flex-direction: column; align-items: center; justify-content: center; - height: 50vh; + height: 100vh; } \ No newline at end of file diff --git a/webapp/src/pages/groups/index.tsx b/webapp/src/pages/groups/index.tsx index b186f972..8c7b93b5 100644 --- a/webapp/src/pages/groups/index.tsx +++ b/webapp/src/pages/groups/index.tsx @@ -38,7 +38,7 @@ export const GroupsPage: React.FC<{}> = () => { }); return( - + { signedUp? ( From 5285f1bd43da332edf78659ec525bd938c96b5c7 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Sun, 14 Apr 2024 12:58:05 +0200 Subject: [PATCH 18/71] h3 to h2 at groups --- webapp/src/components/group/NoGroup.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/webapp/src/components/group/NoGroup.tsx b/webapp/src/components/group/NoGroup.tsx index 32241c06..2dba44f6 100644 --- a/webapp/src/components/group/NoGroup.tsx +++ b/webapp/src/components/group/NoGroup.tsx @@ -114,7 +114,7 @@ const NoGroup = (props: ActionProps) => return ( -

    You are not part of a group yet...

    +

    You are not part of a group yet...

     From c494792f421a1e8f929c8d4b613bfc1fa2ef73f4 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Sun, 14 Apr 2024 14:12:48 +0200 Subject: [PATCH 19/71] No delete button on single player lobby for human user --- .../src/components/game/singleplayer/LobbyGameSinglePlayer.tsx | 3 --- 1 file changed, 3 deletions(-) diff --git a/webapp/src/components/game/singleplayer/LobbyGameSinglePlayer.tsx b/webapp/src/components/game/singleplayer/LobbyGameSinglePlayer.tsx index 2a927150..0cdc4141 100644 --- a/webapp/src/components/game/singleplayer/LobbyGameSinglePlayer.tsx +++ b/webapp/src/components/game/singleplayer/LobbyGameSinglePlayer.tsx @@ -44,9 +44,6 @@ const LobbyGame: FC = ({setPlayers, players, setCurrentStage, is {player.username}

    {player.username}

    Total points: {player.points}

    - {!player.isBot && ( - - )} {player.isBot && ( )} From 808b0e8b863f8459b0779a08cae1fab95d19f9aa Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Sun, 14 Apr 2024 14:17:45 +0200 Subject: [PATCH 20/71] Menu multiplayer css to scss --- webapp/src/components/game/multiplayer/MenuMultiplayer.tsx | 2 +- .../multiplayer/{MenuMultiplayer.css => menu-multiplayer.scss} | 0 2 files changed, 1 insertion(+), 1 deletion(-) rename webapp/src/components/game/multiplayer/{MenuMultiplayer.css => menu-multiplayer.scss} (100%) diff --git a/webapp/src/components/game/multiplayer/MenuMultiplayer.tsx b/webapp/src/components/game/multiplayer/MenuMultiplayer.tsx index dd1067c3..b259b0f2 100644 --- a/webapp/src/components/game/multiplayer/MenuMultiplayer.tsx +++ b/webapp/src/components/game/multiplayer/MenuMultiplayer.tsx @@ -1,6 +1,6 @@ import { FC, useState } from 'react' import { SocketProps, UserPlayer } from './GameMultiPlayer'; -import './MenuMultiplayer.css' +import './menu-multiplayer.scss' interface MenuMultiplayerProps { socket: SocketProps; diff --git a/webapp/src/components/game/multiplayer/MenuMultiplayer.css b/webapp/src/components/game/multiplayer/menu-multiplayer.scss similarity index 100% rename from webapp/src/components/game/multiplayer/MenuMultiplayer.css rename to webapp/src/components/game/multiplayer/menu-multiplayer.scss From b993c8ee02bc74bf3d72eaed78388f431e98d4ea Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Sun, 14 Apr 2024 14:27:53 +0200 Subject: [PATCH 21/71] Centered menu in multiplayer --- .../game/multiplayer/GameMultiPlayer.tsx | 2 +- .../game/multiplayer/MenuMultiplayer.tsx | 2 +- .../game/multiplayer/menu-multiplayer.scss | 83 +++++++++---------- 3 files changed, 39 insertions(+), 48 deletions(-) diff --git a/webapp/src/components/game/multiplayer/GameMultiPlayer.tsx b/webapp/src/components/game/multiplayer/GameMultiPlayer.tsx index 69220904..704fef7d 100644 --- a/webapp/src/components/game/multiplayer/GameMultiPlayer.tsx +++ b/webapp/src/components/game/multiplayer/GameMultiPlayer.tsx @@ -110,7 +110,7 @@ const GameMultiPlayer: FC = () => { }; return ( - + {stage === 1 && } {stage === 2 && } {stage === 3 && } diff --git a/webapp/src/components/game/multiplayer/MenuMultiplayer.tsx b/webapp/src/components/game/multiplayer/MenuMultiplayer.tsx index b259b0f2..87e41421 100644 --- a/webapp/src/components/game/multiplayer/MenuMultiplayer.tsx +++ b/webapp/src/components/game/multiplayer/MenuMultiplayer.tsx @@ -43,7 +43,7 @@ const MenuMultiplayer: FC = ({socket, handleCurrentStage, -
    +
    setTypedCode(e.target.value)}>
    diff --git a/webapp/src/components/game/multiplayer/menu-multiplayer.scss b/webapp/src/components/game/multiplayer/menu-multiplayer.scss index 9aa4d120..c234438d 100644 --- a/webapp/src/components/game/multiplayer/menu-multiplayer.scss +++ b/webapp/src/components/game/multiplayer/menu-multiplayer.scss @@ -3,53 +3,44 @@ flex-direction: column; align-items: center; justify-content: center; - height: 70vh; - } - .container > * { - margin-bottom: 60px; /* Adjust the margin as needed */ - } + height: 100vh; +} - .create-party-button { - font-size: 1.2em; - padding: 10px 20px; - margin: 10px; - text-decoration: none; - background-color: #007bff; - color: #ffffff; - border: none; - border-radius: 8px; - cursor: pointer; - transition: background-color 0.3s ease; - } +.create-party-button { + font-size: 1.2em; + padding: 10px 20px; + margin: 10px; + text-decoration: none; + background-color: #007bff; + color: #ffffff; + border: none; + border-radius: 8px; + cursor: pointer; + transition: background-color 0.3s ease; +} - .join-party-container { - margin-top: 20px; - display: flex; - align-items: center; - } - - .join-party-input { - width: 250px; - height: 35px; - font-size: 16px; - padding: 10px; - margin-right: 10px; - } +.join-party-input { + width: 250px; + height: 35px; + font-size: 16px; + padding: 10px; + margin-right: 10px; +} - .join-party-button { - font-size: 1.2em; /* Adjust as needed */ - padding: 10px 20px; /* Adjust as needed */ - margin: 10px; /* Adjust as needed */ - text-decoration: none; - background-color: #007bff; - color: #ffffff; /* White text color */ - border: none; - border-radius: 8px; /* Make the button slightly round */ - cursor: pointer; - transition: background-color 0.3s ease; - } +.join-party-button { + font-size: 1.2em; + padding: 10px 20px; + margin: 10px; + text-decoration: none; + background-color: #007bff; + color: #ffffff; + border: none; + border-radius: 8px; + cursor: pointer; + transition: background-color 0.3s ease; +} - h1{ - margin-bottom: 20px; - margin-top: 20px; - } \ No newline at end of file +h1{ + margin-bottom: 20px; + margin-top: 20px; +} \ No newline at end of file From a820c9e9af726ee8bf6df19c47f1f8f3c4f7918f Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Sun, 14 Apr 2024 14:31:35 +0200 Subject: [PATCH 22/71] Scoreboard game css to scss --- webapp/src/components/game/LobbyGame.scss | 12 ++++++------ webapp/src/components/game/QuestionsGame.scss | 10 +++++----- webapp/src/components/game/ScoreboardGame.tsx | 2 +- .../{ScoreboardGame.css => scoreboard-game.scss} | 0 4 files changed, 12 insertions(+), 12 deletions(-) rename webapp/src/components/game/{ScoreboardGame.css => scoreboard-game.scss} (100%) diff --git a/webapp/src/components/game/LobbyGame.scss b/webapp/src/components/game/LobbyGame.scss index 973e5a43..7f0a53f4 100644 --- a/webapp/src/components/game/LobbyGame.scss +++ b/webapp/src/components/game/LobbyGame.scss @@ -26,8 +26,8 @@ table { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; - align-items: center; /* Vertically center the grid items */ - justify-items: center; /* Horizontally center the grid items */ + align-items: center; + justify-items: center; border-bottom: 1px solid #eee; padding: 10px; } @@ -40,7 +40,7 @@ table { } img { - max-width: 100px; // Cambia el tamaño máximo de la imagen según sea necesario + max-width: 100px; height: auto; display: block; } @@ -107,9 +107,9 @@ table { } .start-game-button:disabled { - background-color: #cccccc; /* Change background color for disabled state */ - color: #666666; /* Change text color for disabled state */ - cursor: not-allowed; /* Change cursor for disabled state */ + background-color: #cccccc; + color: #666666; + cursor: not-allowed; } .lobby-container { diff --git a/webapp/src/components/game/QuestionsGame.scss b/webapp/src/components/game/QuestionsGame.scss index 29a81b71..18cc6049 100644 --- a/webapp/src/components/game/QuestionsGame.scss +++ b/webapp/src/components/game/QuestionsGame.scss @@ -17,14 +17,14 @@ .answer-grid button { width: 100%; height: 50px; - border-radius: 10px; /* Rounded borders */ - font-size: 18px; /* Big text */ - font-weight: bold; /* Bold font */ - transition: transform 0.2s; /* Transition for scale animation */ + border-radius: 10px; + font-size: 18px; + font-weight: bold; + transition: transform 0.2s; cursor:pointer; } .answer-grid button:active { - transform: scale(0.95); /* Scale down on active state */ + transform: scale(0.95); } \ No newline at end of file diff --git a/webapp/src/components/game/ScoreboardGame.tsx b/webapp/src/components/game/ScoreboardGame.tsx index 9f9ebfc9..ef20e136 100644 --- a/webapp/src/components/game/ScoreboardGame.tsx +++ b/webapp/src/components/game/ScoreboardGame.tsx @@ -1,6 +1,6 @@ import { FC} from 'react' import { Player } from './singleplayer/GameSinglePlayer'; -import './ScoreboardGame.css'; +import './scoreboard-game.scss'; import { PlayerWithPoints } from './multiplayer/GameMultiPlayer'; interface ScoreboardGameProps { diff --git a/webapp/src/components/game/ScoreboardGame.css b/webapp/src/components/game/scoreboard-game.scss similarity index 100% rename from webapp/src/components/game/ScoreboardGame.css rename to webapp/src/components/game/scoreboard-game.scss From 60529215d32cafaa91b3a9de05b400358b9c3644 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Sun, 14 Apr 2024 14:38:29 +0200 Subject: [PATCH 23/71] Renaming scss files to meet naming conventions --- webapp/src/components/g-login-button/GLoginButton.tsx | 2 +- .../g-login-button/{GLoginButton.scss => g-login-button.scss} | 0 webapp/src/components/g-logout-button/GLogoutButton.tsx | 2 +- .../{GLogoutButton.scss => g-logout-button.scss} | 0 .../game-layout/{GameLayout.scss => game-layout.scss} | 0 webapp/src/components/game/{LobbyGame.scss => lobby-game.scss} | 0 webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx | 2 +- webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx | 2 +- .../components/game/{QuestionsGame.scss => questions-game.scss} | 0 .../src/components/game/singleplayer/LobbyGameSinglePlayer.tsx | 2 +- webapp/src/components/init/Init.tsx | 2 +- webapp/src/components/login/Login.tsx | 1 - webapp/src/components/register/Register.tsx | 2 +- webapp/src/components/scoreboard/Scoreboard.tsx | 2 +- 14 files changed, 8 insertions(+), 9 deletions(-) rename webapp/src/components/g-login-button/{GLoginButton.scss => g-login-button.scss} (100%) rename webapp/src/components/g-logout-button/{GLogoutButton.scss => g-logout-button.scss} (100%) rename webapp/src/components/game-layout/{GameLayout.scss => game-layout.scss} (100%) rename webapp/src/components/game/{LobbyGame.scss => lobby-game.scss} (100%) rename webapp/src/components/game/{QuestionsGame.scss => questions-game.scss} (100%) diff --git a/webapp/src/components/g-login-button/GLoginButton.tsx b/webapp/src/components/g-login-button/GLoginButton.tsx index fd66e25d..0f4187d0 100644 --- a/webapp/src/components/g-login-button/GLoginButton.tsx +++ b/webapp/src/components/g-login-button/GLoginButton.tsx @@ -1,5 +1,5 @@ import { GoogleLogin } from '@react-oauth/google'; -import './GLoginButton.scss'; +import './g-login-button.scss'; const GLoginButton = () => { diff --git a/webapp/src/components/g-login-button/GLoginButton.scss b/webapp/src/components/g-login-button/g-login-button.scss similarity index 100% rename from webapp/src/components/g-login-button/GLoginButton.scss rename to webapp/src/components/g-login-button/g-login-button.scss diff --git a/webapp/src/components/g-logout-button/GLogoutButton.tsx b/webapp/src/components/g-logout-button/GLogoutButton.tsx index 23410600..fafa9d12 100644 --- a/webapp/src/components/g-logout-button/GLogoutButton.tsx +++ b/webapp/src/components/g-logout-button/GLogoutButton.tsx @@ -1 +1 @@ -import './GLogoutButton.scss'; \ No newline at end of file +import './g-logout-button.scss'; \ No newline at end of file diff --git a/webapp/src/components/g-logout-button/GLogoutButton.scss b/webapp/src/components/g-logout-button/g-logout-button.scss similarity index 100% rename from webapp/src/components/g-logout-button/GLogoutButton.scss rename to webapp/src/components/g-logout-button/g-logout-button.scss diff --git a/webapp/src/components/game-layout/GameLayout.scss b/webapp/src/components/game-layout/game-layout.scss similarity index 100% rename from webapp/src/components/game-layout/GameLayout.scss rename to webapp/src/components/game-layout/game-layout.scss diff --git a/webapp/src/components/game/LobbyGame.scss b/webapp/src/components/game/lobby-game.scss similarity index 100% rename from webapp/src/components/game/LobbyGame.scss rename to webapp/src/components/game/lobby-game.scss diff --git a/webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx b/webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx index e29c5032..af0aa806 100644 --- a/webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx +++ b/webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx @@ -1,6 +1,6 @@ import { FC, useState } from 'react' import { SocketProps, UserPlayer } from './GameMultiPlayer'; -import '../LobbyGame.scss'; +import '../lobby-game.scss'; import axios from 'axios'; interface LobbyMultiPlayerProps { diff --git a/webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx b/webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx index b1017fd1..81fe6ca3 100644 --- a/webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx +++ b/webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx @@ -2,7 +2,7 @@ import { FC, useMemo, useState } from 'react' import { SocketProps } from './GameMultiPlayer'; import { Question4Answers } from '../singleplayer/GameSinglePlayer'; import axios from 'axios'; -import '../QuestionsGame.scss'; +import '../questions-game.scss'; interface QuestionsMultiPlayerProps { socket: SocketProps; diff --git a/webapp/src/components/game/QuestionsGame.scss b/webapp/src/components/game/questions-game.scss similarity index 100% rename from webapp/src/components/game/QuestionsGame.scss rename to webapp/src/components/game/questions-game.scss diff --git a/webapp/src/components/game/singleplayer/LobbyGameSinglePlayer.tsx b/webapp/src/components/game/singleplayer/LobbyGameSinglePlayer.tsx index 0cdc4141..c6c97315 100644 --- a/webapp/src/components/game/singleplayer/LobbyGameSinglePlayer.tsx +++ b/webapp/src/components/game/singleplayer/LobbyGameSinglePlayer.tsx @@ -1,6 +1,6 @@ import { FC, useRef } from 'react' import { Player } from './GameSinglePlayer'; -import '../LobbyGame.scss'; +import '../lobby-game.scss'; interface LobbyGameProps { setPlayers: (players:Player[]) => void; diff --git a/webapp/src/components/init/Init.tsx b/webapp/src/components/init/Init.tsx index 06e0ffc4..8155dc90 100644 --- a/webapp/src/components/init/Init.tsx +++ b/webapp/src/components/init/Init.tsx @@ -2,7 +2,7 @@ import { useState } from 'react'; import { useTranslation } from 'react-i18next'; import {Button, Stack} from "@mui/material"; import GLoginButton from '../g-login-button/GLoginButton'; -import './Init.scss'; +import './init.scss'; type ActionProps = { changeView:(arg:boolean)=> void; diff --git a/webapp/src/components/login/Login.tsx b/webapp/src/components/login/Login.tsx index 31915a72..06170646 100644 --- a/webapp/src/components/login/Login.tsx +++ b/webapp/src/components/login/Login.tsx @@ -1,4 +1,3 @@ -// src/components/Login.js import { useState, KeyboardEvent } from 'react'; import axios from 'axios'; import { Container, Typography, TextField, Snackbar, Button, Stack } from '@mui/material'; diff --git a/webapp/src/components/register/Register.tsx b/webapp/src/components/register/Register.tsx index f3140cd9..de1014f0 100644 --- a/webapp/src/components/register/Register.tsx +++ b/webapp/src/components/register/Register.tsx @@ -2,7 +2,7 @@ import { useState, KeyboardEvent } from 'react'; import axios from 'axios'; import { Container, Typography, TextField, Snackbar, Stack, Button } from '@mui/material'; import { useTranslation } from 'react-i18next'; -import './Register.scss'; +import './register.scss'; import { useNavigate } from "react-router-dom"; const apiEndpoint = 'http://localhost:8000' diff --git a/webapp/src/components/scoreboard/Scoreboard.tsx b/webapp/src/components/scoreboard/Scoreboard.tsx index e561e9d5..d67f0433 100644 --- a/webapp/src/components/scoreboard/Scoreboard.tsx +++ b/webapp/src/components/scoreboard/Scoreboard.tsx @@ -1,4 +1,4 @@ -import './Scoreboard.scss'; +import './scoreboard.scss'; const Scoreboard = () => { From e82f48b9958fa8a05dd7914b70d925dfda071abe Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Sun, 14 Apr 2024 14:39:39 +0200 Subject: [PATCH 24/71] Removing useless "additional information" section from profile --- webapp/src/pages/userProfile/index.tsx | 13 ------------- 1 file changed, 13 deletions(-) diff --git a/webapp/src/pages/userProfile/index.tsx b/webapp/src/pages/userProfile/index.tsx index 1ea1d0a1..98d1f86d 100644 --- a/webapp/src/pages/userProfile/index.tsx +++ b/webapp/src/pages/userProfile/index.tsx @@ -194,19 +194,6 @@ const ProfilePage = () => { )} - - - - Additional Information - - {profileInfo &&
      } -       -       ); From ea86a1029bab0f18abc728d62533687fc1cbb1e8 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Mon, 22 Apr 2024 21:50:42 +0200 Subject: [PATCH 25/71] Centering visual elements at profile --- webapp/src/pages/userProfile/index.tsx | 25 +++++++++++-------------- 1 file changed, 11 insertions(+), 14 deletions(-) diff --git a/webapp/src/pages/userProfile/index.tsx b/webapp/src/pages/userProfile/index.tsx index 98d1f86d..6391d1cf 100644 --- a/webapp/src/pages/userProfile/index.tsx +++ b/webapp/src/pages/userProfile/index.tsx @@ -30,12 +30,9 @@ const ProfilePage = () => { }; return ( - - - Profile - - - + + + { )} - + { )} - + { className="profile-subheader" > Question {index} +
      • - Question: {JSON.stringify(question.question)} + Question: {JSON.stringify(question[0]["question"])}
      • - Correct answer: {JSON.stringify(question.correctAnswer)} + Correct answer: {JSON.stringify(question[0]["correctAnswer"])}
      • - Incorrect answer 1: {JSON.stringify(question.incorrectAnswer1)} + Incorrect answer 1: {JSON.stringify(question[0]["incorrectAnswer1"])}
      • - Incorrect answer 2: {JSON.stringify(question.incorrectAnswer2)} + Incorrect answer 2: {JSON.stringify(question[0]["incorrectAnswer2"])}
      • - Incorrect answer 3: {JSON.stringify(question.incorrectAnswer3)} + Incorrect answer 3: {JSON.stringify(question[0]["incorrectAnswer3"])}
      - ))} From 2d241b957fed5e1e5428904fd3b30e7f25f75232 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Mon, 22 Apr 2024 22:37:20 +0200 Subject: [PATCH 26/71] Arranged visual elements at profile --- webapp/src/pages/userProfile/index.tsx | 116 +++++++++---------------- 1 file changed, 41 insertions(+), 75 deletions(-) diff --git a/webapp/src/pages/userProfile/index.tsx b/webapp/src/pages/userProfile/index.tsx index 6391d1cf..ac88fa1b 100644 --- a/webapp/src/pages/userProfile/index.tsx +++ b/webapp/src/pages/userProfile/index.tsx @@ -31,43 +31,27 @@ const ProfilePage = () => { return ( - + - + Personal Information {profileInfo && (
      • - {t('profile_uuid')}{' '} - {JSON.stringify(profileInfo.userStats.uuid) - .replace('"', '') - .replace('"', '')} + {t('profile_uuid')} {profileInfo.userStats.uuid}
      • - {t('profile_name')}{' '} - {JSON.stringify(profileInfo.userStats.username) - .replace('"', '') - .replace('"', '')} + {t('profile_name')} {profileInfo.userStats.username}
      • - {t('profile_created_at')}{' '} - {formatDate( - JSON.stringify(profileInfo.userStats.createdAt) - .replace('"', '') - .replace('"', '') - )} + {t('profile_created_at')} {formatDate(profileInfo.userStats.createdAt)}
      @@ -76,56 +60,38 @@ const ProfilePage = () => {       - + Performance Statistics {profileInfo && (
      • - {t('profile_points')}{' '} - {JSON.stringify(Number(profileInfo.userStats.totalScore))} + {t('profile_points')} {Number(profileInfo.userStats.totalScore)}
      • - {t('profile_nwins')}{' '} - {JSON.stringify(Number(profileInfo.userStats.nWins))} + {t('profile_nwins')} {Number(profileInfo.userStats.nWins)}
      • - {t('profile_n_correct_answers')}{' '} - {JSON.stringify( - Number(profileInfo.userStats.nCorrectAnswers) - )} + {t('profile_n_correct_answers')} {Number(profileInfo.userStats.nCorrectAnswers)}
      • - {t('profile_n_wrong_answers')}{' '} - {JSON.stringify( - Number(profileInfo.userStats.nWrongAnswers) - )} + {t('profile_n_wrong_answers')} {Number(profileInfo.userStats.nWrongAnswers)}
      )}       - + - + {t('profile_last_game_questions')} {profileInfo && ( @@ -136,7 +102,7 @@ const ProfilePage = () => { variant="body1" className="field" > - Last game ID: {JSON.stringify(profileInfo.userStats.lastGameID)} + Last game ID: {profileInfo.userStats.lastGameID} { > Questions: -
        +
          {profileInfo.lastGame.map((question, index) => (
        • { > Question {index} -
            -
          • - - Question: {JSON.stringify(question[0]["question"])} - -
            • -
          • - - Correct answer: {JSON.stringify(question[0]["correctAnswer"])} - -
            • -
          • - - Incorrect answer 1: {JSON.stringify(question[0]["incorrectAnswer1"])} - -
            • -
          • - - Incorrect answer 2: {JSON.stringify(question[0]["incorrectAnswer2"])} - -
            • -
          • - - Incorrect answer 3: {JSON.stringify(question[0]["incorrectAnswer3"])} - -
            • -
          +
            +
          • + + Question: {question[0].question} + +
            • +
          • + + Correct answer: {question[0].correctAnswer} + +
            • +
          • + + Incorrect answer 1: {question[0].incorrectAnswer1} + +
            • +
          • + + Incorrect answer 2: {question[0].incorrectAnswer2} + +
            • +
          • + + Incorrect answer 3: {question[0].incorrectAnswer3} + +
            • +
          • ))}
        From f66dec825f8500e6f0c2ac46accc50800af3d53d Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Mon, 22 Apr 2024 22:44:23 +0200 Subject: [PATCH 27/71] Little arrangements at profile --- webapp/src/pages/userProfile/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/webapp/src/pages/userProfile/index.tsx b/webapp/src/pages/userProfile/index.tsx index ac88fa1b..d407c008 100644 --- a/webapp/src/pages/userProfile/index.tsx +++ b/webapp/src/pages/userProfile/index.tsx @@ -89,7 +89,7 @@ const ProfilePage = () => { )} - + {t('profile_last_game_questions')} From a04cde636e7ad9de1253ba57ee8b7280ef6c65dd Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Mon, 22 Apr 2024 23:41:38 +0200 Subject: [PATCH 28/71] Further adjustments --- webapp/src/pages/userProfile/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/webapp/src/pages/userProfile/index.tsx b/webapp/src/pages/userProfile/index.tsx index d407c008..243820dc 100644 --- a/webapp/src/pages/userProfile/index.tsx +++ b/webapp/src/pages/userProfile/index.tsx @@ -32,7 +32,7 @@ const ProfilePage = () => { return ( - + Personal Information From 15876c60a1d7891c243abf3b3d09f31a3481c2ad Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Mon, 22 Apr 2024 23:57:19 +0200 Subject: [PATCH 29/71] Nav localized --- webapp/src/common/Nav.tsx | 4 ++-- webapp/src/i18n.ts | 2 ++ 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/webapp/src/common/Nav.tsx b/webapp/src/common/Nav.tsx index 6526abfd..14916084 100644 --- a/webapp/src/common/Nav.tsx +++ b/webapp/src/common/Nav.tsx @@ -131,8 +131,8 @@ const NavBar: React.FC<{}> = () => anchorEl={anchorEl} sx={{ marginTop: '5px' }} > - navigate("/profile")}>Profile - navigate("/")}>Logout + navigate("/profile")}>{t('nav_profile')} + navigate("/")}>{t('nav_logout')} diff --git a/webapp/src/i18n.ts b/webapp/src/i18n.ts index 9d506f16..9e001b29 100644 --- a/webapp/src/i18n.ts +++ b/webapp/src/i18n.ts @@ -21,6 +21,7 @@ i18n nav_groups: 'Groups', nav_scoreboard: 'Scoreboard', nav_profile: 'Profile', + nav_logout: 'Logout', profile_uuid: 'User ID:', profile_name: 'Name:', profile_created_at: 'Account creation date:', @@ -48,6 +49,7 @@ i18n nav_groups: 'Grupos', nav_scoreboard: 'Puntuación', nav_profile: 'Perfil', + nav_logout: 'Cerrar sesión', profile_uuid: 'ID del jugador:', profile_name: 'Nombre:', profile_created_at: 'Fecha de creación de cuenta:', From 70bd628649e50ed1d5225530be8ed8a2383f91ff Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Tue, 23 Apr 2024 01:05:24 +0200 Subject: [PATCH 30/71] Lobby multiplayer localized --- .../game/multiplayer/GameMultiPlayer.tsx | 4 +- .../game/multiplayer/LobbyMultiPlayer.tsx | 37 ++++++++++--------- webapp/src/i18n.ts | 16 ++++++++ 3 files changed, 38 insertions(+), 19 deletions(-) diff --git a/webapp/src/components/game/multiplayer/GameMultiPlayer.tsx b/webapp/src/components/game/multiplayer/GameMultiPlayer.tsx index 704fef7d..7a09ca4d 100644 --- a/webapp/src/components/game/multiplayer/GameMultiPlayer.tsx +++ b/webapp/src/components/game/multiplayer/GameMultiPlayer.tsx @@ -81,9 +81,9 @@ const GameMultiPlayer: FC = () => { }); newSocket.on('allPlayersFinished', async (playersWithPoints:PlayerWithPoints[]) => { - await new Promise((resolve) => { // Specify void as the type argument + await new Promise((resolve) => { setTimeout(() => { - resolve(); // Resolve the promise without any arguments + resolve(); }, 1000); }); setSortedUsersByPoints(playersWithPoints); diff --git a/webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx b/webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx index af0aa806..d1b44c51 100644 --- a/webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx +++ b/webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx @@ -2,20 +2,23 @@ import { FC, useState } from 'react' import { SocketProps, UserPlayer } from './GameMultiPlayer'; import '../lobby-game.scss'; import axios from 'axios'; +import { useTranslation } from 'react-i18next'; interface LobbyMultiPlayerProps { - socket: SocketProps; - handleCurrentStage: (n: number) => void - partyCode: string - users: UserPlayer[] + socket: SocketProps; + handleCurrentStage: (n: number) => void + partyCode: string + users: UserPlayer[] } -const LobbyMultiPlayer: FC = ({socket, handleCurrentStage, partyCode, users}) => { +const LobbyMultiPlayer: FC = ({ socket, handleCurrentStage, partyCode, users }) => { const [isFetched, setFetched] = useState(true); const uuid = localStorage.getItem("uuid"); + const { t } = useTranslation(); + const fetchQuestions = async () => { setFetched(false) const apiEndpoint = 'http://localhost:8000' @@ -23,10 +26,10 @@ const LobbyMultiPlayer: FC = ({socket, handleCurrentStage try { const requestData = { - players: users.map((user) => ({uuid: user.uuid})) + players: users.map((user) => ({ uuid: user.uuid })) } const response = await axios.post(`${apiEndpoint}/createGame`, requestData); - + socket.emit('updateQuestions', partyCode, response.data); setFetched(true); } catch (error) { @@ -46,23 +49,23 @@ const LobbyMultiPlayer: FC = ({socket, handleCurrentStage return (
        -

        Lobby - Multiplayer

        -

        Party code: {partyCode}

        +

        {t('lobby_multiplayer_title')}

        +

        {t('lobby_multiplayer_party_code')}{partyCode}

        {users.map((player) => (
        - {player.uuid} + {player.uuid}

        {player.username}

        - {player.isAdmin &&

        Admin

        } - {!player.isAdmin &&

        Player

        } -

        Points: {player.totalPoints}

        + {player.isAdmin &&

        {t('lobby_multiplayer_admin')}

        } + {!player.isAdmin &&

        {t('lobby_multiplayer_player')}

        } +

        {t('lobby_multiplayer_points')}{player.totalPoints}

        ))}
        - - {isFetched && isAdmin() && } - {isFetched && !isAdmin() && } - {!isFetched && } + + {isFetched && isAdmin() && } + {isFetched && !isAdmin() && } + {!isFetched && }
        ) diff --git a/webapp/src/i18n.ts b/webapp/src/i18n.ts index 9e001b29..470dbd0f 100644 --- a/webapp/src/i18n.ts +++ b/webapp/src/i18n.ts @@ -22,6 +22,14 @@ i18n nav_scoreboard: 'Scoreboard', nav_profile: 'Profile', nav_logout: 'Logout', + lobby_multiplayer_title: 'Lobby - Multiplayer', + lobby_multiplayer_party_code: 'Party code: ', + lobby_multiplayer_admin: 'Admin', + lobby_multiplayer_player: 'Player', + lobby_multiplayer_points: 'Points: ', + lobby_multiplayer_exit: 'Exit', + lobby_multiplayer_start_game: 'Start game', + lobby_multiplayer_loading_questions: 'Loading questions...', profile_uuid: 'User ID:', profile_name: 'Name:', profile_created_at: 'Account creation date:', @@ -50,6 +58,14 @@ i18n nav_scoreboard: 'Puntuación', nav_profile: 'Perfil', nav_logout: 'Cerrar sesión', + lobby_multiplayer_title: 'Lobby - Multijugador', + lobby_multiplayer_party_code: 'Código de sala: ', + lobby_multiplayer_admin: 'Administrador', + lobby_multiplayer_player: 'Jugador', + lobby_multiplayer_points: 'Puntos: ', + lobby_multiplayer_exit: 'Salir', + lobby_multiplayer_start_game: 'Comenzar partida', + lobby_multiplayer_loading_questions: 'Cargando preguntas...', profile_uuid: 'ID del jugador:', profile_name: 'Nombre:', profile_created_at: 'Fecha de creación de cuenta:', From 35a6700edd28119ef1a3d9d8197e60382c52bd18 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Tue, 23 Apr 2024 01:08:09 +0200 Subject: [PATCH 31/71] Google login button localized --- webapp/src/components/g-login-button/GLoginButton.tsx | 5 ++++- webapp/src/i18n.ts | 2 ++ 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/webapp/src/components/g-login-button/GLoginButton.tsx b/webapp/src/components/g-login-button/GLoginButton.tsx index 0f4187d0..c8942360 100644 --- a/webapp/src/components/g-login-button/GLoginButton.tsx +++ b/webapp/src/components/g-login-button/GLoginButton.tsx @@ -1,8 +1,11 @@ import { GoogleLogin } from '@react-oauth/google'; import './g-login-button.scss'; +import { useTranslation } from 'react-i18next'; const GLoginButton = () => { + const { t } = useTranslation(); + return( @@ -11,7 +14,7 @@ const GLoginButton = () => }} onError={() => { - console.log('Login Failed'); + console.log(t('g_login_button_login_failed')); }} />) } diff --git a/webapp/src/i18n.ts b/webapp/src/i18n.ts index 470dbd0f..683e2942 100644 --- a/webapp/src/i18n.ts +++ b/webapp/src/i18n.ts @@ -22,6 +22,7 @@ i18n nav_scoreboard: 'Scoreboard', nav_profile: 'Profile', nav_logout: 'Logout', + g_login_button_login_failed: 'Login Failed', lobby_multiplayer_title: 'Lobby - Multiplayer', lobby_multiplayer_party_code: 'Party code: ', lobby_multiplayer_admin: 'Admin', @@ -58,6 +59,7 @@ i18n nav_scoreboard: 'Puntuación', nav_profile: 'Perfil', nav_logout: 'Cerrar sesión', + g_login_button_login_failed: 'Fallo de Inicio de Sesión', lobby_multiplayer_title: 'Lobby - Multijugador', lobby_multiplayer_party_code: 'Código de sala: ', lobby_multiplayer_admin: 'Administrador', From 338ba3145d17706ac5fc42684459e50dc86ce265 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Tue, 23 Apr 2024 01:16:01 +0200 Subject: [PATCH 32/71] Menu multiplayer localized --- .../src/components/game/multiplayer/MenuMultiplayer.tsx | 8 +++++--- webapp/src/i18n.ts | 6 ++++++ 2 files changed, 11 insertions(+), 3 deletions(-) diff --git a/webapp/src/components/game/multiplayer/MenuMultiplayer.tsx b/webapp/src/components/game/multiplayer/MenuMultiplayer.tsx index 87e41421..57bd7d9d 100644 --- a/webapp/src/components/game/multiplayer/MenuMultiplayer.tsx +++ b/webapp/src/components/game/multiplayer/MenuMultiplayer.tsx @@ -1,6 +1,7 @@ import { FC, useState } from 'react' import { SocketProps, UserPlayer } from './GameMultiPlayer'; import './menu-multiplayer.scss' +import { useTranslation } from 'react-i18next'; interface MenuMultiplayerProps { socket: SocketProps; @@ -14,6 +15,7 @@ const MenuMultiplayer: FC = ({socket, handleCurrentStage, const totalPoints = localStorage.getItem('score'); const uuid = localStorage.getItem('uuid'); const [typedCode, setTypedCode] = useState(); + const { t } = useTranslation(); const createParty = () => { handleCurrentStage(2); @@ -39,13 +41,13 @@ const MenuMultiplayer: FC = ({socket, handleCurrentStage, return (
        -

        Create a party or join one!

        +

        {t('menu_multiplayer_create_or_join')}

        setTypedCode(e.target.value)}> - +
        ) diff --git a/webapp/src/i18n.ts b/webapp/src/i18n.ts index 683e2942..6609e7eb 100644 --- a/webapp/src/i18n.ts +++ b/webapp/src/i18n.ts @@ -31,6 +31,9 @@ i18n lobby_multiplayer_exit: 'Exit', lobby_multiplayer_start_game: 'Start game', lobby_multiplayer_loading_questions: 'Loading questions...', + menu_multiplayer_create_or_join: 'Create a room or join one', + menu_multiplayer_create: 'Create Room', + menu_multiplayer_join: 'Join Room', profile_uuid: 'User ID:', profile_name: 'Name:', profile_created_at: 'Account creation date:', @@ -68,6 +71,9 @@ i18n lobby_multiplayer_exit: 'Salir', lobby_multiplayer_start_game: 'Comenzar partida', lobby_multiplayer_loading_questions: 'Cargando preguntas...', + menu_multiplayer_create_or_join: 'Crea un sala o únete a una', + menu_multiplayer_create: 'Crear Sala', + menu_multiplayer_join: 'Unirse a Sala', profile_uuid: 'ID del jugador:', profile_name: 'Nombre:', profile_created_at: 'Fecha de creación de cuenta:', From fd43e5885760c14fca7723834e394a7d0cbbfde7 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Tue, 23 Apr 2024 01:35:07 +0200 Subject: [PATCH 33/71] Questions multiplayer localized --- .../game/multiplayer/QuestionsMultiPlayer.tsx | 176 +++++++++--------- webapp/src/i18n.ts | 14 ++ 2 files changed, 105 insertions(+), 85 deletions(-) diff --git a/webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx b/webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx index 81fe6ca3..0d188914 100644 --- a/webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx +++ b/webapp/src/components/game/multiplayer/QuestionsMultiPlayer.tsx @@ -3,124 +3,130 @@ import { SocketProps } from './GameMultiPlayer'; import { Question4Answers } from '../singleplayer/GameSinglePlayer'; import axios from 'axios'; import '../questions-game.scss'; +import { useTranslation } from 'react-i18next'; interface QuestionsMultiPlayerProps { - socket: SocketProps; - handleCurrentStage: (n: number) => void - questions: Question4Answers[] - partyCode: string + socket: SocketProps; + handleCurrentStage: (n: number) => void + questions: Question4Answers[] + partyCode: string } -const QuestionsMultiPlayer: FC = ({socket, questions, partyCode}) => { +const QuestionsMultiPlayer: FC = ({ socket, questions, partyCode }) => { - const answersShuffled = useMemo(() => { - return questions.map((question) => { - const answers = [question.correctAnswer, question.incorrectAnswer1, question.incorrectAnswer2, question.incorrectAnswer3]; - for (let i = answers.length - 1; i > 0; i--) { - const j = Math.floor(Math.random() * (i + 1)); - [answers[i], answers[j]] = [answers[j], answers[i]]; - } - return answers; - }); - }, [questions]); + const answersShuffled = useMemo(() => { + return questions.map((question) => { + const answers = [question.correctAnswer, question.incorrectAnswer1, question.incorrectAnswer2, question.incorrectAnswer3]; + for (let i = answers.length - 1; i > 0; i--) { + const j = Math.floor(Math.random() * (i + 1)); + [answers[i], answers[j]] = [answers[j], answers[i]]; + } + return answers; + }); + }, [questions]); - const uuid = localStorage.getItem("userUUID"); - const apiEndpoint = 'http://localhost:8000' - //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; + const uuid = localStorage.getItem("userUUID"); + const apiEndpoint = 'http://localhost:8000' + //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; - const [currentQuestion, setCurrentQuestion] = useState(0); - const [correctAnswers, setCorrectAnswers] = useState(0); - const [selectedAnswer, setSelectedAnswer] = useState(null); + const [currentQuestion, setCurrentQuestion] = useState(0); + const [correctAnswers, setCorrectAnswers] = useState(0); + const [selectedAnswer, setSelectedAnswer] = useState(null); - const [isWaiting, setIsWaiting] = useState(false); + const [isWaiting, setIsWaiting] = useState(false); + const { t } = useTranslation(); - const handleAnswerClick = async (answer: string, isCorrect:boolean) => { - if(!isWaiting){ - setIsWaiting(true); - setSelectedAnswer(answer); - - setTimeout(() => { - if (isCorrect) { - setCorrectAnswers(correctAnswers + 1); - } - setCurrentQuestion(currentQuestion + 1); - setSelectedAnswer(null); - }, 1000); - setIsWaiting(false); - } - - if(currentQuestion+2 === questions.length){ - const totalPoints = calculatePoints(correctAnswers, questions.length); - // the player has finished the game - // update stats for each player - const requestData ={ "players": [{ + const handleAnswerClick = async (answer: string, isCorrect: boolean) => { + + if (!isWaiting) { + setIsWaiting(true); + setSelectedAnswer(answer); + + setTimeout(() => { + if (isCorrect) { + setCorrectAnswers(correctAnswers + 1); + } + setCurrentQuestion(currentQuestion + 1); + setSelectedAnswer(null); + }, 1000); + setIsWaiting(false); + } + + if (currentQuestion + 2 === questions.length) { + const totalPoints = calculatePoints(correctAnswers, questions.length); + // the player has finished the game + // update stats for each player + const requestData = { + "players": [{ "uuid": uuid, "nCorrectAnswers": correctAnswers, "nWrongAnswers": questions.length - correctAnswers, "totalScore": totalPoints, "isWinner": false - }]} - - // update score in localstorage - const previousScore = parseInt(localStorage.getItem("score")) - localStorage.setItem("score", (previousScore + totalPoints).toString()) - - await axios.post(`${apiEndpoint}/updateStats`, requestData); - // pass the points obtained of each player to the socket - socket.emit('playerFinished', partyCode, totalPoints) + }] } - }; - const calculatePoints = (correctAnswers: number, totalQuestions: number) => { - const incorrectQuestions = totalQuestions - correctAnswers; - const points = correctAnswers * 100 - incorrectQuestions * 25; - return points; - } + // update score in localstorage + const previousScore = parseInt(localStorage.getItem("score")) + localStorage.setItem("score", (previousScore + totalPoints).toString()) - const getAnswers = () => { - const answers = answersShuffled[currentQuestion]; - if (answers.length > 4) { - console.log(answers) - const removeCount = answers.length - 4; - answers.splice(0, removeCount); - } - return answersShuffled[currentQuestion]; - }; + await axios.post(`${apiEndpoint}/updateStats`, requestData); + // pass the points obtained of each player to the socket + socket.emit('playerFinished', partyCode, totalPoints) + } + }; + + const calculatePoints = (correctAnswers: number, totalQuestions: number) => { + const incorrectQuestions = totalQuestions - correctAnswers; + const points = correctAnswers * 100 - incorrectQuestions * 25; + return points; + } + + const getAnswers = () => { + const answers = answersShuffled[currentQuestion]; + if (answers.length > 4) { + console.log(answers) + const removeCount = answers.length - 4; + answers.splice(0, removeCount); + } + return answersShuffled[currentQuestion]; + }; - return ( -
        - {(currentQuestion+1) < questions.length && ( + return ( +
        + {(currentQuestion + 1) < questions.length && ( <>
        -

        Question {currentQuestion + 1} / {questions.length}

        +

        {t('questions_multiplayer_question')}{currentQuestion + 1} / {questions.length}

        {questions[currentQuestion].question}

        -
        -
        - {getAnswers().map((answer) => { - const isCorrect = questions[currentQuestion].correctAnswer === answer; - const buttonColor = (selectedAnswer === answer && !isWaiting) ? (isCorrect ? '#66ff66' : '#ff6666') : '#89c3ff'; - return ( -
        +
        + {getAnswers().map((answer) => { + const isCorrect = questions[currentQuestion].correctAnswer === answer; + const buttonColor = (selectedAnswer === answer && !isWaiting) ? (isCorrect ? '#66ff66' : '#ff6666') : '#89c3ff'; + return ( + - )} - )} -
        + ) + } + )} +
        )} - {currentQuestion+1 === questions.length && ( + {currentQuestion + 1 === questions.length && ( <> -

        You answered {correctAnswers} out of {questions.length} questions correctly.

        -

        You earned {calculatePoints(correctAnswers, questions.length)} points.

        -

        Waiting for the rest of the players to finish...

        +

        {t('questions_multiplayer_you_answered')}{correctAnswers}{t('questions_multiplayer_out_of')}{questions.length}{t('questions_multiplayer_questions_correctly')}

        +

        {t('questions_multiplayer_you_earned')}{calculatePoints(correctAnswers, questions.length)}{t('questions_multiplayer_points')}

        +

        {t('questions_multiplayer_waiting_players')}

        )}
        - ) + ) } export default QuestionsMultiPlayer \ No newline at end of file diff --git a/webapp/src/i18n.ts b/webapp/src/i18n.ts index 6609e7eb..eabf136c 100644 --- a/webapp/src/i18n.ts +++ b/webapp/src/i18n.ts @@ -34,6 +34,13 @@ i18n menu_multiplayer_create_or_join: 'Create a room or join one', menu_multiplayer_create: 'Create Room', menu_multiplayer_join: 'Join Room', + questions_multiplayer_question: 'Question ', + questions_multiplayer_you_answered: 'You answered ', + questions_multiplayer_out_of: ' out of ', + questions_multiplayer_questions_correctly: ' questions correctly.', + questions_multiplayer_you_earned: 'You earned ', + questions_multiplayer_points: ' points.', + questions_multiplayer_waiting_players: 'Waiting for the rest of the players to finish...', profile_uuid: 'User ID:', profile_name: 'Name:', profile_created_at: 'Account creation date:', @@ -74,6 +81,13 @@ i18n menu_multiplayer_create_or_join: 'Crea un sala o únete a una', menu_multiplayer_create: 'Crear Sala', menu_multiplayer_join: 'Unirse a Sala', + questions_multiplayer_question: 'Pregunta ', + questions_multiplayer_you_answered: 'Respondiste ', + questions_multiplayer_out_of: ' de ', + questions_multiplayer_questions_correctly: ' preguntas correctamente.', + questions_multiplayer_you_earned: 'Ganaste ', + questions_multiplayer_points: ' puntos.', + questions_multiplayer_waiting_players: 'Esperando a que el resto de los jugadores terminen...', profile_uuid: 'ID del jugador:', profile_name: 'Nombre:', profile_created_at: 'Fecha de creación de cuenta:', From 313a32b538bc924043113b298b769d3aa1483721 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Tue, 23 Apr 2024 01:42:28 +0200 Subject: [PATCH 34/71] Game single player localized --- webapp/src/components/game/singleplayer/GameSinglePlayer.tsx | 4 +++- webapp/src/i18n.ts | 2 ++ 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/webapp/src/components/game/singleplayer/GameSinglePlayer.tsx b/webapp/src/components/game/singleplayer/GameSinglePlayer.tsx index fa25aa65..acd73cf1 100644 --- a/webapp/src/components/game/singleplayer/GameSinglePlayer.tsx +++ b/webapp/src/components/game/singleplayer/GameSinglePlayer.tsx @@ -4,6 +4,7 @@ import LobbyGame from './LobbyGameSinglePlayer'; import PlayingGame from './PlayingGameSinglePlayer'; import ScoreboardGame from '../ScoreboardGame'; import { Container } from '@mui/material'; +import { useTranslation } from 'react-i18next'; export interface Question4Answers { uuid: string @@ -29,6 +30,7 @@ const GameSinglePlayer = () => { const username = localStorage.getItem("username"); const uuid = localStorage.getItem("userUUID"); const [fetched, setFetched] = useState(false); + const { t } = useTranslation(); useEffect(() => { const fetchQuestions = async () => { @@ -64,7 +66,7 @@ const GameSinglePlayer = () => { } }, [questions.length, uuid, username, fetched]); - if (!username) return

        Error

        ; + if (!username) return

        {t('game_single_player_error')}

        ; const handlePlayers = (Players:Player[]) => { setPlayers(Players); diff --git a/webapp/src/i18n.ts b/webapp/src/i18n.ts index eabf136c..ef28a882 100644 --- a/webapp/src/i18n.ts +++ b/webapp/src/i18n.ts @@ -41,6 +41,7 @@ i18n questions_multiplayer_you_earned: 'You earned ', questions_multiplayer_points: ' points.', questions_multiplayer_waiting_players: 'Waiting for the rest of the players to finish...', + game_single_player_error: 'Error', profile_uuid: 'User ID:', profile_name: 'Name:', profile_created_at: 'Account creation date:', @@ -88,6 +89,7 @@ i18n questions_multiplayer_you_earned: 'Ganaste ', questions_multiplayer_points: ' puntos.', questions_multiplayer_waiting_players: 'Esperando a que el resto de los jugadores terminen...', + game_single_player_error: 'Error', profile_uuid: 'ID del jugador:', profile_name: 'Nombre:', profile_created_at: 'Fecha de creación de cuenta:', From e4f8a16a6dd95a77c48e042c2eccd33fab1a7fe0 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Tue, 23 Apr 2024 01:54:31 +0200 Subject: [PATCH 35/71] Lobby games single player localized --- .../game/singleplayer/LobbyGameSinglePlayer.tsx | 15 +++++++++------ webapp/src/i18n.ts | 12 ++++++++++++ 2 files changed, 21 insertions(+), 6 deletions(-) diff --git a/webapp/src/components/game/singleplayer/LobbyGameSinglePlayer.tsx b/webapp/src/components/game/singleplayer/LobbyGameSinglePlayer.tsx index c6c97315..0cff9499 100644 --- a/webapp/src/components/game/singleplayer/LobbyGameSinglePlayer.tsx +++ b/webapp/src/components/game/singleplayer/LobbyGameSinglePlayer.tsx @@ -1,6 +1,7 @@ import { FC, useRef } from 'react' import { Player } from './GameSinglePlayer'; import '../lobby-game.scss'; +import { useTranslation } from 'react-i18next'; interface LobbyGameProps { setPlayers: (players:Player[]) => void; @@ -19,7 +20,9 @@ const LobbyGame: FC = ({setPlayers, players, setCurrentStage, is } }; + const botGen = useRef(botCounter()); // Assign the function to the variable + const { t } = useTranslation(); const addBotPlayer = () => { if (players.length < 4) { @@ -37,28 +40,28 @@ const LobbyGame: FC = ({setPlayers, players, setCurrentStage, is return (
        -

        Lobby - Single player

        +

        {t('lobby_single_player_title')}

        {players.map((player, index) => (
        {player.username}

        {player.username}

        -

        Total points: {player.points}

        +

        {t('lobby_single_player_total_points')}{player.points}

        {player.isBot && ( - + )}
        ))}
        {isFetched && } {!isFetched && }
        diff --git a/webapp/src/i18n.ts b/webapp/src/i18n.ts index ef28a882..c4990233 100644 --- a/webapp/src/i18n.ts +++ b/webapp/src/i18n.ts @@ -42,6 +42,12 @@ i18n questions_multiplayer_points: ' points.', questions_multiplayer_waiting_players: 'Waiting for the rest of the players to finish...', game_single_player_error: 'Error', + lobby_single_player_title: 'Lobby - Single Player', + lobby_single_player_total_points: 'Total points: ', + lobby_single_player_delete: 'Delete', + lobby_single_player_add_bot_player: 'Add Bot Player', + lobby_single_player_start_game: 'Start Game', + lobby_single_player_loading_questions: 'Loading Questions...', profile_uuid: 'User ID:', profile_name: 'Name:', profile_created_at: 'Account creation date:', @@ -90,6 +96,12 @@ i18n questions_multiplayer_points: ' puntos.', questions_multiplayer_waiting_players: 'Esperando a que el resto de los jugadores terminen...', game_single_player_error: 'Error', + lobby_single_player_title: 'Lobby - Un Solo Jugador', + lobby_single_player_total_points: 'Total de puntos: ', + lobby_single_player_delete: 'Borrar', + lobby_single_player_add_bot_player: 'Añadir Bot Jugador', + lobby_single_player_start_game: 'Comenzar Partida', + lobby_single_player_loading_questions: 'Cargando Preguntas...', profile_uuid: 'ID del jugador:', profile_name: 'Nombre:', profile_created_at: 'Fecha de creación de cuenta:', From 5391ce7c977737603bdb5b2b093559a161c32bc9 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Tue, 23 Apr 2024 02:06:14 +0200 Subject: [PATCH 36/71] Playing game single player localized --- .../game/singleplayer/PlayingGameSinglePlayer.tsx | 8 +++++--- webapp/src/i18n.ts | 12 ++++++++++++ 2 files changed, 17 insertions(+), 3 deletions(-) diff --git a/webapp/src/components/game/singleplayer/PlayingGameSinglePlayer.tsx b/webapp/src/components/game/singleplayer/PlayingGameSinglePlayer.tsx index df087de4..35504e66 100644 --- a/webapp/src/components/game/singleplayer/PlayingGameSinglePlayer.tsx +++ b/webapp/src/components/game/singleplayer/PlayingGameSinglePlayer.tsx @@ -1,6 +1,7 @@ import { FC, useMemo, useState } from 'react' import { Player, Question4Answers } from './GameSinglePlayer' import axios from 'axios'; +import { useTranslation } from 'react-i18next'; interface PlayingGameProps { questions: Question4Answers[] @@ -20,6 +21,7 @@ const PlayingGame: FC = ({questions, setCurrentStage, setPlaye const [selectedAnswer, setSelectedAnswer] = useState(null); const [isWaiting, setIsWaiting] = useState(false); + const { t } = useTranslation(); const answersShuffled = useMemo(() => { return questions.map((question) => { @@ -122,9 +124,9 @@ const PlayingGame: FC = ({questions, setCurrentStage, setPlaye )} {currentQuestion+1 === questions.length && ( <> -

        You answered {correctAnswers} out of {questions.length} questions correctly.

        -

        You earned {calculatePoints(correctAnswers, questions.length)} points.

        - +

        {t('playing_single_player_you_answered')}{correctAnswers}{t('playing_single_player_out_of')}{questions.length}{t('playing_single_player_questions_correctly')}

        +

        {t('playing_single_player_you_earned')}{calculatePoints(correctAnswers, questions.length)}{t('playing_single_player_points')}

        + )}
      diff --git a/webapp/src/i18n.ts b/webapp/src/i18n.ts index c4990233..48ca7e0b 100644 --- a/webapp/src/i18n.ts +++ b/webapp/src/i18n.ts @@ -48,6 +48,12 @@ i18n lobby_single_player_add_bot_player: 'Add Bot Player', lobby_single_player_start_game: 'Start Game', lobby_single_player_loading_questions: 'Loading Questions...', + playing_single_player_you_answered: 'You answered ', + playing_single_player_out_of: ' out of ', + playing_single_player_questions_correctly: ' questions correctly.', + playing_single_player_you_earned: 'you earned ', + playing_single_player_points: ' points.', + playing_single_player_next: 'Next', profile_uuid: 'User ID:', profile_name: 'Name:', profile_created_at: 'Account creation date:', @@ -102,6 +108,12 @@ i18n lobby_single_player_add_bot_player: 'Añadir Bot Jugador', lobby_single_player_start_game: 'Comenzar Partida', lobby_single_player_loading_questions: 'Cargando Preguntas...', + playing_single_player_you_answered: 'Respondiste ', + playing_single_player_out_of: ' de ', + playing_single_player_questions_correctly: ' preguntas correctamente.', + playing_single_player_you_earned: 'Ganaste ', + playing_single_player_points: ' puntos.', + playing_single_player_next: 'Siguiente', profile_uuid: 'ID del jugador:', profile_name: 'Nombre:', profile_created_at: 'Fecha de creación de cuenta:', From 1e281a1983d1aaa5af1d25bf708749ea78c1bc41 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Tue, 23 Apr 2024 02:12:41 +0200 Subject: [PATCH 37/71] Scoreboard game localized --- webapp/src/components/game/ScoreboardGame.tsx | 10 ++++++---- webapp/src/i18n.ts | 8 ++++++++ 2 files changed, 14 insertions(+), 4 deletions(-) diff --git a/webapp/src/components/game/ScoreboardGame.tsx b/webapp/src/components/game/ScoreboardGame.tsx index ef20e136..74d901f0 100644 --- a/webapp/src/components/game/ScoreboardGame.tsx +++ b/webapp/src/components/game/ScoreboardGame.tsx @@ -2,6 +2,7 @@ import { FC} from 'react' import { Player } from './singleplayer/GameSinglePlayer'; import './scoreboard-game.scss'; import { PlayerWithPoints } from './multiplayer/GameMultiPlayer'; +import { useTranslation } from 'react-i18next'; interface ScoreboardGameProps { userScoresSinglePlayer?: Player[]; @@ -17,14 +18,15 @@ const ScoreboardGame:FC = ({userScoresSinglePlayer, userSco } else if (userScoresMultiPlayer){ sorted = userScoresMultiPlayer.sort((a, b) => b.points - a.points); } + const { t } = useTranslation(); return ( - + - - - + + + diff --git a/webapp/src/i18n.ts b/webapp/src/i18n.ts index 48ca7e0b..879b88cf 100644 --- a/webapp/src/i18n.ts +++ b/webapp/src/i18n.ts @@ -54,6 +54,10 @@ i18n playing_single_player_you_earned: 'you earned ', playing_single_player_points: ' points.', playing_single_player_next: 'Next', + scoreboard_game_game_scoreboard: 'Game Scoreboard', + scoreboard_game_position: 'Position', + scoreboard_game_username: 'Username', + scoreboard_game_points: 'Points', profile_uuid: 'User ID:', profile_name: 'Name:', profile_created_at: 'Account creation date:', @@ -114,6 +118,10 @@ i18n playing_single_player_you_earned: 'Ganaste ', playing_single_player_points: ' puntos.', playing_single_player_next: 'Siguiente', + scoreboard_game_game_scoreboard: 'Marcador del Juego', + scoreboard_game_position: 'Posición', + scoreboard_game_username: 'Nombre de Usuario', + scoreboard_game_points: 'Puntos', profile_uuid: 'ID del jugador:', profile_name: 'Nombre:', profile_created_at: 'Fecha de creación de cuenta:', From 522ec92e3750d70ef6b3cdf9a42e581c8bca05ec Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Tue, 23 Apr 2024 19:25:37 +0200 Subject: [PATCH 38/71] Game layout localized --- webapp/src/components/game-layout/GameLayout.tsx | 8 +++++--- webapp/src/i18n.ts | 6 ++++++ 2 files changed, 11 insertions(+), 3 deletions(-) diff --git a/webapp/src/components/game-layout/GameLayout.tsx b/webapp/src/components/game-layout/GameLayout.tsx index 515928b8..4e677d25 100644 --- a/webapp/src/components/game-layout/GameLayout.tsx +++ b/webapp/src/components/game-layout/GameLayout.tsx @@ -2,11 +2,13 @@ import { useState } from "react"; import Game from "../game/singleplayer/GameSinglePlayer"; import {GroupsPage} from "../../pages/groups/index"; import Scoreboard from "../scoreboard/Scoreboard"; +import { useTranslation } from 'react-i18next'; const GameLayout = () => { const [currentView, setCurrentView] = useState("Game"); +const { t } = useTranslation(); return( @@ -16,13 +18,13 @@ return(

      Game

    • - +
    • - +
    • - +
      • diff --git a/webapp/src/i18n.ts b/webapp/src/i18n.ts index 879b88cf..92dedc9a 100644 --- a/webapp/src/i18n.ts +++ b/webapp/src/i18n.ts @@ -58,6 +58,9 @@ i18n scoreboard_game_position: 'Position', scoreboard_game_username: 'Username', scoreboard_game_points: 'Points', + game_layout_game: 'Game', + game_layout_groups: 'Groups', + game_layout_scoreboard: 'Scoreboard', profile_uuid: 'User ID:', profile_name: 'Name:', profile_created_at: 'Account creation date:', @@ -122,6 +125,9 @@ i18n scoreboard_game_position: 'Posición', scoreboard_game_username: 'Nombre de Usuario', scoreboard_game_points: 'Puntos', + game_layout_game: 'Juego', + game_layout_groups: 'Grupos', + game_layout_scoreboard: 'Marcador del Juego', profile_uuid: 'ID del jugador:', profile_name: 'Nombre:', profile_created_at: 'Fecha de creación de cuenta:', From 6e346afa59c3cd02c00c324f6cd9f7ca9b38a241 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Tue, 23 Apr 2024 19:44:03 +0200 Subject: [PATCH 39/71] Group table localized --- webapp/src/components/group/GroupTable.tsx | 16 ++++++++++------ webapp/src/i18n.ts | 12 ++++++++++++ 2 files changed, 22 insertions(+), 6 deletions(-) diff --git a/webapp/src/components/group/GroupTable.tsx b/webapp/src/components/group/GroupTable.tsx index ce807bf8..e67a1d87 100644 --- a/webapp/src/components/group/GroupTable.tsx +++ b/webapp/src/components/group/GroupTable.tsx @@ -1,6 +1,7 @@ import { useEffect } from 'react'; import { Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Container, Grid, Button } from "@mui/material" import axios from 'axios'; +import { useTranslation } from 'react-i18next'; type TableProps = { groupUUID: string, @@ -25,6 +26,9 @@ const apiEndpoint = 'http://localhost:8000' //const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; export const GroupTable = (props: TableProps) => { + + const { t } = useTranslation(); + const aFunction = async ()=>{ await axios.get(`${apiEndpoint}/getGroup/`+props.groupUUID).then(res => { console.log(res.data); @@ -78,13 +82,13 @@ export const GroupTable = (props: TableProps) => {

      {groupName}

      -

      {total} points

      +

      {total}{t('group_table_points')}

       -

      {numberMembers} members

      +

      {numberMembers}{t('group_table_members')}

       - + )} @@ -92,9 +96,9 @@ export const GroupTable = (props: TableProps) => {
      Game Scoreboard{t('scoreboard_game_game_scoreboard')}
      PositionUsernamePoints{t('scoreboard_game_position')}{t('scoreboard_game_username')}{t('scoreboard_game_points')}
      - Username - Role - Score + {t('group_table_username')} + {t('group_table_role')} + {t('group_table_score')} diff --git a/webapp/src/i18n.ts b/webapp/src/i18n.ts index 92dedc9a..c69967c9 100644 --- a/webapp/src/i18n.ts +++ b/webapp/src/i18n.ts @@ -61,6 +61,12 @@ i18n game_layout_game: 'Game', game_layout_groups: 'Groups', game_layout_scoreboard: 'Scoreboard', + group_table_points: ' points', + group_table_members: ' members', + group_table_leave: 'Leave', + group_table_username: 'Username', + group_table_role: 'Role', + group_table_score: 'Score', profile_uuid: 'User ID:', profile_name: 'Name:', profile_created_at: 'Account creation date:', @@ -128,6 +134,12 @@ i18n game_layout_game: 'Juego', game_layout_groups: 'Grupos', game_layout_scoreboard: 'Marcador del Juego', + group_table_points: ' puntos', + group_table_members: ' miembros', + group_table_leave: 'Salir', + group_table_username: 'Nombre de Usuario', + group_table_role: 'Rol', + group_table_score: 'Puntuación', profile_uuid: 'ID del jugador:', profile_name: 'Nombre:', profile_created_at: 'Fecha de creación de cuenta:', From 1b52ad0cd26af9f0487cb40613bb5bd04dbe1c01 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Tue, 23 Apr 2024 20:45:02 +0200 Subject: [PATCH 40/71] Game page localization --- webapp/src/i18n.ts | 6 ++++++ webapp/src/pages/game/index.tsx | 10 +++++++--- 2 files changed, 13 insertions(+), 3 deletions(-) diff --git a/webapp/src/i18n.ts b/webapp/src/i18n.ts index c69967c9..b3eff7f9 100644 --- a/webapp/src/i18n.ts +++ b/webapp/src/i18n.ts @@ -67,6 +67,9 @@ i18n group_table_username: 'Username', group_table_role: 'Role', group_table_score: 'Score', + game_single_player: 'Single Player', + game_single_player_ai: 'Single Player (AI)', + game_multiplayer: 'Multiplayer', profile_uuid: 'User ID:', profile_name: 'Name:', profile_created_at: 'Account creation date:', @@ -140,6 +143,9 @@ i18n group_table_username: 'Nombre de Usuario', group_table_role: 'Rol', group_table_score: 'Puntuación', + game_single_player: 'Un Solo Jugador', + game_single_player_ai: 'Un Solo Jugador (IA)', + game_multiplayer: 'Multijugador', profile_uuid: 'ID del jugador:', profile_name: 'Nombre:', profile_created_at: 'Fecha de creación de cuenta:', diff --git a/webapp/src/pages/game/index.tsx b/webapp/src/pages/game/index.tsx index aacd7674..de21788b 100644 --- a/webapp/src/pages/game/index.tsx +++ b/webapp/src/pages/game/index.tsx @@ -1,18 +1,22 @@ import React from "react"; import { Link } from "react-router-dom"; import "./game-page.scss"; +import { useTranslation } from 'react-i18next'; export const GamePage: React.FC<{}> = () => { + + const { t } = useTranslation(); + return (
      ); From 0f35bc0a015e23aecb27a2fd14f4df5fe38b68ec Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Wed, 24 Apr 2024 01:48:08 +0200 Subject: [PATCH 41/71] User profile localized --- webapp/src/i18n.ts | 30 +++++++++++++++----------- webapp/src/pages/userProfile/index.tsx | 18 ++++++++-------- 2 files changed, 27 insertions(+), 21 deletions(-) diff --git a/webapp/src/i18n.ts b/webapp/src/i18n.ts index b3eff7f9..24105cbf 100644 --- a/webapp/src/i18n.ts +++ b/webapp/src/i18n.ts @@ -73,17 +73,20 @@ i18n profile_uuid: 'User ID:', profile_name: 'Name:', profile_created_at: 'Account creation date:', + profile_performance_statistics: 'Performance Statistics', profile_points: 'Total points:', profile_nwins: 'Number of victories:', profile_n_correct_answers: 'Correct answers:', profile_n_wrong_answers: 'Wrong answers:', + profile_last_game_id: 'Last game ID: ', + profile_questions: 'Questions:', + profile_last_game_questions_question_blank: 'Question ', profile_last_game_questions: 'Last Game', - profile_last_game_questions_question: 'Question:', - profile_last_game_questions_warning: 'You have not played any games yet', - profile_last_game_questions_correct_answer: 'Correct answer:', - profile_last_game_questions_incorrect_answer_1: 'Incorrect answer 1:', - profile_last_game_questions_incorrect_answer_2: 'Incorrect answer 2:', - profile_last_game_questions_incorrect_answer_3: 'Incorrect answer 3:' + profile_last_game_questions_question: 'Question: ', + profile_last_game_questions_correct_answer: 'Correct answer: ', + profile_last_game_questions_incorrect_answer_1: 'Incorrect answer 1: ', + profile_last_game_questions_incorrect_answer_2: 'Incorrect answer 2: ', + profile_last_game_questions_incorrect_answer_3: 'Incorrect answer 3: ' } }, es: { @@ -149,17 +152,20 @@ i18n profile_uuid: 'ID del jugador:', profile_name: 'Nombre:', profile_created_at: 'Fecha de creación de cuenta:', + profile_performance_statistics: 'Estadísticas de Desempeño', profile_points: 'Puntuación total:', profile_nwins: 'Número de victorias:', profile_n_correct_answers: 'Respuestas correctas:', profile_n_wrong_answers: 'Respuestas incorrectas:', + profile_last_game_id: 'ID de la última partida: ', + profile_questions: 'Preguntas:', + profile_last_game_questions_question_blank: 'Pregunta ', profile_last_game_questions: 'Última Partida', - profile_last_game_questions_warning: 'Todavía no has jugado ninguna partida', - profile_last_game_questions_question: 'Pregunta:', - profile_last_game_questions_correct_answer: 'Respuesta correcta:', - profile_last_game_questions_incorrect_answer_1: 'Respuesta incorrecta 1:', - profile_last_game_questions_incorrect_answer_2: 'Respuesta incorrecta 2:', - profile_last_game_questions_incorrect_answer_3: 'Respuesta incorrecta 3:' + profile_last_game_questions_question: 'Pregunta: ', + profile_last_game_questions_correct_answer: 'Respuesta correcta: ', + profile_last_game_questions_incorrect_answer_1: 'Respuesta incorrecta 1: ', + profile_last_game_questions_incorrect_answer_2: 'Respuesta incorrecta 2: ', + profile_last_game_questions_incorrect_answer_3: 'Respuesta incorrecta 3: ' } }, diff --git a/webapp/src/pages/userProfile/index.tsx b/webapp/src/pages/userProfile/index.tsx index 243820dc..f8446e4b 100644 --- a/webapp/src/pages/userProfile/index.tsx +++ b/webapp/src/pages/userProfile/index.tsx @@ -61,7 +61,7 @@ const ProfilePage = () => { - Performance Statistics + {t('profile_performance_statistics')} {profileInfo && (
        @@ -102,7 +102,7 @@ const ProfilePage = () => { variant="body1" className="field" > - Last game ID: {profileInfo.userStats.lastGameID} + {t('profile_last_game_id')}{profileInfo.userStats.lastGameID} { gutterBottom className="profile-subheader" > - Questions: + {t('profile_questions')}
          {profileInfo.lastGame.map((question, index) => ( @@ -121,32 +121,32 @@ const ProfilePage = () => { gutterBottom className="profile-subheader" > - Question {index} + {t('profile_last_game_questions_question_blank')}{index}
          • - Question: {question[0].question} + {t('profile_last_game_questions_question')}{question[0].question}
          • - Correct answer: {question[0].correctAnswer} + {t('profile_last_game_questions_correct_answer')}{question[0].correctAnswer}
          • - Incorrect answer 1: {question[0].incorrectAnswer1} + {t('profile_last_game_questions_incorrect_answer_1')}{question[0].incorrectAnswer1}
          • - Incorrect answer 2: {question[0].incorrectAnswer2} + {t('profile_last_game_questions_incorrect_answer_2')}{question[0].incorrectAnswer2}
          • - Incorrect answer 3: {question[0].incorrectAnswer3} + {t('profile_last_game_questions_incorrect_answer_3')}{question[0].incorrectAnswer3}
          From 17fb00df227630e2df7a70c635ce9f784e7ecfd3 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Wed, 24 Apr 2024 01:54:08 +0200 Subject: [PATCH 42/71] TItles in nav internationalized --- webapp/src/common/Nav.tsx | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/webapp/src/common/Nav.tsx b/webapp/src/common/Nav.tsx index 14916084..1d1c3eba 100644 --- a/webapp/src/common/Nav.tsx +++ b/webapp/src/common/Nav.tsx @@ -35,19 +35,19 @@ const NavBar: React.FC<{}> = () => useEffect(() => { switch (location.pathname) { case '/game': - document.title = 'Conocer y Vencer - Game'; + document.title = t('app_name') + ' - ' + t('nav_game'); break; case '/groups': - document.title = 'Conocer y Vencer - Groups'; + document.title = t('app_name') + ' - ' + t('nav_groups'); break; case '/scoreboard': - document.title = 'Conocer y Vencer - Scoreboard'; + document.title = t('app_name') + ' - ' + t('nav_scoreboard'); break; case '/profile': - document.title = 'Conocer y Vencer - Profile'; + document.title = t('app_name') + ' - ' + t('nav_profile'); break; default: - document.title = 'Conocer y Vencer'; + document.title = t('app_name'); } }, [location.pathname]); From cdde2576d6b63eaa20aeb7d93b7a405844d32488 Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Wed, 24 Apr 2024 01:57:03 +0200 Subject: [PATCH 43/71] Text to localize left at game layout --- webapp/src/components/game-layout/GameLayout.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/webapp/src/components/game-layout/GameLayout.tsx b/webapp/src/components/game-layout/GameLayout.tsx index 4e677d25..9203fb69 100644 --- a/webapp/src/components/game-layout/GameLayout.tsx +++ b/webapp/src/components/game-layout/GameLayout.tsx @@ -15,7 +15,7 @@ return(
      + + + Username + Role + Score + + + + {members.map((member) => { + console.log(member + "added"); + return ( + + {member.username} + {member.role} + {member.totalScore} + + ); + })} + +
      + +       )} - - - - - {t('group_table_username')} - {t('group_table_role')} - {t('group_table_score')} - - - - {membersCharged && members.map((member) => ( - - {member.username} - {member.role} - {member.totalScore} - - ))} - -
      -       ) } \ No newline at end of file diff --git a/webapp/src/components/group/NoGroup.tsx b/webapp/src/components/group/NoGroup.tsx index df2587ee..6918c21e 100644 --- a/webapp/src/components/group/NoGroup.tsx +++ b/webapp/src/components/group/NoGroup.tsx @@ -1,5 +1,5 @@ import './group.scss'; -import { Button, Container, Snackbar, TextField, Grid, Stack, RadioGroup, FormControlLabel, Radio } from "@mui/material"; +import { Button, Container, Snackbar, Grid, Stack } from "@mui/material"; import { useEffect, useState } from 'react'; import axios from 'axios'; import { CreationModal } from './GroupCreationModal'; @@ -24,13 +24,12 @@ let groupsCharged = false; const NoGroup = (props: ActionProps) => { - const { t } = useTranslation(); const [error, setError] = useState(''); const [createModal, setCreateModal] = useState(false); const [joinModal, setJoinModal] = useState(false); - - const creatorUUID = JSON.stringify(localStorage.getItem("userUUID")).replace("\"", "").replace("\"", ""); const { t } = useTranslation(); + + const creatorUUID = JSON.stringify(localStorage.getItem("userUUID")).replace("\"", "").replace("\"", ""); const toggleCreateModal = () => { setCreateModal(!createModal); @@ -54,8 +53,7 @@ const NoGroup = (props: ActionProps) => try{ await axios.get(`${apiEndpoint}/getGroups`).then( res => { // new array here so in case it is chared twice it doesn't contain dupllicate data - groups = new Array(); - + groups = []; for(let group of res.data){ console.log("Group:"+JSON.stringify(group)); let isPublic = JSON.stringify(group.isPublic).replace("\"", "").replace("\"", ""); @@ -72,7 +70,6 @@ const NoGroup = (props: ActionProps) => } } groupsCharged = true; - }) } catch (error:any) { console.log("error: "+error); @@ -101,62 +98,11 @@ const NoGroup = (props: ActionProps) =>       {error && ( - setError('')} message={`Error: ${error}`} data-testid="error-snackbar"/> - )} - {createModal && ( -
      -
      -

      {t('no_group_create_group')}

      - - -

      {t('no_group_group_name')}

       - setGroupName(e.target.value)} - /> -       - -

      {t('no_group_group_name')}

       - setPublic(e.target.value === "yes")} - > - } label="Yes" /> - } label="No" /> - -       - -

      {t('no_group_max_members')}

       - -       - -

      {t('no_group_description')}

       - setDescription(e.target.value)} - - /> -       - - - - -       -
      -
      + setError('')} message={`Error: ${error}`} data-testid="error-snackbar"/> )} - {createModal && () } - {joinModal && (groupsCharged && (
      From 7f961701974b39c6b74f7d6789cf5902e40ed17e Mon Sep 17 00:00:00 2001 From: AlvaroIC Date: Sat, 27 Apr 2024 13:04:01 +0200 Subject: [PATCH 64/71] Merge part 2 --- webapp/src/components/game/PlayingGame.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/webapp/src/components/game/PlayingGame.tsx b/webapp/src/components/game/PlayingGame.tsx index caca75e9..76ef47fa 100644 --- a/webapp/src/components/game/PlayingGame.tsx +++ b/webapp/src/components/game/PlayingGame.tsx @@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next'; import shuffleAnswers from './util/SuffleAnswers'; import calculatePoints from './util/CalculatePoints'; import { SocketProps } from './multiplayer/GameMultiPlayer'; -import "./QuestionsGame.scss" +import "./questions-game.scss" interface PlayingGameProps { questions: Question4Answers[] From 16a15df90067968b419a285f3b5f6133c91cf0be Mon Sep 17 00:00:00 2001 From: CarolinaUniovi Date: Sat, 27 Apr 2024 13:46:48 +0200 Subject: [PATCH 65/71] Fixed some test --- webapp/src/components/login/Login.test.js | 4 ++-- webapp/src/components/login/Login.tsx | 4 ++-- webapp/src/components/register/Register.test.js | 4 ++-- webapp/src/components/register/Register.tsx | 4 ++-- 4 files changed, 8 insertions(+), 8 deletions(-) diff --git a/webapp/src/components/login/Login.test.js b/webapp/src/components/login/Login.test.js index 715c2598..22272c62 100644 --- a/webapp/src/components/login/Login.test.js +++ b/webapp/src/components/login/Login.test.js @@ -41,7 +41,7 @@ describe('Login component', () => { // Wait for the Snackbar to be open await waitFor(() => { - expect(screen.getByText(/Login successful/i)).toBeInTheDocument(); + expect(screen.getByTestId("login-successfull-snackbar")).toBeInTheDocument(); }); // Verify local storage is set correctly @@ -77,7 +77,7 @@ describe('Login component', () => { // Wait for the error Snackbar to be open await waitFor(() => { - expect(screen.getByText(/Error: Internal Server Error/i)).toBeInTheDocument(); + expect(screen.getByTestId('login-error-snackbar')).toBeInTheDocument(); }); // Verify local storage is not set when there's an error diff --git a/webapp/src/components/login/Login.tsx b/webapp/src/components/login/Login.tsx index 6ddf3543..5265b968 100644 --- a/webapp/src/components/login/Login.tsx +++ b/webapp/src/components/login/Login.tsx @@ -90,9 +90,9 @@ const Login = (props: ActionProps) => { {t('return')} - + {error && ( - setError('')} message={`Error: ${error}`} /> + setError('')} message={`Error: ${error}`} /> )}
      diff --git a/webapp/src/components/register/Register.test.js b/webapp/src/components/register/Register.test.js index 92dd7cb7..548b8ae5 100644 --- a/webapp/src/components/register/Register.test.js +++ b/webapp/src/components/register/Register.test.js @@ -36,7 +36,7 @@ describe('Register component', () => { // Wait for the Snackbar to be open await waitFor(() => { - expect(screen.getByText(/You registered successfully/i)).toBeInTheDocument(); + expect(screen.getByTestId('register-successfull-snackbar')).toBeInTheDocument(); }); }); @@ -63,7 +63,7 @@ describe('Register component', () => { // Wait for the error Snackbar to be open await waitFor(() => { - expect(screen.getByText(/Error: Internal Server Error/i)).toBeInTheDocument(); + expect(screen.getByTestId('register-error-snackbar')).toBeInTheDocument(); }); }); }); diff --git a/webapp/src/components/register/Register.tsx b/webapp/src/components/register/Register.tsx index cfe48c05..ee4373fd 100644 --- a/webapp/src/components/register/Register.tsx +++ b/webapp/src/components/register/Register.tsx @@ -97,9 +97,9 @@ const Register = (props:ActionProps) => { {t('return')} - + {error && ( - setError('')} message={`Error: ${error}`} /> + setError('')} message={`Error: ${error}`} /> )} ); From 41ffc70fe52336d17177ddef8eb01919258dbd60 Mon Sep 17 00:00:00 2001 From: CarolinaUniovi Date: Sat, 27 Apr 2024 13:54:42 +0200 Subject: [PATCH 66/71] Scoreboard removed --- webapp/src/components/group/NoGroup.tsx | 2 +- webapp/src/components/scoreboard/Scoreboard.scss | 0 .../src/components/scoreboard/Scoreboard.test.js | 14 -------------- webapp/src/components/scoreboard/Scoreboard.tsx | 13 ------------- 4 files changed, 1 insertion(+), 28 deletions(-) delete mode 100644 webapp/src/components/scoreboard/Scoreboard.scss delete mode 100644 webapp/src/components/scoreboard/Scoreboard.test.js delete mode 100644 webapp/src/components/scoreboard/Scoreboard.tsx diff --git a/webapp/src/components/group/NoGroup.tsx b/webapp/src/components/group/NoGroup.tsx index 6918c21e..e61a28a0 100644 --- a/webapp/src/components/group/NoGroup.tsx +++ b/webapp/src/components/group/NoGroup.tsx @@ -1,4 +1,4 @@ -import './group.scss'; +import './Group.scss'; import { Button, Container, Snackbar, Grid, Stack } from "@mui/material"; import { useEffect, useState } from 'react'; import axios from 'axios'; diff --git a/webapp/src/components/scoreboard/Scoreboard.scss b/webapp/src/components/scoreboard/Scoreboard.scss deleted file mode 100644 index e69de29b..00000000 diff --git a/webapp/src/components/scoreboard/Scoreboard.test.js b/webapp/src/components/scoreboard/Scoreboard.test.js deleted file mode 100644 index eee92c5d..00000000 --- a/webapp/src/components/scoreboard/Scoreboard.test.js +++ /dev/null @@ -1,14 +0,0 @@ -import React from 'react'; -import { render } from '@testing-library/react'; -import Scoreboard from './Scoreboard'; - -describe('Scoreboard Component', () => { - it('should render scoreboard component', () => { - const { getByText } = render(); - const headingElement = getByText('Scoreboard'); - const paragraphElement = getByText('Here is the scoreboard'); - - expect(headingElement).toBeInTheDocument(); - expect(paragraphElement).toBeInTheDocument(); - }); -}); \ No newline at end of file diff --git a/webapp/src/components/scoreboard/Scoreboard.tsx b/webapp/src/components/scoreboard/Scoreboard.tsx deleted file mode 100644 index d67f0433..00000000 --- a/webapp/src/components/scoreboard/Scoreboard.tsx +++ /dev/null @@ -1,13 +0,0 @@ -import './scoreboard.scss'; - -const Scoreboard = () => -{ - return ( -
      -

      Scoreboard

      -

      Here is the scoreboard

      -
      - ) -} - -export default Scoreboard; \ No newline at end of file From 71a6f55b09740dc5378381a1d0299753b4e8327d Mon Sep 17 00:00:00 2001 From: CarolinaUniovi Date: Sat, 27 Apr 2024 14:01:58 +0200 Subject: [PATCH 67/71] removed old-unused scoreboard --- .../components/game-layout/GameLayout.test.js | 16 ---------------- webapp/src/components/game-layout/GameLayout.tsx | 7 +------ webapp/src/components/scoreboard/Scoreboard.scss | 0 .../src/components/scoreboard/Scoreboard.test.js | 14 ++++++++++++++ 4 files changed, 15 insertions(+), 22 deletions(-) create mode 100644 webapp/src/components/scoreboard/Scoreboard.scss create mode 100644 webapp/src/components/scoreboard/Scoreboard.test.js diff --git a/webapp/src/components/game-layout/GameLayout.test.js b/webapp/src/components/game-layout/GameLayout.test.js index fd30f433..552140b4 100644 --- a/webapp/src/components/game-layout/GameLayout.test.js +++ b/webapp/src/components/game-layout/GameLayout.test.js @@ -31,20 +31,4 @@ describe('GameLayout component', () => { }); }); - - it('renders Scoreboard when Scoreboard link is clicked', () => { - - render( - - - - ); - waitFor(() => { - fireEvent.click(screen.getByTestId('scoreboard-link')); - expect(screen.queryByTestId('game-component')).toBeNull(); - expect(screen.queryByTestId('groups-page-component')).toBeNull(); - - }); - - }); }); diff --git a/webapp/src/components/game-layout/GameLayout.tsx b/webapp/src/components/game-layout/GameLayout.tsx index 1a431e40..0a2b9828 100644 --- a/webapp/src/components/game-layout/GameLayout.tsx +++ b/webapp/src/components/game-layout/GameLayout.tsx @@ -1,7 +1,6 @@ import { useState } from "react"; import Game from "../game/singleplayer/GameSinglePlayer"; import { GroupsPage } from "../../pages/groups/index"; -import Scoreboard from "../scoreboard/Scoreboard"; import { useTranslation } from 'react-i18next'; const GameLayout = () => { @@ -22,15 +21,11 @@ const GameLayout = () => {
      • -
    • - -
      • - {currentView === "Game" ? : currentView === "Group" ? : - } + {currentView === "Game" ? : }
      ); diff --git a/webapp/src/components/scoreboard/Scoreboard.scss b/webapp/src/components/scoreboard/Scoreboard.scss new file mode 100644 index 00000000..e69de29b diff --git a/webapp/src/components/scoreboard/Scoreboard.test.js b/webapp/src/components/scoreboard/Scoreboard.test.js new file mode 100644 index 00000000..eee92c5d --- /dev/null +++ b/webapp/src/components/scoreboard/Scoreboard.test.js @@ -0,0 +1,14 @@ +import React from 'react'; +import { render } from '@testing-library/react'; +import Scoreboard from './Scoreboard'; + +describe('Scoreboard Component', () => { + it('should render scoreboard component', () => { + const { getByText } = render(); + const headingElement = getByText('Scoreboard'); + const paragraphElement = getByText('Here is the scoreboard'); + + expect(headingElement).toBeInTheDocument(); + expect(paragraphElement).toBeInTheDocument(); + }); +}); \ No newline at end of file From 531beb95b7454c6c48d1e09fa9b4802f33d1f6d1 Mon Sep 17 00:00:00 2001 From: CarolinaUniovi Date: Sat, 27 Apr 2024 14:13:00 +0200 Subject: [PATCH 68/71] Fixing more tests --- .../src/components/game/singleplayer/lobby.test.js | 2 +- webapp/src/components/register/Register.tsx | 2 +- webapp/src/components/scoreboard/Scoreboard.scss | 0 .../src/components/scoreboard/Scoreboard.test.js | 14 -------------- 4 files changed, 2 insertions(+), 16 deletions(-) delete mode 100644 webapp/src/components/scoreboard/Scoreboard.scss delete mode 100644 webapp/src/components/scoreboard/Scoreboard.test.js diff --git a/webapp/src/components/game/singleplayer/lobby.test.js b/webapp/src/components/game/singleplayer/lobby.test.js index f56dc6f1..fff080a4 100644 --- a/webapp/src/components/game/singleplayer/lobby.test.js +++ b/webapp/src/components/game/singleplayer/lobby.test.js @@ -57,7 +57,7 @@ describe('LobbyGame component', () => { fireEvent.click(addBotButton); // Find all elements that contain the text "Bot" - const botElements = getAllByText(/Bot/); + const botElements = getAllByText('Bot'); // Check if at least one element containing "Bot" text is found expect(botElements.length).toBeGreaterThan(0); diff --git a/webapp/src/components/register/Register.tsx b/webapp/src/components/register/Register.tsx index ee4373fd..9ff0c4e1 100644 --- a/webapp/src/components/register/Register.tsx +++ b/webapp/src/components/register/Register.tsx @@ -2,7 +2,7 @@ import { useState, KeyboardEvent } from 'react'; import axios from 'axios'; import { Container, Typography, TextField, Snackbar, Stack, Button } from '@mui/material'; import { useTranslation } from 'react-i18next'; -import './register.scss'; +import './Register.scss'; import { useNavigate } from "react-router-dom"; //const apiEndpoint = 'http://conoceryvencer.xyz:8000' diff --git a/webapp/src/components/scoreboard/Scoreboard.scss b/webapp/src/components/scoreboard/Scoreboard.scss deleted file mode 100644 index e69de29b..00000000 diff --git a/webapp/src/components/scoreboard/Scoreboard.test.js b/webapp/src/components/scoreboard/Scoreboard.test.js deleted file mode 100644 index eee92c5d..00000000 --- a/webapp/src/components/scoreboard/Scoreboard.test.js +++ /dev/null @@ -1,14 +0,0 @@ -import React from 'react'; -import { render } from '@testing-library/react'; -import Scoreboard from './Scoreboard'; - -describe('Scoreboard Component', () => { - it('should render scoreboard component', () => { - const { getByText } = render(); - const headingElement = getByText('Scoreboard'); - const paragraphElement = getByText('Here is the scoreboard'); - - expect(headingElement).toBeInTheDocument(); - expect(paragraphElement).toBeInTheDocument(); - }); -}); \ No newline at end of file From 05bc5c710f3f0761d6248a15bacfeeadd48fc49c Mon Sep 17 00:00:00 2001 From: CarolinaUniovi Date: Sat, 27 Apr 2024 14:19:22 +0200 Subject: [PATCH 69/71] Fixed lobby test --- webapp/src/components/game/singleplayer/lobby.test.js | 4 ++-- webapp/src/components/init/Init.tsx | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/webapp/src/components/game/singleplayer/lobby.test.js b/webapp/src/components/game/singleplayer/lobby.test.js index fff080a4..018fa2aa 100644 --- a/webapp/src/components/game/singleplayer/lobby.test.js +++ b/webapp/src/components/game/singleplayer/lobby.test.js @@ -57,10 +57,10 @@ describe('LobbyGame component', () => { fireEvent.click(addBotButton); // Find all elements that contain the text "Bot" - const botElements = getAllByText('Bot'); + const botElements = getByTestId('player'); // Check if at least one element containing "Bot" text is found - expect(botElements.length).toBeGreaterThan(0); + expect(botElements.length).toBeGreaterThan(1); }); }); diff --git a/webapp/src/components/init/Init.tsx b/webapp/src/components/init/Init.tsx index 30295a49..8f99622a 100644 --- a/webapp/src/components/init/Init.tsx +++ b/webapp/src/components/init/Init.tsx @@ -2,7 +2,7 @@ import { useState } from 'react'; import { useTranslation } from 'react-i18next'; import {Button, Stack} from "@mui/material"; import GLoginButton from '../g-login-button/GLoginButton'; -import './init.scss'; +import './Init.scss'; type ActionProps = { changeView:(arg:boolean)=> void; From da4ecc7690cb4a8d2b57c7baebc6fcbec298a041 Mon Sep 17 00:00:00 2001 From: CarolinaUniovi Date: Sat, 27 Apr 2024 18:00:00 +0200 Subject: [PATCH 70/71] all test pass in local --- webapp/src/components/game/singleplayer/GameSinglePlayer.tsx | 2 +- .../components/game/singleplayer/LobbyGameSinglePlayer.tsx | 2 +- webapp/src/components/game/singleplayer/game.test.js | 4 ++-- webapp/src/components/game/singleplayer/lobby.test.js | 4 ++-- webapp/src/components/group/GroupCreationModal.tsx | 2 -- webapp/src/components/group/GroupTable.tsx | 5 ----- webapp/src/components/group/NoGroup.tsx | 5 +---- webapp/src/components/login/Login.tsx | 3 --- 8 files changed, 7 insertions(+), 20 deletions(-) diff --git a/webapp/src/components/game/singleplayer/GameSinglePlayer.tsx b/webapp/src/components/game/singleplayer/GameSinglePlayer.tsx index a56ae989..cbe6e732 100644 --- a/webapp/src/components/game/singleplayer/GameSinglePlayer.tsx +++ b/webapp/src/components/game/singleplayer/GameSinglePlayer.tsx @@ -67,7 +67,7 @@ const GameSinglePlayer = () => { } }, [questions.length, uuid, username, fetched]); - if (!username) return

      {t('game_single_player_error')}

      ; + if (!username) return

      {t('game_single_player_error')}

      ; const handlePlayers = (Players:Player[]) => { setPlayers(Players); diff --git a/webapp/src/components/game/singleplayer/LobbyGameSinglePlayer.tsx b/webapp/src/components/game/singleplayer/LobbyGameSinglePlayer.tsx index ccccfddb..6a7e5810 100644 --- a/webapp/src/components/game/singleplayer/LobbyGameSinglePlayer.tsx +++ b/webapp/src/components/game/singleplayer/LobbyGameSinglePlayer.tsx @@ -45,7 +45,7 @@ const LobbyGame: FC = ({setPlayers, players, setCurrentStage, is {players.map((player, index) => (
      {player.username} -

      {player.username}

      +

      {player.username}

      {t('lobby_single_player_total_points')}{player.points}

      {player.isBot && ( diff --git a/webapp/src/components/game/singleplayer/game.test.js b/webapp/src/components/game/singleplayer/game.test.js index 62a1f072..38c6472e 100644 --- a/webapp/src/components/game/singleplayer/game.test.js +++ b/webapp/src/components/game/singleplayer/game.test.js @@ -55,9 +55,9 @@ describe('GameSinglePlayer component', () => { }; Object.defineProperty(window, 'localStorage', { value: localStorageMock }); - const { getByText } = render(); + const { getByTestId } = render(); // Expect error message to be rendered - expect(getByText('Error')).toBeInTheDocument(); + expect(getByTestId("game_single_player_error")).toBeInTheDocument(); }); }); diff --git a/webapp/src/components/game/singleplayer/lobby.test.js b/webapp/src/components/game/singleplayer/lobby.test.js index 018fa2aa..924cc5e0 100644 --- a/webapp/src/components/game/singleplayer/lobby.test.js +++ b/webapp/src/components/game/singleplayer/lobby.test.js @@ -43,7 +43,7 @@ describe('LobbyGame component', () => { }); it('adds a bot player correctly', () => { - const { getByTestId, getAllByText } = render( + const { getByTestId, getAllByTestId } = render( { fireEvent.click(addBotButton); // Find all elements that contain the text "Bot" - const botElements = getByTestId('player'); + const botElements = getAllByTestId('player-item'); // Check if at least one element containing "Bot" text is found expect(botElements.length).toBeGreaterThan(1); diff --git a/webapp/src/components/group/GroupCreationModal.tsx b/webapp/src/components/group/GroupCreationModal.tsx index 40ea16ce..6df262b6 100644 --- a/webapp/src/components/group/GroupCreationModal.tsx +++ b/webapp/src/components/group/GroupCreationModal.tsx @@ -21,8 +21,6 @@ export const CreationModal = (props: ActionProps) => { const createGroup = async () =>{ try{ - console.log("Public?"); - console.log(isPublic); await axios.post(`${apiEndpoint}/createGroup`, { groupName, creatorUUID, description, isPublic }).then( res => { props.nowHasGroup(); }); diff --git a/webapp/src/components/group/GroupTable.tsx b/webapp/src/components/group/GroupTable.tsx index 69efa3e8..4ac519a0 100644 --- a/webapp/src/components/group/GroupTable.tsx +++ b/webapp/src/components/group/GroupTable.tsx @@ -30,17 +30,14 @@ export const GroupTable = (props: TableProps) => { const { t } = useTranslation(); const aFunction = async ()=>{ await axios.get(`${apiEndpoint}/getGroup/`+props.groupUUID).then(res => { - console.log(res.data); members = []; numberMembers=0; total = 0; - console.log(res.data); for(let member of res.data.members){ let memberRole = t('group_table_member'); if(member.uuid === res.data.admin.uuid){ memberRole = t('group_table_leader'); } - console.log(memberRole); members.push({ username : member.username, totalScore : member.totalScore, @@ -49,7 +46,6 @@ export const GroupTable = (props: TableProps) => { total += +member.totalScore; numberMembers++; } - console.log(members); adminUUID = res.data.admin.uuid; groupName = res.data.groupName; members.sort((member) => (+member.totalScore)); @@ -62,7 +58,6 @@ export const GroupTable = (props: TableProps) => { const expelledUUID = JSON.stringify(localStorage.getItem("userUUID")).replace("\"", "").replace("\"", ""); await axios.post(`${apiEndpoint}/leaveGroup`, { expelledUUID, groupName, adminUUID}).then( res => { props.nowHasNoGroup(); - console.log(res); // add only groups that are public }) } catch (error:any) { diff --git a/webapp/src/components/group/NoGroup.tsx b/webapp/src/components/group/NoGroup.tsx index e61a28a0..66d20792 100644 --- a/webapp/src/components/group/NoGroup.tsx +++ b/webapp/src/components/group/NoGroup.tsx @@ -55,11 +55,9 @@ const NoGroup = (props: ActionProps) => // new array here so in case it is chared twice it doesn't contain dupllicate data groups = []; for(let group of res.data){ - console.log("Group:"+JSON.stringify(group)); let isPublic = JSON.stringify(group.isPublic).replace("\"", "").replace("\"", ""); // add only groups that are public if(isPublic === "true"){ - console.log(group.members); let theNumMembers = group.members.length; groups.push({ groupName : group.groupName, @@ -72,8 +70,7 @@ const NoGroup = (props: ActionProps) => groupsCharged = true; }) } catch (error:any) { - console.log("error: "+error); - setError(error.response.data.error); + setError(error.response.data.error); } } diff --git a/webapp/src/components/login/Login.tsx b/webapp/src/components/login/Login.tsx index 5265b968..8b105c8d 100644 --- a/webapp/src/components/login/Login.tsx +++ b/webapp/src/components/login/Login.tsx @@ -20,8 +20,6 @@ const Login = (props: ActionProps) => { //const apiEndpoint = 'http://conoceryvencer.xyz:8000' const apiEndpoint = process.env.REACT_APP_API_ENDPOINT; - console.log(apiEndpoint); - const handleReturnButtonClick = () => { document.title = "Conocer y Vencer"; props.goBack(); @@ -33,7 +31,6 @@ const Login = (props: ActionProps) => { localStorage.clear(); const user = await axios.post(`${apiEndpoint}/login`, { username, password }); - console.log(user); localStorage.setItem("username", user.data.username); localStorage.setItem("score", user.data.totalScore); localStorage.setItem("nWins", user.data.nWins); From 9a76df01652c2b9714ca9aa0e1b829f02ca68d77 Mon Sep 17 00:00:00 2001 From: CarolinaUniovi Date: Sat, 27 Apr 2024 18:17:14 +0200 Subject: [PATCH 71/71] nav test passing --- webapp/src/common/Nav.test.js | 27 ++++++++------------------- 1 file changed, 8 insertions(+), 19 deletions(-) diff --git a/webapp/src/common/Nav.test.js b/webapp/src/common/Nav.test.js index 722402c1..d5f9caa6 100644 --- a/webapp/src/common/Nav.test.js +++ b/webapp/src/common/Nav.test.js @@ -1,24 +1,23 @@ import React from 'react'; import { render, fireEvent, getByTestId } from '@testing-library/react'; -import { MemoryRouter } from 'react-router-dom'; // Importa MemoryRouter +import { BrowserRouter } from 'react-router-dom'; // Importa MemoryRouter import NavBar from './Nav'; describe('NavBar Component', () => { it('should render without crashing', () => { const { getByTestId } = render( - {/* Envuelve el componente en MemoryRouter */} + {/* Envuelve el componente en MemoryRouter */} - + ); const appName = getByTestId('app_name'); // Reemplaza 'app_name' con el texto real del nombre de la aplicación expect(appName).toBeInTheDocument(); }); -/** it('should navigate to "/game" when "Game" button is clicked', () => { const { getByTestId } = render( - + - + ); const gameButton = getByTestId('nav_game'); // Reemplaza 'nav_game' con el botón de juego fireEvent.click(gameButton); @@ -27,25 +26,15 @@ describe('NavBar Component', () => { it('should navigate to "/groups" when "Groups" button is clicked', () => { const { getByTestId } = render( - + - + ); const groupsButton = getByTestId('nav_groups'); // Reemplaza 'nav_groups' con el botón de grupos fireEvent.click(groupsButton); + console.log(window.location.pathname) expect(window.location.pathname).toBe('/groups'); }); - it('should navigate to "/scoreboard" when "Scoreboard" button is clicked', () => { - const { getByTestId: getByTestId } = render( - - - - ); - const scoreboardButton = getByTestId('nav_scoreboard'); // Reemplaza 'nav_scoreboard' con el botón de marcador - fireEvent.click(scoreboardButton); - expect(window.location.pathname).toBe('/scoreboard'); - }); -**/ // Agrega más pruebas similares para los otros botones y funcionalidades del componente NavBar }); \ No newline at end of file