NodeRED-Dashboard-Machine-Up-Time-Monitoring-Sensor

A basic ncd.io dashboard for machine up time monitoring sensor.

Product info: https://ncd.io/blog/machine-up-time-monitoring-product-manual/

This project is a basic subflow developed by ncd based on Node-RED and the new Dashboard 2.0 module, which allows you to visualize the data provided by the “Machine Up Time Monitoring Sensor” in an intuitive way.

For more information visit: ncd.io

Subflow characteristics:

It allows to visualize the data in real time of the variables sent by the sensor:

• Digital Input Counter 1.
• Digital Input Uptimer 1.
• Digital Input Counter 2.
• Digital Input Uptimer 2.
• Digital Input Counter 3.
• Digital Input Uptimer 3.
• Accelerometer Counter.
• Accelerometer Uptimer.
• Magnetometer Counter.
• Magnetometer Uptimer.
• Current value.
• Current value History.
• Battery Level.
• Battery Level History.

It is possible to view the relevant sensor data.

Important

This Subflow only works with type sensors (“sensor_type”: 108) which corresponds to Machine Up Time Monitoring.​

Requirements/Dependencies:

To import this subflow it is necessary to have previously installed:

• Node-RED development tool.
• @ncd-io/node-red-enterprise-sensors npm
• @flowfuse/node-red-dashboard npm

Install "ncd-io/node-red-enterprise-sensors":

Within your Node-RED instance go to the main menu (top right) and select the "Manage palette" option:

In the window, select the "Install" tab:

In the search field enter "@ncd-io/node-red-enterprise-sensors" you will see the following:

Click the "Install" button to start the installation process, a window will appear at the top of the screen, asking you to confirm the installation:

Once the process is completed you will see the following window:

For installing Dashboard 2.0:

FlowFuse's Node-RED Dashboard 2.0 is available in the Node-RED Palette Manager. To install it:

Open the menu in the top-right of Node-RED

• Click "Manage Palette"
• Switch to the "Install" tab
• Search node-red-dashboard
• Install the @flowfuse/node-red-dashboard package (not node-red/node-red-dashboard)

Source: https://dashboard.flowfuse.com/getting-started.html

Procedure to import Sub-flow:

Step 1 - Copy JSON

Copy the raw JSON file "node-red/Machine-Up-Time-Monitor-Dashboard.json" from this repository:

Step 2 - Import nodes

Go to Node-RED, you can add a new flow in the node editor of node-red (optional):

Then, go to the main menu, select the “Import” option:

A field will be opened. Right click and paste the JSON code you just copied from GitHub:

You will see the JSON code, now you can press the red “Import” button at the bottom right (by default the “current flow” option is selected):

In the upper part of the node editor, you will see information of the subflow you just imported, and automatically you will have the subflow available inside the node editor, now you can position it inside the editor by left clicking:

You may also notice that the subflow has been added to the ncd.io node group.

Step 3 - Configure NCD.io nodes

The next step is to configure your ncd.io nodes (you may have already configured your nodes), but it is important to remember that this procedure only works for the “108 - Machine Uptime Monitor” type:

Once you have the Machine Uptime Monitor sensor configured, the next step is to connect the sensor output (node) to the subflow input:

If you double left click on the subflow you can open the settings:

Name: you can assign an identifier to the subflow, and this will only serve to identify your specific flow within the node editor (to differentiate it from other nodes).

Step 4 - Check your Dashboard

The next step is to go to your Dashboard to see the real time data coming from the sensor by clicking on the Dashboard 2.0 option in the sidebar:

Note

In case you have deployed and cannot see the “Dashboard 2.0” content, you should reload the current page of the web browser with the “F5” key or “Reload page”.

Then click on the “Open Dashboard” option:

Your Dashboard will automatically open in a new window, where you can see something like this (depending on sensor configuration):

ncd.io Dashboard Features

The Main Menu

You can navigate between the ui-pages (this menu allows you to navigate between two or more ncd-dashboards, in case you have configured different ncd-dashboards):

Note

For example if you have configured an ncd-uptime-dashboard and you import an ncd-environment-dashboard, you will be able to navigate between the subflows from the main menu:

A step-by-step configuration for importing two or more ncd-dashboard subflows and accessing them from the main menu is presented later in this post.

Gauges and Graphs

- You can display the counter and uptimer data individually by type of probe (Digital Inputs, Accelerometer and Magnetometer).

- A battery level and electric current indicator is also incorporated.

- Historical data for the electric current and battery level variables.

Inspect Button

By pressing this button it is possible to access the information received from the sensor (Payload, NodeID, Firmware version, battery voltage, sensor type, MAC address, etc.), if pressed again it returns to the graphs and indicators view.

Layout

