{% extends "base.html" %}
{% block title %}Home{% endblock %}
{% block content %}
<h2>{{ connection.name }} <span class="muted">({{ connection.prefix }})</span></h2>

{% if load_notice %}
<div class="card" style="border-color:var(--ok,#3a3)">
  <strong>{{ load_notice }}</strong>
</div>
{% endif %}

<div class="card">
  <h3>Active connection</h3>
  <div class="row">
    <div class="col"><span class="muted">Prefix</span><br/>
      <code>{{ connection.prefix }}</code></div>
    <div class="col"><span class="muted">Driver</span><br/>
      <code class="mono">{{ connection.__class__.__module__ }}</code></div>
    <div class="col"><span class="muted">Topics served</span><br/>
      <code class="mono">{{ topics|length }}</code></div>
    <div class="col"><span class="muted">Railroad</span><br/>{{ railroad }}</div>
    {# Command Station power — is the CS itself powered / talking to
       us? Distinct from Track Power (the DCC signal on the rails,
       whose full ON/OFF/IDLE control lives in the card below). This
       is a strict bool: On when the driver's connection is open,
       Off otherwise. #}
    <div class="col"><span class="muted">Command Station Power</span><br/>
      <span id="home-cs-power-badge"
            class="badge {% if command_station_on %}ok{% else %}err{% endif %}">
        {% if command_station_on %}On{% else %}Off{% endif %}
      </span>
    </div>
  </div>
  <p class="muted" style="margin-top:1rem">
    To pick a different driver at startup, open the PMRI launcher,
    switch to the <strong>Startup Options</strong> tab, choose the
    desired default connection, then restart the web service from
    the launcher's <strong>Service</strong> tab.
  </p>
</div>

<div class="card">
  <h3>Profiles</h3>
  {% if settings_root %}
  <p class="muted">Reading from <code class="mono">{{ settings_root }}</code></p>
  {% endif %}
  {% if profile_error %}
  <div class="card" style="border-color:var(--err,#c33)">
    <strong style="color:var(--err,#c33)">Profile operation failed:</strong>
    <span>{{ profile_error }}</span>
  </div>
  {% endif %}
  {% if profiles %}
  <p class="muted">Active profile determines which <code>PanelPro.xml</code>,
    <code>roster.xml</code>, and per-loco data the server uses. Switching
    clears the in-memory bean tables and repopulates them from the new
    profile.</p>
  <form method="post" action="/profiles/load" class="row">
    <label>Pick a profile
      <select name="profile_id">
        {% for p in profiles %}
        <option value="{{ p.id }}"{% if p.id == active_profile_id %} selected{% endif %}>
          {{ p.name }}{% if p.id == active_profile_id %} (active){% endif %}
        </option>
        {% endfor %}
      </select>
    </label>
    <button type="submit">Load</button>
  </form>

  {# Profile CRUD. Create appends a new profile to profiles.xml + mints
     an empty PanelPro.xml. Delete unregisters but leaves the on-disk
     directory alone (so an accidental click through the UI isn't
     data-destructive). The active profile can't be deleted; switch
     first with the picker above. #}
  <h4 style="margin-top:1rem">Manage profiles</h4>
  <form method="post" action="/profiles/create" class="row">
    <label style="flex:1">Create a new profile
      <input type="text" name="name" required pattern="[A-Za-z0-9._-]+"
             placeholder="production" />
    </label>
    <button type="submit">Create</button>
  </form>
  <p class="muted small" style="margin-top:0.5rem">Name must be
    filesystem-safe (no spaces, slashes, or colons). A directory of
    that name is created under the settings root with an empty
    <code>PanelPro.xml</code> — populate it via the picker above or
    the copy-beans widget below.</p>
  <table style="margin-top:0.4rem">
    <thead><tr><th>Name</th><th>Id</th><th></th></tr></thead>
    <tbody>
      {% for p in profiles %}
      <tr>
        <td>{{ p.name }}{% if p.id == active_profile_id %} <span class="badge">active</span>{% endif %}</td>
        <td><code class="mono small">{{ p.id }}</code></td>
        <td>
          {% if p.id != active_profile_id %}
          <form method="post" action="/profiles/{{ p.id }}/delete"
                style="display:inline"
                onsubmit="return confirm('Unregister profile {{ p.name }}? The on-disk directory is left in place.')">
            <button type="submit" class="danger">Unregister</button>
          </form>
          {% else %}
          <span class="muted small">can't delete the active profile</span>
          {% endif %}
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>

  {# Cross-profile bean import. Backed by the ``beanTransfer`` JSON
     service. Preview shows per-type counts + how many rows would be
     overwritten in the target; Apply performs the upsert and, when
     the target is the active profile, re-populates the live bean
     managers so the change is visible immediately. #}
  <h4 style="margin-top:1rem">Copy beans between profiles</h4>
  <p class="muted small">Turnouts / sensors / lights are upserted by
    system name; roster entries are upserted by id. Same-named rows
    in the target are overwritten; unrelated rows are left alone.
    A roster copy into the active profile also broadcasts the new
    RL to any connected WiThrottle client.</p>
  <form hx-post="/profiles/transfer/preview"
        hx-target="#bean-transfer-result"
        hx-swap="innerHTML" class="row">
    <label>From
      <select name="from_id">
        {% for p in profiles %}
        <option value="{{ p.id }}">{{ p.name }}</option>
        {% endfor %}
      </select>
    </label>
    <label>To
      <select name="to_id">
        {% for p in profiles %}
        <option value="{{ p.id }}"{% if p.id == active_profile_id %} selected{% endif %}>
          {{ p.name }}{% if p.id == active_profile_id %} (active){% endif %}
        </option>
        {% endfor %}
      </select>
    </label>
    <label class="row" style="gap:0.3rem">
      <input type="checkbox" name="types" value="turnout" checked /> turnouts
    </label>
    <label class="row" style="gap:0.3rem">
      <input type="checkbox" name="types" value="sensor" checked /> sensors
    </label>
    <label class="row" style="gap:0.3rem">
      <input type="checkbox" name="types" value="light" checked /> lights
    </label>
    <label class="row" style="gap:0.3rem">
      <input type="checkbox" name="types" value="roster" checked /> roster
    </label>
    <button type="submit">Preview</button>
  </form>
  <div id="bean-transfer-result" style="margin-top:0.5rem"></div>
  {% else %}
  <p class="muted">No <code>profiles.xml</code> found at the settings path
    above. Either copy your JMRI <code>profiles.xml</code> + profile
    directories there, or set the <code>JMRI_SETTINGS_DIR</code>
    environment variable to point at where they live (e.g.
    <code>JMRI_SETTINGS_DIR=/mnt/jmri</code>) and restart the server.</p>
  {% endif %}
</div>

<div class="card">
  <div id="fast-clock-panel">
    {% include "_fast_clock.html" %}
  </div>
</div>

<div class="card">
  <div id="power-panel">
    {% include "_power_panel.html" %}
  </div>
</div>

<div class="card">
  <h3>Recent log lines
    <button style="float:right"
            hx-get="/logs/refresh" hx-target="#log-tail" hx-swap="innerHTML"
            >Refresh</button>
  </h3>
  <div id="log-tail">
    {% include "_log_tail.html" %}
  </div>
</div>

<div class="card">
  <h3>Topics available on the JSON API</h3>
  <p class="muted topic-help-intro">Click a topic to expand its help panel — summary,
     available methods, and a request/response example.
     Full class + method reference is at
     <a href="/docs/" target="_blank" rel="noopener" class="doc-link">/docs/</a>.</p>
  <div class="topics-accordion">
    {% for t in topics %}
      <details class="topic-help">
        <summary>
          <span class="badge mono">{{ t.topic }}</span>
          {% if t.help and t.help.rewrite_extension %}
            <span class="badge small" title="Not in JMRI Java's original API">rewrite</span>
          {% endif %}
          {% if t.help %}
            <span class="muted small">{{ t.help.summary.split(".")[0] }}.</span>
          {% else %}
            <span class="muted small">(no help authored yet)</span>
          {% endif %}
        </summary>
        {% if t.help %}
          <div class="topic-help-body">
            <p>{{ t.help.summary }}</p>
            {% if t.help.methods %}
              <table class="topic-help-methods">
                <thead><tr><th>Method</th><th>What it does</th></tr></thead>
                <tbody>
                  {% for m in t.help.methods %}
                    <tr>
                      <td><code class="mono">{{ m.name }}</code></td>
                      <td>
                        {{ m.description }}
                        {% if m.example_request %}
                          <details class="topic-help-example">
                            <summary class="muted small">example</summary>
                            <p class="small muted">request</p>
                            <pre class="mono small">{{ m.example_request }}</pre>
                            {% if m.example_response %}
                              <p class="small muted">response</p>
                              <pre class="mono small">{{ m.example_response }}</pre>
                            {% endif %}
                          </details>
                        {% endif %}
                      </td>
                    </tr>
                  {% endfor %}
                </tbody>
              </table>
            {% endif %}
            {% if t.help.source %}
              <p class="small muted">Source: <code class="mono">{{ t.help.source }}</code></p>
            {% endif %}
          </div>
        {% endif %}
      </details>
    {% endfor %}
  </div>
</div>

{# CS-power badge. Server renders the initial state on every /home GET;
   the jmri-server PushManager pushes ``{type: "commandStationPower",
   data: {on: bool}}`` on every heartbeat-detected transition, and the
   JS below mirrors it into the badge without a full page reload.

   ``app.js`` is loaded with ``defer`` in the head — that means it runs
   AFTER the DOM is parsed, which is AFTER this inline <script> tag has
   already run. So at the point this line executes, ``window.jmriBus``
   doesn't exist yet. Wrapping the subscription in ``DOMContentLoaded``
   is the fix: that event fires after every deferred script has
   executed, so ``jmriBus`` is guaranteed to be there. #}
<script>
document.addEventListener("DOMContentLoaded", function () {
  if (!window.jmriBus) return;
  const badge = document.getElementById("home-cs-power-badge");
  if (!badge) return;
  window.jmriBus.on("commandStationPower", function (msg) {
    const on = !!(msg.data && msg.data.on);
    badge.textContent = on ? "On" : "Off";
    badge.className = on ? "badge ok" : "badge err";
  });
});
</script>
{% endblock %}