13 ‐ Problemas encontrados y soluciones aplicadas - martaarevalo/HoraDelBocata_ProyectoSintesis GitHub Wiki

🧱 Problema 1: Colisiones en la escena Lake

Descripción: En la escena Lake, el mapa estaba formado por 3 capas: Suelo, Agua y Objetos. Queríamos que Jake colisionase contra el agua y por lo tanto no pudiese pisarla y para ello íbamos a usar la capa Agua como límites. Pero las casillas de agua se extendían más allá de las casillas que queríamos delimitar por la manera en la que las estábamos usando para rellenar todos los huecos entre píxeles, provocando que Jake no pudiera caminar por zonas en las que sí debería poder.

Solución: Creamos una nueva capa llamada Boundaries, compuesta por casillas invisibles que, aunque no se ven en pantalla, Phaser las detecta como obstáculos. Esta capa nos permitió definir de forma precisa los límites del terreno transitable, manteniendo la separación entre el aspecto visual y la lógica de colisión.

🗺️ Problema 2: Colisiones en la escena Mapa

Descripción: En la escena Mapa, que representa un mapa literal del mundo del juego, necesitábamos impedir que el jugador saliera de los bordes del mapa. Además, el mapa incluye una sección secundaria (similar a cómo se representan las Islas Canarias en los mapas de España), y queríamos que cada área tuviera sus propios límites de colisión. El reto era que Phaser no aplicaba correctamente las colisiones cuando el jugador se movía entre áreas con diferentes zonas de colisión.

Solución: Implementamos dos capas independientes de Boundaries invisibles, una para el área principal del mapa y otra para la sección secundaria. Activamos ambas capas simultáneamente, lo cual nos permitió gestionar las colisiones de forma separada según la zona en la que se encontraba el jugador. Descubrimos que Phaser solo activa las colisiones de una capa cuando el jugador está fuera de ella, así que esta doble capa resolvió la transición entre zonas manteniendo la lógica de colisiones intacta.

🔔 Problema 3: Acumulación de event listeners en los modales

Descripción: Los menús del juego se presentan en modales HTML que reutilizan siempre los mismos div, independientemente de la escena activa. Sin embargo, los botones de estos modales dependen de la escena actual, y cada vez que se instanciaba una nueva escena, se añadían nuevos event listeners al mismo botón, provocando que se ejecutaran múltiples acciones y generando errores.

Solución: Creamos una función que verifica si un botón ya tiene un event listener, y en tal caso elimina el anterior antes de asignar uno nuevo. Esta función se llama automáticamente en el método create() de cada escena a través de la clase padre BaseScene, garantizando que los botones siempre tengan un único listener activo, coherente con la lógica de la escena actual.

🕹️ Problema 4: El jugador podía moverse mientras el menú estaba abierto

Descripción: Abrir un modal no desactivaba el control del jugador, por lo que era posible seguir moviéndose o interactuando con el juego mientras el menú estaba visible, lo cual resultaba en una experiencia confusa y generaba errores.

Solución: En la clase BaseScene implementamos los métodos disableControls() y enableControls(), que permiten especificar qué teclas deben desactivarse al abrir un modal, y volver a activarlas al cerrarlo. Esto asegura que el jugador no pueda moverse mientras navega por un menú, ofreciendo una experiencia más fluida y controlada.