diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index f04c212..7c588ad 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -166,4 +166,4 @@ jobs: wget https://raw.githubusercontent.com/arquisoft/wiq_es04d/master/docker-compose.yml -O docker-compose.yml wget https://raw.githubusercontent.com/arquisoft/wiq_es04d/master/.env -O .env docker compose --profile prod down - docker compose --profile prod up -d --pull always + docker compose --profile prod up -d --pull always \ No newline at end of file diff --git a/webapp/e2e/steps/register-form.steps.js b/webapp/e2e/steps/register-form.steps.js index b49a623..ba97d15 100644 --- a/webapp/e2e/steps/register-form.steps.js +++ b/webapp/e2e/steps/register-form.steps.js @@ -26,7 +26,7 @@ defineFeature(feature, test => { let password; given('An unregistered user', async () => { - username = "pablo" + username = "ProbandoV1" password = "pabloasw" await expect(page).toClick("a", { text: "Don't have an account? Register here." }); }); diff --git a/webapp/src/components/pages/Jugar.js b/webapp/src/components/pages/Jugar.js index e91160a..dd6310e 100644 --- a/webapp/src/components/pages/Jugar.js +++ b/webapp/src/components/pages/Jugar.js @@ -1,4 +1,4 @@ -import React, { useContext, useState, useEffect } from "react"; +import React, {useContext, useState, useEffect, useCallback} from "react"; import { useNavigate } from 'react-router-dom'; import { AuthContext } from '../../AuthContext'; import "./Jugar.css"; @@ -6,7 +6,7 @@ import axios from 'axios'; // Configuración inicial y datos const INITIAL_TIMER = 20; - +const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; @@ -35,53 +35,34 @@ function Jugar() { ] }]); - const getQuestions = async() => { - try { - console.log("Requesting random questions to " + apiEndpoint); - const response = await axios.get(`${apiEndpoint}/getquestions`); - console.log(response); - setQuestions(response.data); - setQuestionsLoaded(true); - } catch (error) { - console.error('Error getting questions', error); - } - } useEffect(() => { + const getQuestions = async () => { + try { + console.log("Requesting random questions to " + apiEndpoint); + const response = await axios.get(`${apiEndpoint}/getquestions`); + console.log(response); + setQuestions(response.data); + setQuestionsLoaded(true); + } catch (error) { + console.error('Error getting questions', error); + } + }; + if (!isLoggedIn) { navigate('/login'); } else { getQuestions(); } - }, [isLoggedIn, navigate]); + }, [isLoggedIn, navigate]); // Asegúrate de incluir apiEndpoint en las dependencias si su valor puede cambiar. - useEffect(() => { - if (!quizFinished && questionsLoaded) { - const countdown = setInterval(() => { - setTimer((prevTimer) => { - if (prevTimer === 1) { - handleNextQuestion(true); // Agrega un indicador de que el cambio fue por tiempo - return INITIAL_TIMER; - } - return prevTimer - 1; - }); - }, 1000); - return () => clearInterval(countdown); - } - }, [quizFinished, questionsLoaded, currentQuestionIndex, timer]); - - const handleAnswerSelect = (index) => { - setSelectedAnswerIndex(index); - }; - const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000'; - - const handleNextQuestion = (timeExpired = false) => { + const handleNextQuestion = useCallback((timeExpired = false) => { setTimer(INITIAL_TIMER); if (selectedAnswerIndex !== null || timeExpired) { const isCorrect = - selectedAnswerIndex !== null && - questions[currentQuestionIndex].answers[selectedAnswerIndex]?.correct; + selectedAnswerIndex !== null && + questions[currentQuestionIndex].answers[selectedAnswerIndex]?.correct; if (isCorrect) { setCorrectAnswers(correctAnswers + 1); } @@ -90,23 +71,45 @@ function Jugar() { setCurrentQuestionIndex(currentQuestionIndex + 1); setSelectedAnswerIndex(null); } else { - //Finaliza el quiz + // Finaliza el quiz setQuizFinished(true); - //Guardamos en el historial los datos de la partida + // Guardamos en el historial los datos de la partida axios.post(`${apiEndpoint}/savehistory`, { username: username, - NumPreguntasJugadas: questions.length, // Número total de preguntas jugadas (la longitud de la matriz de preguntas) - NumAcertadas: correctAnswers, // Número de preguntas respondidas correctamente + NumPreguntasJugadas: questions.length, + NumAcertadas: correctAnswers, }) - .then(response => { - console.log(response.data); // Mensaje de confirmación del servidor - }) - .catch(error => { - console.error('Error al guardar el historial:', error); + .then(response => { + console.log(response.data); + }) + .catch(error => { + console.error('Error al guardar el historial:', error); + }); + } + }, [currentQuestionIndex, selectedAnswerIndex, correctAnswers, questions, username]); + + + useEffect(() => { + if (!quizFinished && questionsLoaded) { + const countdown = setInterval(() => { + setTimer((prevTimer) => { + if (prevTimer === 1) { + handleNextQuestion(true); // Agrega un indicador de que el cambio fue por tiempo + return INITIAL_TIMER; + } + return prevTimer - 1; }); + }, 1000); + return () => clearInterval(countdown); } + }, [quizFinished, questionsLoaded, currentQuestionIndex, timer, handleNextQuestion]); + + const handleAnswerSelect = (index) => { + setSelectedAnswerIndex(index); }; + + const videoSource = quizFinished ? "/videos/celebracion.mp4" : "/videos/question.mp4"; // Renderizado del componente return (