node-red-dashboard/nodes/ui_ui_control.html

A set of dashboard nodes for Node-RED

<script type="text/javascript">
    RED.nodes.registerType('ui_ui_control', {
        category: 'dashboard',
        color: 'rgb( 63, 173, 181)',
        defaults: {
            name: {value:""}
        },
        inputs:1,
        outputs:1,
        align: "right",
        icon: "ui_link.png",
        paletteLabel: 'ui control',
        label: function() { return this.name || "ui control"; },
        labelStyle: function() { return this.name?"node_label_italic":""; }
    });
</script>

<script type="text/x-red" data-template-name="ui_ui_control">
    <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="Name">
    </div>
</script>

<script type="text/x-red" data-help-name="ui_ui_control">
    <p>Allows dynamic control of the Dashboard.</p>
    <p>The default function is to change the currently displayed tab. <code>msg.payload</code>
    should either be an object of the form <code>{tab:"(tab_name)"}</code>, or just be the <b>tab name</b>
    or <b>numeric index</b> (from 0) of the tab or link to be displayed.</p>
    <p>Sending a blank tab name "" will refresh the current page.
    You can also send "+1" for next tab and "-1" for previous tab.</p>
    <p>When any browser client connects or loses connection this node will emit a <code>msg</code> containing:</p>
    <ul>
    <li><code>payload</code> - <i>connect</i> or <i>lost</i>.
    <li><code>socketid</code> - the ID of the socket (this will change every time the browser reloads the page).
    <li><code>socketip</code> - the ip address from where the connection originated.
    </ul>
</script>