{% extends 'base.html.twig' %}

{% block body %}
    <form method="post">
        <img src="{{asset("/medias/logo/logo.png")}}" style="margin: 15px auto 15px auto; width:100px; display:block;">
        <center style="font-size:200%;margin-bottom:30px;">{{appName}}</center>
        <div class="card card-body m-auto" style="width:300px">
            {% if error %}
                <div class="alert alert-danger">{{ error.messageKey|trans(error.messageData, 'security') }}</div>
            {% endif %}

            {% if app.user %}
                <div class="mb-3">
                    Vous êtes déjà connecté avec le login {{ app.user.userIdentifier }} = <a href="{{ path('app_logout') }}">Logout</a>
                </div>
            {% endif %}

            <div class="form-group">
                <label for="username">Login</label>
                <input class="form-control" type="text" value="{{ last_username }}" name="_username" id="username" class="form-control" autocomplete="username" required autofocus>
            </div>

            <div class="form-group">
                <label for="password">Password</label>
                <input class="form-control" type="password" name="_password" id="password" class="form-control" autocomplete="current-password" required>
            </div>

            <input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">

            <button class="btn btn-lg btn-primary" type="submit">
                Valider
            </button>
        </div>
    </form>
{% endblock %}

{% block localscript %}
    <script type="module">
        import $ from 'jquery';

        $(document).ready(function () {
            $("#username").focus();
        });

    </script>
{% endblock %}