Enabling online-only features in offline mode

When you follow the guidelines for designing offline-enabled mobile apps to ensure that your mobile app operates without a network connection, you can expand the functionality of the app and add a flow processing feature, configure an action, or add a control that your app does not support in offline mode. To use online-only features, you configure your app to call the server directly.

When you design an application that users can access with an offline-enabled mobile app, you can, for example, let users work with cases whose flows contain shapes that are absent from the offline-supported flow processing list. You can also build a user interface that contains online-only controls, or invoke actions that require a connection with the server.

Procedure
Use any combination of the following methods to enable online-only features in your offline-enabled app:
Choices Actions
Process an online-only case
  1. Create a new case type in the application and do not add it to the list of offline-supported case types in the mobile channel.
For example, you can add a case type that contains a utility flow shape for sending an e-mail.

Online-only cases use all the features that are available to online-only mobile apps. Users can work on such cases only when the app is connected to a network.
Display online-only layouts, controls and actions in a page
  1. In the user interface for an offline-enabled case type, create an actionable control, for example, a button.
  2. On the Actions tab of the control, add a Launch > Harness action.
  3. Configure the action as online-only by selecting Always display harness from the server.
For example, you can display a chart control to see a report in a graphical form.

When the mobile app is connected to a network and the user interacts with the control, the app displays a page that supports all layouts, controls and actions that are available to online-only mobile apps. In offline mode, instead of showing the page, the mobile app displays an alert that users can dismiss to continue their work.
Display online-only layouts, controls and actions in a user interface page
  1. In the Navigation section of the mobile channel page, add an item to the menu bar, for example, Documents, Reports, or Pulse.
  2. Next to the name of the page that you want to modify, click Configure, and then select Display online version of the page.
For example, you can display a Pulse page to let users communicate with other stakeholders.

A fully-functional user interface page is available to users only when the mobile app is connected to a network. In offline mode, when the user taps an icon on the bottom bar, instead of showing the user page, the mobile app displays an alert that users can dismiss to continue their work.
Immediately run any online-only activity
  1. Create and open a text file rule of js type, for example, department_expenses_api.
  2. In the File source field, add JavaScript code that performs the following actions:
    • Loads an empty data page, for example D_Departments, to the client cache.
    • Defines a function that calls the executeBreakoutCall method, for example fetchData, and populates the D_Departments data page with data from the server.
  3. Check out the pypega_ui_userscripts_offline Static Content Bundle rule to the branch for your application.
  4. In the pypega_ui_userscripts_offline Static Content Bundle rule for your application, add the department_expenses_api text file to the list of included files.
  5. In the user interface for an offline-enabled case type, add and configure a drop-down control:
    1. In the Cell properties window, on the General, in the List source section, in the Type field, select Data page, and in the Data page field, select D_Departments.
    2. In the Load behavior field, select After screen renders.
  6. In the section that contains the drop-down control, add an embedded section:
    1. In the Section Include window, in the Page context field, select Use current page context.
    2. In the Section field, select or create an empty page, for example Script_page.
  7. Configure the Script_page page:
    1. In the configuration page of the Script_page page, on the HTML tab, clear the Auto-generated HTML field.
    2. In the HTML source field, add HTML code and a script that calls the fetchData function.
For example, you can populate a drop-down control with filtered properties from a large, frequently updated workpage that is not packaged and is not stored in the client store, such as a list of departments and their current budgets.

A JavaScript method runs the activity and receives a callback that can be a success or a failure, and that you can handle in your code. For more information, see JavaScript API for running any activity in offline mode.
Schedule any online-only activity
  1. In the user interface for an offline-enabled case type, create an actionable control, for example, a button.
  2. On the Actions tab of the control, add a Run script action.
  3. In the parameters of the Run script action, create a JavaScript function, which contains the code that you create to add the callActivity action to the action queue.
For example, you can send a notification to the originator of a case, to provide additional attachments.

A JavaScript method schedules the activity to be run on the server when the offline-enabled mobile app regains network connectivity. For more information, see JavaScript API for scheduling any activity in offline mode.