{% call macros.panel("info", "Step 1 - Initial configuration") %}
<p>Before starting, some variables must be set.</p>

<div class="form-group">
  <label>Mailu storage path: </label>
<!--   Validates path -->
  <input class="form-control" type="text" name="root" value="/mailu" required pattern="^\/[\-_A-Za-z0-9\.]+(\/[\-_A-Za-z0-9\.]*)*">
</div>

<p>In the following sections we need to set the postmaster address. This is a combination of the <i>postmaster</i> local part and the <i>main mail domain</i>.
The <i>main mail domain</i> is also used as </i>"server display name"</i>. This is the way the SMTP server identifies itself when connecting to others.
The Postmaster will get an e-mail address &lt;postmaster&gt;@&lt;main_domain&gt;. This address will receive the DMARC "rua" and "ruf" reports.
Or in plain English: if receivers start to classify your mail as spam, this postmaster will be informed.</p>

<div class="form-group">
  <label>
    Main mail domain and server display name.
  </label>
<!--   Validates domain name -->
  <input class="form-control" type="text" name="domain" placeholder="e.g. mailu.io"
  		required pattern="^([a-z0-9]+(-[a-z0-9]+)*\.)+[a-z]{2,}$">
</div>

<div class="form-group">
  <label>Postmaster local part</label>
  <input class="form-control" type="text" name="postmaster" value="admin" required>
</div>

<div class="form-group">
  <label>Choose how you wish to handle security <a href="https://mailu.io/{{ version }}/compose/setup.html#tls-certificates">TLS certificates</a></label>
  <br/>
  <select class="btn btn-primary dropdown-toggle" name="tls_flavor">
  	{% for tlsflavor in ["letsencrypt", "cert", "notls", "mail", "mail-letsencrypt"] %}
  	<option value="{{ tlsflavor }}" >{{ tlsflavor }}</option>
  	{% endfor %}
  </select>
</div>

<div class="form-group">
  <label>Authentication rate limit per IP for failed login attempts on unique non-existing accounts (password spraying counter-measure)</label>
  <!--   Validates number input only -->
  <p><input class="form-control" style="width: 9%; display: inline;" type="number" name="auth_ratelimit_ip" value="5" required > / hour
  </p>
</div>

<div class="form-group">
  <label>Authentication rate limit per user</label>
  <!--   Validates number input only -->
  <p><input class="form-control" style="width: 9%; display: inline;" type="number" name="auth_ratelimit_user"
  		value="50" required > / day
  </p>
</div>

<div class="form-group">
  <label>Outgoing message rate limit (per user)</label>
  <!--   Validates number input only -->
  <p><input class="form-control" style="width: 7%; display: inline;" type="number" name="message_ratelimit_pd" value="200" required > / day
  </p>
</div>

<div class="form-check form-check-inline">
  <label class="form-check-label">
    <input class="form-check-input" type="checkbox" name="statistics_enabled"  value="True">
    Opt-in for anonymized statistics
  </label>
</div>

<div class="form-group">
  <label>Website name</label>
  <input class="form-control" type="text" name="site_name" value="Mailu" required>
</div>

<div class="form-group">
  <label>Linked Website URL</label>
<!--   Validates url with or without https:// -->
  <input class="form-control" type="url" name="website" value="https://mailu.io" required
		pattern="^(https?://)?([a-zA-Z0-9]([a-zA-ZäöüÄÖÜ0-9\-]{0,61}[a-zA-Z0-9])?\.)+[a-zA-Z]{2,}$">
</div>

<p>The admin interface is the main Mailu-specific bit, it provides tools to
manage your email domains, users, etc.</p>

<div class="form-group">
    <input type="checkbox" name="admin_enabled" value="true" id="admin" checked>
  	<label>Enable the admin UI</label>
</div>

<p>The API interface is a RESTful API for changing the Mailu configuration.
  Anything that can be configured via the Mailu web administration interface,
  can also be configured via the RESTful API. For enabling the API, an API token must be configured.
  It is not possible to use the API without an API token.</p>

  <div class="form-group">
      <input type="checkbox" name="api_enabled" value="true" id="api_enabled" >
      <label>Enable the API</label>
      <br>
      <label name="api_token_label" id="api_token_label">API token</label>
      <input class="form-control" type="text" name="api_token" id="api_token" style="display: none" value="{{ secret(32) }}">
  </div>

{% endcall %}