Offline Errors

No alert

Offline Snackbar

Offline Full Screen blocker

Alert Dialog

No alert

Offline Snackbar

Offline Full Screen blocker

Alert Dialog

If user is engaging with content that is unaffected by being offline (i.e. when engaging with downloaded content like videos, or filling out a form without submitted it) there will be no indicator that they are offline.

 

  1. When offline, we will show the snackbar on all screens that are displaying cached data:

  • Course Outline

  • Announcements

  • Handouts

  • Profile

  • Discussion Topics 

  • Course Enrollment

  1. User can dismiss the snackbar on Android via swiping, on iOS there is a Dismiss button

  1. If a user dismisses the snackbar, and then navigates to another screen with cached data, the bar will appear again

  1. If a user comes back online, snackbar does not go away until they either tap Reload or navigate to another page

  1. On Android, tapping the Reload button on Snackbar will result in a full screen refresh on the new Tabs based Course Dashboard i.e. all the tabs will be refreshed.

 

 

  1. If there is no content to show, display full screen blocker

  2. Default to having a Refresh button

    • Remove Refresh button if user is in airplane mode or if we know for certain that nothing will happen on refresh

  3. On Android, tapping the Reload button on Full Screen Blocker will result in a full screen refresh on the new Tabs based Course Dashboard i.e. all the tabs will be refreshed.

If the user tries to submit data while offline (i.e. something that would trigger a POST request), they should see an alert dialog telling them they are offline.

In the login activity, when the app detects that we are offline, an alert dialog is displayed that tells the user there is no connection. This can be dismissed either by hitting OK or getting the back button. It also goes away if we have a network connection again.

Snackbar

Full Screen

Snackbar

Full Screen

^ In certain cases there won't be a search box, this is only showing the case within Find Courses.

 

We will use the native snackbar in Android and a custom snackbar in iOS

 

 

**NOTE: Text is not final, we will need to run it by Carol