{% extends "pretixcontrol/base.html" %}
{% load i18n %}
{% load bootstrap3 %}
{% load staticfiles %}
{% load compress %}
{% block title %}{% trans "Add a two-factor authentication device" %}{% endblock %}
{% block content %}
    <h1>{% trans "Add a two-factor authentication device" %}</h1>
    <p id="u2f-progress">
        <span class="fa fa-cog fa-spin"></span>
        {% trans "Please connect your U2F device. If it has a button, touch it now. You might have to unplug the device and plug it back in again." %}
    </p>
    <form class="form form-inline" method="post" action="" id="u2f-form">
        {% csrf_token %}
        <input type="hidden" id="u2f-response" name="token" class="form-control" required="required">
        <button class="btn btn-primary sr-only" type="submit"></button>
    </form>

    <div class="sr-only alert alert-danger" id="u2f-error">
        {% trans "Device registration failed." %}
    </div>
    <script type="text/json" id="u2f-enroll">
        {{ jsondata|safe }}

    </script>
    {% compress js %}
        <script type="text/javascript" src="{% static "pretixcontrol/js/ui/u2f-api.js" %}"></script>
        <script type="text/javascript" src="{% static "pretixcontrol/js/ui/u2f.js" %}"></script>
    {% endcompress %}
{% endblock %}
