{% extends 'Login/layout.html.twig' %}

{% block title %} {{'Login.T1' | trans}}{% endblock %}

{% block login %}

    <div class="main-login col-xs-10 col-xs-offset-1 col-sm-8 col-sm-offset-2 col-md-4 col-md-offset-4">
        <div class="logo margin-top-30">
            <img src="{{ asset('components/assets/images/logo.png') }}" style="width: 250px;" alt="Total Opérations"/>
        </div>
        <!-- start: LOGIN BOX -->
        <div class="box-login">
            <form id="formLogin" class="form-login" method="post" action="{{ path("login") }}">
                <fieldset>
                    <legend>
                        {{ 'Login.T2' | trans }}
                    </legend>
                    {% if error %}
                        <div class="alert alert-danger">
                            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                            <strong>{{ error.messageKey|trans(error.messageData, 'security') }}</strong>
                        </div>
                    {% endif %}

                    <div class="form-group">
								<span class="input-icon">
									  <input type="email" value="{{ last_username }}" name="email" id="inputEmail"
                                             class="form-control" placeholder="{{ 'Login.T3' | trans }}" required
                                             autofocus>
									<i class="fa fa-user"></i> </span>
                    </div>
                    <div class="form-group form-actions">
								<span class="input-icon">
									 <input type="password" name="password" id="inputPassword" class="form-control"
                                            placeholder="{{ 'Login.T4' | trans }}" required>
									<i class="fa fa-lock"></i>
								</span>
                    </div>

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

                    <div class="form-actions">
                        {% if app.request.locale == 'ar' %}
                            <button type="submit" class="btn btn-primary pull-left">{{ 'Login.T5' | trans }} <i  class="fa fa-arrow-circle-left"></i></button>

                        {% else %}
                            <button type="submit" class="btn btn-primary pull-right">{{ 'Login.T5' | trans }} <i  class="fa fa-arrow-circle-right"></i></button>

                        {% endif %}
                    </div>
                </fieldset>
            </form>
            <div class="margin-top-30 margin-bottom-30">
                <div  class="row cl-effect-4 text-center">
                    <div class="col-md-4 col-xs-4 col-lg-4 col-sm-4 ">
                        <a  href="{{  path(app.request.get('_route'), app.request.get('_route_params')|merge({'_locale': 'en'}))}}" >
                            English
                        </a>
                    </div>
                    <div class="col-md-4 col-xs-4 col-lg-4 col-sm-4 ">
                    <a href="{{ path(app.request.get('_route'), app.request.get('_route_params')|merge({'_locale': 'fr'})) }}">
                            Français
                        </a>
                    </div>
                    <div class="col-md-4 col-xs-4 col-lg-4 col-sm-4 ">
                    <a href="{{ path(app.request.get('_route'), app.request.get('_route_params')|merge({'_locale': 'ar'})) }}">
                            عربي
                        </a>
                    </div>
                    </div>
            </div>
            <!-- start: COPYRIGHT -->
            <div class="copyright">
                {{ 'Login.T6' | trans }} <span class="text-bold text-uppercase">{{ 'Login.T7' | trans }}</span>
            </div>
            <!-- end: COPYRIGHT -->
        </div>
        <!-- end: LOGIN BOX -->
    </div>

{% endblock %}