{% extends "base.html" %}
{% comment %}
# SPDX-License-Identifier: AGPL-3.0-or-later
# ToDo: if connection is disabled, no information are visible anymore (Bug)
{% endcomment %}

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

{% block page_head %}
  <link type="text/css" rel="stylesheet"
        href="{% static 'networks/networks.css' %}">
{% endblock %}

{% block content %}

  <div class="row">
    <div class="col-md-8 offset-md-2">
      {% if connection.primary %}
        <div class="alert alert-warning d-flex align-items-center" role="alert">
          <div class="me-2">
            {% icon 'exclamation-triangle' %}
            <span class="visually-hidden">{% trans "Caution:" %}</span>
          </div>
          <div>
            {% blocktrans trimmed %}
              This is the primary connection that {{ box_name }} relies on for
              Internet connectivity. Altering it may render your {{ box_name }}
              unreachable. Ensure that you have other means to access
              {{ box_name }} before altering this connection.
            {% endblocktrans %}
          </div>
        </div>
      {% endif %}

      <div class="btn-toolbar">
        <a href="{% url 'networks:edit' connection.uuid %}"
           class="btn btn-primary" role="button"
           title="{% trans "Edit connection" %}">{% trans "Edit" %}</a>

        {% if active_connection %}
          <form class="form" method="post"
                action="{% url 'networks:deactivate' connection.uuid %}">
            {% csrf_token %}
            <button class="btn btn-default" type="submit">
              {% trans "Deactivate" %}</button>
          </form>
        {% else %}
          <form class="form" method="post"
                action="{% url 'networks:activate' connection.uuid %}">
            {% csrf_token %}
            <button class="btn btn-default" type="submit">
              {% trans "Activate" %}</button>
          </form>
        {% endif %}

        <a href="{% url 'networks:delete' connection.uuid %}"
           class="btn btn-danger button-secondary" role="button"
           title="{% trans "Delete connection" %}">{% trans "Delete" %}</a>
      </div>

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

      <div class="list-group list-group-two-column">
        {% if connection.primary %}
          <div class="list-group-item">
            <span class="primary">{% trans "Primary connection" %}</span>
            <span class="badge text-bg-success secondary">
              {% trans "yes" %}
            </span>
          </div>
        {% endif %}
        <div class="list-group-item">
          <span class="primary">{% trans "Name" %}</span>
          <span class="secondary">{{ connection.id }}</span>
        </div>
      </div>

      {% if device %}
        <h3>{% trans "Device" %}</h3>

        <div class="list-group list-group-two-column">
          <div class="list-group-item">
            <span class="primary">{% trans "State" %}</span>
            <span class="secondary">{{ device.state_string }}</span>
          </div>
          {% if device.state_reason != 'none' %}
            <div class="list-group-item">
              <span class="primary">{% trans "State reason" %}</span>
              <span class="secondary">{{ device.state_reason_string }}</span>
            </div>
          {% endif %}
          <div class="list-group-item">
            <span class="primary">{% trans "Type" %}</span>
            <span class="secondary">{{ device.type_string }}</span>
          </div>
          <div class="list-group-item">
            <span class="primary">{% trans "MAC address" %}</span>
            <span class="secondary">{{ device.hw_address }}</span>
          </div>
          <div class="list-group-item">
            <span class="primary">{% trans "Interface" %}</span>
            <span class="secondary">{{ device.interface_name }}</span>
          </div>
          <div class="list-group-item">
            <span class="primary">{% trans "Description" %}</span>
            <span class="secondary">{{ device.description }}</span>
          </div>
        </div>
      {% endif %}

      <h3>{% trans "Physical Link" %}</h3>

      <div class="list-group list-group-two-column">
        {% if device.ethernet %}
          <div class="list-group-item">
            <span class="primary">{% trans "Link state" %}</span>
            {% if device.ethernet.carrier %}
              <span class='badge text-bg-success secondary'>
                {% trans "cable is connected" %}</span>
            {% else %}
              <span class='badge text-bg-warning secondary'>
                {% trans "please check cable" %}</span>
            {% endif %}
          </div>
          <div class="list-group-item">
            <span class="primary">{% trans "Speed" %}</span>
            <span class="secondary">
              {% blocktrans trimmed with ethernet_speed=device.ethernet.speed %}
                {{ ethernet_speed }} Mbit/s
              {% endblocktrans %}
            </span>
          </div>
        {% endif %}

        {% if connection.type == "802-11-wireless" %}
          <div class="list-group-item">
            <span class="primary">{% trans "SSID" %}</span>
            <span class="secondary">{{ connection.wireless.ssid }}</span>
          </div>
          {% if device %}
            <div class="list-group-item">
              <span class="primary">{% trans "Speed" %}</span>
              <span class="secondary">
                {% blocktrans trimmed with wireless_bitrate=device.wireless.bitrate %}
                  {{ wireless_bitrate }} Mbit/s
                {% endblocktrans %}
              </span>
            </div>
            <div class="list-group-item">
              <span class="primary">{% trans "Mode" %}</span>
              <span class="secondary">{{ connection.wireless.mode_string }}</span>
            </div>
          {% endif %}
          {% if access_point.strength %}
            <div class="list-group-item">
              <span class="primary">{% trans "Signal strength" %}</span>
              <span class="badge text-bg-secondary secondary">
                {{ access_point.strength }}%
              </span>
            </div>
          {% endif %}
          {% if access_point.channel %}
            <div class="list-group-item">
              <span class="primary">{% trans "Channel" %}</span>
              <span class="secondary">{{ access_point.channel }}</span>
            </div>
          {% endif %}
        {% endif %}
      </div>

      {% if active_connection %}
        <h3>{% trans "IPv4" %}</h3>

        <div class="list-group list-group-two-column">
          {% if connection.ipv4.method %}
            <div class="list-group-item">
              <span class="primary">{% trans "Method" %}</span>
              <span class="secondary">
                {{ connection.ipv4.method_string }}
              </span>
            </div>
          {% endif %}

          {% for address in device.ip4.addresses %}
            <div class="list-group-item">
              <span class="primary">{% trans "IP address" %}</span>
              <span class="secondary">
                {{ address.address }}/{{ address.prefix }}
              </span>
            </div>
          {% endfor %}

          {% if device.ip4.gateway %}
            <div class="list-group-item">
              <span class="primary">{% trans "Gateway" %}</span>
              <span class="secondary">{{ device.ip4.gateway }}</span>
            </div>
          {% endif %}

          {% for server in device.ip4.nameservers %}
            <div class="list-group-item">
              <span class="primary">{% trans "DNS server" %}</span>
              <span class="secondary">{{ server }}</span>
            </div>
          {% endfor %}

          {% if active_connection.ip4.default %}
            <div class="list-group-item">
              <span class="primary">{% trans "Default" %}</span>
              <span class="secondary">{% trans "yes" %}</span>
            </div>
          {% endif %}
        </div>

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

        <div class="list-group list-group-two-column">
          {% if connection.ipv6.method %}
            <div class="list-group-item">
              <span class="primary">{% trans "Method" %}</span>
              <span class="secondary">{{ connection.ipv6.method_string }}</span>
            </div>
          {% endif %}

          {% for address in device.ip6.addresses %}
            <div class="list-group-item">
              <span class="primary">{% trans "IP address" %}</span>
              <span class="secondary">
                {{ address.address }}/{{ address.prefix }}
              </span>
            </div>
          {% endfor %}

          {% if device.ip6.gateway %}
            <div class="list-group-item">
              <span class="primary">{% trans "Gateway" %}</span>
              <span class="secondary">{{ device.ip6.gateway }}</span>
            </div>
          {% endif %}

          {% for server in device.ip6.nameservers %}
            <div class="list-group-item">
              <span class="primary">{% trans "DNS server" %}</span>
              <span class="secondary">{{ server }}</span>
            </div>
          {% endfor %}

          {% if active_connection.ip6.default %}
            <div class="list-group-item">
              <span class="primary">{% trans "Default" %}</span>
              <span class="secondary">{% trans "yes" %}</span>
            </div>
          {% endif %}
        </div>
      {% else %}
        <h3>{% trans "Status" %}</h3>

        <p>{% trans "This connection is not active." %}</p>
      {% endif %}

      {% if is_resolved_installed %}
        <h3>{% trans "Privacy" %}</h3>

        <div class="list-group list-group-two-column">
          <div class="list-group-item">
            <span class="primary">{% trans "DNS-over-TLS" %}</span>
            <span class="secondary">{{ connection.dns_over_tls_string }}</span>
          </div>
        </div>
      {% endif %}

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

      {% if connection.zone == "internal" %}
        <div class="list-group list-group-two-column">
          <div class="list-group-item">
            <span class="primary">{% trans "Firewall zone" %}</span>
            <span class="badge text-bg-success secondary">
              {{ connection.zone_string }}
            </span>
          </div>
        </div>

        <div class="alert alert-info d-flex align-items-center" role="alert">
          <div class="me-2">
            {% icon 'info-circle' %}
            <span class="visually-hidden">{% trans "Info:" %}</span>
          </div>
          <div>
            {% blocktrans trimmed %}
              This interface should be connected to a local
              network/machine.  If you connect this interface to a
              public network, services meant to be available only
              internally will become available externally.  This is a
              security risk.
            {% endblocktrans %}
          </div>
        </div>
      {% elif connection.zone == "external" %}
        <div class="list-group list-group-two-column">
          <div class="list-group-item">
            <span class="primary">{% trans "Firewall zone" %}</span>
            <span class="badge text-bg-warning secondary">
              {{ connection.zone_string }}
            </span>
          </div>
        </div>

        <div class="alert alert-info d-flex align-items-center" role="alert">
          <div class="me-2">
            {% icon 'info-circle' %}
            <span class="visually-hidden">{% trans "Info:" %}</span>
          </div>
          <div>
            {% blocktrans trimmed %}
              This interface should receive your Internet connection.
              If you connect it to a local network/machine, many
              services meant to available only internally will not be
              available.
            {% endblocktrans %}
          </div>
        </div>
      {% else %}
        <div class="list-group list-group-two-column">
          <div class="list-group-item">
            <span class="primary">{% trans "Firewall zone" %}</span>
            <span class="badge text-bg-danger secondary">
              {% trans "External" %}
            </span>
          </div>
        </div>

        <div class="alert alert-info d-flex align-items-center" role="alert">
          <div class="me-2">
            {% icon 'info-circle' %}
            <span class="visually-hidden">{% trans "Info:" %}</span>
          </div>
          <div>
            {% blocktrans trimmed %}
              This interface is not maintained by {{ box_name }}.  For security,
              it is automatically assigned to the external zone.
            {% endblocktrans %}
            {% blocktrans trimmed %}
              This interface should receive your Internet connection.
              If you connect it to a local network/machine, many
              services meant to available only internally will not be
              available.
            {% endblocktrans %}
          </div>
        </div>
      {% endif %}
    </div>
  </div>
{% endblock %}
