Detect User Activity And Fire Callback After A Idle Time – idle.js

Category: Javascript | June 28, 2018
Author:h-wang
Views Total:4,634 views
Official Page:Go to website
Last Update:June 28, 2018
License:MIT

Preview:

Detect User Activity And Fire Callback After A Idle Time – idle.js

Description:

idle.js is a vanilla JavaScript based idle timer that checks if a user is idle for a specific amount of time and fires a callback function (or redirects the page to another)  if the user goes idle.

By default, the library detects user activity based on mouse movement, click, keydown and window scroll events.

How to use it:

Insert the JavaScript file ‘idle.js’ into the document.

<script src="/dist/idle.js"></script>

Set the  ‘idle’ timeout in milliseconds.

// 2 seconds
_idle('interval', 2000);

Execute a function when the user goes idle.

_idle('callback', function(){
  // do something
});

Redirect the page to another.

_idle('url', ['logout.html']);

Redirect the page to an escape page (no need to detect idle).

_idle('escape', ['logout.html']);

Set the event types used to detect the user activity.

_idle('eventTypes', ['mousemove', 'click', 'keydown', 'scroll']);

You Might Be Interested In:


2 thoughts on “Detect User Activity And Fire Callback After A Idle Time – idle.js

  1. Paolo Mattiangeli

    The call to

    _idle(‘eventTypes’, [‘mousemove’, ‘click’, ‘keydown’, ‘scroll’]);

    returns an exception. It seems to me that there is no way to configure the event listeners via this function. The events are hardwired in the _idle() function code.

    Reply
  2. Ashnage Narnesfugen

    hey, is there a way that the callback function work again even if i already “disarmed” the function i executed, i mean like ”
    _idle(‘callback’, function(){
    $(“.intro”).css(“display”,”none”);
    });
    $(“html”).mousemove(function(){
    $(“.intro”).css(“display”,”none”);
    });

    and then if user idles again, the function will execute.

    Reply

Leave a Reply