{% extends "turkle/base.html" %}

{# This is shown to annotators, not for admin site #}

{% block body %}

<div class="container-fluid mt-3">

{% load turkle_tags %}
{% is_installed "consent" as consent_installed %}
{% if consent_installed %}
{% include "consent/banner.html" %}
{% endif %}

{% if form.non_field_errors %}
{% for error in form.non_field_errors %}
<div class="alert alert-error" role="alert">
  <h5 class="card-title" align="center">{{ error }}</h5>
</div>
{% endfor %}
{% endif %}

{% if next %}
  <h5 class="card-title" align="center">
  {% if user.is_authenticated %}
    Your account doesn't have access to this page. To proceed,
    please login with an account that has access.
  {% else %}
    Please login to see this page.
  {% endif %}
  </h5>
{% endif %}

<form method="post" action="{% url 'login' %}">
  {% csrf_token %}
  <div class="col-md-4 offset-md-4">
    <div class="panel panel-primary">
      <div class="form-group">
        <label for="username">Username</label>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text"><i class="glyphicon glyphicon-user"></i></span>
          </div>
          <input type="text" name="username" id="username" class="form-control" required="required" autofocus>
        </div>
      </div>
      <div class="form-group">
        <label for="password">Password</label>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text"><i class="glyphicon glyphicon-lock"></i></span>
          </div>
          <input type="password" name="password" id="password" class="form-control" required="required">
        </div>
      </div>
      <div class="form-group">
        <button class="btn btn-primary form-control">Login</button>
      </div>
    </div>
    {% if turkle_email_enabled %}
    <div>
      <a href="{% url 'password_reset' %}">Reset your Password</a>
    </div>
    {% endif %}
  </div>
  <input type="hidden" name="next" value="{{ next }}">
</form>
</div>

{% endblock %}
