Ejercicios

En los ejercicios de esta parte vamos a continuar con el sitio Web que empezamos para la gestión de un videoclub. Primero añadiremos los controladores y métodos asociados a cada ruta, y posteriormente también completaremos las vistas usando formularios y el sistema de plantillas Blade.

Ejercicio 1 - Controladores (1 punto)

En este primer ejercicio vamos a crear los controladores necesarios para gestionar nuestra aplicación y además actualizaremos el fichero de rutas para que los utilice.

Empezamos por añadir los dos controladores que nos van a hacer falta: CatalogController.php y HomeController.php. Para esto tenéis que utilizar el comando de Artisan que permite crear un controlador vacío (sin métodos).

A continuación vamos a añadir los métodos de estos controladores. En la siguiente tabla resumen podemos ver un listado de los métodos por controlador y las rutas que tendrán asociadas:

Ruta	Controlador	Método
/	HomeController	getHome
catalog	CatalogController	getIndex
catalog/show/{id}	CatalogController	getShow
catalog/create	CatalogController	getCreate
catalog/edit/{id}	CatalogController	getEdit

Acordaros que los métodos getShow y getEdit tendrán que recibir como parámetro el $id del elemento a mostrar o editar, por lo que la definición del método en el controlador tendrá que ser como la siguiente:

public function getShow($id)
{
    return view('catalog.show', array('id'=>$id));
}

Por último vamos a cambiar el fichero de rutas routes/web.php para que todas las rutas que teníamos definidas (excepto las de login y logout que las dejaremos como están) apunten a los nuevos métodos de los controladores, por ejemplo:

Route::get('/', 'HomeController@getHome');

El código que teníamos puesto para cada ruta con el return con la generación de la vista lo tenéis que mover al método del controlador correspondiente.

Ejercicio 2 - Completar las vistas (2 puntos)

En este ejercicio vamos a terminar los métodos de los controladores que hemos creado en el ejercicio anterior y además completaremos las vistas asociadas:

Método HomeController@getHome

En este método de momento solo vamos a hacer una redirección a la acción que muestra el listado de películas del catálogo: return redirect()->action('CatalogController@getIndex');. Más adelante tendremos que comprobar si el usuario está logueado o no, y en caso de que no lo este redirigirle al formulario de login.

Método CatalogController@getIndex

Este método tiene que mostrar un listado de todas las películas que tiene el videoclub. El listado de películas lo podéis obtener del fichero array_peliculas.php facilitado con los materiales. Este array de películas lo tenéis que copiar como variable miembro de la clase (más adelante las almacenaremos en la base de datos). En el método del controlador simplemente tendremos que modificar la generación de la vista para pasarle este array de películas completo ($this->arrayPeliculas).

Y en la vista correspondiente simplemente tendremos que incluir el siguiente trozo de código en su sección content:

<div class="row">

    @foreach( $arrayPeliculas as $key => $pelicula )
    <div class="col-xs-6 col-sm-4 col-md-3 text-center">

        <a href="{{ url('/catalog/show/' . $key ) }}">
            <img src="{{$pelicula['poster']}}" style="height:200px"/>
            <h4 style="min-height:45px;margin:5px 0 10px 0">
                {{$pelicula['title']}}
            </h4>
        </a>

    </div>
    @endforeach

</div>

Como se puede ver en el código, en primer lugar se crea una fila (usando el sistema de rejilla de Bootstrap) y a continuación se realiza un bucle foreach utilizando la notación de Blade para iterar por todas las películas. Para cada película obtenemos su posición en el array y sus datos asociados, y generamos una columna para mostrarlos. Es importante que nos fijemos en como se itera por los elementos de un array de datos y en la forma de acceder a los valores. Además se ha incluido un enlace para que al pulsar sobre una película nos lleve a la dirección /catalog/show/{$key}, siendo key la posición de esa película en el array.

Método CatalogController@getShow

Este método se utiliza para mostrar la vista detalle de una película. Hemos de tener en cuenta que el método correspondiente recibe un identificador que (de momento) se refiere a la posición de la película en el array. Por lo tanto, tendremos que coger dicha película del array ($this->arrayPeliculas[$id]) y pasársela a la vista.

En esta vista vamos a crear dos columnas, la primera columna para mostrar la imagen de la película y la segunda para incluir todos los detalles. A continuación se incluye la estructura HTML que tendría que tener esta pantalla:

<div class="row">

    <div class="col-sm-4">

        {{-- TODO: Imagen de la película --}}

    </div>
    <div class="col-sm-8">

        {{-- TODO: Datos de la película --}}

    </div>
</div>

En la columna de la izquierda completamos el TODO para insertar la imagen de la película. En la columna de la derecha se tendrán que mostrar todos los datos de la película: título, año, director, resumen y su estado. Para mostrar el estado de la película consultaremos el valor rented del array, el cual podrá tener dos casos:

• En caso de estar disponible (false) aparecerá el estado "Película disponible" y un botón azul para "Alquilar película".

• En caso de estar alquilada (true) aparecerá el estado "Película actualmente alquilada" y un botón rojo para "Devolver película".

Además tenemos que incluir dos botones más, un botón que nos llevará a editar la película y otro para volver al listado de películas.

Nota: los botones de alquilar/devolver de momento no tienen que funcionar. Acordaros que en Bootstrap podemos transformar un enlace en un botón, simplemente aplicando las clases "btn btn-default" (más info en: http://getbootstrap.com/css/#buttons).

Esta pantalla finalmente tendría que tener una apariencia similar a la siguiente:

Método CatalogController@getCreate

Este método devuelve la vista "catalog.create" para añadir una nueva película. Para crear este formulario en la vista correspondiente nos podemos basar en el contenido de la plantilla "catalog_create.php". Esta plantilla tiene una serie de TODOs que hay que completar. En total tendrá que tener los siguientes campos:

Label	Name	Tipo de campo
Título	title	text
Año	year	text
Director	director	text
Poster	poster	text
Resumen	synopsis	textarea

Además tendrá un botón al final con el texto "Añadir película".

De momento el formulario no funcionará. Más adelante lo terminaremos.

Método CatalogController@getEdit

Este método permitirá modificar el contenido de una película. El formulario será exactamente igual al de añadir película, así que lo podemos copiar y pegar en esta vista y simplemente cambiar los siguientes puntos:

• El título por "Modificar película".

• El texto del botón de envío por "Modificar película".

• Añadir justo debajo de la apertura del formulario el campo oculto para indicar que se va a enviar por PUT. Recordad que Laravel incluye el método method_field('PUT') que nos ayudará a hacer esto.

De momento no tendremos que hacer nada más, más adelante lo completaremos para que se rellene con los datos de la película a editar.