node-red-contrib-alarm-ultimate 0.1.0 → 0.1.2

package/README.md

@@ -1,15 +1,59 @@
+<p align="center">
+  <img src="docs/images/banner.svg" alt="Alarm Ultimate for Node-RED" width="900">
+</p>
+
+[![NPM version][npm-version-image]][npm-url]
+[![NPM downloads][npm-downloads-image]][npm-url]
+[![Node-RED Flows][flows-image]][flows-url]
+[![License][license-image]][license-url]
+[![GitHub issues][issues-image]][issues-url]
+[![Status: beta][beta-image]][repo-url]
+
 # node-red-contrib-alarm-ultimate
 
-Alarm System Ultimate node for Node-RED.
+Alarm System Ultimate nodes + web panel for Node-RED.
+
+Includes:
+
+- `AlarmSystemUltimate` (BETA): full alarm control panel node (zones, entry/exit delays, bypass, chime, 24h/fire/tamper, siren, event log).
+- `AlarmUltimateInputAdapter`: translates incoming messages into zone messages for `AlarmSystemUltimate` using built-in or user-defined presets.
+- Output-only helper nodes: `AlarmUltimateState`, `AlarmUltimateZone`, `AlarmUltimateSiren`.
+- Web tools: Zones JSON mapper + web Alarm Panel (embeddable in Node-RED Dashboard).
+
+Note: `AlarmSystemUltimate` is currently **BETA**.
 
-This package provides:
+## Table of contents
 
