{% extends "base.html" %}

{% block title %}Bearbeite {{ filename }}{% endblock %}

{% block content %}
<div class="container my-5">
  <h1>Bearbeite Konfiguration</h1>
  <h4 class="text-muted mb-4">{{ filename }}</h4>

  {% if error %}
    <div class="alert alert-danger alert-dismissible fade show" role="alert">
      {{ error }}
      <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
    </div>
  {% endif %}

  <form method="POST">
    <div class="mb-3">
      <label for="config_content" class="form-label">JSON-Inhalt (achte auf gültiges Format):</label>
      <textarea class="form-control font-monospace" id="config_content" name="config_content" rows="20">{{ content }}</textarea>
    </div>
    <div class="d-flex gap-3">
      <button type="submit" class="btn btn-primary btn-lg px-5">Speichern</button>
      <a href="{{ url_for('admin.admin') }}" class="btn btn-outline-secondary btn-lg px-5">Abbrechen</a>
    </div>
  </form>

  <div class="mt-5">
    <h5>Hilfe – Beispielstruktur</h5>
    <pre class="bg-light p-3 rounded">
{
  "name": "BR 01 Dampflok",
  "image": "br01.jpg",
  "hub_id": 0,
  "hub_type": "6channel",
  "channels": [
    {"port": "A", "type": "motor", "name": "Fahrtrichtung", "invert": false},
    {"port": "C", "type": "light", "name": "Spitzenlicht", "on_value": 1.0}
  ]
}
    </pre>
  </div>
</div>
{% endblock %}