Creating a Webviewer Object

This topic describes how to add a new Webviewer Object to a Screen or a Container and its specific properties.

To create a new Webviewer Object, you need to access a Screen in Design mode.

Once you're in the Screen editing page, locate the Label Object from the Screen Objects list in the left panel, then drag and drop it onto your Screen or Container.

The Webviewer Object, just like every other Object, can be moved, resized, duplicated via copy/paste, and easily aligned with other Objects on the Screen.

When you create a Webviewer Object, you need to define the web page it will display. You can do this in two ways: by entering a specific web address or by dynamically defining a URL using the Layout.

How to associate the Webviewer with a specific web address

To associate the Webviewer with a specific web address, select the Object and enter the desired URL in the "Web address" field located in the Object Properties panel to the right of the Screen editing page.

Once a URL has been entered, the Webviewer Object immediately shows the corresponding webpage.

If the web page displayed in the Webviewer Object doesn't fit within its area, scrollbars will appear.
If the Board Platform URL is loaded over the HTTPS protocol, the web address associated with the Webviewer must also start with HTTPS.
The Webviewer does not support web pages that have the following directives in their HTTP header responses: frame-src, X-Frame-Options, frame-ancestors.

How to dynamically define a URL

The URL to be displayed can be dynamically determined using the Layout.

To do so, proceed as follows:

1. Select the Object and click the "Configure Layout" button  in the Properties toolbar

2. In the Layout editor, configure at least one Block that will define the URL (either a text Algorithm or a text Cube)

3. In the Object settings, select the desired Block in the "Show value" field. The first Block you create will be automatically selected

4. Save the Layout.

If you use a text Algorithm, the URL must be written in quotation marks and the Layout must contain a Cube (for technical reasons).

Once the Layout is executed, the Webviewer Object immediately shows the corresponding webpage.

If the webpage displayed in the Webviewer Object doesn't fit within its area, scrollbars will appear.

With this configuration, for example, you can enable the Master option on a Data View Object associated with a text Cube that contains the URLs of your suppliers' websites. By clicking on a supplier, the Webviewer Object displays the corresponding webpage using the address stored in the Cube.

You can also include substitution formulas in the web address to dynamically change it based on data from Board.

For example, the text Algorithm whose syntax is "https://www.bing.com/search?q="&@Customer will open a search results page based on the member of the Customer Entity defined in the active Selection.

In the example below, you can see a Webviewer configured with the Algorithm mentioned above in conjunction with a Pager set on the Customer Entity: cycling through all members of that Entity loads a new page in the Webviewer.

Interacting with the Webviewer Object in Design mode

In Design mode, the Webviewer Object doesn't provide any interactive feature and that applies also to the embedded webpage: scrollbars will not be operations and links will be disabled. If you need to test the behavior of the Object, please switch to Play mode.

The only options that you can disable for the end user in Play mode from the Contextual menu is the Layout and Annotation.