El Usuario puede tomar dos caminos a la hora de seleccionar la película, el cine, y la sesión a la que quiere asistir. La diferencia es puramente
de orden entre la elección de cine y de la película, a conveniencia del usuario; se procede a explicar ambos:
</p>
<p>
1. Selección de Cine -> Selección de Película -> Selección de Sesión -> Reserva de Butacas -> Checkout: Primero se selecciona el cine en la vista de selección
de cines en la que se encuentra un mapa y una lista con los cines de la cadena. Una vez seleccionado el cine se redirigirá al usuario a la vista de selección
de película, con el filtro del cine correspondiente activado, de forma que solo se muestren las películas disponibles en el cine seleccionado. En esa vista se
eligirá la película y la versión a ver (VO, 3D, 4DX, etc).
</p>
<p>
Una vez elegida la película, se redirigirá al usuario a la elección de sesión. Se mostrarán todas las sesiones disponibles y el usuario podrá elegir la sesión y
el número de entradas que quiere reservar, pudiendo ver el precio final de las mismas. Se le llevará a la vista de butacas en donde podrá elegir qué butacas reservar.
</p>
<p>
Una vez elegidas las butacas, el usuario procede a la página de pago, en donde rellenará los datos necesarios para pagar online. Terminada la compra con éxito, se
mostrará una pantalla de "Compra Realizada", dando al usuario la seguridad de que su reserva se ha registrado correctamente. Luego se le redirigirá a la pantalla de
inicio.
</p>
<p>
2. Selección de Película -> Selección de Cine -> Selección de Sesión -> Reserva de Butacas -> Checkout: Es idéntico al flujo anterior pero el usuario empieza eligiendo
la película, de forma que se le redirige a la vista de selección de cine, esta vez con un filtro, de forma que solo se muestran los cines que tengan sesiones activas
con la película seleccionada.
</p>
<p>
Una vez elegidos película y cine, el flujo es idéntico al anterior.
</p>
</fieldset>
<!-- Administrador -->
<fieldset>
<legend>Administrador</legend>
<p>El Administrador es el encargado de gestionar las: películas, cines, promociones, otros administradores y gerentes de cada cine.</p>
<p>Para cada categoría tiene un panel en el que puede seleccionar, a partir de una lista, el elemento que quiere modificar, también hay otro panel al lado, en donde
puede modificar los datos de un elemento ya existente o crear uno nuevo introduciendo datos que no existan en la BD. También hay una opción de Eliminar en caso de que
quiera eliminar un elemento.</p>
<p>También cuenta con un botón de "Vista de Usuario", con el que puede navegar por la página con la vista que tendrá el usuario final.</p>
El Gerente es el encargado de gestionar las sesiones y salas de cada cine. La forma de proceder es la misma que el administrador, con vistas equivalentes.
En el caso de la gestión de salas, se administrarán los asientos disponibles (por temas de Covid-19) y si está o no habilitada para su uso.
<p>En esta zona de la página, el usuario registrado accede a su perfil con sus correspondientes opciones.</p>
</div>
</div>
</fieldset>
</div>
</div>
<br>
<!-- Bocetos Usuario -->
<fieldset>
<legend>VISTA USUARIO</legend>
<divclass="row">
<divclass="column left">
<!-- Pagina inicio -->
<divclass="sketches">
<imgsrc="../img/inicio.png"/>
<divclass="description">
<h4>~ PÁGINA DE INICIO ~</h4>
<p>Pantalla de bienvenida al entrar en la web.</p>
<p>Se mostrará los estrenos con sus sinopsis, las promociones disponibles y el último cine añadido.</p>
</div>
</div>
</div>
<divclass="column left">
<!-- Peliculas -->
<divclass="sketches">
<imgsrc="../img/peliculas.png"/>
<divclass="description">
<h4>~ CARTELERA ~</h4>
<p>Mostrará todas las películas disponibles en base al filtro seleccionado (cine).</p>
</div>
</div>
</div>
</div>
<divclass="row">
<divclass="column left">
<!-- Cines -->
<divclass="sketches">
<imgsrc="../img/cine.png"/>
<divclass="description">
<h4>~ CINES ~</h4>
<p>Mostrará todos los cines disponibles.</p>
</div>
</div>
</div>
<divclass="column left">
<!-- Horario -->
<divclass="sketches">
<imgsrc="../img/selector_horario.png"/>
<divclass="description">
<h4>~ SELECTOR DE HORARIO ~</h4>
<p>Aquí se mostrará todos los horarios disponibles y salas de la película y cine seleccionada.</p>
</div>
</div>
</div>
</div>
<divclass="row">
<divclass="column left">
<!-- Butacas -->
<divclass="sketches">
<imgsrc="../img/mapa_asientos .png"/>
<divclass="description">
<h4>~ SELECTOR DE BUTACAS ~</h4>
<p>Se mostrará los asientos que se van a seleccionar, ocupados y libres, dependiendo de las personas se subirá o bajará el precio. </p>
</div>
</div>
</div>
<divclass="column left">
<!-- Pagar -->
<divclass="sketches">
<imgsrc="../img/pagar.png"/>
<divclass="description">
<h4>~ PAGAR ~</h4>
<p>Se ofrecerá un resumen de toda la compra, podrá poner algún código de descuento y realizar la compra.</p>
</div>
</div>
</div>
</div>
<divclass="row">
<divclass="column left">
<!-- Compra Realizada -->
<divclass="sketches">
<imgsrc="../img/compra_realizada.png"/>
<divclass="description">
<h4>~ COMPRA REALIZADA ~</h4>
<p>Confirmará la compra de las entradas y si estás registrado podrás ver tu historial de compras.</p>
</div>
</div>
</div>
<divclass="column left">
<!-- About us -->
<divclass="sketches">
<imgsrc="../img/about_us.png"/>
<divclass="description">
<h4>~ ABOUT US ~</h4>
<p>Describe el equipo de FDI-cines.</p>
</div>
</div>
</div>
</div>
<divclass="row">
<divclass="column left">
<!-- Formulario de contacto -->
<divclass="sketches">
<imgsrc="../img/contacto.png"/>
<divclass="description">
<h4>~ FORMULARIO DE CONTACTO ~</h4>
<p>Si un usuario tiene algún problema se puede poner en contacto en esta página.</p>
</div>
</div>
</div>
<divclass="column left">
<!-- Terminos y condiciones -->
<divclass="sketches">
<imgsrc="../img/terminosyCondiciones.png"/>
<divclass="description">
<h4>~ TÉRMINOS Y CONDICIONES ~</h4>
<p>Habrá un texto describiendo los términos y condiciones de la página web.</p>
</div>
</div>
</div>
</div>
</fieldset>
<br>
<!-- Bocetos Gerente -->
<fieldset>
<legend>VISTA GERENTE</legend>
<divclass="row">
<divclass="column left">
<!-- Panel de inicio Gerente -->
<divclass="sketches">
<imgsrc="../img/panel_inicio_gerente.png"/>
<divclass="description">
<h4>~ PANEL DE INICIO ~</h4>
<p>Pantalla de inicio del gerente de un cine.</p>
<p>El gerente podrá administrar las salas y las sesiones.</p>
</div>
</div>
</div>
<divclass="column left">
<!-- Gestionar salas -->
<divclass="sketches">
<imgsrc="../img/gestionar_salas.png"/>
<divclass="description">
<h4>~ GESTIONAR SALAS ~</h4>
<p>Solo podrá gestionar las salas el gerente, escoge una sala y lo edita o lo deshabilita(ya que una sala no se puede eliminar físicamente), también podrá añadir una nueva sala y guardarla.</p>
</div>
</div>
</div>
</div>
<divclass="row">
<divclass="column left">
<!-- Gestionar sesiones -->
<divclass="sketches">
<imgsrc="../img/gestionar_sesiones.png"/>
<divclass="description">
<h4>~ GESTIONAR SESIONES ~</h4>
<p>Solo podrá gestionar las sesiones el gerente, escoge una sesión y lo edita o lo elimina, también podrá añadir una nueva sesión y guardarla.</p>
</div>
</div>
</div>
</div>
</fieldset>
<br>
<!-- Bocetos Administrador -->
<fieldset>
<legend>VISTA ADMINISTRADOR</legend>
<divclass="row">
<divclass="column left">
<!-- Panel de Inicio Admin -->
<divclass="sketches">
<imgsrc="../img/panel_inicio_admin.png"/>
<divclass="description">
<h4>~ PANEL DE INICIO ~</h4>
<p>Pantalla de inicio del administrador.</p>
<p>
El administrador podrá añadir, editar y eliminar las películas, cines y promociones, también podrá añadir o eliminar
a un gerente o administrador, y ver la página con la vista de usuario final.
</p>
</div>
</div>
</div>
<divclass="column left">
<!-- Gestionar Peliculas -->
<divclass="sketches">
<imgsrc="../img/gestionarPeliculas.png"/>
<divclass="description">
<h4>~ GESTIONAR PELÍCULAS ~</h4>
<p>El administrador puede listar las películas existentes, modificar sus datos, eliminarlas, o añadir una película nueva.</p>
</div>
</div>
</div>
</div>
<divclass="row">
<divclass="column left">
<!-- Gestionar Cines -->
<divclass="sketches">
<imgsrc="../img/gestionarCines.png"/>
<divclass="description">
<h4>~ GESTIONAR CINES ~</h4>
<p>El administrador puede listar los cines existentes, modificar sus datos, eliminarlos, o añadir un cine nuevo.</p>
</div>
</div>
</div>
<divclass="column left">
<!-- Gestionar Promociones -->
<divclass="sketches">
<imgsrc="../img/gestionarPromociones.png"/>
<divclass="description">
<h4>~ GESTIONAR PROMOCIONES ~</h4>
<p>El administrador puede listar las promociones existentes, modificar sus datos, eliminarlas, o añadir una promoción nueva.</p>
</div>
</div>
</div>
</div>
<divclass="row">
<divclass="column left">
<!-- Gestionar Admins-Gerentes -->
<divclass="sketches">
<imgsrc="../img/gestionar_admins_gerentes.png"/>
<divclass="description">
<h4>~ GESTIONAR ADMINS-GERENTES ~</h4>
<p>El administrador puede listar los administradores y gerentes existentes, modificar sus datos, eliminarlos, o añadir un admin/gerente nuevo.</p>
