Importing HTML5 Widgets

Widgets are small web components that can extend the functionality of a webpage or website. Custom-built websites can also incorporate widgets, by using open-source code or frameworks to provide certain functionality in whole or in part. A widget is a self-contained code block that slots into a website without changing any of its features. Widgets are most frequently used to provide on-screen user interface elements that ingrate with other platforms and data sources. A widget can be run on any web page on a website, with consistent placement and user interface. For example, social media, weather, RSS or podcast widgets.

By default, the following widgets are available under the Widgets folder in the Graphic Toolbox:

• Carousel

• Web Browser

• QR Code Scanner

• Map_App

You can import a widget for a standalone and managed application. The file format is Custom Widget Package (.cwp), which includes HTML5, CSS, and Javascript files.

Importing HTML Widgets

1. Launch WindowMaker.

2. On the File menu, click Import, click Visualization, and then click HTML5 widget.

   The Import HTML5 widget dialog box appears.

3. Select the folder for the application containing the windows to import.

4. Click OK.

   The widget will appear in the toolbox.

After importing the widgets

5. Create a graphic.

6. Edit the graphic and embed the widget.

7. Set the properties under the Widget Properties section. Each widget will have its own set of properties.

8. Insert the widget on a window.

The widget can now be viewed on WindowViewer and any web browser. Depending on the properties set in the design time you can manipulate the widget in runtime. Scripts using Custom Properties under ‘Widget Properties’ to modify widgets are not supported.