{% extends "pretixcontrol/base.html" %}
{% load i18n %}
{% load bootstrap3 %}
{% block title %}{% trans "Two-factor authentication" %}{% endblock %}
{% block content %}
    <h1>{% trans "Two-factor authentication" %}</h1>
    <p>
        {% blocktrans trimmed %}
            Two-factor authentication is a way to add additional security to your account. If you enable it, you will
            not only need your password to log in, but also an additional token that is generated e.g. by an app on your
            smartphone or a hardware token generator and that changes on a regular basis.
        {% endblocktrans %}
    </p>
    {% if obligatory and not user.require_2fa %}
        <div class="panel panel-warning">
            <div class="panel-heading">
                <h3 class="panel-title">
                    <span class="fa fa-warning"></span>
                    {% trans "Obligatory usage of two-factor authentication" %}
                </h3>
            </div>
            <div class="panel-body">
                {% if obligatory == "system" %}
                    <p>
                        <strong>{% trans "This system enforces the usage of two-factor authentication!" %}</strong>
                    </p>
                {% elif obligatory == "staff" %}
                    <p>
                        <strong>{% trans "As an administrator, you need to use two-factor authentication." %}</strong>
                    </p>
                {% elif obligatory == "team" %}
                    <p>
                        <strong>{% trans "You are part of one or more organizer teams that require you to use two-factor authentication." %}</strong>
                    </p>
                    <ul>
                        {% for t in obligatory_teams %}
                            <li>
                                {% blocktrans trimmed with team=t.name organizer=t.organizer.name %}
                                    Team "{{ team }}" of organizer "{{ organizer }}"
                                {% endblocktrans %}
                            </li>
                        {% endfor %}
                    </ul>
                {% endif %}
                <p>
                    {% if not devices %}
                        {% trans "Please set up at least one device below." %}
                    {% elif not user.require_2fa %}
                        {% trans "Please activate two-factor authentication using the button below." %}
                    {% endif %}
                    {% if obligatory == "team" %}
                        <a href="{% url "control:user.settings.2fa.leaveteams" %}">
                            {% blocktrans trimmed count count=obligatory_teams|length %}
                                Leave team instead
                            {% plural %}
                                Leave {{ count }} teams instead
                            {% endblocktrans %}
                        </a>
                    {% endif %}
                </p>
            </div>
        </div>
    {% endif %}
    {% if user.require_2fa %}
        <div class="panel panel-success">
            <div class="panel-heading">
                <h3 class="panel-title">{% trans "Two-factor status" %}</h3>
            </div>
            <div class="panel-body">
                {% if obligatory %}
                    <button disabled class="btn btn-primary pull-right flip" data-toggle="tooltip"
                            title="{% spaceless %}{% if obligatory == "system" %}
                                {% trans "This system enforces the usage of two-factor authentication!" %}
                        {% elif obligatory == "staff" %}
                                {% trans "As an administrator, you need to use two-factor authentication." %}
                        {% elif obligatory == "team" %}
                                {% trans "You are part of one or more organizer teams that require you to use two-factor authentication." %}
                        {% endif %}{% endspaceless %}">
                        {% trans "Disable" %}
                    </button>
                {% else %}
                    <a href="{% url "control:user.settings.2fa.disable" %}" class="btn btn-primary pull-right flip">
                        {% trans "Disable" %}
                    </a>
                {% endif %}
                <p>
                    <strong>{% trans "Two-factor authentication is currently enabled." %}</strong>
                </p>
            </div>
        </div>
    {% else %}
        <div class="panel panel-warning">
            <div class="panel-heading">
                <h3 class="panel-title">{% trans "Two-factor status" %}</h3>
            </div>
            <div class="panel-body">
                {% if devices|length %}
                    <a href="{% url "control:user.settings.2fa.enable" %}" class="btn btn-primary pull-right flip">
                        {% trans "Enable" %}
                    </a>
                {% endif %}
                <p>
                    <strong>{% trans "Two-factor authentication is currently disabled." %}</strong>
                </p>
                {% if not devices|length %}
                    <p>{% trans "To enable it, you need to configure at least one device below." %}</p>
                {% endif %}
            </div>
        </div>
    {% endif %}
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title">{% trans "Registered devices" %}</h3>
        </div>
        <ul class="list-group">
            {% for d in devices %}
                <li class="list-group-item">
                    <a class="btn btn-danger btn-xs pull-right flip"
                       href="{% url "control:user.settings.2fa.delete" devicetype=d.devicetype device=d.pk %}">
                        Delete
                    </a>
                    {% if d.devicetype == "totp" %}
                        <span class="fa fa-mobile"></span>
                    {% elif d.devicetype == "webauthn" %}
                        <span class="fa fa-usb"></span>
                    {% elif d.devicetype == "u2f" %}
                        <span class="fa fa-usb"></span>
                    {% endif %}
                    {{ d.name }}
                </li>
            {% endfor %}

            <li class="list-group-item">
                <a href="{% url "control:user.settings.2fa.add" %}" class="btn btn-primary">
                    <span class="fa fa-plus"></span>
                    {% trans "Add a new device" %}
                </a>
            </li>
        </ul>
    </div>
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title">{% trans "Emergency tokens" %}</h3>
        </div>
        <div class="panel-body">
            <p>
                {% trans "If you lose access to your devices, you can use one of the following keys to log in. We recommend to store them in a safe place, e.g. printed out or in a password manager. Every token can be used at most once." %}
            </p>
            <p>{% trans "Unused tokens:" %}</p>
            <ul>
                {% for t in static_tokens %}
                    <li><code>{{ t.token }}</code></li>
                {% endfor %}
            </ul>
            <a href="{% url "control:user.settings.2fa.regenemergency" %}" class="btn btn-default">
                <span class="fa fa-refresh"></span>
                {% trans "Generate new emergency tokens" %}
            </a>
        </div>
    </div>
{% endblock %}
