Overview
In the page decorator, you will find two buttons: Page Script and Global Script.
Unlike Python Scripts, which are executed server-side, Page and Global Scripts are executed client-side in the browser. This means the script runs inside each user's browser session independently.
Page scripts are stored with the page and only loaded with that page. Global scripts are stored globally and loaded with all pages.
- Scripts inside Page Script are saved together with the page and are only loaded with this page.
- Scripts inside Global Script are saved globally and are loaded with all pages.
Default lifecycle functions
Both Page Script and Global Script include three lifecycle functions by default.
- OnPageLoad / OnGlobalLoad : Executes when the page is loaded.
- OnPagePeriodic / OnGlobalPeriodic: Executes periodically while the page is open.
- OnPageExit / OnGlobalExit: Executes before navigating to another page. This function is not executed when closing the browser.
Custom functions and object actions
Besides the default lifecycle handlers, you can create your own custom functions.
These custom functions can then be executed from object actions.
Page Script functions
The system provides built-in functions for interacting with variables, the page, the system, data tables, alarms, databases, and popups.
- PageNavigate(pagename): Navigates the runtime to another page.
- PageAddVariable(variable) : Creates a script-level variable, necessary when not used on the page.
- PageReadVariable(variable): Reads the value of a system variable.
- PageReadIntVariable(variable): Reads a variable and returns it as an integer.
- PageReadFloatVariable(variable) : Reads a variable and returns it as a floating-point number.
- PageReadBoolVariable(variable): Reads a variable and returns it as a boolean value.
- PageWriteVariable(variable, value, silent = true) : Writes a value to a system variable.
- PageGetSelectedDataGridRows(name) : Returns the selected rows of a Data Grid as objects keyed by column.
- PageDeselectDataGrid(name) : Removes the current selection in a Data Grid.
- PageRefreshDataGrid(name) : Reloads the rows of a Data Grid.
- PageSelectDataGridRow(name, keyValue) : Selects the row of a Data Grid with that key value.
- PageSetDataGridFilter(name, column, operator, value, value2) : Sets a filter on a Data Grid column.
- PageClearDataGridFilters(name) : Removes every filter and the search text of a Data Grid.
- PageExportDataGrid(name) : Downloads the CSV export of a Data Grid.
- PageGetSelectedDataGridCells(name) : Returns the visible cell texts of the first selected row of a Data Grid, in column order.
- PageLogin(username, password) : Logs a user into the system.
- PageDatabaseQuery(connection, sqlquery) : Executes a SQL query on a Database Connection and returns the result asynchronously.
- PageAlarmBannerAcknowledgeAll(name) : Acknowledges all unacknowledged alarms in an alarm banner (if the user has the rights)
- PageAlarmBannerRemoveAll(name) : Removes all alarms from an alarm banner (if the user has the rights)
- PagePublishDeviceVariables(deviceName) : Publishes variables of a specified device.
- PageSetLayerVisibility(layer, hide) : Sets the visibility of a layer using its layer identifier.
- PageSetLayerVisibilityByName(layerName, hide) : Sets the visibility of a layer using its layer name.
- PageOpenPopup(callerId, popupJson): Opens a popup with its configuration
The usage of Local variables is of course completely supported. Note that writing a Local variable changes it for all users, not only for the user executing the script.
PageAddVariable(variable)
Adds a script-level variable initialized to zero.
- variable: Name of the script variable to create.
PageReadVariable(variable)
Returns the value of a system variable.
- variable: Name of the variable to read.
PageReadIntVariable(variable)
Reads a variable and returns its value converted to an integer.
- variable: Name of the variable to read.
PageReadFloatVariable(variable)
Reads a variable and returns its value converted to a floating-point number.
- variable: Name of the variable to read.
PageReadBoolVariable(variable)
Reads a variable and returns its value converted to a boolean.
- variable: Name of the variable to read.
PageWriteVariable(variable, value, silent = true)
Writes a value to a system variable.
- variable: Name of the variable to write.
- value: Value to write.
- silent: Optional flag to suppress notifications or events. Default: true.
PageGetSelectedDataGridRows(name)
Returns the selected rows of the Data Grid with that Name as an array of objects keyed by column, for example rows[0].OrderNo. With Selection set to Single the array holds one row.
- name: Name of the Data Grid.
PageGetSelectedDataGridCells(name) returns the same row as the visible cell texts in column order, which is what the Data Table function PageGetSelectedDataTable(name) returned. Page Scripts that used the old name are rewritten to the new one when the project is upgraded.
PageSelectDataGridRow(name, keyValue)
Selects the row whose Key Column holds keyValue, for example after a write, and writes the Selection Variable.
- name: Name of the Data Grid.
- keyValue: Value of the Key Column.
PageDeselectDataGrid(name)
Removes the current row selection in the Data Grid. It replaces the Data Table function PageDeselectDataTable(name), which upgraded projects are rewritten to use.
- name: Name of the Data Grid.
PageRefreshDataGrid(name)
Reloads the rows of the Data Grid with the current filters, sort and page.
- name: Name of the Data Grid.
If you do not want the grid to reload periodically, set its Refresh Time to 0 and call this function when needed. It replaces the Data Table function PageRefreshDataTable(name), which upgraded projects are rewritten to use.
PageSetDataGridFilter(name, column, operator, value, value2)
Sets a filter on one column of the Data Grid and reloads it, the way an operator does through the column filter. Call it with an empty value to remove the filter of that column. This replaces the former PageFillDataTableDynamic: the connection and the table belong to the object, and a filter narrows the rows at runtime.
- name: Name of the Data Grid.
- column: Column key as defined on the object.
- operator: contains, startswith, equals, notequals, gt, gte, lt, lte, between, in, empty or notempty.
- value: Filter value; for in a comma separated list; for between the lower bound.
- value2: Upper bound for between.
PageClearDataGridFilters(name) and PageExportDataGrid(name)
PageClearDataGridFilters removes every filter and the search text of the Data Grid and reloads it. PageExportDataGrid downloads the CSV export of the rows that match the current filters, up to the Row Limit.
- name: Name of the Data Grid.
PageLogin(username, password)
Logs a user into the system.
- username: User name.
- password: User password.
PageDatabaseQuery(connection, sqlquery)
Executes a SQL query on a Database Connection and returns the result asynchronously. The connection is selected by name and must have Allow Database Query set on the Database Connections page; see the Database Query article.
- connection: Name of the Database Connection.
- sqlquery: SQL query to execute.
PagePublishDeviceVariables(deviceName)
Publishes all variables of the specified device to its configured Kafka broker.
- deviceName: Name of the device.
PageSetLayerVisibility(layer, hide)
Sets the visibility of a layer using its layer identifier.
- layer: Layer identifier or reference.
- hide: Boolean indicating whether the layer should be hidden (true) or shown (false).
PageSetLayerVisibilityByName(layerName, hide)
Sets the visibility of a layer using its layer name.
- layerName: Name of the layer.
- hide: Boolean indicating whether the layer should be hidden (true) or shown (false).
PageOpenPopup(callerId, popupJson)
Opens a popup and passes the caller id plus a popup configuration JSON object to the method.
- callerId: The id that the popup will receive.
- popupJson: Contains the JSON configuration of the popup.
popupreplacers define the replacers which will replace the values inside a master or template symbol. The order must match the master symbol, such as PumpFaceplate in the example below.
{
"OpenPopup": {
"popuptop": "-100px",
"popupleft": "75px",
"popupsymbolname": "PumpFaceplate",
"popupcontext": "",
"popupusepositioncontext": "false",
"popupdisabledrag": "false",
"popupreplacers": ["Sim", "Pump1", "Pump 1"]
}
}| Property | Type | Description | Example |
|---|---|---|---|
| popuptop | string | Vertical position of the popup as a CSS value. | 100px |
| popupleft | string | Horizontal position of the popup as a CSS value. | 200px |
| popupsymbolname | string | Name of the symbol or faceplate to open. | PumpFaceplate |
| popupcontext | string | Logical group name used for popup management. | PumpGroup |
| popupusepositioncontext | true / false | Reuse a stored position for the same popup context. | false |
| popupdisabledrag | true / false | Disable dragging of the popup window. | false |
| popupreplacers | array of strings | Values used to replace placeholders in the target symbol. | ["Sim", "Pump1", "Pump 1"] |
No rows match the filter.
Example usage: