<!--
    AngularJS template. Created by fran lopez on 14/12/15.

    This is the view to search information about films by year. This view shows
    a form with a combo element to select a film year from 2000 to 2015.

    If there are films matched to inserted year, these films will be listed in
    another view, where the user can access to view details of every film.
-->

    <section data-ng-controller="FilmsController" data-ng-init="getGenres()">
        <h1>Búsqueda de películas por género</h1><hr>
        <form data-ng-submit="listFilmsByGenre()" novalidate>
            <div>
                <label for="filmGenre">Género:</label>
                <div>
                    <select data-ng-model="genre" id="filmGenre" required>
                        <option data-ng-repeat="genre in genres"
                                data-ng-value="genre" data-ng-bind="genre">
                        </option>
                    </select>
                </div>
            </div><br>
            <div>
                <input type="submit" value="Buscar películas">
            </div><hr>
            <br>
            <div data-ng-show="error">
                <strong data-ng-bind="error"></strong>
            </div>
            <br>
            <a data-ng-href="/#!/films">Volver al menú anterior</a>
        </form>
    </section>