Input helpers

Input helpers provide support to simplify the assignation of common needed values to property values. The Input helpers menu appears when hovering over an input field and clicking on the gear icon. The displayed options are attached to the context and the property, and only the available assignations will be displayed for each property.

Link tag

Link tag entry allows users to pick a property from a tag or alias tag. When selected, a popup will open to allow users to select a tag without needing to know the path from memory. The helper popup also allows users to navigate between previously defined tag aliases.

The helper is divided into three sections: 

1. The top part allows users to select tags group and elements. The list will show the tags tree if the alias is disabled, or the alias tree configured on the module if the alias is enabled.

2. The bottom part allows users to select one of the tags inside the selected alias or element selected.

3. In the button bars, you can toggle between Tags and Alias views. This option will only be available when at least one alias is configured.

When the required alias or tag is selected, a second pop up is opened showing tag properties, where the user can choose the required property to be read

After selecting the property, the input will be filled with an expression tag(“<tag path>.<property path>”), giving the value of the property from the selected tag or alias as result.

See reference for further information.

Link property

The Link Property helper allows users to link one property to another without manually writing the full property path. When selected, a popup opens with two main sections:

• The top section displays the element tree related to the parent element of the selected input. This allows users to select siblings, parent elements, and child elements.

• The bottom section displays the properties available for the selected element.

Link function

The Link Function helper allows users to select a function from the Functions project folder and insert it into a property expression.

When a function is selected, Web Vision generates an expression using the following format: func("<function name>"). Any parameters required by the function must be added manually after the function name.

Note:

The Link Function helper inserts the function reference, but it does not automatically complete the required parameters. If the function requires parameters and they are not provided, the expression returns an error until the missing parameters are added manually.

Result from function selection with an error message due to missing parameters.

Link Dataset

The Link Dataset helper allows users to select a Dataset from the project and insert it into a property expression.

When a dataset is selected, Web Vision generates an expression using the following format: dataset("<dataset path>"). The path generated will be the result from accessing the Dataset instance from the property .

After selecting the dataset, the generated expression is inserted into the selected property. The property can then use the dataset as a data source for components, expressions, or reusable screen logic.

Link UI

The Link UI helper provides access to runtime information from the current Web Vision session, such as time, time zone, window size, and user information. When an option is selected, Web Vision inserts the corresponding ui() expression into the selected property.

Expression editor

Expression editor is a popup that allows users to develop and edit an expression or code blocks in a comprehensive, user-friendly editor that includes syntax highlighting, automatic indentation, code folding, line counting, text selection highlighting and other features. Other functionalities available outside the editor:

• Multiple types of syntax highlighting can be applied within the editor. For instance, functions utilize JavaScript syntax, while SVG includes a feature capable of highlighting HTML syntax.

• Right-hand Buttons bar: these buttons are helpers used to append the selected helper result to the expression text as opposed to direct link access, which overwrites the current input value.

• Bottom bar buttons allow users to import a file with the relevant code and open it in the editor area.

The return keyword is optional. If not present, the result from the last line will automatically be returned.

1. Line count and code folding markers.

2. Expression editor with automatic syntax highlighting.

3. Helpers button bar.

4. Buttons for loading code files from an external source, and save or discard changes.

Animations

Most Web Vision inputs can be configured with an animation, which will play whenever the value changes, resulting in a smooth transition between the previous value status and the new status . Animations can also be set to custom properties.

Set animation opens a popup that allows users to apply an animation to the selected input. The following options are available:

Once the animation has been saved, a play icon is shown before the input label. The animation can be edited using the Input helpers menu.

In the following animated image, we create a rectangle and set its XY coordinates to a Tag with random values. Initially, the rectangle jumps around in a random pattern. However, once we set the animation for both XY coordinates, the rectangle moves around more smoothly.

Link action

This input helper is only available on action inputs, as the resultant function receive the response of the specified action called during the trigger of an event, and trying to access to an action out of this context will throw a warning message to the user.

The input helper will display the sorted list of actions configured for a trigger, in ascendent, triggering order. Each action is named after the number of the sequential order in which it is executed, followed by the type of action triggered. 

This functions is useful for 'Call Module Method' actions, which will return the same value returned from the method triggered.

Select method

This input helper is available for 'Call Module Method' action only, where the option of selecting a method is needed.

The input helper will display a popup: on the left side, a list of the available methods is shown; on the right side, extra information about the method is shown: 

Web Vision Full Product Details