Aplicación CRUD del Diario del Cazador del videojuego Hollow Knight. Es una base de datos que alberga información de todos los enemigos de ese videojuego. En ella se podrán insertar, borrar o editar datos.
"Aventúrate en las profundidades de esta tierra y dale muerte a las bestias. Demuestra que eres digno de llevar la marca del cazador"
Lo primero que vemos al abrir la aplicación es esta página, un "login" en el que como usuarios podremos iniciar sesión. Probemos a darle al botón enviar sin rellenar el formulario de entrada.
Podemos ver como necesitamos rellenar el formulario para continuar si es que pulsamos el botón enviar. En todo el programa cada formulario con un asterisco será obligatorio de rellenar. Podemos crear un nuevo usuario con el botón "Registrarse" o entrar como invitado dándole al respectivo botón. Hagamos esto último.
Nos encontramos con la página principal. En ella podemos consultar los datos de los enemigos que ya se encuentran en la base de datos. Veamos cada uno de los elementos de ella.
En la parte superior tenemos una imagen de perfil genérica junto a dos enlaces, uno que nos enviará a la página de registro de usuarios y otra que nos devolverá al login del principio. Cuando entremos como usuario registrado veremos como cambia.
A continuación tenemos la tabla donde se encuentran los datos de los enemigos del juego. Por cada enemigo tenemos su nombre, una imagen suya, una descripción del mismo, su zona de apararición, si es un boss o no (Un boss o jefe es el enemigo final de una zona o simplemente un enemigo más poderoso que el resto), si lo es, pondrá "Sí", si no, "No".
Si dejamos el cursor sobre el nombre de una zona nos aparecerá en forma de tooltip la descripción de la misma.
Después de la columna "Boss" tenemos dos columnas más, la columna "Editar" y la columna "Borrar". Cada una alberga un botón por cada enemigo que al pulsar ejecutará un evento distinto. Si pulsamos un botón verde como invitado aparecerá la página de registro de usuario, ya que a menos que estemos registrados no podemos modificar datos de enemigos.
Si pulsamos un botón rojo como invitado en la página principal, nos aparecerá un modal indicando que necesitamos permisos de administrador para borrar los datos de un enemigo.
Ahora bajemos hasta el final de la página, nos encontraremos esto:
Si pulsamos ese botón como invitado, al igual que con el botón de editar enemigo, iremos a la página de registro de usuario, y ya que nos encontramos en ella, registraremos un usuario.
En este caso hemos seleccionado una foto de perfil pero podríamos perfectamente no poner una si no indicamos nada distinto a la opción seleccionada por defecto en el desplegable, y nuestro usuario tendrá asignada la misma foto de perfil que le aparece a un usuario invitado.
El valor de la fecha de nacimiento originalmente era del tipo date en la base de datos, pero debido a que el formato del navegador es distinto al formato de phpadmin y genera conflicto al añadir los datos.
Cuando hemos rellenado todos los datos necesarios para registrar al usuario, le damos al botón "Registrarse". El botón "Cancelar" nos devolverá a la página de inicio. Al darle al botón "Registrarse" los datos se enviarán a la página insertausuario.jsp, que contiene la siguiente función para añadirla a la base de datos
y nos aparecerá una página con el siguiente mensaje:
Pulsamos el botón, volvemos a la página de inicio, rellenamos el formulario con los datos del nuevo usuario y le damos a "Enviar".
Nos aparece la página principal, con neustro nombre de usuario y nuestra foto de perfil en la parte superior, junto con un "Cerrar Sesión". Ahora si podemos añadir o modificar enemigos.
Bajemos hasta el fondo de la página y pulsemos en "Añadir enemigo". Nos aparecerá este formulario.
Añadiremos los siguiente datos:
-
Nombre: Hollow Knight
-
Descripción: Receptáculo adulto que encierra al corazón de la plaga en su cuerpo.
-
Zona: Cruces Olvidados
-
¿Es Boss?: Sí
Le damos a "Añadir" para añadir los datos del enemigo a la base de datos y "Cancelar" para volver a la página principal, al darle a "Añadir se enviarán los datos a la página insertar.jsp que contiene la siguiente función para añadirla a la base de datos.
y nos aparecerá una página con el siguiente mensaje:
Al volver a la página principal podemos ver al nuevo enemigo añadido.
Ahora modifiquemos la descripción y añadamos la siguiente
- Descripción: El antiguo Rey de Hallownest... llegó a tomar medidas desesperadas para salvar su pequeño mundo. Obligó a muchos a realizar tremendos sacrificios... y todo para nada.
El botón "Modificar" modificará los datos del enemigo, y el botón "Cancelar" nos devolverá a la página principal, al darle a "Modifcar"r se enviarán los datos a la página editar.jsp que contiene la siguiente función para añadirla a la base de datos
y nos aparecerá una página con el siguiente mensaje:
Podemos ver al volver a la página principal los datos modificados.
Pero ahora si le damos a borrar enemigo, nos aparecerá el mismo mensaje que cuando entramos a la página como invitado.
Para borrar los datos del enemigo, necesitaremos iniciar sesión con un usuario administrador, por lo que le daremos a "Cerrar Sesión" y volveremos a la página de inicio. Para cerrar la sesión en index.jsp al principio declararemos todas las variables de sesión como null, y ya después en el formulario se enviarán los datos introducidos a comprobarusuario.jsp para comprobar si esos datos coinciden con los que haya en la base de datos, en caso contrario se volverá a index.jsp.
Código de index.jsp:
Código de comprobación en comprobarusuario.jsp:
En la página de inicio ponemos el Usuario: admin y Contraseña: root y le damos a "Enviar".
Vemos que el usuario que es administrador tiene una estrella junto a su nombre. Busquemos el enemigo que antes no pudimos borrar y demósle al botón de borrado.
Vemos que el mensaje cambia, ahora aparece el botón "Borrar" dentro del modal. Si le damos se enviará el id del enemigo (que está oculto) a borrar.jsp nos aparecerá el seguiente mensaje
y se ejecutó la siguiente función:
Al volver a la página principal nos encontraremos con que el enemigo ya no aparece.
Nota: las imágenes de los enemigos aparecen gracias a que tienen el mismo nombre que los enemigos. La imagen de Hollow Knight aparece porque está guardada en los archivos de la aplicación. Si se intenta añadir otro enemigo no saldrá imagen.
Código Destacado
Consultas SQL de la página principal para mostrar los datos
Código de la navbar que cambia según si entra un usuario registrado o un invitado
Código de la tabla (sin columnas "Editar y "Borrar") donde se muestran los enemigos y sus datos
Código del botón "Añadir", en caso de usuario registrado y de invitado
Código del botón "Modificar", en ambos casos de sesión
ódigo del botón "Borrar" en ambos casos, admin y no admin
Código de los modales que salen al pulsar el botón "Borrar" en ambos casos, admin y no admin
Codigo del formulario para añadir un enemigo
Codigo del formulario para modificar un enemigo
