Acá hay gato encerrado...

Ultimamente se pusieron de moda los juegos de escapismo y cada vez hay mas lugares donde las personas van con un grupo de amigos, se encierran en una habitación y tienen que encontrar la forma de ir pasando de habitaciones hasta lograr "liberarse", ni lerdos ni perezosos nos pidieron que realicemos un sistema que tiene que llamarse: "Acá hay gato encerrado...". La idea atrás de todo esto es armar distintos "laberintos" para que la gente juegue con la misma modalidad que en la vida real!

Contexto

Un laberinto se compone de muchas habitaciones
Siempre hay una única habitación inicial y una única habitación final
En cada habitación se pueden realizar muchas acciones (las que la habitación admita)
Las acciones permitidas las podemos categorizar en:
- moverse a una habitación permitida ==> Cuando nos movemos pasamos a esa habitación
- Agarrar un item (se agrega al inventario) ==> Cada jugador tiene un inventario asociado al laberinto que está queriendo resolver, cuando el juego inicia el inventario está vacío y se va llenando al agarrar items de las habitaciones. El inventario tiene un máximo de 15 items (cada unidad cuenta como un item, por ejemplo si tenemos 2 martillos ocupamos 2 lugares en el inventario)
- Usar item ==> Los items con los que cuenta el jugador en su inventario pueden ser usados, si la habitación admite el uso de un determinado item luego de producirse su uso se habilita otra acción y el item es destruido. Por ejemplo... si usamos la pala en una habitación que lo admitía ahora se habilitará la acción correspondiente (por ejemplo, poder moverse a otra habitación) y se pierde la pala usada (esto hace que se elimine del inventario).
- Salir del laberinto ==> esta acción solo esta disponible en la habitación final, si salimos del laberinto entonces terminamos el nivel! (ganamos!)
Aclaraciones:
- No pueden usarse items no permitidos por las habitaciones, por ejemplo si mi habitación permite usar item: pala (únicamente), seguro que no va a tener efecto alguno usar el item: llave
- No es necesario asegurar que el laberinto tenga solución
- Un laberinto puede ser abandonado por el jugador si decide darse por vencido
- El inventario que posee el jugador está asociado al laberinto que está resolviendo, los items NO pueden compartirse entre laberintos

Ejemplo

Configuraron el siguiente laberinto que se compone de 10 habitaciones:

(El dibujo que sigue es solo a modo de ejemplo para que se entienda el laberinto, no implica que las habitaciones sean cuadradas, linden con esa cantidad de habitaciones necesariamente o tengan exactamente esa cantidad de acciones)

0) Habitación inicial. Tiene como acciones
- Ir a 1
- Ir a 2
1) Tiene como acciones
- ir a 0
- Ir a 3
- Agarrar item: llave mística
2) Tiene como acciones
- Ir a 0
- Agarrar item: piedra
3) Tiene como acciones
- Ir a 1
- Ir a 6
- Usar item: llave mística =habilita=> Ir a 4
4) Tiene como acciones
- Ir a 3
- Ir a 7
- Usar item: piedra =habilita=> Agarrar item punta de pala
5) Tiene como acciones
- Ir a 5
- Agarrar item: clavos
6) Tiene como acciones
- Ir a 3
- Usar item: punta de pala =habilita=> Ir a 9
- Usar item: llave mística =habilita => Ir a 5
7) Tiene como acciones
- Ir a 4
- Agarrar item madera
8) Tiene como acciones
- Ir a 9
- Salir del laberinto
9) Tiene como acciones
- Ir a 6
- Usar item madera =habilita=> Ir a 8

Para que un jugador supere este laberinto bien podría:

Ir a 2
Agarrar piedra
Ir a 0
Ir a 1
Agarrar llave mística
Ir a 3
Usar llave mítica
Ir a 4
Usar piedra
Agarrar punta de pala
Ir a 7
Agarrar madera
Ir a 4
Ir a 6
Usar punta de pala
Ir a 9
Usar madera
Ir a 8
Salir del laberinto

Ayudas para encarar el problema

Para que sea mas simple de entender algunos computines nos regalaron algunas horas de su tiempo y nos ayudaron a masticar un poco el problema, el resultado de lo que estuvieron haciendo es un bosquejo con un poco de inspiración en historias de usuario que dejamos a continuación:

