{% extends 'swimmonitor/base.html.twig' %}

{% block title %}Einstellungen{% endblock %}
{% block page_modifier %} sm-page--narrow{% endblock %}

{% block breadcrumb %}<li>Administration</li><li>Einstellungen</li>{% endblock %}

{% block page_head %}
    <div>
        <h1>Einstellungen</h1>
        <p class="sm-lead">Systemweite Werte für Benachrichtigungen und das TV-Dashboard.</p>
    </div>
{% endblock %}

{% block content %}
    <form method="post" class="sm-panel">
        <div class="sm-panel-body sm-form">
            <fieldset class="sm-fieldset">
                <legend>Benachrichtigungen</legend>
                <label for="emails" class="form-label">E-Mail-Empfänger bei Warnungen und Alarmen</label>
                <input type="text" name="emails" id="emails" class="form-control sm-mono" value="{{ currentEmails }}"
                       placeholder="name@beispiel.de, zweite@beispiel.de" required aria-describedby="emails-help">
                <div class="form-text" id="emails-help">Mehrere Adressen durch Komma trennen.</div>
            </fieldset>

            <fieldset class="sm-fieldset">
                <legend>TV-Dashboard</legend>
                <label for="tv_carousel_duration" class="form-label">Anzeigedauer pro Container</label>
                <div class="input-group sm-input-narrow">
                    <input type="number" name="tv_carousel_duration" id="tv_carousel_duration" class="form-control sm-num"
                           value="{{ tvSettings.carousel_duration|default(10) }}" min="5" max="60" step="1" required aria-describedby="tv-help">
                    <span class="input-group-text">Sekunden</span>
                </div>
                <div class="form-text" id="tv-help">Zeit bis zum Wechsel auf den nächsten Container. Empfohlen sind 10 bis 15 Sekunden.</div>
            </fieldset>
        </div>
        <div class="sm-panel-foot">
            <button type="submit" class="btn btn-primary">Einstellungen speichern</button>
        </div>
    </form>
{% endblock %}