{% extends "Master/MicroTemplate.html.twig" %}

{% block body %}
    {{ parent() }}
    <div class="container">
        <div class="row justify-content-md-center">
            <div class="col-md-6">
                <form action="{{ asset('login') }}" method="post" class="form">
                    {{ formToken() }}
                    <input type="hidden" name="action" value="login">
                    <div class="card mt-4">
                        <a href="{{ asset('login') }}">
                            {% set idfile = settings('default','idloginimage', 0) %}
                            {{ _self.loadLogo(idfile) }}
                        </a>
                        <div class="card-body d-grid">
                            <p class="card-text text-center">{{ trans('login-text') }}</p>
                            <div class="mb-3">
                                <div class="input-group">
                                    <span class="input-group-text">
                                            <i class="fa-solid fa-user fa-fw" aria-hidden="true"></i>
                                    </span>
                                    <input type="text" name="fsNick" class="form-control" maxlength="50"
                                           placeholder="{{ trans('user') }}" required autocomplete="off"
                                           autofocus/>
                                </div>
                            </div>
                            <div class="mb-3 d-grid">
                                <div class="input-group">
                                    <span class="input-group-text">
                                            <i class="fa-solid fa-key fa-fw" aria-hidden="true"></i>
                                    </span>
                                    <input type="password" name="fsPassword" class="form-control" maxlength="50"
                                           placeholder="{{ trans('password') }}" required autocomplete="off"/>
                                </div>
                                <a href="#" class="btn btn-link" data-bs-toggle="modal"
                                   data-bs-target="#newPasswordModal">
                                    {{ trans('i-forgot-password') }}
                                </a>
                            </div>
                            <button type="submit" class="btn btn-primary mb-4">
                                {{ trans('login') }}
                            </button>
                        </div>
                        <div class="card-footer text-center">
                            <p>
                                FacturaScripts es un software libre de contabilidad, facturación y CRM.
                                No dude en consultar la web oficial o las cuentas de facebook, twitter o youtube.
                            </p>
                            <a href="https://facturascripts.com" rel="nofollow" class="btn btn-secondary">
                                <i class="fa-solid fa-question-circle me-1"></i> facturascripts.com
                            </a>
                            <a href="https://www.facebook.com/facturascripts/" rel="nofollow" class="btn btn-outline-primary"
                               title="facebook"> <i class="fa-brands fa-facebook"></i>
                            </a>
                            <a href="https://twitter.com/facturascripts" rel="nofollow" class="btn btn-outline-info"
                               title="twitter"> <i class="fa-brands fa-twitter"></i>
                            </a>
                            <a href="https://www.youtube.com/channel/UCtsptMQYpW2wJZkvak6NYng" rel="nofollow"
                               class="btn btn-outline-danger" title="youtube"> <i class="fa-brands fa-youtube"></i>
                            </a>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <form action="{{ asset('login') }}" method="post" class="form">
        {{ formToken() }}
        <input type="hidden" name="action" value="change-password">
        <div class="modal fade" id="newPasswordModal" tabindex="-1" role="dialog" aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">
                            <i class="fa-solid fa-user-lock me-2"></i> {{ trans('new-password') }}
                        </h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body">
                        <a href="https://facturascripts.com/publicaciones/he-olvidado-mi-contrasena" rel="nofollow"
                           target="_blank" class="btn w-100 btn-link mb-3">
                            {{ trans('need-help-password') }}
                        </a>
                        <div class="mb-3">
                            <div class="input-group">
                                <span class="input-group-text">
                                        <i class="fa-solid fa-user fa-fw" aria-hidden="true"></i>
                                </span>
                                <input type="text" name="fsNewUserPasswd" class="form-control" maxlength="50"
                                       placeholder="{{ trans('user') }}" required autocomplete="off"/>
                            </div>
                        </div>
                        <div class="mb-3">
                            <div class="input-group">
                                <span class="input-group-text">
                                        <i class="fa-solid fa-key fa-fw" aria-hidden="true"></i>
                                </span>
                                <input type="password" name="fsNewPasswd" class="form-control" maxlength="50"
                                       placeholder="{{ trans('new-password') }}" required autocomplete="off"/>
                            </div>
                        </div>
                        <div class="mb-3">
                            <div class="input-group">
                                <span class="input-group-text">
                                        <i class="fa-solid fa-eye fa-fw" aria-hidden="true"></i>
                                </span>
                                <input type="password" name="fsNewPasswd2" class="form-control" maxlength="50"
                                       placeholder="{{ trans('repeat-new-password') }}"
                                       required autocomplete="off"/>
                            </div>
                        </div>
                        <div class="mb-3">
                            {{ trans('database') }}
                            <div class="input-group">
                                <span class="input-group-text">
                                        <i class="fa-solid fa-database fa-fw" aria-hidden="true"></i>
                                </span>
                                <input type="password" name="fsDbPasswd" class="form-control"
                                       placeholder="{{ trans('db-password') }}" autocomplete="off"/>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="submit" class="btn btn-primary w-100">{{ trans('save') }}</button>
                    </div>
                </div>
            </div>
        </div>
    </form>
{% endblock %}

{% block css %}
    {{ parent() }}
    <style>
        body {
            background-color: #333A40;
        }
    </style>
{% endblock %}

{% macro loadLogo(idfile) %}
    {% set url = 'Dinamic/Assets/Images/horizontal-logo.png' %}
    {% if idfile > 0 %}
        {% set attached = attachedFile(idfile) %}
        {% if attached.filename is not empty %}
            {% set url = attached.url('download-permanent') %}
        {% endif %}
    {% endif %}
    <img class="card-img-top" src="{{ asset(url) }}" alt="FacturaScripts"/>
{% endmacro loadLogo %}