Accueil > > > CHECKUSERACTIVITY : DETECTER L'INACTIVITÉ DU VISITEUR
CHECKUSERACTIVITY : DETECTER L'INACTIVITÉ DU VISITEUR
Information sur la source
Description
Suite à un post sur le forum j'ai fais ce code... donc je le poste tant qu'à faire si ça peut servir... qui plus est si quelqu'un a un commentaire sur la façon de procéder pour surveiller l'inactivité du visiteur ça peut être intéressant même si, comme dit sur le topic d'origine, je ne suis pas fan de ce genre de contrôle coté client vu qu'on a, normalement, les outils adéquats coté serveur... bref... .. . Ce code "surveille" donc l'inactivité de l'internaute et exécute un callback si l'inactivité dépasse x minutes... pour cela je me base sur l'évènement onmousemove et justement ça peut être un point de discussion car il y a surement moyen de faire plus propre... à mon goût trop d'appel à la méthode reset() si l'utilisateur est actif... mais bon je l'ai codé assez rapidement à vrai dire... j'en ai profité pour fait quelques ajouts/corrections et le commenter... .. . Testé uniquement sous IE7 et firefox3... .. . @ tchaOo°
Source
- /*
- * Object checkUserActivity
- * Check if user is activ or not
- *
- * @copyright kankrelune
- * @license LGPL - www.gnu.org/licenses/lgpl.html
- */
- var checkUserActivity = {
-
- timeout: 60, // (int) timeout in minutes
- loop: true, // (bool) restart check after callback exec
- timer: null, // (obj) timeout id
- callback: null, // (function) timeout function
- cWrapper: null, // (function) callback wrapper
- eWrapper: null, // (function) event callback wrapper
-
- /*
- * start activity check
- * @access public
- * @arg function callback the callback function
- * @arg int timeout the timeout in minutes (optional)
- */
- start: function( callback, timeout) {
- this.timeout = (this.timeout*60*1000);
- this.setTime(timeout);
- this.setCallback(callback);
- this._startObserving();
- this.reset();
- },
-
- /*
- * stop activity check
- * @access public
- */
- stop: function() {
- this.loop = false;
- this._stopObserving();
- if(this.timer) {
- clearTimeout(this.timer);
- this.timer = null;
- }
- },
-
- /*
- * set the callback function
- * @access public
- * @arg function callback the callback function
- */
- setCallback: function(callback) {
- if(typeof callback == "function") {
- this.callback = callback;
- }
- else {
- this.callback = function() {};
- }
- this.cWrapper = function() {
- checkUserActivity.callback.apply(checkUserActivity);
- if(checkUserActivity.loop) {
- checkUserActivity.reset();
- }
- else if(checkUserActivity.timer) {
- checkUserActivity.stop();
- }
- };
- },
-
- /*
- * set the timeout
- * @access public
- * @arg int timeout the timeout in minutes
- */
- setTime: function(timeout) {
- if(!isNaN(timeout)) {
- this.timeout = (timeout*60*1000);
- if(this.timer) {
- this.reset();
- }
- }
- },
-
- /*
- * reset the timeout
- * @access public
- */
- reset: function() {
- if(this.timer) {
- clearTimeout(this.timer);
- this.timer = null;
- }
- this.timer = setTimeout( this.cWrapper, this.timeout);
- },
-
- /*
- * register event callback wrapper
- * @access private
- */
- _startObserving: function() {
- if(!this.eWrapper) {
- this.eWrapper = function(){ checkUserActivity.reset(); };
- if(window.addEventListener) {
- window.addEventListener("mousemove", this.eWrapper, true);
- }
- else {
- window.attachEvent("onmousemove", this.eWrapper);
- }
- }
- },
-
- /*
- * unregister event callback wrapper
- * @access private
- */
- _stopObserving: function() {
- if(this.eWrapper) {
- if (window.removeEventListener) {
- window.removeEventListener("mousemove", this.eWrapper, true);
- }
- else {
- window.detachEvent("onmousemove", this.eWrapper);
- }
- this.eWrapper = null;
- }
- }
- };
-
-
- /*
- * exemple d'utilisation lancer la page et attendez ou faites autre chose pendant 30s...
- *
- * le calllback est exécuté dans le contexte de checkUserActivity
- * les propriétées et methodes de ce dernier sont donc directement
- * accessible depuis le callback...
- */
- checkUserActivity.start( function() {
- // un petit message
- alert("Ca fait "+(this.timeout/1000).toFixed(0)+" secondes que tu est là comme ça\ndevant ton écran, pationnant n'est il pas... .. .");
- // on change le callback pour le prochain appel
- this.setCallback(function() {
- // second message puis on arrete
- alert("Voila voila... 2nd callback...\n"+(this.timeout/500).toFixed(0)+" secondes à rien faire... trépidant cet exemple... .. .");
- this.stop();
- }
- );
- },
- 0.25
- );
/*
* Object checkUserActivity
* Check if user is activ or not
*
* @copyright kankrelune
* @license LGPL - www.gnu.org/licenses/lgpl.html
*/
var checkUserActivity = {
timeout: 60, // (int) timeout in minutes
loop: true, // (bool) restart check after callback exec
timer: null, // (obj) timeout id
callback: null, // (function) timeout function
cWrapper: null, // (function) callback wrapper
eWrapper: null, // (function) event callback wrapper
/*
* start activity check
* @access public
* @arg function callback the callback function
* @arg int timeout the timeout in minutes (optional)
*/
start: function( callback, timeout) {
this.timeout = (this.timeout*60*1000);
this.setTime(timeout);
this.setCallback(callback);
this._startObserving();
this.reset();
},
/*
* stop activity check
* @access public
*/
stop: function() {
this.loop = false;
this._stopObserving();
if(this.timer) {
clearTimeout(this.timer);
this.timer = null;
}
},
/*
* set the callback function
* @access public
* @arg function callback the callback function
*/
setCallback: function(callback) {
if(typeof callback == "function") {
this.callback = callback;
}
else {
this.callback = function() {};
}
this.cWrapper = function() {
checkUserActivity.callback.apply(checkUserActivity);
if(checkUserActivity.loop) {
checkUserActivity.reset();
}
else if(checkUserActivity.timer) {
checkUserActivity.stop();
}
};
},
/*
* set the timeout
* @access public
* @arg int timeout the timeout in minutes
*/
setTime: function(timeout) {
if(!isNaN(timeout)) {
this.timeout = (timeout*60*1000);
if(this.timer) {
this.reset();
}
}
},
/*
* reset the timeout
* @access public
*/
reset: function() {
if(this.timer) {
clearTimeout(this.timer);
this.timer = null;
}
this.timer = setTimeout( this.cWrapper, this.timeout);
},
/*
* register event callback wrapper
* @access private
*/
_startObserving: function() {
if(!this.eWrapper) {
this.eWrapper = function(){ checkUserActivity.reset(); };
if(window.addEventListener) {
window.addEventListener("mousemove", this.eWrapper, true);
}
else {
window.attachEvent("onmousemove", this.eWrapper);
}
}
},
/*
* unregister event callback wrapper
* @access private
*/
_stopObserving: function() {
if(this.eWrapper) {
if (window.removeEventListener) {
window.removeEventListener("mousemove", this.eWrapper, true);
}
else {
window.detachEvent("onmousemove", this.eWrapper);
}
this.eWrapper = null;
}
}
};
/*
* exemple d'utilisation lancer la page et attendez ou faites autre chose pendant 30s...
*
* le calllback est exécuté dans le contexte de checkUserActivity
* les propriétées et methodes de ce dernier sont donc directement
* accessible depuis le callback...
*/
checkUserActivity.start( function() {
// un petit message
alert("Ca fait "+(this.timeout/1000).toFixed(0)+" secondes que tu est là comme ça\ndevant ton écran, pationnant n'est il pas... .. .");
// on change le callback pour le prochain appel
this.setCallback(function() {
// second message puis on arrete
alert("Voila voila... 2nd callback...\n"+(this.timeout/500).toFixed(0)+" secondes à rien faire... trépidant cet exemple... .. .");
this.stop();
}
);
},
0.25
);
Conclusion
Hésitez pas pour les avis... .. .
Historique
- 16 juin 2009 20:43:14 :
- fatigué j'ai du mal mettre les mots dans le bon ordre... .. . ;o)
- 16 juin 2009 20:46:06 :
- re
- 16 juin 2009 20:49:36 :
- jamais 2 sans 3
- 16 juin 2009 20:58:29 :
- -_-
- 16 juin 2009 21:27:11 :
- petite correction du code...
Sources de la même categorie
Commentaires et avis
Discussions en rapport avec ce code source dans le forum
onUnload event, popup... [ par VicoLaChips2 ]
Voila mon problème. J'ai mis dans la balise bodyd'une frame le code suivant : <body onUnload="return goodbye('<% =user %>';">Le script : f
controle liste de formulaire [ par gwerz ]
Bonjour,Je cherche un script très simple, permettant d'obliger les internautes à selectionner une option dans une liste, sinon le formulaire ne se pos
user_logon [ par akimodo ]
AkimodoNewbieMaisPasPourLongtempsje cherche une solution pour récuperer l equivalent de user_logon en aspl identifiant NT en javascriptmerci
problème avec Windows.Open [ par asm123 ]
En quelques mots voici mon problème,j'utilise la fonction javascript côté client "windows.open"(*) à qui je passe des paramètres.mais il arrive +/- 1
Controle formulaire paranoiaque [ par ma2x ]
Bonjour à tousIl m'a été demandé dans le cadre du boulot de mettre en oeuvre une interface de saisie de données soumis à des controles de toutes parts
controle de chargement de sons [ par theyann ]
existe t il une variable pour le controle de chargementdes embed comme pour les images ?Img = new Image(); Img.src = 'images/toto.gif';if( Img.complet
probleme avec fichier joint [ par desrimaisd ]
bonjour a tous,je ne connais pas du tout le javascript et j'ai donc besoin d'un peu d'aide (ca ne devrait pas etre trop dur je pense pour ceux ki conn
récupération info user ! Poste,Nom,OS... [ par Xanders ]
Bjr a vous!Je début en JS donc je sais pas si c'est possible mais j'aimerais récupéré des information sur le client et en priorité son OS puis eventue
Controle textarea quote [ par gallianofr ]
Bonjour je recherche un script contrôlant si j'ai la structure qu'il faut dans un texte. J'ai une textarea ou la secretaire tape un texte puis modifie
controle d'un textarea par radio [ par nrossero ]
Je souhaite controler le contenu d'un textarea. CaD, j'ai un radio OUI et un NON, quand le NON est cheked, je veux que la value soit figée, et modifia
|
Derniers Blogs
CSS CONTENT STATE SELECTORS (PERSONNAL DRAFT)CSS CONTENT STATE SELECTORS (PERSONNAL DRAFT) par FREMYCOMPANY
Bonjour à tous, Je viens de publier une proposition comprenant 5 pseudo-classes pour le CSS Working Group ayant trait à l'état de chargement d'un élément (ex: IMG,VIDEO,AUDIO,OBJECT pour l'HTML.). Si le c½ur vous en dit, vous pouvez retrouver cette p...
Cliquez pour lire la suite de l'article par FREMYCOMPANY MBA : POURQUOI FAIRE ET COMMENT LE CHOISIR ?MBA : POURQUOI FAIRE ET COMMENT LE CHOISIR ? par ROMELARD Fabrice
Formation initiale Durant la formation, le découpage classique est le suivant (je donnerai les équivalences Suisse lorsque je les connaîtrais) : Ecole primaire jusqu'au Collège : Formation générale permettant d'obtenir les méthodes...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice Y'A DES ERREURS QUI PEUVENT RENDRE LE DéVELOPPEUR VIOLENTY'A DES ERREURS QUI PEUVENT RENDRE LE DéVELOPPEUR VIOLENT par Aleks
Quand on a ce genre d'erreur sans log :
Et bas on a juste envie de choper le gas de Microsoft qu'a développé ça et lui foutre des baffes de Coboye ! ...
Cliquez pour lire la suite de l'article par Aleks [HYPER-V 3] PRéSENTATION DES COMMANDLETS POWERSHELL[HYPER-V 3] PRéSENTATION DES COMMANDLETS POWERSHELL par Pierrick CATRO-BROUILLET
Avec la sortie prochaine de la Beta Consumer Preview de Windows 8, j'avais envie de revenir sur une des fonctionnalités que j'attends le plus et que, en bon geek que je suis, j'utilise déjà : Hyper-V 3 ainsi son module PowerShell.
Il y a déjà pléthor...
Cliquez pour lire la suite de l'article par Pierrick CATRO-BROUILLET IIS7 - COMPRESSION GZIPIIS7 - COMPRESSION GZIP par cyril
La compression GZIP permet d'améliorer les performances de navigation en compressant ce qu'envoie le serveur à un client. Pour comprendre comment cela fonctionne, regardons ce qu'il se passe au niveau HTTP lorsqu'un client tente d'accéder à une ress...
Cliquez pour lire la suite de l'article par cyril
Logiciels
Academy System (17.2.1.0)ACADEMY SYSTEM (17.2.1.0)Logiciel de gestion des établissements.
- élèves/étudiants (inscription, dossier, absence...)
-... Cliquez pour télécharger Academy System Easy-Planning (1.0.0.1)EASY-PLANNING (1.0.0.1)Basé sur les mêmes principes que MyPlanning, Easy-Planning permet de créer des plannings sous la ... Cliquez pour télécharger Easy-Planning COLLECTOR PLUS (3.00B)COLLECTOR PLUS (3.00B)COLLECTOR PLUS version 3.00B est un logiciel utilisant une base de données alimentée par :
- L... Cliquez pour télécharger COLLECTOR PLUS PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V7.4)PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V7.4)PONAMEDIA TV DEVIENS HELLLOOO FLASH
LA TV SUR VOTRE ORDINATEUR.
Toute une plateforme Multi... Cliquez pour télécharger PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO LettresFaciles 2011 (8.0.0.1)LETTRESFACILES 2011 (8.0.0.1)LettresFaciles est un logiciel facilitant la création et la rédaction de lettres types.
Son inte... Cliquez pour télécharger LettresFaciles 2011
|