“Have you ever needed to perform a single or periodic task on your page based on user’s actual presence? Do you think you really need to fetch new notifications from your servers all the time, or isn’t such task quite pointless unless there actually is an active user sitting in front of your page?”

jQuery-IdleCat to the rescue …

// Create an instance of idleCat on a jQuery object.
var instance = $('#status').idleCat({

    // Number of seconds to wait between two scans of user activity.
    interval: 2,

    // How many seconds to hold the activity from the moment of knowing there was not any activity.
    release: 2,

    // The default state of the idleness (use 'active' or 'idle').
    state: 'idle',

    // Callback fired after the discovery of user activity on the page.
    activeCallback: function() {
        $(this).addClass('active');
    },

    // Callback fired after the discovery of used idleness on the page.
    // (+ number of seconds defined in the 'release' property)
    idleCallback: function(element) {
        $(this).removeClass('active');
    },

    // See below for more options...

});

// Log current state from idleCat attached to that jQuery object.
window.setInterval(function() {
    console.log(instance.getState());
}, 1000)

// Create an instance of idleCat on a jQuery object.

var instance = $('#status').idleCat({

// Number of seconds to wait between two scans of user activity.

interval: 2,

// How many seconds to hold the activity from the moment of knowing there was not any activity.

release: 2,

// The default state of the idleness (use 'active' or 'idle').

state: 'idle',

// Callback fired after the discovery of user activity on the page.

activeCallback: function() {

$(this).addClass('active');

// Callback fired after the discovery of used idleness on the page.

// (+ number of seconds defined in the 'release' property)

idleCallback: function(element) {

$(this).removeClass('active');

// See below for more options...

});

// Log current state from idleCat attached to that jQuery object.

window.setInterval(function() {

console.log(instance.getState());

}, 1000)

GitHub

User-presence detection with jQuery-IdleCat

Alexander