Shortcuts for creating multiple similar dashboard elements

Dashboard
1

I'm creating an interactive museum exhibit that supports 4 simultaneous users, each on 1 of 4 different sides. All of the sides have similar user experiences and share the exact same parameters, but each side has unique values for the parameters such that they behave differently from one another. I'm mocking up the interactions using dashboard elements - each side has about 8-10 different settings/preferences that can be set, and 8-10 different outputs/indicators that display the state of various elements as the user interacts with the exhibit. I'm using MQTT to manage state between the various inputs and outputs on each side. This is all working swimmingly.

Now, this results in quite a few nodes to represent each "side" of the exhibit in the dashboard (an MQTT listener for each setting/state, and a dashboard element to display it). I've got 1 side all wired up and working, and now I need to scale it to support all 4 sides. This would be fairly easily to do programmatically in code, but it's quite a bit of copy and pasting and manual tweaking of topic assignments in each node to create the dashboard groups for the other 3 sides. And if I realize I need to add a setting later on down the road, I have to change it in four different places.

Is there any way to instantiate the 3 other sides programmatically? If not, are there ways I can copy and paste the nodes to different flows but use, say, env vars to bind the topic listeners to the different sides? ("sides/side1/foo", "sides/side2/foo", etc.)? Hoping to make this as flexible as possible for the future.

2

You do know that there is only one Node-red dashboard?
It will display the same for all four users, unless you have four copies of Node-red running.

3

You may have outgrown dashboard.

You may wish to look at uibuilder - this is more suited to more complex designs.

If you wish to carry on down this path, then NO, each dashboard node is 1 element. You could export, search + replace, import sections of flows to lower the workload?

4

Hi Stephen-

After a little research I think uibuilder is definitely the right path. In theory, I can make a component that includes the settings and state elements and have four different instances of it. One question though – I understand how to have component bind to JavaScript model objects - is there any documentation on how to have user input trigger messages into the flow so that they will publish to MQTT?

5

uibuilder has extensive documentation built in examples (ctrl-i → examples) and loads of forum threads on this and other subjects.

Like all parts of node-red, once you see the msg in a debug, you can route it to an MQTT node with a simple wire to an MQTT out node (and potentially a switch + change node node in between to filter + adjust the payload before publishing)

6

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.