How can I resume setInterval after clearInterval has been called in javascript?

Question

I have this code which works ok but I would like to stop polling and clearInterval if the user is inactive (no mouse move) after say 5 iterations rather than be in a continuous loop.

var i, active = new Date, iter = 1;

$(window).on('mousemove', function(e){
active = new Date;          
});

i = setInterval(function(){
    if(new Date().getTime() - active.getTime() < 1000){
     console.log("sending active event to server.....");
             iter = 1;  
    else{
      iter++;
        if(iter >= 5){
           clearInterval(i);
        }
     }          
}, 2000);

right now it checks every two seconds in this example. I would like to check the active date say 5 times and if its expired 5 iterations in a row, call clearInterval(i)... so something inside the mousemove callback should reinitialize the setInterval only if it's currently not running. How can I accomplish this? Thanks for any tips and samples. I'd like to keep using an anonymous function if possible.

score 1 · Answer 1 · answered Apr 29 '12 at 16:31

Seperate the Interval function

function intFunc(){
    if(new Date().getTime() - active.getTime() < 1000){
     console.log("sending active event to server.....");
             iter = 1;  
    else{
      iter++;
        if(iter >= 5){
           clearInterval(i);
        }
     }          
};

Now, call them on the two places you need

var i;
$(window).on('mousemove', function(e){
  active = new Date;          
  i = setInterval(intFunc, 2000);

});
i = setInterval(intFunc, 2000);

score 0 · Answer 2 · answered Apr 29 '12 at 17:03

One simple way would just be to remove the clearInterval call, and instead only poll the server when iter < 5.

But that's still a little wasteful, as the handler is still being called when it has nothing to do, which is bad when you want your laptop/phone to stay in powersaving mode. So what I'd do is basically what you have, but after calling clearInterval, set up a one-time mousemove handler that restarts polling.

I'm not seeing a way to do that without naming a function (I'm presuming you don't want to get into Y-combinators and the like), but you can hide its name – and the others – from the outside world by using an anonymous function around the whole thing:

(function () {
    var i, active = new Date, iter = 1;

    $(window).on('mousemove', function(e) {
        active = new Date;
    });

    function startPolling() {
        i = setInterval(function() {
            if (new Date().getTime() - active.getTime() < 1000) {
                console.log("sending active event to server.....");
                iter = 1;
            }
            else{
                iter++;
                if (iter >= 5) {
                    clearInterval(i);
                    $(window).one('mousemove', function () {
                        startPolling();
                    });
                }
            }
        }, 2000);
    }

    startPolling();
})();

How can I resume setInterval after clearInterval has been called in javascript?

2 Answers2