Snakewatch es una aplicación web dedicada al videojuego de la serpiente o Snake en versión online y multijugador.
Concretamente, Snakewatch Server es es la aplicación web que sirve el front end y mantiene en ejecución un back end para gestionar peticiones.
El proyecto está desarrollado dentro de la asignatura de Ingeniería Web del Grado en Ingeniería Informática de la Universidad Complutense de Madrid, y utiliza tecnologías como Spring, Maven y Thymeleaf.
Índice de contenidos
- Snakewatch Server
- Propuesta de proyecto
- Funcionalidad
- Funcionalidad de gestión de acceso, usuarios y roles
- Funcionalidad de amistad entre usuarios
- Funcionalidad de clasificaciones o rankings
- Funcionalidad de base de juego
- Funcionalidad de multijugador en juego
- Funcionalidad de salas o rooms de juego
- Funcionalidad de reporte de usuarios
- Funcionalidad de niveles de juego
- Funcionalidad de skins de juego
- Vistas
- Documentación del proyecto
- Desarrollo
- Referencias, cheat sheets y shortcuts
Autores
- Daniel Marín Irún
- Juan Carrión Molina
- Mohamed Ghanem
- Óscar Caro Navarro
- Óscar Molano Buitrago
En resumen, la dinámica del juego consiste en que el jugador controla una criatura larga y delgada, similar a una serpiente, que se mueve sobre un plano delimitado recogiendo alimentos. El jugador debe evitar que la serpiente se golpee contra su propia cola o contra las paredes que delimitan el plano.
Se pueden obtener más detalles en la página de Wikipedia de la serpiente.
¿Viciado al Elden Ring o al God of war Ragnarök? Si eres más de clásicos, ¡estás de suerte! Con Snakewatch podrás jugar al mítico y legendario Snake con tus amigos. Gracias a su entorno multijugador, la partida se sincronizará para que luchéis por ver quién es el amo del mapa. ¡Sé el último en sobrevivir y álzate con la victoria!
Estado: ✅ funcionalidad implementada
☕ Clases Java relacionadas:
User
,SecurityConfig
,LoginSuccessHandler
,IwUserDetailsService
📄 Ficheros JavaScript relacionados: (...)
A partir de la base proporcionada para la asignatura, se ha construido la funcionalidad de gestión de acceso, usuarios y roles.
Roles de usuario
- Usuario invitado o guest:
- Solo podrá ver las páginas públicas.
- Con respecto a la lógica de juego, solo podrá unirse a una sesión existente y no podrá alojar la suya propia. No tendrá acceso a ninguna de las características secundarias, como equipar skins o aparecer en los rankings. No se guardará su información.
- Usuario registrado:
- Poseerá un perfil propio persistente.
- Con respecto a la lógica de juego, podrá crear una sesión, participar en las clasificaciones o rankings, personalizar pieles o skins, consultar historiales de partidas, reportar a usuarios y configurar su cuenta.
- Usuario espectador:
- Pueden observar el desarrollo de una partida, ya sean invitados o registrados.
- Administrador:
- Tienen la capacidad de gestionar la plataforma, ver reportes y, especialmente, de actuar ante reportes de usuarios.
📝 Pendiente (TODO): crear página de registro.
📝 Pendiente (TODO): mostrar mensajes de error en los formularios de inicio de sesión y registro.
Estado: ✅ funcionalidad implementada
☕ Clases Java relacionadas: (...)
📄 Ficheros JavaScript relacionados: (...)
Estado: ✅ funcionalidad implementada
☕ Clases Java relacionadas: (...)
📄 Ficheros JavaScript relacionados: (...)
Estado: ✅ funcionalidad implementada
☕ Clases Java relacionadas: (...)
📄 Ficheros JavaScript relacionados: (...)
Estado: 🚧 funcionalidad en proceso de implementación
☕ Clases Java relacionadas: (...)
📄 Ficheros JavaScript relacionados: (...)
Estado: 🚧 funcionalidad en proceso de implementación
☕ Clases Java relacionadas: (...)
📄 Ficheros JavaScript relacionados: (...)
📝 Pendiente (TODO): crear nuevas salas.
📝 Pendiente (TODO): permitir al administrador de la sala comenzar una nueva partida.
📝 Pendiente (TODO): implementar estado de "espera" para las salas, anterior al juego en sí.
📝 Pendiente (TODO): lógica de salas privadas.
Estado: 📅 funcionalidad planificada
☕ Clases Java relacionadas: (...)
📄 Ficheros JavaScript relacionados: (...)
Estado: 📅 funcionalidad planificada
☕ Clases Java relacionadas: (...)
📄 Ficheros JavaScript relacionados: (...)
📝 Pendiente (TODO): añadir muros al juego.
📝 Pendiente (TODO): cargar el nivel correspondiente desde la pestaña de niveles.
📝 Pendiente (TODO): crear niveles por defecto.
📝 Pendiente (TODO): permitir al admin subir nuevos niveles como ficheros JSON.
Estado: 📅 funcionalidad planificada
☕ Clases Java relacionadas: (...)
📄 Ficheros JavaScript relacionados: (...)
⚠️ Sección pendiente de actualización
La pantalla de lobby es la pantalla de inicio del juego, donde un usuario una vez se ha registrado en la aplicación web podrá seleccionar como desee jugar, si multijugador (play online) o un jugador solo (levels), así como observar otras partidas (spectate). También podrá acceder a su perfil, a los rankings o en caso de ser administrador a la pantalla de administrador.
La pantalla de perfil incluirá el perfil del usuario con su respectivo nombre y foto de perfil, así como los amigos que tiene, el número total de partidas jugadas y ganadas y un historial con las partidas recientes.
La pantalla de niveles es la pantalla de un solo jugador, en la que el usuario podrá seleccionar el nivel al que desee jugar, donde habrá distintas dificultades por nivel, al seleccionar el nivel tendrá que superar la dificultad que incluya dicho nivel.
La pantalla de administrador únicamente será accesible para aquellos usuarios con el rol de administrador, en la cual se incluirá una lista de aquellos usuarios que han sido reportados donde el administrador podrá ver el motivo de su reporte y si banea o no a dicho usuario.
La pantalla de juego es la pantalla de multijugador donde varios jugadores podrán entrar a jugar simultáneamente, se enfrentarán entre ellos y ganará aquel que sea el último en quedar de pie.
La pantalla de rankings mostrará un top con los 100 mejores jugadores del juego o lo que es lo mismo, los jugadores que hayan ganado más veces en el modo de juego multijugador. Se mostrará el nombre del usuario junto a las victorias conseguidas y la posición que ocupa en el top.
Diagrama pseudo-UML de clases de Java de Spring Boot
Este diagrama muestra, de forma resumida y con un formato parecido a UML, la funcionalidad de las clases de configuración y arranque de Spring Boot utilizadas en el proyecto.
Diagrama pseudo-UML de clases de Java del dominio
Diagrama pseudo-UML de clases de Java de controladores y lógica
Se ha seguido la plantilla de la asignatura en cuanto a implementar la lógica de servicios dentro de los controladores.
Diagrama pseudo-UML de la lógica de JavaScript en el cliente
El proyecto de Java se basa en las siguientes dependencias:
- Spring Boot
- Thymeleaf
- Spring Security
- Base de datos H2
- Anotaciones Lombok
- Karate para pruebas
- JSON
- Java Bean Validation API
La lógica de JavaScript en el cliente se basa en las siguientes dependencias:
Para el desarrollo en equipo, se ha utilizado Visual Studio Code como editor. Como sistema de control de versiones, se ha utilizado Git o, más concretamente, GitHub. De GitHub también se ha utilizado la herramienta de proyectos para realizar la planificación y la distribución de tareas.
Además, se han utilizado las siguientes extensiones de VS Code:
- Extension Pack for Java:
- Language Support for Java(TM) by Red Hat (se ha usado también para formatear el código)
- Debugger for Java
- Test Runner for Java
- Maven for Java
- Project Manager for Java
- IntelliCode
- Spring Boot Extension Pack
- Lombok Annotations Support for VS Code
- Checkstyle for Java
- SonarLint
- Live Share
- Markdown All in One
Ejecutar tests del proyecto:
$ mvn test
- Official Apache Maven documentation: https://maven.apache.org/guides/index.html
- Spring Boot Maven Plugin Reference Guide: https://docs.spring.io/spring-boot/docs/2.6.3/maven-plugin/reference/html/
- Create an OCI image: https://docs.spring.io/spring-boot/docs/2.6.3/maven-plugin/reference/html/#build-image
- Spring Web: https://docs.spring.io/spring-boot/docs/2.6.3/reference/htmlsingle/#boot-features-developing-web-applications
- WebSocket: https://docs.spring.io/spring-boot/docs/2.6.3/reference/htmlsingle/#boot-features-websockets
- Spring Data JPA: https://docs.spring.io/spring-boot/docs/2.6.3/reference/htmlsingle/#boot-features-jpa-and-spring-data
- Spring Security: https://docs.spring.io/spring-boot/docs/2.6.3/reference/htmlsingle/#boot-features-security
- Building a RESTful Web Service: https://spring.io/guides/gs/rest-service/
- Serving Web Content with Spring MVC: https://spring.io/guides/gs/serving-web-content/
- Building REST services with Spring: https://spring.io/guides/tutorials/bookmarks/
- Using WebSocket to build an interactive web application: https://spring.io/guides/gs/messaging-stomp-websocket/
- Accessing Data with JPA: https://spring.io/guides/gs/accessing-data-jpa/
- Securing a Web Application: https://spring.io/guides/gs/securing-web/
- Spring Boot and OAuth2: https://spring.io/guides/tutorials/spring-boot-oauth2/
- Authenticating a User with LDAP: https://spring.io/guides/gs/authenticating-ldap/
- Handling Form Submission: https://spring.io/guides/gs/handling-form-submission/
H2 Console
Acceso a H2 Console desde http://localhost:8080/h2/
.
Importación en el arranque
A través de un import.sql
.
- Ant tasks for schema creation and documentation: https://developer.jboss.org/docs/DOC-14011
- Using Hibernate import.sql: http://christopherlakey.com/articles/import-sql.html