It is possible that the distribution of the indicators inside the ncd-dashboar is different depending on the size of your monitor, it is possible to adjust to a better distributed view by adjusting the zoom of the web browser.

For example:

1.- With a large monitor/screen:

It is possible that if you open the dashboard on a large monitor, you will see something like the following:

This works, but you may want a better distribution of the dashboard elements (as shown in the dashboard image at the beginning of this post) to do this just adjust the zoom of the web browser window, in this case increase the zoom, until you have the right distribution:

2.- With a smaller monitor/screen:

It is possible that if you open the dashboard on a computer with a small screen/monitor (such as a laptop), you will see something like the following:

Where you will have to scroll to navigate between the dashboard elements, this works, but you may want a better distribution of the dashboard elements (as shown in the dashboard image at the beginning of this post) just adjust the zoom of the web browser window, in this case reduce the zoom, until you have the right distribution:

Working with two or more ncd-dashboards in the same Node-RED project

This instructions refers to the scenario where you have previously installed and configured an ncd-dashboard (subflow) and you want to import another ncd-dashboard (subflow) to the same project.

The procedure is the same as mentioned above, with the simple difference that as soon as you press the import button in the "Import nodes" window you will see the following message at the top of our Node-RED flow editor:

This indicates that you are importing a subflow that contains one or more nodes that already exist in your current project (workspace). Specifically it refers to the configuration node "ncd-ui-base" which represents the base configuration of all our ncd-dashboards, simply click on the "Import copy" option. This shows us the detail of the elements that were imported in our project.

If everything is correct, the next step is to deploy in order to apply and execute the changes in our project, using the "Deploy" button:

Now, if you go to the "Dashboard 2.0" tab and click on "Open Dashboard" or simply refresh the dashboard browser tab, you will see in the main dashboard menu the new imported ncd dashboard:

View from ncd-uptime-dashboard

View from ncd-environment-dashboard

Import subflow to an existent dashboard 2.0 project.

This procedure refers to the scenario where you already have a dashboard 2.0 configured and you want to import an ncd-dashboard within the same Node-RED project. For example, if you already have a dashboad 2.0 configured with some elements, in the dashboard you would have something like the following:

To import an ncd-dashboard to your existing project you use the same steps mentioned above; copy the JSON file from the GitHub repository, use the import window (or Key shortcut Ctrl-i), paste the JSON and click on import, the imported elements will be shown at the top, but if you deploy inside the dashboard 2.0 you will have the following message:

To solve this you must return to the Node-RED flow editor, go to the "dashboard 2.0" tab and inside "Layout" you will be able to see something like the following:

You can identify the ui-pages of the ncd-dashboard by the fact that they are preceded by "ncd".

Next to the "Your Page Name" identifier, if you hover the cursor you will see the "Edit" button, click on it:

This opens the page configuration window, in the UI property you will click on the "Edit" (pencil icon).

Now the configuration window of the "ui-base" configuration node opens, you should click on the "Delete" button (located in the upper left part of the window):

Automatically it returns to the ui-page window, and it shows us the box of the property "UI" with the outline in red color:

Click on the arrow and then select the property "ncd-ui-base[/dashboard]":

Finally click on the "Update" button at the top right of the window:

Note

this same procedure must be done if you have two or more pages previously configured in dashboard 2.0.

Now click on deploy button to apply the changes made to the project:

Go to the "Dashboard 2.0" tab and click on the "Open Dashboard" button:

You will notice that the ncd-dashboard identifier has been added to the dashboard 2.0 main menu:

Possible drawbacks during subflow import

1.- Import subflow without dependencies installed

If you import the flow without having previously installed Dashboard 2, you will get a message like the following:

So you must delete the subflow and install the module “@flowfuse/node-red-dashboard” as mentioned at the beginning, and repeat the process. To delete the subflow you must double-click on the subflow in the Node-RED node editor to open its properties, then click on the “Delete” button at the top of the window.

You must also delete the subflow node from the node palette in the "NCD" or "Sublows" group, double click on the node.

This opens the subflow window, at the top click on the "delete subflow" button:

2.- Import the same subflow twice / delete subflow.

In case by mistake or by some procedure you have imported twice the same subflow, or you simply want to remove an ncd-dashboard subflow from the nodes palette, you must follow this quite simple procedure.

• 1.- Double click on the subflow node you wish to delete, the ncd-dashboard subflows are located in the node palette within the NCD group.
• 2.- Once the "Edit subflow template" tab opens at the top, click on the "delete subflow" button.

This completely removes the subflow, as well as the associated configuration nodes, you will notice that it no longer appears in the nodes palette.

Do not forget to deploy in order to save and apply the changes made to your project.

For more information visit: ncd.io | Machine Up Time Monitoring Product Manual