{% extends "base.html" %}
{% block title %}Consists{% endblock %}
{% block content %}
<h2>Consists</h2>

<div class="card">
  <h3>Create a consist</h3>
  {# A consist has a shared "consist address" (used for advanced /
     CS-managed consists) plus a kind. Software consists work on every
     driver via per-loco throttle fan-out; command_station consists
     require driver support (LocoNet ships this today; NCE/DCC-EX
     currently fall back to software).

     Address is constrained to 1..127 short — CV19's 7-bit range —
     across every kind so the address space is uniform. Long
     addresses are not offered because they don't exist for consists. #}
  <form hx-post="/consists/create" hx-target="#consists-table"
        hx-swap="outerHTML" class="row">
    <label>Address
      <input type="number" name="address" required min="1" max="127" />
    </label>
    <label>Kind
      <select name="kind">
        <option value="command_station">Command station</option>
        <option value="software">Software</option>
        <option value="advanced">Advanced (CV19)</option>
      </select>
    </label>
    <label style="flex:1">Comment
      <input type="text" name="comment" placeholder="optional" />
    </label>
    <button type="submit">Create</button>
  </form>
</div>

<div class="card">
  <div class="row" style="align-items:baseline">
    <h3 style="margin:0">Active consists</h3>
    <span style="margin-left:auto"></span>
    {# Refresh from CS: NCE-only. On other drivers the JSON service
       returns 400 which the route surfaces as a friendly banner. #}
    <button hx-post="/consists/refresh-from-cs"
            hx-target="#consists-table" hx-swap="outerHTML"
            title="Reconcile in-memory consists with the command station's consist table (NCE only)">
      Refresh from CS
    </button>
  </div>
  {% include "_consists_table.html" %}
</div>

{# Live push: the consist manager broadcasts {type: "consist", ...} on
   every create/update/delete, so we refresh the table when any change
   flows through the WebSocket. #}
<script>
(function () {
  if (!window.jmriBus) return;
  window.jmriBus.on("consist", function () {
    if (window.htmx) {
      window.htmx.ajax("GET", "/consists/refresh", {
        target: "#consists-table", swap: "outerHTML",
      });
    }
  });
})();
</script>
{% endblock %}