{% extends "gateways/base.html" %}{% load i18n %}
{% block title %}{% translate "Registration code" %} – Rivet{% endblock %}
{% block breadcrumbs %}<nav class="crumbs" aria-label="{% translate "Breadcrumb" %}"><ol>
  <li><a href="{% url 'gateway-list' %}">{% translate "Gateways" %}</a></li><li><span aria-current="page">{% translate "Registration code" %}</span></li>
</ol></nav>{% endblock %}
{% block head %}<style>
  .code { font:700 clamp(1.6rem, 8vw, 2.6rem)/1.2 ui-monospace, monospace; letter-spacing:.08em;
          user-select:all; -webkit-user-select:all; padding:12px; border:2px dashed var(--accent);
          border-radius:10px; text-align:center; margin:8px 0 4px; overflow-wrap:anywhere; }
</style>{% endblock %}
{% block content %}
<h1>{% blocktranslate trimmed with name=code.gateway_name|default:organisation.name %}Registration code for “{{ name }}”{% endblocktranslate %}</h1>
<div class="card">
  <p>{% translate "<strong>Important:</strong> The code is only shown now. Please write it down or copy it." %}</p>
  <div class="code" id="code" aria-label="{% translate "Registration code" %}">{{ code.code }}</div>
  <p class="muted">{% blocktranslate trimmed with zone=rivet_install_zone|default:"–" portal=rivet_portal_host expires=code.expires_at|date:"SHORT_DATETIME_FORMAT" org=organisation.name %}Organisation for the wizard <strong>{{ zone }}</strong> (portal {{ portal }}) · valid until {{ expires }} · single use · {{ org }}{% endblocktranslate %}</p>
  {% translate "Copied" as t_copied %}
  <p><button class="secondary" type="button"
     onclick="navigator.clipboard&&navigator.clipboard.writeText('{{ code.code|escapejs }}').then(()=>{this.textContent='{{ t_copied|escapejs }}'})">{% translate "Copy code" %}</button></p>
</div>
<div class="card">
  <h2>{% translate "Next steps" %}</h2>
  <ol>
    <li>{% blocktranslate trimmed %}Connect the Rivet gateway to the farm network and open its web interface
      (<code>https://rivet.local</code> or the IP address of the device). The access key is on the sticker.{% endblocktranslate %}</li>
    <li>{% translate "Enter in the setup wizard:" %}
      <ul>
        <li>{% blocktranslate trimmed with zone=rivet_install_zone %}this <strong>registration code</strong> and the <strong>organisation</strong> {{ zone }}.{% endblocktranslate %}</li>
      </ul></li>
    <li>{% translate "After registration the gateway appears here under “Gateways” with its address." %}</li>
  </ol>
  <p><a class="btn" href="{% url 'gateway-list' %}">{% translate "Done" %}</a></p>
</div>
{% endblock %}