{% extends 'admin/master.html' %}
{% import 'macro/actions.html' as actionlib with context %}

{% block title %}setup 2fa{% endblock %}

{% block main %}

<div>
  <div>Scan this QR code with your authenticator app:</div>
  <div id="qrimg" data-uri="{{ totp_uri }}"></div>
  <div>Or enter this secret manually: <b>{{ totp_secret }}</b></div>

</div>
{% if not current_user.tfa_enabled %}

{{ actionlib.add_modal_button(url=get_url('.verify_tfa',modal=True,action=url_for('.enable_tfa',enable=True)), btn_class='nav-link', title=gettext('Enable 2FA'),
content=gettext('Enable 2FA')) }}

{{ actionlib.add_modal_window() }}

{% endif %}

{% endblock %}

{% block scripts %}
{%- set _ = template.plugin.enable('qrcode') -%}
{{ super() }}
{% endblock %}

{% block tail %}
{{ super() }}
{{ actionlib.add_modal_js() }}

<script>
  // generate QR code
  let qr = new QrCode(20, 'M');
  let text = document.getElementById('qrimg').dataset.uri;
  qr.addData(text);
  qr.make();
  const qrsvg = qr.createSvgTag(4,4);
  document.getElementById('qrimg').innerHTML = qrsvg;
</script>

{% endblock %}