Front-end

Configuration of the front-end

Configuration

Capability	Support	Comment
HTTPS		By default
HTTP		Disabled by default. See Enable HTTP for how enabling.
Changing default port		The default port used by the frontend is 5000. To change it see changing port
Setting hostname		See changing hostname
Replace self-signed certificate		See changing self signed certificate

Designing the frontend theme

Theming

Capability	Support	Comment
Theming dark-mode		Product has by default dark/light display mode. See theming
Theming light-mode		Product has by default dark/light display mode. See theming
Customize logo		The favicon and logo can be customized change logo
Customize theming		See Theme overriding. Warning, this is an experimental feature.

Creating dashboards

Dashboard

Capability	Support	Comment
Dashboards		Within OnSphere, the term dashboard encompasses what is commonly referred to as a tab or page in the design of a website.
Dashboards search		See dashboard search
Default dashboard		See default dashboard
Dashboard playlist		See dashboard playlist
Kiosk mode		See kiosk mode
Navigate between dashboards		See navigate between dashboards
Use layout to display widgets		Two layouts are currently available, vertical or horizontal layout or a border layout

Global capabilities

Widgets features

Capability	Support	Comment
Customize toolbar and menu		Some widget support menu and toolbar, this menu is customizable. See menu and tools bar.
Dynamic evaluation		See dynamic evaluation
Report a display error		A widget that cannot be displayed is replaced by an error panel and the rest of the dashboard stays usable. See error display.

Dynamic evaluation

Capability	Support	Comment
Extract a single element		See Extracting from single item
Extract a list of elements		See Extraction of a list of items
Use schema with dynamic elements		See Extraction of a map of key values given the schema
Use complex JSON path query for dynamic evaluation		See Extraction of a map of key values given the schema

Media

Capability	Support	Comment
Using form as a dashboard widget		See Media widget
Play/Pause the video on the widget		You can play or pause a video at will.
Display the video in fullscreen mode		You can display the video in fullscreen.
Go forward/backward on the video		It is possible to scroll through the video bar and go forward or backward on the video (the more buffering the more you can navigate time wise in the video).
Select the video quality of the video		This feature is currently not supported. In case of interest please contact us at info@sdn.ch
Choose between a list of available streams		A dropdown menu on the widget let you choose between the list of available streams.
Volume control		Adjust the volume of the video if there is sound available.
Fallback image when stream unavailable		This feature is currently not supported. In case of interest please contact us at info@sdn.ch
Using PTZ directly in the widget		See PTZ controller.
Hide the menu containing the list of the stream.		This feature is currently not supported. In case of interest please contact us at info@sdn.ch
Display multiple streams in the same widget.		This feature is currently not supported. In case of interest please contact us at info@sdn.ch
Configure stream name and description.		This feature is currently not supported. In case of interest please contact us at info@sdn.ch

Menu and toolbars

Capability	Support	Comment
Use custom menu inside a table
Use dynamic evaluation		The dynamic evaluation can be used to express complex configuration.
Re-use elements multiples times
Use icon from material UI		See Material UI Icons (version 6) for the complete list of available icons and ensure to use snake_case naming.
Display/hide menu		A menu can be hidden or displayed based on conditions
Execute any action on click		An action can be triggered on click menu action
Execute post-event actions		An action can be triggered after the initial one; see Post-Event Action. The system supports either a single post-event action or multiple post-event actions executed in parallel (like A then B AND C). However, sequential execution is not supported (like A then B then C).

Forms capabilities

Capability	Support	Comment
Using form as a dashboard widget		See Form
Using form to update a collection		A form can be bound to a collection to `insert/update` an element of a collection. See Form
Using form to update values		See Using form to update a value value (write)
Using form to update values and collection in same time		This can be done with standard scripting, beware to the order of action and reaction to avoid conflicts
Creating custom form		See Form definition
Create conditional forms
Using (read) value in forms		A form can be bind to a value Using form linked to a value (read).
Trigger action in forms submission		Trigger an action on submission All data content will be posted to an action running a script.
Trigger both action and `value` in forms submission		Update destination Acts as `Value` and `Action` mixed. Values are updated and data are sent to a script through an action
Trigger `request` in forms submission		See Trigger an action on submission for details.
Modify elements based on the current user’s permissions.		See Rights for details.
Immediate transmission of modification		See Submission mode for details.
Manage conflicts
Retrieve data from an external api		See API service and Api service picker for details.

Tables (collection or alarms)

Capability	Support	Comment
Customize menu		See menus and toolbar
Choice data to display (filter)		Filter can be used to choose the data displayed to a user. See menus and toolbar
Define a default filter by table		A unique default filter can be set for each view. See Default filter
Define a default filter by user or group of user		The filter cannot be set by user or group of user, only by dashboard. But the local storage can be used to store the filter for a user.
Set views or filter by URL parameters		The filter can be set by URL parameters, which allows creating links from other widgets or dashboards. See URL parameters

