{% extends "base.html" %}
{% from "partials/macros.html" import avatar, nav_icon %}
{% block title %}Optionen · Putzliga{% endblock %}
{% block page_title %}Optionen{% endblock %}
{% block content %}
  <section class="two-column">
    <article class="panel">
      <p class="eyebrow">Profil & Benachrichtigungen</p>
      <h2>Persönliche Einstellungen</h2>
      <form method="post" enctype="multipart/form-data" class="form-grid">
        {{ form.hidden_tag() }}
        <div class="field">
          {{ form.name.label }}
          {{ form.name() }}
          {% for error in form.name.errors %}<small class="error">{{ error }}</small>{% endfor %}
        </div>
        <div class="field">
          {{ form.email.label }}
          {{ form.email() }}
          {% for error in form.email.errors %}<small class="error">{{ error }}</small>{% endfor %}
        </div>
        <div class="field">
          {{ form.password.label }}
          {{ form.password(placeholder="Leer lassen, wenn nichts geändert werden soll") }}
          {% for error in form.password.errors %}<small class="error">{{ error }}</small>{% endfor %}
        </div>
        <div class="field">
          {{ form.avatar.label }}
          {{ form.avatar() }}
          {% for error in form.avatar.errors %}<small class="error">{{ error }}</small>{% endfor %}
        </div>
        <label class="checkbox">
          {{ form.notification_task_due_enabled() }}
          <span>Push für heute oder morgen fällige Aufgaben</span>
        </label>
        <label class="checkbox">
          {{ form.notification_monthly_winner_enabled() }}
          <span>Push zum Monatssieger am 1. um 09:00 Uhr</span>
        </label>
        {{ form.submit(class_='button') }}
      </form>
    </article>

    <article class="panel">
      <p class="eyebrow">Push & App-Install</p>
      <h2>Web-Push vorbereiten</h2>
      <p class="muted">Putzliga nutzt echten Web-Push mit Service Worker und gespeicherten Subscriptions. Auf iPhone funktioniert das nur, wenn die App zum Home-Bildschirm hinzugefügt wurde.</p>
      <div class="push-box">
        <div class="push-box__state {% if push_ready %}is-ready{% else %}is-disabled{% endif %}">
          {{ nav_icon('bell') }}
          <div>
            <strong>{% if push_ready %}VAPID konfiguriert{% else %}VAPID fehlt{% endif %}</strong>
            <p>{% if push_ready %}Push kann im Browser aktiviert werden.{% else %}Bitte zuerst Public/Private Key in der Umgebung setzen.{% endif %}</p>
          </div>
        </div>
        <button
          type="button"
          class="button button--wide"
          id="pushToggle"
          {% if not push_ready %}disabled{% endif %}
          data-subscribed="{{ '1' if has_subscription else '0' }}"
        >
          {% if has_subscription %}Push deaktivieren{% else %}Push aktivieren{% endif %}
        </button>
        <p class="inline-note" id="pushHint">
          Auf iPhone/iPad bitte zuerst in Safari zum Home-Bildschirm hinzufügen und als Web-App öffnen.
        </p>
      </div>
    </article>
  </section>

  <section class="panel">
    <p class="eyebrow">Gamification</p>
    <h2>Badge-Regeln pflegen</h2>
    {% if current_user.is_admin %}
      <div class="badge-settings">
        {% for badge in badges %}
          <form method="post" action="{{ url_for('settings.update_badge', badge_id=badge.id) }}" class="badge-setting-card">
            <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
            <div>
              <strong>{{ badge.name }}</strong>
              <p class="muted">{{ badge.description }}</p>
            </div>
            <div class="field field--compact">
              <label>Schwelle</label>
              <input type="number" name="threshold" min="1" value="{{ badge.threshold }}">
            </div>
            <div class="field field--compact">
              <label>Bonus</label>
              <input type="number" name="bonus_points" min="0" value="{{ badge.bonus_points }}">
            </div>
            <label class="checkbox checkbox--compact">
              <input type="checkbox" name="active" {% if badge.active %}checked{% endif %}>
              <span>Aktiv</span>
            </label>
            <button type="submit" class="button button--secondary">Badge speichern</button>
          </form>
        {% endfor %}
      </div>
    {% else %}
      <p class="muted">Badge-Regeln können nur von einem Admin geändert werden.</p>
    {% endif %}
  </section>

  {% if current_user.is_admin %}
    <section class="panel">
      <p class="eyebrow">Admin</p>
      <h2>Nutzerverwaltung</h2>
      <div class="badge-settings">
        <form method="post" action="{{ url_for('settings.create_user') }}" class="badge-setting-card">
          {{ admin_form.hidden_tag() }}
          <div>
            <strong>Neuen Nutzer anlegen</strong>
            <p class="muted">Hier legst du weitere Personen kontrolliert an, ohne freie Registrierung.</p>
          </div>
          <div class="field">
            {{ admin_form.name.label }}
            {{ admin_form.name() }}
          </div>
          <div class="field">
            {{ admin_form.email.label }}
            {{ admin_form.email() }}
          </div>
          <div class="field">
            {{ admin_form.password.label }}
            {{ admin_form.password() }}
          </div>
          <label class="checkbox">
            {{ admin_form.is_admin() }}
            <span>Als Admin anlegen</span>
          </label>
          {{ admin_form.submit(class_='button button--secondary') }}
        </form>
      </div>

      <div class="admin-user-list">
        {% for user in users %}
          <article class="admin-user-card">
            <div class="admin-user-card__identity">
              {{ avatar(user) }}
              <div>
                <strong>{{ user.name }}</strong>
                <p class="muted">{{ user.email }}</p>
              </div>
            </div>
            <div class="chip-row">
              {% if user.is_admin %}
                <span class="reward-chip">Admin</span>
              {% endif %}
              {% if user.id == current_user.id %}
                <span class="point-pill">Du</span>
              {% endif %}
            </div>
            <div class="admin-user-card__actions">
              <form method="post" action="{{ url_for('settings.toggle_admin', user_id=user.id) }}">
                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                <input type="hidden" name="make_admin" value="{{ 0 if user.is_admin else 1 }}">
                <button type="submit" class="button button--ghost">
                  {% if user.is_admin %}Admin entziehen{% else %}Zum Admin machen{% endif %}
                </button>
              </form>
              <form method="post" action="{{ url_for('settings.delete_user', user_id=user.id) }}" onsubmit="return confirm('Diesen Nutzer wirklich entfernen? Zugewiesene Aufgaben bleiben erhalten, aber ohne Person.')">
                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                <button type="submit" class="button button--secondary" {% if user.id == current_user.id %}disabled{% endif %}>
                  Nutzer löschen
                </button>
              </form>
            </div>
          </article>
        {% endfor %}
      </div>
    </section>
  {% endif %}
{% endblock %}