begin process at 2012 02 06 02:14:41
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Divers

 > CHECKUSERACTIVITY : DETECTER L'INACTIVITÉ DU VISITEUR

CHECKUSERACTIVITY : DETECTER L'INACTIVITÉ DU VISITEUR


 Information sur la source

Note :
9 / 10 - par 1 personne
9,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Divers Classé sous :user, activity, check, controle, inactivité Niveau :Initié Date de création :16/06/2009 Date de mise à jour :16/06/2009 21:27:11 Vu :2 962

Auteur : kankrelune

Ecrire un message privé
Ce membre participe au partage de revenus publicitaires
Commentaire sur cette source (6)
Ajouter un commentaire et/ou une note


 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 du même auteur

Source avec Zip PETITE CLASSE DE TIMERS

 Sources de la même categorie

COLONNES ADAPTABLES EN HAUTEUR par dronoide
Source avec Zip VECTEURS ET MATRICES: OUTILS GRAPHIQUES UTILES par william voirol
Source avec Zip Source avec une capture HTML5 PLAYER par kazma
Source avec Zip Source avec une capture SCROLLBAR PERSONNALISABLE par kazma
Source avec Zip INFO BULLE par RudiRatlos

 Sources en rapport avec celle ci

Source avec Zip JSCHECKER, VALIDEUR DE FORMULAIRE par codefalse
Source avec Zip Source avec une capture FORMULAIRE DE CONTACT AVEC MASQUE DE SAISI, RECUPERATION DON... par fifiriri123
Source avec Zip Source avec une capture CONTRÔLE DES CHAMPS D'UN FORMULAIRE [CCF] par bultez
PETIT SCRIPT MAIS EFFICACE POUR VALIDER LES DATES par slash135
QUELQUES FONCTIONS DE VÉRIFICATION DE SAISIE UTILISANT LES E... par bluedemon

Commentaires et avis

Commentaire de jdmcreator le 17/06/2009 19:46:45

Bonjour,

le code fonctionne aussi bien sur Safari 3 ;) Bravo !

Commentaire de abdelaziz_info le 17/06/2009 21:28:53

Salut,

Pour surveiller l'inactivité de l'internaute on peut le faire tout simplement comme ça :

<html>
<head>
</head>
<body onmousemove="clearInterval(timer),M=0,mouv()">
<script type="text/javascript">
M=0;
C=0;
var timer;
function mouv() {
M++;
if (M==15){C++,alert('hooooo '+C+' fois')} // On déclenche un événement après 15 secondes d'inactivité
timer=setTimeout('mouv();',1000);
}
</script>
</body>
</html>

Commentaire de kankrelune le 17/06/2009 22:20:16

lol... toujours le mot pour rire abdelaziz... ton code ne détecte rien du tout là il boucle juste une alerte... .. .

@ tchaOo°

Commentaire de kankrelune le 17/06/2009 22:28:24

Merci au fait jdmcreator pour le test sous safari...

@ Abdelaziz... j'avais pas vu le onmousemove dans le body... bref tu as réécris en tout pas beau tout pas portable une partie de mon code... dans quel but... .. ?

@ tchaOo°

Commentaire de Julien39 le 26/06/2009 16:37:40 administrateur CS 9/10

C'est écrit proprement et bien commenté.

Commentaire de kankrelune le 01/07/2009 00:15:50

Merci...

Mais du coup personne n'a d'avis/idée pour améliorer ça... j'ai pas eu le temps d'y repenser mais j'aime pas ce setTimeout() à chaque mouvement de souris... ça va si l'utilisateur est rapidement inactif mais pour un visiteur actif sur la page ça me plait moyen pas trop du tout... .. .

@ tchaOo°

 Ajouter un commentaire


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 : &lt;body onUnload="return goodbye('&lt;% =user %&gt;';"&gt;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


Nos sponsors


Sondage...

Comparez les prix

CalendriCode

Février 2012
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
272829    

Consulter la suite du CalendriCode

 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 5,101 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales