{% extends 'layouts/base.njk' %}
{% import 'macros.njk' as macros %}

{% set title = 'Authentication / Registration' %}
{% set decription = 'Join ' + app.name + ' and share your files!' %}
{% set h1 = 'Authentication and registration' %}

{% block body %}
    <div class="container">
        {% set queryStr = '' %}
        {% if query.redirect_uri | length %}
            {% set queryStr = '?' + querystring.stringify({redirect_uri: query.redirect_uri}) %}
        {% endif %}

        <section class="panel">
            <h2>Log in</h2>

            <form action="{{ route('login') + queryStr }}" method="POST" id="login-form">
                {{ macros.field(_locals, 'text', 'identifier', query.identifier or '', 'Your email address or username', null, 'required') }}

                {{ macros.field(_locals, 'password', 'password', null, 'Your password', 'Do not fill to log in via magic link.') }}

                <button type="submit">Authenticate</button>

                {{ macros.csrf(getCsrfToken) }}
            </form>
        </section>

        <section class="panel">
            <h2>Register with email</h2>

            <form action="{{ route('register') + queryStr }}" method="POST" id="register-form">
                <input type="hidden" name="auth_method" value="magic_link">
                {{ macros.csrf(getCsrfToken) }}

                {% if has_username %}
                    {{ macros.field(_locals, 'text', 'name', null, 'Choose your username', 'This cannot be changed later.', 'pattern="[0-9a-z_-]+" required') }}
                {% endif %}

                {{ macros.field(_locals, 'email', 'identifier', null, 'Your email address', null, 'required') }}

                {{ macros.field(_locals, 'checkbox', 'terms', null, 'I accept the <a href="/terms-of-services" target="_blank">Terms Of Services</a>.' | safe, null, 'required') }}

                <button type="submit" class="primary">Register</button>
            </form>
        </section>

        {% if register_with_password %}
            <section class="panel">
                <h2>Register with password</h2>

                <form action="{{ route('register') + queryStr }}" method="POST" id="register-form">
                    <input type="hidden" name="auth_method" value="password">
                    {{ macros.csrf(getCsrfToken) }}

                    <section class="sub-panel">
                        <h3>Username</h3>
                        {{ macros.field(_locals, 'text', 'identifier', null, 'Choose your username', 'This cannot be changed later.', 'pattern="[0-9a-z_-]+" required') }}
                    </section>

                    <section class="sub-panel">
                        <h3>Password</h3>
                        {{ macros.field(_locals, 'password', 'password', null, 'Choose a password', null, 'required') }}
                        {{ macros.field(_locals, 'password', 'password_confirmation', null, 'Confirm your password', null, 'required') }}
                    </section>

                    {{ macros.field(_locals, 'checkbox', 'terms', null, 'I accept the <a href="/terms-of-services" target="_blank">Terms Of Services</a>.' | safe, null, 'required') }}

                    <button type="submit" class="primary">Register</button>
                </form>
            </section>
        {% endif %}
    </div>
{% endblock %}