BetterFrame/nodered/src/bf-trigger-layout-changed.html

<script type="text/javascript">
  RED.nodes.registerType("bf-trigger-layout-changed", {
    category: "BetterFrame Triggers",
    color: "#a6d4ff",
    defaults: {
      name: { value: "" },
      display_id: { value: "" },
    },
    inputs: 0,
    outputs: 1,
    icon: "betterframe.svg",
    label: function () {
      return this.name || "layout changed";
    },
    paletteLabel: "Layout Changed Trigger",
  });
</script>

<script type="text/html" data-template-name="bf-trigger-layout-changed">
  <div class="form-row">
    <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
    <input type="text" id="node-input-name" placeholder="(optional)" />
  </div>
  <div class="form-row">
    <label for="node-input-display_id"><i class="fa fa-desktop"></i> Display ID</label>
    <input type="number" id="node-input-display_id" placeholder="(blank = all displays)" />
  </div>
  <div class="form-tips">
    Fires when a display's active layout changes.
    Listens on <code>POST /in/layout.changed</code> internally — no upstream
    <code>http in</code> node required.
    Emits <code>msg.payload = {display_id, kiosk_id, layout_id, layout_name}</code>.
    Leave Display ID blank to receive events from all displays.
  </div>
</script>

<script type="text/html" data-help-name="bf-trigger-layout-changed">
  <p>Fires when a display switches to a new layout (admin layout-switch).</p>
  <p>Listens on <code>POST /in/layout.changed</code> internally — no upstream
  <code>http in</code> node needed.</p>
  <p>Optional <b>Display ID</b> filter limits this node to a single display.</p>
</script>