Maps

Capability	Support	Comment
Use online map tiles		Supported with Mapbox tiles (requires a dedicated API token).
Use offline map tiles		Supported with the Protomaps format for offline access.
Use satellite view		Supported only with a dedicated Mapbox style (using Mapbox Studio).
Update base map style		Supported through widget library settings. See Mapbox.
Display static value-linked layers on a map		The widget renders configured OnSphere layers produced by Geographical aggregation. See Layer controls and user-facing filters.
Display static alarm-linked layers on a map		The widget renders configured OnSphere layers produced by Geographical aggregation. See Layer controls and user-facing filters.
Display collection-backed geographical layers on a map		COLLECTIONS layers are rendered through the same map request contract. See Layer controls and user-facing filters.
Display alarm-backed geographical layers on a map		ALARMS layers are rendered through the same map request contract. See Layer controls and user-facing filters.
Display static or dynamic icons on a map		Point icons are configured in Geographical aggregation and loaded by the widget. See Icons.
Configure point and polygon colors per feature		Point and polygon colors are read from feature properties with a default fallback, for static, collection-backed, and alarm-backed STANDARD layers. See How feature colors are resolved.
Color severity layers automatically from alarm severity		SEVERITY layers are colored from the configured severity palette instead of per-feature properties. See How feature colors are resolved.
Points aggregation (clustering)		Standard and severity point layers can expose clustering options. See Layer controls and user-facing filters.
Show or hide configured OnSphere layers		The layer menu can toggle any configured layer. See Layer controls and user-facing filters.
Hide the layer menu through configuration		Set `displayLayersMenu` to `false` to remove the layer menu (defaults to `true`). See Layer controls and user-facing filters.
Navigate to a dashboard from a displayed map element		Use the GeoJSON `linkedDashboard` property. See Layer controls and user-facing filters.
Load SVG as an map icon		See Icon image formats
Limit map boundaries and movements		Configure center, zoom, pitch, bearing, `maxBounds`, `disablePan`, `disableRotate`, and `disableZoom`. See Navigation and camera controls.
Switch dynamic collection filters from the map		The layer menu exposes collection filter ids when a visible layer declares more than one. See Collection and alarm filters.
Switch dynamic alarm filters from the map		The layer menu exposes alarm filter ids when a visible layer declares more than one. See Collection and alarm filters.
Notify when a selected filter returns no points		Selecting a collection or alarm filter with an empty result shows a notification without locking the layer. See Collection and alarm filters.
Reuse one floor selector across OnSphere, WMTS, and WMS layers		Use `style: "Floor"` together with `floorPropertyPath`. Only one floor parameter is supported per widget. See Floor-linked filtering.
WMTS layer support		Overlay external WMTS raster tiles with templated URLs and runtime parameters. See External raster overlays and parameters.
WMS image support		Display WMS `GetMap` responses as a single image refreshed on map move or zoom. See WMS image sources.
Toggle WMS and WMTS sources at runtime		Each configured external source appears in the layer menu and can be shown or hidden independently. See Runtime source toggles.
WMS / WMTS static parameter settings		Inject fixed placeholder values into WMS and WMTS templates. See WMS / WMTS template parameters (Static, Dynamic, Shared).
WMS / WMTS dynamic parameter settings		Expose `Select` placeholders as in-map dropdowns or floor pickers. See WMS / WMTS template parameters (Static, Dynamic, Shared).
WMS / WMTS shared parameter settings		Reuse one selector value across several WMS and WMTS sources. See WMS / WMTS template parameters (Static, Dynamic, Shared).
Open map menu actions from right click or long press		Map menus can use the clicked position and feature context. See Map context and Create alarm from map context menu.
Read clicked coordinates, layers, and features in menu context		The map menu context exposes `map.point` and `map.layers` data. See Map context.
Navigate to a specific location on the map from a menu or widget		Use `navigateOnMap` from the widget context. See Map context.
Activate or deactivate a specific layer from a menu or widget		Use `activateLayer` and `deactivateLayer` from the widget context. See Map context.
Link to the current map location through the URL		The widget synchronizes the `pos` URL parameter on map moves. See URL state and context integration.
Use street view		See Limitations and non-supported features
Update element location on the map		See Limitations and non-supported features
Read live mouse-pointer coordinates		See Limitations and non-supported features
Include the map in a menu (for example as a position picker)		See Limitations and non-supported features
Draw shapes or query an area on the map		See Limitations and non-supported features
Search, measure distance or area, or calculate itineraries		See Limitations and non-supported features
Export the current map view as an image or PDF		See Limitations and non-supported features
Use tiled WMS sources		See Limitations and non-supported features
Use external vector, WFS, or GeoJSON overlay sources		See Limitations and non-supported features
Adapt WMS or WMTS language and theme automatically from the OnSphere theme		See Limitations and non-supported features
Configure WMS or WMTS layers automatically from `GetCapabilities`		See Limitations and non-supported features

