Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Adición de Ventana Final de Partida #36

Merged
merged 8 commits into from
Mar 6, 2025

Conversation

JavierSanabriaMiranda
Copy link

Se ha implementado la ventana de final de partida por medio de 2 componentes

GameResults

La propia ventana de resultados de la partida que muestra los puntos totales, el historial (reutilizando el componente QuestionAccordion) y el ResultSectorChart

ResultSectorChart

Diagrama de sectores utilizado para mostrar las respuestas correctas, incorrectas y las preguntas sin responder al final de una partida

image

Se ha instalado la librería recharts que permite introducir diagramas en react
Se ha reutilizado el componente QuestionAccordion para mostrar los resultados de la partida recien jugada.
Además se han introducido dos botones que permiten volver a jugar o volver al menú principal.
Tambien se ha introducido algo de estilo en los puntos y en el diagrama de sectores
Se ha implementado la funcionalidad de responder a las preguntas en los componentes Game y AnswerButton.
Cuando el usuario responda a una pregunta se comprobará si esta fue o no correcta, se almacenará el resultado y la propia pregunta con sus poisbles respuestas. Dependiendo del resultado de la respuesta se sumará o no puntos y se actualizará el estado que corresponda de entre los estados "correctAnswers" y "wrongAnswers" en el componente Game.
@@ -15,6 +17,7 @@ const AnswerButton = ({answerText, isCorrectAnswer}) => {
: "answer-button-not-answered";

const handleClick = () => {
answerAction(isCorrectAnswer);
setWasSelected(true);
console.log(`${buttonClassName}`);

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hay una salida por consola , quitarlo para la fase de presentación de la aplicación

};

return (
<ResponsiveContainer width="100%" height={300}>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Asegurarse de que esta altura es adecuada para cualquier tipo de dispositivo

@JavierSanabriaMiranda JavierSanabriaMiranda merged commit 71632f2 into Front-end Mar 6, 2025
1 check failed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants