@5minds/node-red-dashboard-2-processcube-ui-page-navigation/nodes/ui-page-navigation.html

A node to handle the navigation between pages in the Node-RED Dashboard

<script type="text/javascript">
    (function () {
        RED.nodes.registerType('ui-page-navigation', {
            category: 'ProcessCube UI',
            color: '#02AFD6',
            defaults: {
                page: { type: 'ui-page', required: true },
                name: { value: '' },
                event: { value: '', required: true }
            },
            inputs: 0,
            outputs: 1,
            icon: 'ui_page_navigation.svg',
            oneditprepare: function () {
                // topic
                $('#node-input-topic').typedInput({
                    default: 'str',
                    typeField: $('#node-input-topicType'),
                    types: ['str', 'msg', 'flow', 'global'],
                });
            },
            label: function () {
                return this.name || 'ui-page-navigation';
            },
            labelStyle: function () {
                return this.name ? 'node_label_italic' : '';
            },
        });
    })();
</script>

<script type="text/html" data-template-name="ui-page-navigation">  
    <div class="form-row">
        <label for="node-input-page"><i class="fa fa-tag"></i> Page</label>
        <input type="text" id="node-input-page" />
    </div>
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
        <input type="text" id="node-input-name" />
    </div>
    <div class="form-row">
        <label for="node-input-event"><i class="fa fa-sliders"></i> Event</label>
        <select id="node-input-event" style="width: 70%;">
            <option value="any">any</option>
            <option value="$pageview">$pageview</option>
            <option value="$pageleave">$pageleave</option>
        </select>
    </div>
</script>

<script type="text/markdown" data-help-name="ui-page-navigation">
A Note to listen on events for the page navigation.

## Outputs

: page (Object) : An object representing the page where the event happend.
: Event (Object): Any, $pageleave or $pageview event type.

### References

-  [The ProcessCube Network](https://www.processcube.io) – All information for the ProcessCube&copy; platform (videos, docs and co.)
-  [Node-RED Integration in ProcessCube&copy;](https://docs.processcube.io/docs/node-red) – Node-RED integration in ProcessCube&copy;
</script>