Bocetos
++
diff --git a/assets/css/main.css b/assets/css/main.css new file mode 100644 index 0000000..0d1ff81 --- /dev/null +++ b/assets/css/main.css @@ -0,0 +1,380 @@ +/* Basic */ +* { + box-sizing: border-box; +} + +/* Headers */ +h1, h2, h3, h4 { + color: #363636; + text-transform: uppercase; + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + vertical-align: baseline; + text-align: center; +} + +h2 { + font-size: 95%; +} + +h3 { + font-size: 85%; +} + +h4 { + font-size: 75%; +} + +/* Header */ +.header { + background-color: #1f2c3d; + color: #dadada; + padding: 15px; + text-align: left; + font-size: 18px; +} +.header img { + width: 11px; +} +.menu { + background-color: #1f2c3d; + color: #dadada; + text-align: right; + font-size: 15px; +} + +/* Paragraphs */ +p { + padding: 0; + border: 0; +} + +a { + color: #dadada; + text-decoration: none; +} +a:hover{ + color:rgb(138, 150, 32); +} + +/* Body */ +body { + font-family: Arial, Helvetica, sans-serif; + background-color: #d3ebff; + color: #000000 +} + +/* Table */ +table { + border-collapse: collapse; + border-spacing: 0; + margin: 0 0 2em 0; + width: 100%; + text-align: left; + font-size: 15px; +} +table a{ + color: #1f2c3d; +} + table tbody tr { + border: solid 1px #1f2c3d; + border-left: 0; + border-right: 0; + } + table tbody tr:nth-child(2n + 1) { + background-color: rgba(144, 144, 144, 0.25); + } + table td { + padding: 0.75em 0.75em; + } + table th { + color: #1f2c3d; + font-size: 0.9em; + font-weight: 600; + padding: 0 0.85em 0.85em 0.85em; + } + table thead { + border-bottom: solid 2px #1f2c3d; + } + + + +/* Main */ +.main { + padding: 30px; + text-align: center; + font-size: 35px; +} +.main h1, h2, h3, h4 { + color: #363636; +} +.main img { + width: 50%; +} + +/* Create three unequal columns that floats next to each other */ +.column { + float: left; + padding: 10px; +} + +/* Left and right column */ +.column.side { + width: 33.33%; +} + +/* Middle column */ +.column.middle { + width: 33.33%; +} + +/* Left column */ +.column.left { + width: 50%; +} + +/* Right column */ +.column.right { + float: right; + width: 50%; +} + +/* Clear floats after the columns */ +.row:after { + content: ""; + display: table; + clear: both; +} + +/* Responsive layout: makes the three columns stack on top of each other instead of next to each other */ +@media (max-width: 1000px) { + .column.side, .column.middle, .column.left, .column.right{ + width: 100%; + } +} + +/* Zoom */ +.zoom { + transition: transform .2s; +} +.zoom:hover { + transform: scale(1.05); +} + +/* Code & Blockquote */ +.code { + background: #1f2c3d; + border-radius: 3px; + font-size: 0.9em; + margin: 10px; + display: block; + line-height: 1.75em; + padding: 1em 1.5em; + overflow-x: auto; + overflow-y: auto; +} +.code h1, .code h2{ + color: #dadada; +} +.code h3, .code h4 { + color: #d3ebff; +} +.code p { + color: #dadada; +} +.code a { + text-decoration: underline; +} +.code ul { + color: #dadada; +} +.code img{ + /* width: 80px; height: 80px; */ + width: 25%; +} +.code fieldset{ + margin: 1px; + border-color: #dadada; + border-style: groove; +} +.code fieldset legend { + text-transform: uppercase; + font-weight: bold; + font-size: 90%; + color: #d3ebff; +} +.code.details{ + height: 750px; +} +.code.plan { + height: 1150px; +} + +.blockquote { + border-left: solid 4px #dadada; + margin: 0 0 2em 0; + padding: 0.5em 0 0.5em 2em; +} +.blockquote.bio { + height: 250px; +} + + +/* Sketches */ +.sketches { + text-align: center; + display: block; + line-height: 1.25em; + padding: 1em 1em; + overflow-x: auto; + background: #1f2c3d; + border-radius: 3px; + height: 680px; +} +.sketches h1, .sketches h2, .sketches h3, .sketches h4, .sketches p { + color: #dadada; +} +.sketches img { + width: 550px; + height: 550px; +} +.sketches .description { + color: #d3ebff; +} +/* Responsive layout */ +@media (max-width: 1500px) { + .column.side .sketches, .column.middle .sketches { + width: 100%; + height: 500px; + } + .column.side .sketches img, .column.middle .sketches img { + width: 100%; + height: 75%; + } +} +@media (max-width: 1150px) { + .sketches img { + width: 100%; + height: 75%; + } +} + +/* Percentage bar */ +.bar { + height: 15px; + line-height: 15px; + font-size: 13px; + font-weight: bold; + width: 100%; + background-color: #d3ebff; + text-align: right; +} +.bar.seventyfive { + width: 75%; +} +.bar.fifty { + width: 50%; +} +.bar.twentyfive { + width: 25%; +} + +/* Timeline Image */ +.timeline h2 { + padding-top: 50px; +} +.timeline img{ + width: 100%; + text-align: center; + padding-bottom: 50px; + padding-left: 15px; + padding-right: 15px; +} + + +/* Form */ +form { + margin: auto; + width: 65%; +} + +form h1, h2, h3, h4 { + color: #363636; +} + +label { + text-align: center; + font-weight: bold; +} + +input, textarea { + width: 100%; + height: 27px; + border: 1px solid #000000; + padding: 10px; + margin-top: 5px; + font-size: 15px; +} + +textarea { + width: 100%; + height: 150px; +} + +#radio, #checkbox { + width: auto; + height: 15px; + cursor: pointer; +} + +.verify { + font-size: 11px; +} + +#submit { + width: 100%; + height: 35px; + border: 1px solid #000000; + padding: 5px; + margin-top: 5px; + font-size: 15px; + font-weight: bold; + box-shadow: 2px 2px #1f2c3d; + filter: brightness(105%); + cursor: pointer; +} +#submit:hover { + background-color: #d3ebff; +} + +#reset { + width: 100%; + height: 30px; + border: 1px solid #dadada; + background-color: #00020f; + color: #dadada; + padding: 5px; + margin-top: 5px; + font-size: 12px; + font-weight: bold; + box-shadow: 2px 2px #1f2c3d; + cursor: pointer; +} +#reset:hover { + border:#000000; + background-color: #791515; +} + + +/* Footer */ +.footer { + background-color: #1f2c3d; + color: #dadada; + padding: 25px; + margin-top: 100px; + width: 100%; + height: 80px; + text-align: right; +} \ No newline at end of file diff --git a/assets/php/footer.php b/assets/php/footer.php new file mode 100644 index 0000000..b223c13 --- /dev/null +++ b/assets/php/footer.php @@ -0,0 +1,7 @@ + +
+ \n"; +?> \ No newline at end of file diff --git a/assets/php/header.php b/assets/php/header.php new file mode 100644 index 0000000..90be9cd --- /dev/null +++ b/assets/php/header.php @@ -0,0 +1,25 @@ + + CompluCine | {$page} + + \n"; +?> \ No newline at end of file diff --git a/bocetos/index.php b/bocetos/index.php new file mode 100644 index 0000000..8ecb346 --- /dev/null +++ b/bocetos/index.php @@ -0,0 +1,307 @@ + + + + +Pantalla de bienvenida al entrar en la web.
+Pantalla para que un usuario nuevo se registre o, en caso de ya tener una cuenta de usuario, inicie sesión.
+Pantalla con todas las opciones disponibles, propias de un usuario registrado.
+Pantalla con información sobre todas las películas disponibles en ese momento.
+Pantalla con un mapa que indica la geolocalización de todos los cines de FDI-Cines.
+Pantalla que muestra los horarios disponibles por salas para un cine y película elegidos.
+Pantalla con un mapa para selccionar los asientos que se quieren escoger. Los asientos ocupados no pondrán ser seleccionados.
+Pantalla para realizar el pago, después de haber selecionado película, cine, sala, horario y butacas.
+Pantalla de confirmación con los datos de compra.
+Pantalla con información sobre FDI-Cines.
+Pantalla con un formulario para realizar una consulta a los administradores.
+Pantalla con todos los términos y condiciones de uso del servicio.
+Pantalla con las funciones exclusivas a las que puede acceder un Gerente.
+Pantalla en la que los Gerentes pueden interactuar para añadir, modificar o eliminar la sala de un cine.
+Pantalla en la que los Gerentes pueden interactuar para añadir, modificar o eliminar las sesiones de una película.
+Pantalla con las funciones exclusivas a las que puede acceder un Administrador.
+Pantalla en la que los Administradores pueden interactuar para añadir, modificar o eliminar las películas de la cartelera.
+Pantalla en la que los Administradores pueden interactuar para añadir, modificar o eliminar los cines.
+Pantalla en la que los Administradores pueden interactuar para añadir, modificar o eliminar las promociones existentes.
+Pantalla en la que los Administradores pueden interactuar para añadir, modificar o eliminar tanto otros Administradores como Gerentes.
++ Con este proyecto buscamos la creación de una aplicación web que + gestione la cartelera de un grupo de cines con una cartelera de películas variable, unos horarios propios de cada cine por sesión y película + y unos precios determinados. + + Los usuarios podrán registrarse, comprar sus entradas para una + sesión, elegir asientos, precomprar sus snacks y ver ofertas y promociones. +
++ La aplicación debe permitir la compra online de entradas para sesiones de cine, mostrando los cines y + horarios en los que se encuentra disponible la película seleccionada por el usuario dentro del catálogo disponible en ese momento (la cartelera). + Los usuarios podrán acceder a la compra de entradas buscando la película que desean ver y luego escogiendo un cine y horario determinado. + Además de una búsqueda específica, también se ofrecerá la posibilidad de visionar toda la cartelera, y escoger una película, horario y cine, de entre todas las posibilidades. +
+ Una vez escogido todo, se mostrará una página en la que el usuario decidirá la o las butacas en las que se sentará. Se mostrarán butacas disponibles y butacas ocupadas (en caso de que las haya). + Antes de realizar la compra, los usuarios podrán aplicar promociones especificas que le permitan obtener algun snack en el cine o descuentos disponibles en la aplicación. +
++ Por otro lado la aplicacion debe permitir a los gerentes y administradores visionar la lista y contenido de todas las peliculas que hay en cartelera, + siendo los administradores los encargados de modificarlas y añadir nuevas. + De igual forma, ambos podran ver todos los cines activos de la aplicacion, pero solo los administradores serán capaces de añadir o modificar cines existentes. +
+ Cada cine tiene una cantidad de salas y sesiones con horarios específicos pora cada una de las películas. + Aunque ambos roles (administrador y gerente) pueden ver estas salas y horarios, es el gerente de cine el encargado de modificar las salas, + su disposición de butacas, modificar el horario de las sesiones y añadir nuevas sesiones, y crear promociones específicas para una sesión concreta o para el cine completo. + Todo esto unicamente para el cine con el cual esta relacionado. +
++ CompluCine es un proyecto para la creación y desarrollo de una plataforma web que permita la compra de entradas + de cine, por fecha y hora, para cualquiera de los cines del grupo FDI-Cines + mostrar la cartelera disponible e incluya ofertas y promociones para los clientes. +
++ Con este proyecto buscamos la creación de una aplicación web que + gestione la cartelera de un grupo de cines con una lista de películas variable, + unos horarios propios de cada cine por sesión y película, y con unos precios determinados. +
++ Los usuarios podrán registrarse, comprar sus entradas para una + sesión, elegir asientos, precomprar sus snacks y ver ofertas y promociones. +
++ Somos un grupo de estudiantes de la asignatura de Sistemas Web + de la Facultad de Informática de la Universidad Complutense de Madrid. +
++ CompluCine es un proyecto web universitario y en ningún momento pretende ofrecer una funcionalidad real. + Para más información acerca del proyecto, haz click aquí. +
+Nombre | +|
---|---|
Marco Expósito Pérez | +marcoexp@ucm.es | +
Fernando Méndez Torrubiano | +fernmend@ucm.es | +
Daniel Muñoz García | +danimu03@ucm.es | +
Ioan Marian Tulai | +ioantula@ucm.es | +
Óscar Ruiz de Pedro | +oscarrui@ucm.es | +
Adrian Real del Noval | +adrireal@ucm.es | +
~ Marco Expósito Pérez (marcoexp@ucm.es)
+Aficionado a todo tipo de videojuegos, principalmente la saga Zelda. Tambien me gusta leer tanto literatura fantastica como mangas y veo anime asiduamente.
+En verano suelo participar en campeonatos de pesca subacuatica y tambien me gusta bastante jugar al futbol federado, aunque hace un tiempillo ya que no hago.
+~ Fernando Méndez (fernmend@ucm.es)
+Estudiante de Ingeniería de Computadores en la Universidad Complutense de Madrid.
+Presidente de la asociación Diskobolo. Colaborador de la Oficina de Sotfware Libre de la UCM y coordinador del grupo de Hacking Ético de la FDI.
+~ Daniel Muñoz García (danimu03@ucm.es)
+Estudiante del grado en ingeniería informática en la Universidad Complutense de Madrid. Aficionado a la ciberseguridad y las nuevas tecnologías.
+Especializado en el diseño y gestión de bases de datos, tanto SQL como noSQL, y su desarrollo con distintos lenguajes como MongoDB o MySQL.
+~ Ioan Marian Tulai (ioantula@ucm.es)
+Estudiante con mucha ilusion y ganas de trabajar especialista en hardware.
+Alta experiencia programando en C, gran interés en aprender nuevos lenguajes de programación y aficionado a dibujar.
+~ Óscar Ruiz de Pedro (oscarrui@ucm.es)
+Estudiante de ingeniería de computadores en la Universidad Complutense de Madrid.
+Altas capacidades de programación en bajo nivel, me gustaría aprender más sobre el ámbito de la robótica.
+Aficionado a todo tipo de videojuegos, impresión 3D, teatro y airsoft.
+~ Adrian Real del Noval (adrireal@ucm.es)
+Estudiante de 3er año de Ingeniería de Computadores en la Universidad Complutense de Madrid.
+Las áreas en las que tiene mayor interés son la electrónica, las GPUs, y los sistemas empotrados.
+