Wednesday, September 26, 2012

IBM Worklight – Part 2: Best Practices

In the initial part of the series, we focused on the folder structure, logging device information and splash screen. In this part, we dive deeper into core Worklight features and focus on Offline Mode, State Manager and Navigation. Let us get right to the subject.

1. Offline Mode/ Processing:
Even though Mobiles are supposed to have 24*7 connectivity; reality is different. Given that every Application should implement Offline Mode. To enable Offline Mode, modify body tag of InitPage.html as follows:

Now, implement doConnectionFailure() method inside InitPage.js

Additionally, have a global busy indicator that could be used across pages to show processing cycles. This will ensure in uniformity across applications.

Applications can then show/hide busy indicator as follows:

2) State Manager:
Mobile Applications need to manage state on client side. This could be achieved through a State Manager that intercepts each View and stores relevant information globally. A code sample that illustrates the same is shown below:

The following snippet is present in InitPage.html to define the view name.

3) Navigation:
Navigation is key part of Mobile Applications. Implementing a versatile framework is essential for a quality application. Content fragments should be isolated so that they can be sourced from external systems if needed. It is also a best practice to keep UI in small pieces as opposed to a single large HTML serving up the entire application.

A sample snippet that implements recommended navigation framework in InitPage.html containing to 2 pages: demo1View.html and demo2View.html is shown below:

Now, demoView.html contains the following snippet to take the user back to InitPage.html. Note that mainView corresponds to view name in InitPage.html. For more details on views, refer to StateManager.

If the snippets are present in same page moveTo should be employed in both places. The above example is for navigating between fragments.

Laks Sundararajan is a Solution Architect with Prolifics and a key member of highly specialized team working on IBM WebSphere Portal, Content Management and Collaboration technologies. He has led the implementation of many global projects using IBM WebSphere Portal and has extensive background in design and development of enterprise portals. He specializes in providing Enterprise SOA solutions leveraging WebSphere Portal, Content Management, Tivoli and Mashup’s. He holds Masters in Information Technology from Carnegie Mellon University and a Graduate Degree in Engineering from BITS, Pilani.