{% extends "base.html" %}
{% load i18n two_factor %}

{% block content %}
  <h1 class="title">{% trans "Login" %}</h1>

  {% if user.is_authenticated %}
    <div class="notification is-warning">
      You are already authenticated.
    </div>
  {% else %}
    {% if wizard.steps.current == 'auth' %}
      <h2 class="subtitle">{% blocktrans %}Enter your credentials.{% endblocktrans %}</h2>
    {% elif wizard.steps.current == 'token' %}
      {% if device.method == 'call' %}
        <div class="notification is-warning">{% blocktrans %}We are calling your phone right now, please enter the
          digits you hear.{% endblocktrans %}</div>
      {% elif device.method == 'sms' %}
        <div class="notification is-warning">{% blocktrans %}We sent you a text message, please enter the tokens we
          sent.{% endblocktrans %}</div>
      {% else %}
        <div class="notification is-warning">{% blocktrans %}Please enter the tokens generated by your token
          generator.{% endblocktrans %}</div>
      {% endif %}
    {% elif wizard.steps.current == 'backup' %}
      <div class="notification is-danger">{% blocktrans %}Use this form for entering backup tokens for logging in.
        These tokens have been generated for you to print and keep safe. Please
        enter one of these backup tokens to login to your account.{% endblocktrans %}</div>
    {% endif %}

    <form action="" method="post">{% csrf_token %}
      {{ wizard.management_form }}

      {% include "bulma_form.html" %}

      {# hidden submit button to enable [enter] key #}
      <div style="margin-left: -9999px"><input type="submit" value=""/></div>

      {% if other_devices %}
        <p>{% trans "Or, alternatively, use one of your backup phones:" %}</p>
        <p>
          {% for other in other_devices %}
          <button name="challenge_device" value="{{ other.persistent_id }}"
                  class="button is-default" type="submit">
            {{ other|device_action }}
          </button>
        {% endfor %}</p>
      {% endif %}
      {% if backup_tokens %}
        <p>{% trans "As a last resort, you can use a backup token:" %}</p>
        <p>
          <button name="wizard_goto_step" type="submit" value="backup"
                  class="button is-warning">{% trans "Use Backup Token" %}</button>
        </p>
      {% endif %}

      {% include "mfa/_wizard_actions.html" %}
    </form>

    <div class="section">
      <p class="subtitle">{% trans "Forgot your password?" %} <a href="{% url 'auth_password_reset' %}">{% trans "Reset it" %}</a>.</p>
      <p class="subtitle">{% trans "Not a member?" %} <a href="{% url 'registration_register' %}">{% trans "Register" %}</a>.</p>
    </div>
  {% endif %}
{% endblock %}