AngularJS - Detect no action for n minutes and go to default state

Question

I am new to Angular and would appreciate your advice. I'm using ui.router and I configured states like this:

app.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise("/category");
$stateProvider
    .state('category', {
        url: '/category',
        templateUrl: 'category.html',
        controller: 'categoryController as catCtrl',
        reload: true
    })
    .state('category.categoryDetail', {
        url:'/:id',
        templateUrl: 'categoryDetail.html',
        controller: 'categoryDetailController as catDetailCtrl',
    })

    .state('category.categoryDetail.product', {
        url:'/product/:prod_id/:filter_model/:current_page',
        templateUrl: 'product.html',
        controller: 'productController as productCtrl'
    })

I need to set timeout function that checks if there is no action for 'n' minutes, then I need the website to return to the default state 'category'. I know I could do it with jQuery using setTimeout() but I'm not sure where to embed the code.

what actions are you talking about? talking to the backend, clicks on anywhere of the screen? — sdfacre, May 03 '16 at 05:52
In wherever you want to land first, use $timeout (just like you use jQuery's setTimeout) to countdown, and when it ends redirect the user using $location. Meantime if action happens, cancel the timeout and/or start a new one if you need to do the checking again... — Suman Barick, May 03 '16 at 05:57

score 3 · Answer 1 · answered May 03 '16 at 05:54

3

I believe you need something like ng-idle

answered May 03 '16 at 05:54

Muhammad Abid

801
4
12

Very useful, but should I repeat the same code in every controller? Because I need to "watch" from every place. – Gyuzal May 03 '16 at 06:28
you can use it with .run – Muhammad Abid May 04 '16 at 00:39

score 1 · Accepted Answer · edited May 23 '17 at 11:59

1

You may use app.run .

I made an example of what you need in plunker: https://plnkr.co/edit/aHj3XeCC83hHoCcu9Vix?p=preview

Copy the code and try it locally, it will work fine.

I used this answer: auto logout with angularjs based on idle user

edited May 23 '17 at 11:59

Community

1
1

answered May 03 '16 at 07:22

user2903753

153
2
12

AngularJS - Detect no action for n minutes and go to default state

2 Answers2