{% extends "kleides_mfa/device_create_form.html" %}

{% load i18n static %}

{% block extra_js %}
<script src="{% static 'js/kleides_mfa/jquery.qrcode.min.js' %}" integrity="sha512-NFUcDlm4V+a2sjPX7gREIXgCSFja9cHtKPOL1zj6QhnE0vcY695MODehqkaGYTLyL2wxe/wtr4Z49SvqXq12UQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script type="text/javascript">
jQuery(function ($) {
    $('#qrcode').qrcode({width: 200, height: 200,text: "{{ form.instance.config_url|escapejs }}"});
});
</script>
{% endblock extra_js %}

{% block form_description %}
<div id="qrcode"></div>

<p>
{% blocktrans with url=form.instance.config_url %}
Scan the QR code with your authentication app or visit the
<a href="{{ url }}">configuration url</a> to import it on your mobile device.<br>
<br>
Then enter the token generated by the app.
{% endblocktrans %}
</p>
{% endblock form_description %}
