Appboard/2.4/builder/widgets/web page: Difference between revisions

imported>Jason.nicholls
No edit summary
imported>Jason.nicholls
Line 48: Line 48:


This approach would be similar for many other services that offer embeddable content.
This approach would be similar for many other services that offer embeddable content.
[[File:appboard-2.4-web-widget-twitter.png|frame|center|Web Widget using local HTML page with embedded Twitter content.]]


# Use Twitter Widgets (link above) to create the widget
# Use Twitter Widgets (link above) to create the widget

Revision as of 15:24, 15 July 2014


Overview

The AppBoard Web Page Widget provides a way to include HTML content into an AppBoard dashboard. The URL for the widget can be configured with the widget and/or set via action which allows for user interaction to drive the content shown.

With the Web Page Widget you are able to:

  • Include content from an external source by specifying an external URL. Please note that not all websites behave well in this context hence the functionality provided by enPortal.
  • Include enPortal proxied content, providing the full capabilities of enPortal such as single sign-on (SSO), and the Content Retrieval System (CRS).
  • Include web pages or content served up by the AppBoard server itself. These could be static pages or CGI scripts.

Other than managing the URL, interaction between the Web Page Widget and AppBoard is limited. To develop a more integrated experience allowing AppBoard and the Widget to communicate then refer to the HTML Widget.


Creating Web Widgets

For instructions on creating a Widget, see the general instructions in Adding Widgets. The Web Page Widget type is located under the Web category on the Widget selection screen.

Web Widget Home Control

Web Widget Home control

In both the Builder and Viewer any Web Widgets feature a Home icon in the widget title bar. This forces the content displayed to revert to either:

  1. the last configured URL via action
  2. (if above doesn't apply) the widget configured URL

When interacting with a Web Widget the user may navigate away from the original content and this feature just provides an easy way to get back.

Examples

Simple External Source

This example configures a simple external URL:

  1. Follow the instructions above to create the basic "Web Page" Widget.
  2. Enter the following information on the Visualization tab:
  3. Click Close or Next -> Finish to save the changes.

Including enPortal Proxied Content

Embedding a Twitter Timeline

This example is a case of including a HTML page served up by the AppBoard server. The content of the HTML page is just a bare bones HTML document with the embedded code provided by Twitter using the User timeline widget (see https://twitter.com/settings/widgets - requires a Twitter account).

This approach would be similar for many other services that offer embeddable content.

Web Widget using local HTML page with embedded Twitter content.
  1. Use Twitter Widgets (link above) to create the widget
  2. Create a basic HTML page on the AppBoard server and include the code provided by Twitter. For example this could be stored: [INSTALL_HOME]/server/webapps/enportal/custom/edge_twitter.html
  3. Now in the AppBoard Builder create a new Web Page widget and use the following URL: /enportal/custom/edge_twitter.html
  4. Click Close or Next -> Finish to save the changes.

OLD

Launch Contextual Content in a Web Widget

By combining AppBoard and enPortal, you can create special Widgets (called "Channels") that integrate web application GUIs. For a tutorial example of using an enPortal Channel to launch contextual content from an AppBoard Web Widget, see Launching an enPortal Channel from a Widget.


Display enPortal PIM Content in a Web Widget

enPortal PIMs provide out-of-the-box integration of web application GUIs. You may want to display an enPortal channel on a Board in AppBoard. For a tutorial example of using an enPortal Channel to display an integration application GUI in an AppBoard Web Widget, see Display PIM Content in a Web Widget.