Juego de las Frutas de Mario Party 2

Descripción

Este proyecto es una versión web inspirada en el minijuego de frutas de Mario Party 2, desarrollada con HTML, CSS y JavaScript.

La idea principal es que dos jugadores se turnan para tomar frutas usando un dado que alterna entre 1 y 2. Cada vez que un jugador detiene el dado, suma esa cantidad al total de frutas acumuladas. El peligro aparece cuando el contador llega al panal: el jugador que provoca esa situación pierde automáticamente.

Objetivo del juego

Dos jugadores comparten el mismo contador de frutas y deben turnarse para evitar ser quien active el panal.

Durante la partida:

• cada jugador toma su turno
• el dado gira entre 1 y 2
• el jugador decide cuándo detenerlo
• el valor obtenido se suma al total de frutas
• si el total llega al límite del panal, ese jugador pierde

El juego mezcla azar, lectura del turno y pequeñas decisiones de riesgo dentro de una mecánica muy sencilla.

Tecnologías utilizadas

• HTML5 
• CSS3 
• JavaScript 

Explicación del archivo HTML

El archivo index.html contiene la estructura principal del juego. Su función es organizar visualmente todos los elementos que intervienen en la partida.

Elementos principales del HTML

Encabezado del juego

• título del proyecto
• subtítulo descriptivo
• panel de estadísticas generales

Panel de estadísticas

• frutas actuales
• jugador en turno
• estado de la partida

Panel de jugadores

• tarjeta del Jugador 1
• tarjeta del Jugador 2
• marcador de victorias de cada uno

Zona de mensajes

• mensajes de estado
• aviso del turno actual
• resultado final de cada partida

Tablero de progreso

• celdas que representan las frutas acumuladas
• celda final del panal como punto de derrota

Zona del dado

• ventana visual del dado
• botones para:
• girar
• detener
• reiniciar partida

El HTML define toda la base visual y estructural del juego, mientras que JavaScript modifica dinámicamente los valores y estados de la interfaz.

Explicación del archivo CSS

El archivo style.css define toda la apariencia visual del proyecto.

Qué controla el CSS

• fondo general del juego
• paneles y tarjetas informativas
• estilo del tablero de frutas
• apariencia del panal
• diseño visual del dado
• resaltado del jugador en turno
• botones de control
• colores de mensajes de estado

Objetivo visual

Se buscó una interfaz clara, colorida y fácil de leer, con una presentación ligera y accesible que recordara al tono de un minijuego de tablero.

El sistema visual también ayuda a entender rápidamente:

• cuántas frutas se han acumulado
• quién está jugando
• cuándo la partida ha terminado

Explicación del archivo JavaScript

El archivo script.js contiene toda la lógica principal del juego.

Funciones más importantes del JavaScript

1. Control del contador de frutas

El sistema mantiene un total acumulado compartido entre los dos jugadores. Cada valor obtenido del dado se suma al mismo contador.

2. Sistema de turnos

El juego alterna automáticamente entre:

• Jugador 1
• Jugador 2

Después de cada jugada válida, si el panal no fue activado, el turno cambia al otro jugador.

3. Dado dinámico

El dado no usa una tirada aleatoria tradicional, sino que alterna rápidamente entre:

• 1
• 2

Cuando el jugador pulsa el botón de detener, se toma el valor que estaba visible en ese momento.

4. Validación de derrota

Después de sumar frutas, el sistema comprueba si el total alcanzó o superó el límite del panal. Si esto sucede:

• el jugador actual pierde
• el otro jugador gana
• la partida termina

5. Actualización de marcadores

El juego registra:

• frutas actuales
• victorias del Jugador 1
• victorias del Jugador 2
• turno actual
• estado de la partida

6. Resaltado visual del turno

La interfaz marca visualmente al jugador activo para que siempre quede claro quién debe jugar en ese momento.

7. Reinicio de partida

Se puede reiniciar la partida sin recargar la página. Esto vuelve a dejar:

• frutas en cero
• turno del Jugador 1
• juego activo
• dado listo para una nueva ronda

Flujo general del juego

1. La partida comienza con 0 frutas acumuladas.
2. El Jugador 1 pulsa el botón para girar el dado.
3. El dado alterna entre 1 y 2.
4. El jugador detiene el dado y se suma el valor obtenido.
5. Si el total no llega al panal, el turno pasa al siguiente jugador.
6. Si el total alcanza el panal, el jugador actual pierde.
7. El marcador se actualiza y la partida puede reiniciarse.

Estado actual del proyecto

Actualmente el juego incluye:

• modo para dos jugadores
• dado funcional con valores 1 y 2
• contador compartido de frutas
• condición de derrota al llegar al panal
• cambio automático de turnos
• resaltado visual del jugador activo
• marcador de victorias por jugador
• botón de reinicio de partida

Posibles mejoras futuras

Estas son algunas extensiones posibles del proyecto:

• agregar sonidos al girar y detener el dado
• añadir animaciones más marcadas al panal
• permitir personalizar nombres de jugadores
• implementar varias rondas dentro de un mismo encuentro
• mostrar estadísticas históricas de victorias
• guardar resultados en localStorage
• incluir una IA para jugar en modo de un solo jugador
• mejorar la presentación visual del dado con una animación más elaborada

Ejecución

Para jugarlo, basta con abrir el archivo index.html en un navegador compatible.

No requiere instalación ni dependencias externas.