-- `AlarmSystemUltimate`: a full alarm control panel node (zones, entry/exit delays, bypass, chime, 24h/fire/tamper, siren, event log).
-- Output-only helper nodes to mirror alarm state into your flows (`AlarmUltimateState`, `AlarmUltimateZone`, `AlarmUltimateSiren`).
-- Web tools: a Zones JSON mapper and a web Alarm Panel (also embeddable in Node-RED Dashboard).
+- [Install](#install)
+- [Screenshots](#screenshots)
+- [Nodes](#nodes)
+- [Web tools](#web-tools)
+- [Examples](#examples)
+- [Permissions and endpoints](#permissions-and-endpoints)
+- [Development](#development)
 
-Note: this repository currently ships `AlarmSystemUltimate` as **BETA**.
+## Install
+
+- Palette Manager: Menu → **Manage palette** → **Install** → search `alarm ultimate`
+- NPM:
+
+```bash
+npm i node-red-contrib-alarm-ultimate
+```
 
+## Screenshots
+
+### Alarm Panel (web)
+
+<p align="center">
+  <img src="docs/images/alarm-panel-mock.svg" alt="Alarm Panel mock" width="900">
+</p>
+
+### Flow overview
+
+<p align="center">
+  <img src="docs/images/flow-overview.svg" alt="Typical flow overview" width="900">
+</p>
 
 ## Nodes
 
@@ -30,6 +74,13 @@ These nodes have no input and emit the current Alarm state (and changes) for one
 - `Alarm Zone` (`AlarmUltimateZone`): `msg.payload = true|false` for a selected zone
 - `Alarm Siren` (`AlarmUltimateSiren`): `msg.payload = true|false` when the siren is on/off
 
+### Input Adapter
+
+`AlarmUltimateInputAdapter` translates incoming messages (from arbitrary sources) into the format expected by the Alarm zones.
+
+- Built-in presets are shipped with the package.
+- A single user preset (custom JavaScript) can be created/edited inside the node and is stored in the node configuration.
+
 ## Web tools
 
 These pages are served via the Node-RED admin HTTP endpoint:
@@ -42,32 +93,55 @@ The Alarm Panel supports:
 - Preselect node: `/alarm-ultimate/alarm-panel?id=<alarmNodeId>`
 - Embed mode (for Dashboard iframes): `/alarm-ultimate/alarm-panel?embed=1&id=<alarmNodeId>`
 
+The Zones JSON Mapper supports:
+
+- Sample message mapping (e.g. KNX Ultimate): map `topic`/`payload` fields and generate a zone template.
+- ETS Group Addresses export (TSV): paste the exported table and generate zones in batch (boolean datapoints only).
+
 ## Examples
 
 - `examples/alarm-ultimate-basic.json`: ready-to-import flow with `AlarmSystemUltimate`, injects and debug nodes.
 - `examples/alarm-ultimate-dashboard.json`: Node-RED Dashboard example embedding the Alarm Panel in a `ui_template` iframe.
+- `examples/alarm-ultimate-dashboard-controls.json`: Node-RED Dashboard example with the embedded panel plus command buttons (and a small sensor simulator).
+- `examples/alarm-ultimate-dashboard-v2.json`: Dashboard 2.0 example for `@flowfuse/node-red-dashboard` (Alarm Panel + basic controls + status).
 
 See `examples/README.md`.
 
+## Development
+
+Run tests:
+
+```bash
+npm test
+```
+
 ## Permissions and endpoints
 
 When Node-RED authentication is enabled, the admin endpoints use these permissions (if available):
 
 - `AlarmSystemUltimate.read`
 - `AlarmSystemUltimate.write`
+- `AlarmUltimateInputAdapter.read`
 
 HTTP admin endpoints:
 
 - `GET /alarm-ultimate/alarm/nodes`
 - `GET /alarm-ultimate/alarm/:id/state`
+- `GET /alarm-ultimate/input-adapter/presets`
 - `POST /alarm-ultimate/alarm/:id/command`
 - `GET /alarm-ultimate/alarm-json-mapper`
 - `GET /alarm-ultimate/alarm-panel`
 
-## Development
-
-Run tests:
-
-```bash
-npm test
-```
+<!-- Badges (reference-style links) -->
+
+[repo-url]: https://github.com/Supergiovane/node-red-contrib-alarm-ultimate
+[npm-url]: https://www.npmjs.com/package/node-red-contrib-alarm-ultimate
+[flows-url]: https://flows.nodered.org/node/node-red-contrib-alarm-ultimate
+[license-url]: LICENSE
+[issues-url]: https://github.com/Supergiovane/node-red-contrib-alarm-ultimate/issues
+[npm-version-image]: https://img.shields.io/npm/v/node-red-contrib-alarm-ultimate.svg
+[npm-downloads-image]: https://img.shields.io/npm/dm/node-red-contrib-alarm-ultimate.svg
+[flows-image]: https://img.shields.io/badge/Node--RED%20Flows-library-8f0000?logo=nodered&logoColor=white
+[license-image]: https://img.shields.io/npm/l/node-red-contrib-alarm-ultimate.svg
+[issues-image]: https://img.shields.io/github/issues/Supergiovane/node-red-contrib-alarm-ultimate.svg
+[beta-image]: https://img.shields.io/badge/status-beta-orange.svg

package/docs/images/alarm-panel-mock.svg

@@ -0,0 +1,114 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="700" viewBox="0 0 1200 700" role="img" aria-label="Alarm Panel mock screenshot">
+  <defs>
+    <linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#0b1020"/>
+      <stop offset="1" stop-color="#11162a"/>
+    </linearGradient>
+    <linearGradient id="accent" x1="0" y1="0" x2="1" y2="0">
+      <stop offset="0" stop-color="#ff375f"/>
+      <stop offset="1" stop-color="#ff9f0a"/>
+    </linearGradient>
+    <filter id="shadow" x="-20%" y="-20%" width="140%" height="140%">
+      <feDropShadow dx="0" dy="10" stdDeviation="14" flood-color="#000" flood-opacity="0.4"/>
+    </filter>
+    <style>
+      .h1 { font: 700 22px ui-sans-serif, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial; fill: #fff; }
+      .h2 { font: 600 14px ui-sans-serif, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial; fill: rgba(255,255,255,0.78); }
+      .label { font: 600 13px ui-sans-serif, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial; fill: rgba(255,255,255,0.86); }
+      .value { font: 700 18px ui-sans-serif, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial; fill: #fff; }
+      .tiny { font: 600 12px ui-sans-serif, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial; fill: rgba(255,255,255,0.68); }
+    </style>
+  </defs>
+
+  <rect width="1200" height="700" fill="url(#bg)"/>
+  <rect x="0" y="0" width="1200" height="10" fill="url(#accent)"/>
+
+  <!-- Window -->
+  <g filter="url(#shadow)">
+    <rect x="80" y="70" width="1040" height="560" rx="18" fill="rgba(255,255,255,0.06)" stroke="rgba(255,255,255,0.14)"/>
+  </g>
+
+  <!-- Top bar -->
+  <g>
+    <rect x="80" y="70" width="1040" height="64" rx="18" fill="rgba(255,255,255,0.07)"/>
+    <circle cx="118" cy="102" r="7" fill="#ff375f"/>
+    <circle cx="142" cy="102" r="7" fill="#ff9f0a"/>
+    <circle cx="166" cy="102" r="7" fill="#34c759"/>
+    <text class="h1" x="210" y="110">Alarm Panel</text>
+    <text class="h2" x="340" y="110">demo layout</text>
+  </g>
+
+  <!-- Status -->
+  <g transform="translate(120,160)">
+    <rect x="0" y="0" width="420" height="110" rx="16" fill="rgba(255,255,255,0.06)" stroke="rgba(255,255,255,0.12)"/>
+    <text class="label" x="22" y="32">Status</text>
+    <text class="value" x="22" y="70">DISARMED</text>
+    <rect x="280" y="30" width="120" height="56" rx="14" fill="rgba(52,199,89,0.18)" stroke="rgba(52,199,89,0.55)"/>
+    <text class="label" x="308" y="64">Ready</text>
+  </g>
+
+  <!-- Actions -->
+  <g transform="translate(560,160)">
+    <rect x="0" y="0" width="520" height="110" rx="16" fill="rgba(255,255,255,0.06)" stroke="rgba(255,255,255,0.12)"/>
+    <text class="label" x="22" y="32">Actions</text>
+    <g transform="translate(22,48)">
+      <rect x="0" y="0" width="140" height="44" rx="12" fill="rgba(255,55,95,0.18)" stroke="rgba(255,55,95,0.6)"/>
+      <text class="label" x="38" y="28">Arm</text>
+      <rect x="160" y="0" width="160" height="44" rx="12" fill="rgba(255,159,10,0.16)" stroke="rgba(255,159,10,0.55)"/>
+      <text class="label" x="202" y="28">Arm stay</text>
+      <rect x="340" y="0" width="158" height="44" rx="12" fill="rgba(255,255,255,0.08)" stroke="rgba(255,255,255,0.18)"/>
+      <text class="label" x="382" y="28">Disarm</text>
+    </g>
+  </g>
+
+  <!-- Zones list -->
+  <g transform="translate(120,300)">
+    <rect x="0" y="0" width="700" height="290" rx="16" fill="rgba(255,255,255,0.06)" stroke="rgba(255,255,255,0.12)"/>
+    <text class="label" x="22" y="34">Zones</text>
+
+    <!-- rows -->
+    <g transform="translate(22,56)">
+      <rect x="0" y="0" width="656" height="44" rx="12" fill="rgba(255,255,255,0.07)"/>
+      <text class="label" x="16" y="28">01 • Front door</text>
+      <rect x="540" y="10" width="100" height="24" rx="10" fill="rgba(52,199,89,0.18)" stroke="rgba(52,199,89,0.55)"/>
+      <text class="tiny" x="570" y="27">closed</text>
+
+      <rect x="0" y="58" width="656" height="44" rx="12" fill="rgba(255,255,255,0.07)"/>
+      <text class="label" x="16" y="86">02 • Living room PIR</text>
+      <rect x="540" y="68" width="100" height="24" rx="10" fill="rgba(52,199,89,0.18)" stroke="rgba(52,199,89,0.55)"/>
+      <text class="tiny" x="570" y="85">idle</text>
+
+      <rect x="0" y="116" width="656" height="44" rx="12" fill="rgba(255,255,255,0.07)"/>
+      <text class="label" x="16" y="144">03 • Garage</text>
+      <rect x="540" y="126" width="100" height="24" rx="10" fill="rgba(255,55,95,0.18)" stroke="rgba(255,55,95,0.6)"/>
+      <text class="tiny" x="572" y="143">open</text>
+
+      <rect x="0" y="174" width="656" height="44" rx="12" fill="rgba(255,255,255,0.07)"/>
+      <text class="label" x="16" y="202">04 • Smoke detector</text>
+      <rect x="540" y="184" width="100" height="24" rx="10" fill="rgba(255,159,10,0.16)" stroke="rgba(255,159,10,0.55)"/>
+      <text class="tiny" x="567" y="201">24h</text>
+    </g>
+  </g>
+
+  <!-- Side panel -->
+  <g transform="translate(840,300)">
+    <rect x="0" y="0" width="240" height="290" rx="16" fill="rgba(255,255,255,0.06)" stroke="rgba(255,255,255,0.12)"/>
+    <text class="label" x="20" y="34">Last events</text>
+    <g transform="translate(20,56)">
+      <rect x="0" y="0" width="200" height="54" rx="12" fill="rgba(255,255,255,0.07)"/>
+      <text class="tiny" x="14" y="22">10:24</text>
+      <text class="label" x="14" y="42">Zone 03 opened</text>
+
+      <rect x="0" y="66" width="200" height="54" rx="12" fill="rgba(255,255,255,0.07)"/>
+      <text class="tiny" x="14" y="88">10:26</text>
+      <text class="label" x="14" y="108">Disarmed</text>
+
+      <rect x="0" y="132" width="200" height="54" rx="12" fill="rgba(255,255,255,0.07)"/>
+      <text class="tiny" x="14" y="154">10:28</text>
+      <text class="label" x="14" y="174">Siren off</text>
+    </g>
+  </g>
+
+  <!-- Footnote -->
+  <text class="tiny" x="80" y="670">Illustration only (mock). The real panel is served at /alarm-ultimate/alarm-panel</text>
+</svg>

package/docs/images/banner.svg

@@ -0,0 +1,63 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="320" viewBox="0 0 1200 320" role="img" aria-label="Alarm Ultimate for Node-RED banner">
+  <defs>
+    <linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#0b1020"/>
+      <stop offset="1" stop-color="#171a2a"/>
+    </linearGradient>
+    <linearGradient id="accent" x1="0" y1="0" x2="1" y2="0">
+      <stop offset="0" stop-color="#ff375f"/>
+      <stop offset="1" stop-color="#ff9f0a"/>
+    </linearGradient>
+    <filter id="shadow" x="-20%" y="-20%" width="140%" height="140%">
+      <feDropShadow dx="0" dy="8" stdDeviation="10" flood-color="#000" flood-opacity="0.35"/>
+    </filter>
+    <style>
+      .title { font: 700 54px ui-sans-serif, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial; fill: #ffffff; }
+      .subtitle { font: 500 22px ui-sans-serif, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial; fill: rgba(255,255,255,0.78); }
+      .chip { font: 600 14px ui-sans-serif, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial; fill: rgba(255,255,255,0.92); letter-spacing: 0.2px; }
+      .mono { font: 600 14px ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; fill: rgba(255,255,255,0.92); }
+    </style>
+  </defs>
+
+  <rect width="1200" height="320" fill="url(#bg)"/>
+
+  <!-- Accent ribbon -->
+  <rect x="0" y="0" width="1200" height="10" fill="url(#accent)"/>
+
+  <!-- Decorative grid -->
+  <g opacity="0.16">
+    <path d="M80 0V320M160 0V320M240 0V320M320 0V320M400 0V320M480 0V320M560 0V320M640 0V320M720 0V320M800 0V320M880 0V320M960 0V320M1040 0V320M1120 0V320" stroke="#ffffff" stroke-width="1"/>
+    <path d="M0 60H1200M0 120H1200M0 180H1200M0 240H1200" stroke="#ffffff" stroke-width="1"/>
+  </g>
+
+  <!-- Card -->
+  <g filter="url(#shadow)">
+    <rect x="70" y="70" width="1060" height="180" rx="18" fill="rgba(255,255,255,0.06)" stroke="rgba(255,255,255,0.14)"/>
+  </g>
+
+  <!-- Icon -->
+  <g transform="translate(120,115)">
+    <rect x="0" y="0" width="86" height="86" rx="18" fill="rgba(255,55,95,0.15)" stroke="rgba(255,55,95,0.5)"/>
+    <path d="M43 16c-10.5 0-19 8.5-19 19v11.3l-5.7 11.4c-1.2 2.3 0.4 5.1 3 5.1H64c2.6 0 4.2-2.8 3-5.1l-5.7-11.4V35c0-10.5-8.5-19-19-19z" fill="#ff375f"/>
+    <path d="M32 68c0 6.1 4.9 11 11 11s11-4.9 11-11H32z" fill="#ff9f0a"/>
+  </g>
+
+  <!-- Text -->
+  <text class="title" x="240" y="150">Alarm Ultimate</text>
+  <text class="subtitle" x="240" y="186">Alarm nodes + web panel for Node-RED</text>
+
+  <!-- Chips -->
+  <g transform="translate(240,206)">
+    <rect x="0" y="0" width="132" height="30" rx="10" fill="rgba(255,255,255,0.08)" stroke="rgba(255,255,255,0.14)"/>
+    <text class="chip" x="16" y="20">Zones</text>
+
+    <rect x="148" y="0" width="170" height="30" rx="10" fill="rgba(255,255,255,0.08)" stroke="rgba(255,255,255,0.14)"/>
+    <text class="chip" x="164" y="20">Siren &amp; events</text>
+
+    <rect x="334" y="0" width="232" height="30" rx="10" fill="rgba(255,255,255,0.08)" stroke="rgba(255,255,255,0.14)"/>
+    <text class="chip" x="350" y="20">Dashboard embed</text>
+
+    <rect x="582" y="0" width="214" height="30" rx="10" fill="rgba(255,255,255,0.08)" stroke="rgba(255,255,255,0.14)"/>
+    <text class="mono" x="598" y="20">/alarm-ultimate</text>
+  </g>
+</svg>

package/docs/images/flow-overview.svg

@@ -0,0 +1,85 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="520" viewBox="0 0 1200 520" role="img" aria-label="Flow overview diagram">
+  <defs>
+    <linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#0b1020"/>
+      <stop offset="1" stop-color="#11162a"/>
+    </linearGradient>
+    <linearGradient id="accent" x1="0" y1="0" x2="1" y2="0">
+      <stop offset="0" stop-color="#ff375f"/>
+      <stop offset="1" stop-color="#ff9f0a"/>
+    </linearGradient>
+    <filter id="shadow" x="-20%" y="-20%" width="140%" height="140%">
+      <feDropShadow dx="0" dy="10" stdDeviation="14" flood-color="#000" flood-opacity="0.35"/>
+    </filter>
+    <style>
+      .title { font: 800 20px ui-sans-serif, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial; fill: #fff; }
+      .label { font: 650 14px ui-sans-serif, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial; fill: rgba(255,255,255,0.85); }
+      .tiny { font: 600 12px ui-sans-serif, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial; fill: rgba(255,255,255,0.65); }
+      .mono { font: 650 12px ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; fill: rgba(255,255,255,0.8); }
+    </style>
+    <marker id="arrow" viewBox="0 0 10 10" refX="9.2" refY="5" markerWidth="8" markerHeight="8" orient="auto-start-reverse">
+      <path d="M 0 0 L 10 5 L 0 10 z" fill="rgba(255,255,255,0.65)"/>
+    </marker>
+  </defs>
+
+  <rect width="1200" height="520" fill="url(#bg)"/>
+  <rect x="0" y="0" width="1200" height="10" fill="url(#accent)"/>
+
+  <text class="title" x="80" y="58">Typical Node-RED flow</text>
+  <text class="tiny" x="80" y="84">Sensors publish to per-zone topics; commands go to a dedicated control topic; helper nodes mirror state.</text>
+
+  <!-- Nodes -->
+  <g filter="url(#shadow)">
+    <!-- Sensors -->
+    <rect x="80" y="140" width="260" height="300" rx="18" fill="rgba(255,255,255,0.06)" stroke="rgba(255,255,255,0.14)"/>
+    <text class="label" x="110" y="176">Sensors</text>
+    <text class="mono" x="110" y="202">topic: house/zone/01</text>
+    <text class="mono" x="110" y="226">payload: true/false</text>
+    <text class="mono" x="110" y="262">topic: house/zone/02</text>
+    <text class="mono" x="110" y="286">payload: true/false</text>
+    <text class="mono" x="110" y="322">topic: house/zone/03</text>
+    <text class="mono" x="110" y="346">payload: true/false</text>
+    <text class="tiny" x="110" y="392">Any topic != controlTopic</text>
+  </g>
+
+  <g filter="url(#shadow)">
+    <!-- Main node -->
+    <rect x="420" y="200" width="360" height="180" rx="18" fill="rgba(255,55,95,0.12)" stroke="rgba(255,55,95,0.55)"/>
+    <text class="label" x="450" y="240">AlarmSystemUltimate</text>
+    <text class="tiny" x="450" y="266">Zones + delays + bypass + siren + log</text>
+    <rect x="450" y="292" width="300" height="56" rx="14" fill="rgba(255,255,255,0.08)" stroke="rgba(255,255,255,0.16)"/>
+    <text class="mono" x="468" y="326">msg.topic === controlTopic</text>
+  </g>
+
+  <g filter="url(#shadow)">
+    <!-- Commands -->
+    <rect x="420" y="140" width="360" height="46" rx="14" fill="rgba(255,159,10,0.14)" stroke="rgba(255,159,10,0.55)"/>
+    <text class="label" x="450" y="170">Commands (Inject / MQTT / UI)</text>
+  </g>
+
+  <g filter="url(#shadow)">
+    <!-- Helpers -->
+    <rect x="860" y="140" width="260" height="300" rx="18" fill="rgba(255,255,255,0.06)" stroke="rgba(255,255,255,0.14)"/>
+    <text class="label" x="890" y="176">Output-only nodes</text>
+
+    <rect x="890" y="200" width="200" height="56" rx="14" fill="rgba(255,255,255,0.07)" stroke="rgba(255,255,255,0.14)"/>
+    <text class="label" x="910" y="234">AlarmUltimateState</text>
+    <text class="tiny" x="910" y="252">payload: \"armed\" | \"disarmed\"</text>
+
+    <rect x="890" y="270" width="200" height="56" rx="14" fill="rgba(255,255,255,0.07)" stroke="rgba(255,255,255,0.14)"/>
+    <text class="label" x="910" y="304">AlarmUltimateZone</text>
+    <text class="tiny" x="910" y="322">payload: true/false (selected)</text>
+
+    <rect x="890" y="340" width="200" height="56" rx="14" fill="rgba(255,255,255,0.07)" stroke="rgba(255,255,255,0.14)"/>
+    <text class="label" x="910" y="374">AlarmUltimateSiren</text>
+    <text class="tiny" x="910" y="392">payload: true/false</text>
+  </g>
+
+  <!-- Arrows -->
+  <path d="M340 290H420" stroke="rgba(255,255,255,0.65)" stroke-width="2.2" marker-end="url(#arrow)"/>
+  <path d="M600 186V200" stroke="rgba(255,255,255,0.65)" stroke-width="2.2" marker-end="url(#arrow)"/>
+  <path d="M780 290H860" stroke="rgba(255,255,255,0.65)" stroke-width="2.2" marker-end="url(#arrow)"/>
+
+  <!-- Footer -->
+  <text class="tiny" x="80" y="486">Web tools: /alarm-ultimate/alarm-json-mapper • /alarm-ultimate/alarm-panel (also embeddable)</text>
+</svg>

package/examples/README.md

@@ -1,21 +1,42 @@
-## Esempi
+## Examples
 
-Importa il flow da `examples/alarm-ultimate-basic.json` in Node-RED:
+Import the flow from `examples/alarm-ultimate-basic.json` into Node-RED:
 
 1. Menu → **Import**
-2. Incolla il contenuto del file JSON
+2. Paste the JSON file content
 3. Deploy
 
-Il flow include:
+This flow includes:
 
-- 1 nodo `AlarmSystemUltimate` con 2 zone di esempio
-- Inject per arm/disarm, bypass, sensori open/close
-- I nodi output-only (`Alarm State`, `Alarm Zone`, `Alarm Siren`) collegati a debug
+- 1 `AlarmSystemUltimate` node with 2 example zones
+- Inject nodes for arm/disarm, bypass, sensor open/close
+- Output-only nodes (`Alarm State`, `Alarm Zone`, `Alarm Siren`) connected to debug
+
+Notes:
+
+- The old Alarm “Translator” option has been removed. If you need to translate incoming device messages, use the `AlarmUltimateInputAdapter` node.
+- Zones can be edited from the Alarm node editor via the “Manage zones” button (opens the `alarm-json-mapper` tool).
 
 ## Dashboard (node-red-dashboard)
 
-Importa `examples/alarm-ultimate-dashboard.json`.
+Import `examples/alarm-ultimate-dashboard.json`.
+
+- Requires `node-red-dashboard` installed (`ui_*` nodes).
+- The widget uses an iframe pointing to `"/alarm-ultimate/alarm-panel?embed=1&id=<alarmNodeId>"`.
+- If you changed `httpAdminRoot`, update the iframe URL accordingly (e.g. `"/red/alarm-ultimate/alarm-panel?...`).
+
+### Dashboard + commands (panel + controls)
+
+Import `examples/alarm-ultimate-dashboard-controls.json`.
+
+- Includes the panel (iframe) + Dashboard buttons for `arm`, `disarm`, `status`, `list_open_zones`, `siren_on/off`, `panic`.
+- Also includes a small “sensor simulator” (buttons that send `true/false` on `sensor/frontdoor` and `sensor/living_pir`).
+- The iframe uses a *relative* URL (`alarm-ultimate/...`) so it works even when Node-RED is served under a path prefix (e.g. Home Assistant Ingress).
+
+## Dashboard V2 (FlowFuse / @flowfuse/node-red-dashboard)
+
+Import `examples/alarm-ultimate-dashboard-v2.json`.
 
-- Richiede `node-red-dashboard` installato (nodi `ui_*`).
-- Il widget usa un iframe verso `"/alarm-ultimate/alarm-panel?embed=1&id=<alarmNodeId>"`.
-- Se hai cambiato `httpAdminRoot`, aggiorna l'URL dell'iframe di conseguenza (es: `"/red/alarm-ultimate/alarm-panel?...`).
+- Requires `@flowfuse/node-red-dashboard` installed (`ui-*` nodes).
+- Embeds the Alarm Panel via a Dashboard 2.0 `ui-template` (Vue SFC) iframe.
+- Includes basic command buttons (`arm`, `disarm`, `status`), a small sensor simulator, and two status widgets (`AlarmUltimateState`, `AlarmUltimateSiren` → `ui-text`).

package/examples/alarm-ultimate-basic.json

@@ -23,7 +23,6 @@
     "name": "Home Alarm",
     "controlTopic": "alarm",
     "payloadPropName": "payload",
-    "translatorConfig": "",
     "persistState": true,
     "requireCodeForArm": false,
     "requireCodeForDisarm": false,