Redémarrer le temporisateur après clearTimeout (temporisateur)

Question

Comment une autre fonction peut-elle être redémarrée après clearTimeout (temporisateur)?

J'ai la fonction refreshTable() arrêt après 7 secondes d'inactivité (pas d'événement de souris). L'actualisation peut-elle être redémarrée lorsque le client déplace la souris après l'inactivité?

La fonction supérieure refreshTable() que je voudrais laisser tel quel est si possible.

Codepen demo

//====DONT EDIT THIS FUNCTION IF POSSIBLE==== 
function refreshTable() { 
    window.clearTimeout(timer); 
    timer = window.setTimeout(refreshTable, 5000); 
    $("body").append("<p>refreshTable every 5 seconds.</p>"); 
} 
//======== 

var timer = window.setTimeout(refreshTable, 0); 




// If theres no activity for 7 seconds do something 
var activityTimeout = setTimeout(clientInActive, 7000); 

function clientResetActive(){ 
    $("body").attr('class', 'active'); 
    clearTimeout(activityTimeout); 
    activityTimeout = setTimeout(clientInActive, 5000); 
    //RESTART TIMER WHILE resetActive 
    //???????? 
} 

// No activity do something. 
function clientInActive(){ 
    $("body").attr('class', 'clientInactive'); 
    $("body").append("<p>clientInActive</p>"); 
    //STOP TIMER WHILE clientInActive 
    clearTimeout(timer); 
} 

// Check for mousemove, could add other events here such as checking for key presses ect. 
$(document).bind('mousemove', function(){clientResetActive()}); 

Quelque chose comme l'image ci-dessous est l'objectif.

Answer 1

Je vous suggère que vous avez une fonction en charge de démarrage du délai d'attente et un en charge de l'arrêter. Essayez ceci:

//====DONT EDIT THIS TOP FUNCTION IF POSSIBLE==== 
 
function refreshTable() { 
 
    stopRefreshTable(); 
 
    window.refreshTableTimer = window.setTimeout(refreshTable, 5000); 
 
    $("body").append("<p>refreshTable every 5 seconds.</p>"); 
 
} 
 
//====END==== 
 

 
function startRefreshTable() { 
 
    if(!window.refreshTableTimer) { 
 
     window.refreshTableTimer = window.setTimeout(refreshTable, 0); 
 
    } 
 
} 
 

 
function stopRefreshTable() { 
 
    if(window.refreshTableTimer) { 
 
     self.clearTimeout(window.refreshTableTimer); 
 
    } 
 
    window.refreshTableTimer = null; 
 
} 
 

 
function resetActive(){ 
 
    $("body").attr('class', 'active'); 
 
    clearTimeout(activityTimeout); 
 
    activityTimeout = setTimeout(inActive, 5000); 
 
    //RESTART TIMER WHILE resetActive 
 
    startRefreshTable() 
 
} 
 

 
// No activity do something. 
 
function inActive(){ 
 
    $("body").attr('class', 'inactive'); 
 
    $("body").append("<p>inActive</p>"); 
 
    //STOP TIMER WHILE inActive 
 
    stopRefreshTable(); 
 
} 
 

 
// If theres no activity for 7 seconds do something 
 
var activityTimeout = setTimeout(inActive, 7000); 
 
// Check for mousemove, could add other events here such as checking for key presses ect. 
 
$(document).bind('mousemove', function(){resetActive()}); 
 
startRefreshTable();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>