{% import 'macros/forms.html' as forms with context %}

{% block content %}
  <h1>{{ _("Two-factor authentication adds an extra layer of security to your account") }}</h1>
  <h3>{{ _("In addition to your username and password, you'll need to use a code.") }}</h3>
  <form action="{{ url_for('security.two_factor_setup') }}" method="post" name="two_factor_setup_form">
    {{ two_factor_setup_form.hidden_tag() }}
    <div class="fs-div">{{ _("Currently setup two-factor method: %(method)s", method=primary_method) }}</div>
    <hr class="fs-gap">
    {% for subfield in two_factor_setup_form.setup %}
      {% if subfield.data in choices %}
        {{ forms.field(subfield) }}
      {% endif %}
    {% endfor %}
    {{ forms.field(two_factor_setup_form.submit) }}
    {% if chosen_method=="email" and chosen_method in choices %}
      <div>{{ _("To complete logging in, please enter the code sent to your mail") }}</div>
    {% endif %}
    {% if chosen_method=="authenticator" and chosen_method in choices %}
      <hr>
      <div class="fs-center">
        <div>
          {{ _("Open an authenticator app on your device and scan the following QRcode (or enter the code below manually) to start receiving codes:") }}
        </div>
        <div>
          <img alt="{{ _('Two factor authentication code') }}" id="qrcode" src="{{ authr_qrcode }}">
        </div>
        <div>{{ authr_key }}</div>
      </div>
    {% endif %}
    {% if chosen_method=="sms" and chosen_method in choices %}
      <p>{{ _("To Which Phone Number Should We Send Code To?") }}</p>
      {{ two_factor_setup_form.hidden_tag() }}
      {{ forms.field(two_factor_setup_form.phone) }}
      {{ forms.field(two_factor_setup_form.submit) }}
    {% endif %}
  </form>
  {% if chosen_method %}
    {# Hide this when first setting up #}
    <hr>
    <form action="{{ url_for('security.two_factor_token_validation') }}" method="post" name="two_factor_verify_code_form">
      {{ two_factor_verify_code_form.hidden_tag() }}
      {{ forms.field(two_factor_verify_code_form.code) }}
      {{ forms.field(two_factor_verify_code_form.submit) }}
    </form>
  {% endif %}
  {% if config.SECURITY_MULTI_FACTOR_RECOVERY_CODES %}
    <h3>{{ _("Recovery Codes") }}</h3>
    <div class="fs-div">
      {{ _("This application supports setting up recovery codes.") }}
      <a href="{{ url_for('security.mf_recovery_codes') }}">{{ _("You can set them up here.") }}</a>
    </div>
  {% endif %}
{% endblock content %}