Journal

Capability	Support	Comment
Show the journal as a chat timeline		Default display mode. See Display modes.
Show the journal as a table		Rows expose the journal properties as columns. See Display modes.
Let users switch between timeline and table at runtime		Enabled unless `disableTypeSwitch` is set. See Display modes.
Format the timeline text with an expression		Use `journalSettingsOverride.timelineTextFormatter`. See Journal on a collection table.
Define the journal table columns and sort		Use `journalSettingsOverride.tableView`. See Journal on a collection table.
Show a per-row summary above the journal		Use `summaryFormatterExpression`. See Panel behaviour and summary.
Show the journal panel when several rows are selected		Use `displayWithMultipleRows`. See Panel behaviour and summary.
Display the author from a user-preference attribute		Use `usernameAttribute`. See Panel behaviour and summary.
Track who created or edited each entry (edit history)		The `meta` trail is filled automatically for collection and form journals. See Entry data model.
Add a free-text entry (GitHub Flavoured Markdown)		Type a message and submit with `Ctrl`+`Enter`. See Adding and editing entries and Alarm Table.
Let the user set the entry timestamp		Set `inputMethod` to `TimestampMessage`. See Adding and editing entries.
Restrict who can edit entries		`editMode` accepts `all`, `self` or `none`. See Adding and editing entries.
Conditionally allow adding or editing entries		Evaluate `enabledAddEditEntryExpression`. See Adding and editing entries.
Capture structured entries with a custom input form		Use `journalSettingsOverride.form`. See Custom input form and Customize the input and table of a form journal component.
Prefill form fields from live values		Uses the form `bindings`. See Custom input form.
Populate form fields from a collection (dropdowns / lookups)		Collection-backed fields fetch their options through the collections module. See Custom input form and Customize the input and table of a form journal component.
Add an entry to every selected row at once		Submit with `Ctrl`+`Shift`+`Enter`. See Alarm Table.
Force a journal entry from a menu action or script		Call `alarms.addJournalEntry` from a script. See Force journal entry on alarm menu actions.
Attach a journal to a collection-table row		Add a `JOURNAL` render column to the collection view. See Journal on a collection table and Customize the input and table of a form journal component.
Store journal entries inside the collection document		Entries are an array field written by document diffs. See Journal on a collection table and Collection table with row detailed view.
Expand a collection-table row to show its journal		Set `tableRowDetail` to the journal property. See Collection table with row detailed view.
Use `journalSettingsOverride` outside a collection table		The override (form / tableView / timeline formatter) is only honoured for CollectionTable views. See Limitations.
Attach files to an entry by drag and drop		Requires `uploadId`. Drop files onto the journal. See Attachments and Use menus to upload file as attachments on alarms.
Attach files to an entry with a file picker		Requires `uploadId`. Use the paper-clip in the input row. See Attachments.
Restrict allowed file types and size		Configure `authorizedContentTypes` and `maxSize` in `upload.ospp`. See Attachments and Use menus to upload file as attachments on alarms.
Preview and download attachments (image, PDF, video, …)		Click a thumbnail to open the preview modal. See Attachments.
Show attachments on an alarm history table journal		Attachments are dropped on the history path (the history entry carries no attachment list). See Limitations.
Limit the number of attachments per entry		No per-entry count limit is enforced. See Limitations.
Automatically delete orphaned files when an entry or alarm is removed		The entry only stores file identifiers; deleting it does not remove the stored files. See Limitations.
Detach the journal into its own dashboard widget		Use a `Journal` widget bound with `viewAs`. See Detached journal widget.
Bind the detached widget to a live alarm table (editable)		Point `viewAs` at an AlarmTable widget id. See Detached journal widget.
Bind the detached widget to an alarm history table		Point `viewAs` at an AlarmHistoryTable; the journal becomes read-only. See Detached journal widget.
Validate that `viewAs` resolves to an existing widget		The referenced widget id is not checked at configuration time. See Limitations.
Toggle table-mode toolbar buttons and column resize mode		Use the `disableToolbar*` flags and `resizeMode`. See the JournalWidget settings.

Media

Capability	Support	Comment
Display images		Only indirectly using widget Markdown or widget Schematic
Display videos		Using widget Video Player
Display PDFs		Using widget PDF Viewer
Link files to an alarm/collection		Currently, only PDF files can be linked to an alarm or a collection entry. By setting the source of the PDF inside an alarm/collection, you can then use a menu to open/display the PDF inside a popup box or a separated PDF Viewer widget.

Front-end

Widgets list