busylight_modular/templates/zentrale.html

<!DOCTYPE html>
<html lang="de">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Zentrale - Busylight</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.2/font/bootstrap-icons.min.css" rel="stylesheet">
</head>
<body class="bg-light">
<div class="container">
<div class="row justify-content-center mt-4 mb-5">
<div class="col-md-5">
<div class="card shadow-sm">
<div class="card-body p-4">

    <div class="text-center mb-4">
        <img src="{{ logo_url() }}" alt="Logo" style="height: 40px;" class="mb-2">
        <h5 class="mb-0">Zentrale besetzen</h5>
    </div>

    {# ── Rueckmeldung der letzten Aktion ───────────────────────────────── #}
    {% if done == 'uebernommen' %}
        <div class="alert alert-success py-2"><small><i class="bi bi-check-circle"></i>
            Du sitzt jetzt auf der Zentrale.</small></div>
    {% elif done == 'bereits' %}
        <div class="alert alert-info py-2"><small><i class="bi bi-info-circle"></i>
            Du warst schon auf der Zentrale eingetragen. Das Licht wurde neu gesetzt.</small></div>
    {% elif done == 'zurueck' %}
        <div class="alert alert-success py-2"><small><i class="bi bi-check-circle"></i>
            Zurueck auf dem eigenen Tuerschild.</small></div>
    {% elif done == 'abgemeldet' %}
        <div class="alert alert-success py-2"><small><i class="bi bi-check-circle"></i>
            Von der Zentrale abgemeldet.</small></div>
    {% elif done == 'stammplatz_hier' %}
        <div class="alert alert-info py-2"><small><i class="bi bi-info-circle"></i>
            Die Zentrale ist dein eigener Platz - es gibt nichts zurueckzusetzen.</small></div>
    {% elif done == 'err_unbekannt' %}
        <div class="alert alert-danger py-2"><small><i class="bi bi-x-circle"></i>
            Die Durchwahl {{ extension }} ist keinem aktiven Benutzer zugeordnet.</small></div>
    {% elif done == 'err_nicht_eingerichtet' %}
        <div class="alert alert-warning py-2"><small><i class="bi bi-gear"></i>
            Die Zentrale ist noch nicht eingerichtet.</small></div>
    {% elif done == 'err_heimat_belegt' %}
        <div class="alert alert-danger py-2"><small><i class="bi bi-x-circle"></i>
            Dein eigenes Tuerschild ist inzwischen
            {%- if home_blocker %} {{ home_blocker }}{% else %} jemand anderem{% endif %} zugeordnet.
            Es wurde nichts geaendert - bitte den Administrator ansprechen.</small></div>
    {% elif done == 'err_nichts_zu_tun' %}
        <div class="alert alert-danger py-2"><small><i class="bi bi-x-circle"></i>
            Du sitzt nicht auf der Zentrale und es ist kein eigenes Tuerschild gemerkt.</small></div>
    {% elif done == 'err_stammplatz_fremd' %}
        <div class="alert alert-warning py-2"><small><i class="bi bi-exclamation-triangle"></i>
            Die Zentrale ist dein eigener Platz, aktuell hat sie jemand anderes.
            Mit "Zentrale uebernehmen" holst du sie zurueck.</small></div>
    {% endif %}

    {% if not target %}
        <div class="alert alert-warning py-2 mb-0">
            <small><i class="bi bi-gear"></i>
                Die Zentrale ist noch nicht eingerichtet. Unter
                <strong>Einstellungen &gt; Zentrale</strong> muss ein Busylight und ein
                Segment ausgewaehlt werden.</small>
        </div>
    {% else %}

    {# ── Zustand der Zentrale, immer sichtbar ──────────────────────────── #}
    <div class="border rounded p-3 mb-3 bg-white">
        <small class="text-muted d-block">Busylight der Zentrale</small>
        <strong>{{ target.name }}</strong>
        <small class="text-muted">(Segment {{ target.segment }})</small>
        <hr class="my-2">
        {% if occupant %}
            <small class="text-muted d-block">Aktuell besetzt von</small>
            <strong class="{% if is_here %}text-primary{% else %}text-success{% endif %}">
                <i class="bi bi-person-fill"></i> {{ occupant.display_name }}
                {%- if is_here %} <span class="badge bg-primary">das bist du</span>{% endif %}
            </strong>
            {% if occupant_is_owner %}
            <div><small class="text-muted">Das ist der Stammplatz dieser Person.</small></div>
            {% endif %}
        {% else %}
            <small class="text-muted d-block">Aktuell besetzt von</small>
            <span class="text-muted"><i class="bi bi-person-dash"></i> niemand - die Zentrale ist frei</span>
        {% endif %}
        {% if owner_waiting %}
        <div class="mt-2"><small class="text-muted">
            <i class="bi bi-hourglass-split"></i>
            {{ owner_waiting }} gehoert auf die Zentrale und kommt automatisch zurueck,
            sobald sie freigegeben wird.
        </small></div>
        {% endif %}
    </div>

    {% if not user %}
        {# ── Schritt 1: Wer bist du? ──────────────────────────────────── #}
        <form method="get" action="/zentrale">
            <div class="mb-3">
                <label class="form-label">Eigene Telefon-Durchwahl</label>
                <input type="text" name="durchwahl" class="form-control form-control-lg text-center"
                       inputmode="numeric" autocomplete="off" autofocus required
                       value="{{ extension }}" placeholder="z.B. 123">
                <small class="text-muted">
                    Im naechsten Schritt siehst du, was du tun kannst - es wird noch nichts geaendert.
                </small>
            </div>
            <button type="submit" class="btn btn-primary w-100">
                <i class="bi bi-arrow-right-circle"></i> Weiter
            </button>
        </form>
    {% else %}
        {# ── Schritt 2: Zustand und passende Aktionen ──────────────────── #}
        <div class="text-center mb-3">
            <small class="text-muted d-block">Durchwahl {{ user.phone_extension }}</small>
            <strong>{{ user.display_name }}</strong>
        </div>

        {% if is_owner and is_here %}
            <div class="alert alert-info py-2">
                <small><i class="bi bi-house-check"></i>
                    Die Zentrale ist dein eigener Platz und du sitzt darauf.
                    Hier ist nichts zu tun - jemand anderes kann sie jederzeit uebernehmen,
                    danach kommst du automatisch zurueck.</small>
            </div>

        {% elif is_here %}
            <div class="alert alert-primary py-2">
                <small><i class="bi bi-person-check"></i>
                    Du sitzt aktuell auf der Zentrale.
                    {% if home %}
                        Dein eigenes Tuerschild ({{ home.name or home.hostname }}, Segment {{ home.segment }})
                        ist bis zur Rueckkehr ausgeschaltet.
                    {% endif %}
                </small>
            </div>
            <form method="post" action="/api/zentrale/verlassen" class="mb-2">
                <input type="hidden" name="extension" value="{{ user.phone_extension }}">
                <button type="submit" class="btn btn-primary w-100">
                    <i class="bi bi-box-arrow-left"></i> Zurueck auf mein Tuerschild
                </button>
            </form>
            {% if home_blocker %}
            <div class="alert alert-warning py-2 mb-0">
                <small><i class="bi bi-exclamation-triangle"></i>
                    Achtung: dein Tuerschild ist derzeit {{ home_blocker }} zugeordnet.
                    Die Rueckkehr wird abgelehnt, solange das so ist.</small>
            </div>
            {% endif %}

        {% else %}
            <form method="post" action="/api/zentrale/uebernehmen" class="mb-2">
                <input type="hidden" name="extension" value="{{ user.phone_extension }}">
                <button type="submit" class="btn btn-primary w-100">
                    <i class="bi bi-box-arrow-in-right"></i>
                    {% if occupant %}Zentrale uebernehmen{% else %}Zentrale besetzen{% endif %}
                </button>
                <small class="text-muted">
                    {% if occupant and occupant_is_owner %}
                        {{ occupant.display_name }} gehoert auf die Zentrale und kommt automatisch
                        zurueck, sobald du sie wieder freigibst.
                    {% elif occupant %}
                        {{ occupant.display_name }} wird dabei auf das eigene Tuerschild zurueckgesetzt.
                    {% else %}
                        Die Zentrale ist frei.
                    {% endif %}
                </small>
            </form>

            {% if home %}
            <form method="post" action="/api/zentrale/verlassen">
                <button type="submit" class="btn btn-outline-secondary w-100 btn-sm">
                    <i class="bi bi-box-arrow-left"></i> Zurueck auf mein Tuerschild
                </button>
                <input type="hidden" name="extension" value="{{ user.phone_extension }}">
                <small class="text-muted">
                    Gemerkt: {{ home.name or home.hostname }}, Segment {{ home.segment }}.
                </small>
            </form>
            {% endif %}
        {% endif %}

        <div class="text-center mt-3">
            <a href="/zentrale/{{ user.phone_extension }}" class="text-muted small me-3">
                <i class="bi bi-arrow-clockwise"></i> Aktualisieren
            </a>
            <a href="/zentrale" class="text-muted small">Andere Durchwahl</a>
        </div>
        <div class="text-center mt-2">
            <small class="text-secondary" style="font-size:0.7rem">
                Diese Seite als Lesezeichen: <code>/zentrale/{{ user.phone_extension }}</code>
            </small>
        </div>
    {% endif %}
    {% endif %}

    <div class="text-center mt-4">
        <small class="text-secondary" style="font-size:0.65rem">&copy; cynfo GmbH</small>
    </div>

</div>
</div>
</div>
</div>
</div>
</body>
</html>