{% extends 'ddm_core/page_with_form.html' %}

{% block page_title %}Project Access Token{% endblock %}

{% block main_heading %}Manage Project Access Token{% endblock %}

{% block main_top %}
<div class="mt-3">
  <p>
    The collected data of a project can be accessed remotely through the download API.
    For this to work, an access token must be created. Access tokens are project-specific.
    <br>
    Access tokens are valid for a limited time (maximum 90 days). After the current token has expired, a new one must be created.
  </p>
  <p>
    The download API endpoint for this project is <code class="text-dark">https://{{ request.get_host }}/api/project/{{ project.url_id }}/data/</code>.<br>
    When making a request, prefix your token with "Token " and include this string in the Authorization HTTP header.
    {% if project.super_secret %}
    Because this is a super secret project, the secret must also be provided in an HTTP header named "Super-Secret" (e.g., <code class="text-dark">GET https://{{ request.get_host }}/{{ project.url_id }}/download/ -H 'Authorization: Token 9944b09199c62bcf9418ad846dd0e4bbdfc6ee4b' -H 'Super-Secret: y0urSuperSecr3t'</code>).
    {% else %}
    (e.g., <code class="text-dark">GET https://{{ request.get_host }}/api/project/{{ project.url_id }}/data/ -H 'Authorization: Token 9944b09199c62bcf9418ad846dd0e4bbdfc6ee4b'</code>).
    {% endif %}
  </p>
  An example on how this can be used to retrieve the data directly from within your R- or Python-scripts can be found <a>here</a>. <!-- TODO: Link to example in documentation. -->
</div>

<div class="ddm-admin-section">
  <div class="ddm-admin-section-header">Current Token</div>
  <div class="ddm-admin-section-body">
    <div>
      {% if token %}
      <div>
        <div class="row">
          <div class="col">
            <div><label>Token</label></div>
            <div>{{ token.key }}</div>
          </div>
          <div class="col">
            <div><label>Created on</label></div>
            <div>{{ token.created|date:"M d, Y, H:i" }}</div>
          </div>
          <div class="col">
            <div><label>Expires on</label></div>
            <div>{{ token.expiration_date|date:"M d, Y, H:i" }}</div>
          </div>
          <div class="col">
            <div><label>Satus</label></div>
            <div>{% if token.has_expired %}<span class="badge bg-danger">Invalid</span>{% else %}<span class="badge bg-success">valid</span>{% endif %}</div>
          </div>
        </div>
        <form method='post'>
          {% csrf_token %}
          {{ form.media }}
          <input type="hidden" id="delete-token" name="action" value="delete">
          <button
              class="ddm-btn ddm-btn-red"
              data-bs-toggle="modal"
              data-bs-target="#delete-token-modal"
              type="button"
          >
            Delete Token
          </button>

          {# Modal for participant deletion #}
          <div class="modal" id="delete-token-modal" data-bs-backdrop="static" tabindex="-1" aria-hidden="true">
            <div class="modal-dialog modal-xl modal-dialog-centered">
              <div class="modal-content">
                <div class="modal-body">
                  <h4>Delete Token</h4>
                  <p>Are you sure you want to delete the current API token?</p>

                </div>
                <div class="modal-footer">
                  <button
                      type="button"
                      class="ddm-btn"
                      data-bs-dismiss="modal">
                    Cancel
                  </button>
                  <input
                      id="delete-token-button"
                      class="ddm-btn ddm-btn-red"
                      data-bs-dismiss="modal"
                      type="submit"
                      value="Delete Token"
                  >
                </div>
              </div>
            </div>
          </div>

        </form>
      </div>
      {% else %}
      <p>A token has yet to be created.</p>
      {% endif %}
    </div>
  </div>
</div>
{% endblock %}


{% block main_form_header %}Create new Token{% endblock %}

{% block main_form %}
  {% if token %}
    <p>Delete current token to create a new one.</p>
  {% else %}
  <form method='post'>
    {% csrf_token %}
    {{ form.media }}

    <div>
      {% if form.errors %}
      <p class="error-disclaimer"><i class="bi bi-exclamation-square-fill"></i> The form could not be processed. Please
        check the issues highlighted below.</p>
      {% endif %}

      {{ form.non_field_errors }}

      {% for field in form %}
      {% if field.name in 'expiration_days' %}
      <p>The new token expires in {{ field }} days.</p>
      <p>The new token will overwrite the existing one and the current token will no longer work.</p>
      {% else %}
      {{ field }}
      {% endif %}
      {% endfor %}
      <input class="ddm-btn" type="submit" value="Create Token">
      {% block cancel %}
      <p>
        <a href="{% url 'ddm_projects:detail' project.url_id %}"><i class="bi bi-arrow-left-short"></i> Back</a>
      </p>
      {% endblock %}
    </div>
  </form>
  {% endif %}
{% endblock %}

{% block breadcrumbs %}
<a href="{% url 'ddm_projects:list' %}">Projects</a> /
<a href="{% url 'ddm_projects:detail' project.url_id %}">"{{ project.name|truncatechars:15 }}" Project</a> /
Manage Access Token
{% endblock %}