Como administrador del sistema quiero
- crear, modificar y eliminar laberintos
- crear (modificar y eliminar) habitaciones que admitan distintas acciones
  - marcar habitación como inicial
  - marcar habitación como final
  - crear acción de ir a otra habitación
  - crear acción de agarrar un item
  - crear acción de usar un item y definir que acción tiene como consecuencia
Como participante quiero
- elegir un laberinto para poder jugarlo
- realizar acciones disponibles dentro de las habitaciones:
  - moverme a la habitación permitida
  - agarrar un item disponible
  - usar un item permitido
  - salir del laberinto
- conocer el inventario con el que cuento mientras estoy jugando
- abandonar un laberinto
- ver los laberintos que superé y los que abandoné

NOTAS: Es importante darnos cuenta que no es lo mismo un laberinto configurado (listo para que alguien lo juegue) que un laberinto que está siendo recorrido. Los laberintos se recorren por jugador pero el juego de uno no influye en el juego del otro.

Entrega 1: Cliente de escritorio

Nuestro objetivo es tener una aplicación de escritorio que permita al administrador configurar laberintos

NOTA: Las pantallas son sugerencias, pueden modificarlas, pero para este primer trabajo práctico tienen que consultar las modificaciones con alguno de los docentes de la materia.

Sugerencia para realizar el Trabajo Práctico: Realizar todas las pantallas de Agregar acciones y por último realizar la Pantalla Inicial.

Pantalla inicial

Para eso crearemos una pantalla inicial que mostrará el nombre del Administrador (en este caso Juan). Es opcional crear una pantalla previa que permita un loggeo de Usuario.

La pantalla tendrá los laberintos creados en el sistema (en el caso de la primera vez, la lista estará vacía).

Edición: Si el usuario selecciona un laberinto, automáticamente, en el lado derecho aparecerá su nombre y las habitaciones que tiene (si no tiene ninguna habitación, la lista aparecerá vacía). El nombre puede editarse y se reflejará ese cambio inmediatamente en el listado de Laberintos.

Borrado: Si, teniendo un laberinto seleccionado, se clickea el botón "Quitar laberinto", se eliminará el mismo de la lista y todos los campos de la derecha aparecerán vacíos.

Agregado: Cuando el usuario clickea el botón "Agregar laberinto", aparecerá un nuevo elemento en el listado laberintos y su nombre podrá modificarse igual que en la edición.

Las habitaciones funcionarán igual que los laberintos:

Edición: Al seleccionar una habitación, del lado derecho aparecerán todos campos (Nombre, si es habitación inicial, si es habitación final y las acciones) completos permitiendo modificaciones.

Borrado: Si, teniendo una habitación seleccionada, se clickea el botón "Quitar habitación", se eliminará la misma de la lista y todos los campos de la derecha aparecerán vacíos.

Agregado: Cuando el usuario clickea el botón "Agregar habitación", aparecerá un nuevo elemento en el listado "Habitaciones de:" y su nombre podrá modificarse igual que en la edición.

Realizar todos los controles que crean necesarios (por ejemplo: no permitir varias habitaciones finales)

Pantalla de agregar acción

Cuando en la pantalla anterior se clickea el botón "Agregar acción", se abrirá la siguiente pantalla:

La misma cuenta con 3 botones que nos llevarán cada uno a una configuración de cada acción.

Pantalla de agregar acción: Ir a otra habitación

Esta pantalla contará con un desplegable que listará todas las habitaciones actualmente creadas. Una vez que el usuario seleccione la que desea, deberá clickear el botón "Agregar" para efectivamente agregar la acción de ir a la habitación elegida dentro de la habitación seleccionada.

Pantalla de agregar acción: Agarrar un elemento

Esta pantalla contará con un campo que permitirá escribir el elemento que aparecerá. Una vez que el usuario clickee el botón "Agregar", se agregará la acción de agarrar el elemento escrito dentro de la habitación seleccionada.

Pantalla de agregar acción: Usar un elemento

Esta pantalla contará con un desplegable que listará todos los elementos creados en el laberinto hasta ahora (Atención! No deben aparecer elementos de otros laberintos).

