ROES Web webviewurl

ROES Web can make use of the webviewurl attribute to provide customers with additional information on Options different from what sublabel, icon and/or tooltip already do.  The webviewurl window acts as an overlay/pop-up in the app.  The value should be an https:// URL to an image or web page, with added modifiers for size and location to show the pop-up and whether it should mask the overall screen or not (details below).

To define the location, size and overlay mask level these values should be defined after adding a ?webview_style= to the end of the URL:

top - set top as a percentage from the top of the workspace are to begin display of the window, i.e. top:10%;

left - set left as a percentage from the left of the workspace area to begin display of the window, i.e. left:25%;

width - set width to the desired pixel width to display, i.e. 800px;

height - set height to the desired pixel height to display, i.e. 500px;

(the window will offer scroll bars for the user to see more; if using images ideally set the width and height to match for best presentation)

&webview_overlay - set &webview_overlay to either true (to fully mask the app behind the overlay) or false (to not mask the app).

 

When defined, an icon appears next to the option, highlighted by the red square here:

When clicked, the page or image set as the value will display:

With &webview_overlay=false:

With &webview_overlay=true:

You can have webviewurl on multiple options in a set and customers can click on each and see at same time if desired, like Mahogany and Pine in this example:

Set the top and left values to be close but separate areas; in this example Mahogany is 

?webview_style=top:5%;left:5%;width:350px;height:410px;&webview_overlay=false

after the URL and Pine - whose file size is 340x400 - is

?webview_style=top:25%;left:25%;width:350px;height:410px;&webview_overlay=false

after the URL.  A few extra pixels for the width and height are best to avoid scroll bar appearance.

 

 

Article Details

Article ID:
86
Category:
Views:
74