{% extends "multifactor/base.html" %}
{% load static i18n %}

{% block card_title %}{% trans "Multi-Factor Verification" %}{% endblock %}
{% block container_class %}{% endblock %}

{% block content %}
{% if can_edit %}
<a class="button home-add is-light" href="{% url 'multifactor:add' %}">{% trans "Add New Factor" %} ➕</a>
{% endif %}

<p>{% trans "To keep your account secure, you can add one or more secondary authentication factors. These are commonly USB keys, or codes acquired through a secure mechanism like an authenticator." %}</p>

<table class="table is-striped">
	<tbody>
		{% for factor in factors %}
		<tr>
			<td>
				<h3><a href="{% url 'multifactor:rename' factor.pk %}" title="{% trans 'Click to rename' %}">
					{{ factor.display_name }}
				</a></h3>
				<p>{% blocktrans with added=factor.added_on.date %}Added {{ added }}.{% endblocktrans %} {% if factor.last_used %}{% blocktrans with used=factor.last_used|timesince %}Used {{ used }} ago.{% endblocktrans %}{% else %}{% trans "Never used." %}{% endif %}</p>
			</td>
			<td>
				{% if factor.id in authed_kids %}
					<a class="button disabled" href="#" title="{% trans 'Unlocked' %}">🔓</a>
				{% elif factor.enabled %}
					<a class="button is-light" href="{% url factor.auth_url %}" title="{% trans 'Locked, click to authenticate' %}">🔒</a>
				{% endif %}
				{% if can_edit %}
				<form action="{% url 'multifactor:action' 'toggle_factor' factor.pk %}" method="POST">
					{% csrf_token %}
					<button type="submit" name="kid" value="{{factor.pk}}" class="button is-toggle is-toggled-{{factor.enabled|yesno:'on,off'}}">{% if factor.enabled %}{% trans "Enabled" %}{% else %}{% trans "Disabled" %}{% endif %}</button>
				</form>
				<form action="{% url 'multifactor:action' 'delete_factor' factor.pk %}" method="POST">
					{% csrf_token %}
					<button type="submit" name="kid" value="{{factor.pk}}" class="button is-danger delete-button"><span>{% trans "Delete" %}</span></button>
				</form>
				{% endif %}
			</td>
		</tr>
		{% endfor %}
		<tr>
			<td>
				<strong>{% trans "Fallback verification factors" %}</strong>
				<p>{% trans "Consider turning these off for higher security." %}</p>
			</td>
			<td>
				{% csrf_token %}
				{% for fb_name, fb_enabled, fb_destination in available_fallbacks %}
				<form method="POST" action="{% url 'multifactor:action' 'toggle_fallback' fb_name %}">
					{% csrf_token %}
					<button type="submit" class="button button-ml  is-toggle is-toggled-{{fb_enabled|yesno:'on,off'}}" title="{% if fb_enabled %}{% blocktrans with name=fb_name %}{{ name }} fallback enabled, click to toggle.{% endblocktrans %}{% else %}{% blocktrans with name=fb_name %}{{ name }} fallback disabled, click to toggle.{% endblocktrans %}{% endif %}" {% if not can_edit %} disabled{% endif %}>
						<span>{{fb_name}} {{ fb_enabled|yesno:'✔,✗' }}</span>
						<small class="d-block">{{fb_destination}}</small>
					</button>
				</form>
				{% endfor %}
			</td>
		</tr>
	</tbody>
</table>
{% endblock %}


{% block head %}{% endblock %}