El usuario deberá obligatoriamente crear una acción para que se corresponda con lo que habilitará el elemento seleccionado. Para esto tendrá que clickear en el botón "Agregar acción" que abrirá la pantalla de "Agregar acción" (la que permite clickear en los tres botones).

Una vez que el usuario termine de crear la acción se mostrará en este lugar la acción creada.

Cuando el usuario clickee el botón "Agregar", se agregará la acción de Usar el elemento seleccionado habilitando la acción creada dentro de la habitación seleccionada.

Entrega 2: Cliente web + Servidor REST

Nuestro objetivo es tener una página web que permita resolver laberintos

Servidor

La tecnología que usaremos para exponer los servicios es XTRest.

Deben de implementarse los servicios que se mencionan a continuación (siendo opcional el de login) y debemos estar en control de los datos que se envían desde nuestra API, es decir que no enviamos datos de más.

NOTA: Consideramos que un dato está de más cuando no se muestra en la pantalla ni es usado como input de otro servicio

Laberintos:

Invocación: GET
Parámetros: id del Usuario (Si no hay pantalla de login y no cambia el usuario, enviar un Id de usuario conocido)
Respuesta JSON con la lista de Laberintos:
- Cada Laberinto debe tener nombre, id del laberinto, path de la imagen.

Iniciar Laberinto:

Invocación: GET
Parámetros: Id del Usuario, Id del Laberinto
Respuesta JSON con los datos del Laberinto:
- Id del Laberinto (opcional)
- lista de habitaciones
- Cada habitación debe tener
  - id, nombre, lista de acciones, el path a la imagen.
  - Informar de alguna manera, cuál es la habitación inicial y cuál la final.
  - De cada acción necesitamos el Id y el nombre
- Todos los elementos del inventario del Jugador.
- cada elemento debe tener, id, nombre y descripción.

Realizar Acción Habitación:

Invocación: GET
Parámetros: id de la habitación, id de la acción, id de usuario
Respuesta Json
- Resultado de ejecutar la acción:
  - Agarrar un elemento
  - Ir a otra habitación
  - Habilitar otra acción
  - Ganar !!!
  - Nada

Modificaciones posibles:

Mantener el inventario desde el FrontEnd. Esto implicaría que, se debe quitar el elemento usado en una acción del inventario y se debe agregar un elemento agarrado en la habitación sin traer todo el inventario.

Cliente

El Frontend lo vamos a programar en Angular.

Los mockups de pantalla pueden ser modificados a gusto del grupo, lo único que deben respetar es mostrar imágenes junto con el nombre los laberintos y las habitaciones.

Se debe elegir realizar alguna de las dos alternativas propuestas:

Alternativa SPA

Como su nombre lo indica, SPA (Single Page Application), es un sitio web que cuenta con una sola página.

La idea es ir cambiando el contenido de la misma sin cambiar la página en su totalidad.

Selección de Laberinto (lobby)

Desde esta sección podemos ver los laberintos disponibles para jugar y también una descripción de los mismos.

Cambios posibles:

En vez de tener un botón Jugar, seleccionar la foto para entrar al laberinto.

Jugar en habitación

Desde esta sección tenemos que poder realizar las acciones disponibles en una habitación, como así también usar los items que tenemos en el inventario.

Abandonar Laberinto

Cuando se quiere abandonar un laberinto, se muestra una ventana de confirmación.

Ganar Laberinto

Cuando se gana el laberinto debe aparecer una ventana modal que nos informa que ganamos el laberinto y como única acción podemos volver al home.

Cambios posibles:

No necesariamente tiene que ser verde con un botón azul y sin nada de estilo.
Puede ofrecernos volver a jugar el Laberinto.

Alternativa MPA

La alternativa a SPA es Multi Page Application. La idea es que cambia el contenido entero de la página y no solo una parte.

Selección de Laberinto (lobby)

Desde esta página podemos ver los laberintos disponibles para jugar y también una descripción de los mismos. Tener presente que pueden ser más o menos de tres laberintos.

Jugar en habitación

Desde esta página tenemos que poder realizar las acciones disponibles en una habitación, como así también usar los items que tenemos en el inventario.

