uPortal Javascript Framework Use Cases

Portlet Overview

The news reader portlet collects recent news stories from multiple sources for a given user.  These sources are typically RSS feeds, and feeds may be distributed by user role.

The current user interface has two main subcomponents.  The first provides a list feeds, with some way to choose between them, while the second displays stories associated with the chose feed.  Eventually a third subcomponent might display the content of the story itself, which might be an article, a video, or some other resource.

Desktop Views

In the desktop interface, each subcomponent can be displayed in multiple ways.  The feed list can be either a set of tabs or a select menu, and story descriptions may be displayed either as flyouts or paragraphs.  The default choice for these views is set by an administrator but can be overridden by end users, and each of the four possible combinations is valid.

   

Mobile Views

The mobile client displays all feeds in a list, then displays stories in a list.

Implementation Notes

This portlet provides a representative example of the flexibility requirements of uPortal.  A single javascript file provides resources common to all display styles shown above.  This shared script is paired with inline template scripts defining template markup and post-render hooks.  These post-render hooks are used to perform important tasks like initializing the flyouts or calling jQuery Mobile's initialization task.

Current implementation files (based on Backbone.js):

 

Â