{% extends "app.html" %}
{% comment %}
# SPDX-License-Identifier: AGPL-3.0-or-later
{% endcomment %}

{% load bootstrap %}
{% load i18n %}
{% load static %}

{% block page_head %}

  {% if status.setup_running %}
    <noscript>
      <meta http-equiv="refresh" content="3" />
    </noscript>
  {% endif %}

{% endblock %}


{% block status %}

  {% if not status.is_setup and not status.setup_running %}
    <h3>{% trans "Status" %}</h3>

    <p>
      {% blocktrans trimmed %}
        OpenVPN has not yet been setup.  Performing a secure setup
        takes a very long time.  Depending on how fast your
        {{ box_name }} is, it may even take hours.  If the setup
        is interrupted, you may start it again.
      {% endblocktrans %}
    </p>

    <form class="form form-setup" method="post"
          action="{% url 'openvpn:setup' %}">
      {% csrf_token %}

      <input type="submit" class="btn btn-primary"
             value="{% trans "Start setup" %}"/>
    </form>
  {% endif %}

  {% if not status.is_setup and status.setup_running %}
    <h3>{% trans "Status" %}</h3>

    <p class="running-status-parent">
      <span class='running-status loading'></span>
      {% trans "OpenVPN setup is running" %}
    </p>

    <p>
      {% blocktrans trimmed %}
        To perform a secure setup, this process takes a very long
        time.  Depending on how fast your {{ box_name }} is, it may
        even take hours.  If the setup is interrupted, you may start
        it again.
      {% endblocktrans %}
    </p>
  {% endif %}

  {% if status.is_setup %}
    {{ block.super }}
  {% endif %}

{% endblock %}

{% block configuration %}

  {% if status.is_setup %}

    <h3>{% trans "Profile" %}</h3>

    <p>
      {% blocktrans trimmed %}
        To connect to {{ box_name }}'s VPN, you need to download a
        profile and feed it to an OpenVPN client on your mobile or
        desktop machine.  OpenVPN Clients are available for most
        platforms.  Click "Learn more..." above for recommended clients
        and instructions on how to configure them.
      {% endblocktrans %}
    </p>

    <p>
      {% blocktrans trimmed %}
        Profile is specific to each user of {{ box_name }}.  Keep it a
        secret.
      {% endblocktrans %}
    </p>

    <form class="form form-profile" method="post"
          action="{% url 'openvpn:profile' %}">
      {% csrf_token %}

      <input type="submit" class="btn btn-primary"
             value="{% trans "Download my profile" %}"/>
    </form>

  {% endif %}

  {% if status.is_setup %}
    {{ block.super }}
  {% endif %}

{% endblock %}

{% block page_js %}
  {% if status.setup_running %}
    <script type="text/javascript" src="{% static 'theme/js/refresh.js' %}"></script>
  {% endif %}
{% endblock %}
