Il concetto di attività dell'utente su una pagina può riferirsi a diversi eventi attivati ogni qualvolta l'utente interagisce con la pagina. Quando l'utente non compie nessuna azione sulla pagina si può dire che l'utente è inattivo. Con jQuery possiamo verificare se l'utente è inattivo per un certo periodo di tempo. Vediamo come.
Il seguente codice associa un timer agli eventi mousemove
, keydown
e scroll
e verifica che l'utente li attivi o meno:
var idleTimer = null;
var idleState = false;
var idleWait = 2000;
(function($) {
$(document).ready(function () {
$('*').bind('mousemove keydown scroll', function () {
clearTimeout(idleTimer);
if (idleState == true) {
$('body').append('<p>Bentornato.</p>');
}
idleState = false;
idleTimer = setTimeout(function () {
$('body').append('<p>Sei stato inattivo per ' + idleWait/1000 + ' secondi.</p>');
idleState = true; }, idleWait);
});
$('body').trigger('mousemove');
});
})(jQuery);
Una volta perfezionato questo codice lo si può applicare a molti casi d'uso dell'interazione utente e della GUI del sito.