How To Resume and Ionic App If Pause Lasts Less Than 5 seconds

Question

I have an app that I want to apply the cordova "pause" and "resume" functionality to. I have the "pause" implemented. Inside the "Pause" listener, I log the user out. What I need is to only log the user out if the "pause" is for longer than 5 seconds. So if the user leaves the app, then in under 5 seconds returns to the app, I do not want to log them out, but allow them to continue to use the app.

I have used the following, but it just waits 5 seconds and then logs them out even if they return.

$timeout(function(){
   myLogoutFunction(); //I want to cancel this if the user returns before the function fires.
}, 5000);

Answer 1

You need to cancel the $timeout. Try $timeout.cancel(promise) when the app resume event is fired, this will abort the operation. Or with simple javascript:

// on pause
let _timer = setTimeout(function(){      
      //logout the user
}, 5000);
// on resume
clearTimeout(_timer);

$timeout is just a wrapper for setTimeout.
Hope this provides some insight.

Answer 2

In Ionic 1, the 'pause' event handler will never actually be called on iOS because the web view that the app is running in is immediately halted.

I have used the following, but it just waits 5 seconds and then logs them out even if they return.

The actual 'pause' event handler will be called on the subsequent 'resume' event being fired. The user of timers won't work in this scenario because they will be queued on 'resume'. Instead you could keep track of the last action done by the user, manage session via local db that can be serialized to the file system, or manage the session remotely and destroy the logout remotely and check if the session is still valid on 'resume'. If the session is no longer valid than redirect back to the login screen. However, in these scenarios you'll probably want to increase the timeout period to a time greater than 30 seconds. Maybe 10 minutes would be a better number.

This is a consequence of Cordova using a webview which doesn't have access to the underlying native lifecycle events.

You could try using the ng-idle module however, I haven't actually used it so I can't say whether or not it works but it says it keeps track of touches/scrolls etc. to maintain when a user was last active.

See this question for additional information on ng-idle and potential other approaches to detecting idle users.