Cambios Posibles:

La acción de tirar un item puede ser seleccionarlo y luego clickear un botón tirar.

Abandonar Laberinto

Cuando un jugador decide abandonar el laberinto, se muestra esta ventana de confirmación. Si acepta vuelve a la pantalla de seleccionar laberinto. Si cancela no tiene efecto.

Ganar el Laberinto

En vez de mostrar una ventana modal, se abre una nueva pantalla dando las opciones de volver a jugar o ir a la selección de laberinto.

Entrega 3: Cliente mobile

Nuestro objetivo es tener una aplicación mobile que permita visualizar los laberintos y posible y gestionar nuestro inventario.

Para ello debe:

Codificar las pantallas necesarias
Crear los servicios que sean necesario agregar a la api rest actual

Aclaraciones:

Las pantallas son solo un mockup, no es un maquetado final de como debería de quedar (si deben contener los elementos que se describen, pero no es necesario que sea identico a la foto)
Si en el modelo actual mantienen un inventario por Laberinto y no un inventario general el boton para consultar el inventario debe estar en la pantalla de Detalles del laberinto.

Laberintos disponibles

Detalles del laberinto

Gestionar Inventario

Criterios de corrección - Interfaz Desktop: Arena

Condiciones mínimas de aprobación

Test, al menos un tests para las funcionalidades:
- Crear laberinto
- Agregar acción al laberinto
Bindings:
- Labels: al menos un label bien bindeado
- Lista:
  - item seleccionado
  - items posibles
Pantallas
- Crear acciones
- Crear accion usar
- Crear acción agarrar
- Crear acción pasar a otra habitación
Toda la lógica de dominio en el proyecto de dominio, a lo sumo una condición para decidir si abrir una ventana u otro pero nada más
App model en la vista de crear laberinto

OJO: Que no haya código repetido en la vista

Condiciones mínimas de promoción

Inicialización en el objeto application
Pantallas
Crear laberinto
Al menos un buen mensaje de error / notificación

Para el 10

Buen modelado del dominio
- Habitaciones
- Diferentes acciones
Ningún error en ejecución, todo bien anotado con @Observable, los getters y setters bien definidos
Validaciones con bindings sobre propiedades que se actualizan disparando los eventos que correspondan
Sin repetición de lógica en la creación de los componentes visuales
Usar el info de los diálogos o a lo sumo una ventana que muestre un mensaje de error y se pueda cerrar
Trabajar sobre la disposición de los elementos visuales con los layouts

App models en el proyecto de dominio, en un package separado.

Criterios de corrección - Interfaz Web: Angular

Condiciones mínimas de aprobación

Test: al menos un test en el dominio para las funcionalidades
- Jugar un laberinto (iniciar el laberinto y simular jugar)
- Realizar una acción
Bindings:
- Labels: al menos un label bien bindeado
- Lista de laberintos
  - Laberinto seleccionado
    - Cambie el laberinto al jugar
  - Laberintos posibles
    - Ver todos los posibles laberintos para elegir
Pantallas
- Tengan una vista medianamente decente
Toda la lógica de dominio en el proyecto de dominio, a lo sumo una cosita mínima, pero nada más en el controller
Servicios (ambos con los datos pedidos)
- Listado de laberintos: llamar al servicio al entrar
- Jugar un laberinto: llamar al servicio al clickear el botón Jugar
- Mantener los cambios de estado tanto en el modelo como en la vista (ejemplo: al iniciar un laberinto, el laberinto actual del jugador que está en el server es el laberinto seleccionado)
- Que no se mande el objeto de dominio (podría mandar algun dato de más pero seguro no el objeto como viene)

Condiciones mínimas de promoción

Incluye el resultado el del juego: ganaste - perdiste - etc (se informa) con toda la lógica relacionada (en el server)
Las acciones disponibles se muestran bien al cambiar de habitación
Implementación correcta de cambiar habitación / agarrar o usar un item
Los 3 servicios pedidos funcionando correctamente
Mostrar las imágenes del laberinto correctamente

Para el 10

Ningún error en ejecución
Validaciones con mensajes de error bien manejados a través de los servicios
CSS y HTML claros, uso de boostrap (css ++)
Separación en varios controllers