Camera Settings

The Camera Settings widget provides a complete interface for managing and configuring industrial cameras from the dashboard. It shows a camera list that can be reordered by drag and drop, a view of the main image of the selected camera with interactive cropping, and a settings panel where each camera's parameters can be inspected and modified.

The widget connects to a NATS server to discover the available cameras and fetch their parameters in real time. It can receive the camera list from the Node-RED flow (for example, previously saved in a JSON file) or discover them directly through NATS. When it detects a new camera that was not registered, it offers to add it through a confirmation dialog. The interface is organised into tabs: Settings, Calibration and Error handling.

Features

• Camera list: shows every detected camera and lets you reorder them by drag and drop.
• List management: buttons to add a new camera, reload the camera information and save the current order.
• Main image view: presents the image of the selected camera with pagination between cameras.
• Interactive crop: adjust the image area through a canvas and sliders for width, height, X offset and Y offset.
• Settings panel: lists the parameters of the selected camera and lets you modify them with a crop preview.
• Configuration profiles: create, save and delete parameter profiles.
• Discovery through NATS: fetches the available cameras and their parameters from the NATS server.
• New camera detection: compares the cameras from NATS with the known ones and offers to add the missing ones.
• All-parameters view: a dialog that opens a viewer with the full parameter list.
• External viewer: button to open the machine vision viewer (for example /xpra) in a dialog.
• Work tabs: organised into Settings, Calibration and Error handling.

Configuration

Property	Description	Default
Group	Dashboard group where the widget is displayed.	— (required)
Name	Node name shown in the editor.	""
Order	Order in which the widget appears within the group.	0
Size (Width)	Widget width (0 = fit automatically to the group).	0
Size (Height)	Widget height (0 = fit automatically).	0

Input

This node has 1 input. Each received message is stored in the widget data store and processed in the interface according to its contents.

msg.payload.cameras (array): list of known cameras (for example, loaded from a JSON file). The widget uses it as a starting point and then fills in their parameters and compares it with the cameras discovered through NATS.

Besides the properties in the example, each camera in the array accepts the rest of the parameters that the widget fills in after discovery.

msg.payload = {
  cameras: [
    {
      macAddress: "00:11:22:33:44:55",
      CameraName: "camera1",
      order: 1,
      disabled: false,
      ipAddress: "192.168.1.10"
    }
  ]
};

msg.payload === "nojson" (string): indicates that there is no previously saved list. In that case the widget fetches the cameras directly from NATS.

msg.payload = "nojson";

Output

This node has 1 output. It emits messages when actions are performed in the interface, which can be used in the flow to persist the camera information. The actions include:

• Camera information request: when the widget loads it emits payload: "camerasinfo" so the flow returns the saved camera list.
• Order saving: when the list order is saved it emits payload: { newOrder } with the reordered cameras.

On startup, the widget requests the camera list:

msg.payload = "camerasinfo";

And when the new order is saved it emits the reordered camera array:

msg.payload = { newOrder: [...] };

Usage example

A typical camera configuration flow with storage in a JSON file:

1. The widget loads and emits payload: "camerasinfo" requesting the saved list.
2. A node in the flow reads the camera JSON file and responds with the stored cameras:

msg.payload = { cameras: savedCameras };
return msg;

If the file does not exist or is empty, it responds with "nojson" and the widget will discover the cameras through NATS:

msg.payload = "nojson";
return msg;

3. The user reorders the cameras and presses save; the widget emits payload: { newOrder }, which a downstream node writes back to the JSON file to preserve the order.