April 29, 2012

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

Question by Hcabnettek

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.

Answer by Starx

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);
March 24, 2012

jQuery play/pause jQuery function

Question by Yusaf

What I’m trying to do is play and pause a function ie press a button to start a fucntion press a button to pause so on. I am not entirely sure how this can be done i have tried .live() and .die() but they don’t work.

Fiddle

I have the HTML below

<button class="play">play</button>
<button class="pause">pause</button>
<div class="divafter"></div>​

and the jQuery which I’m not entirely sure what .die() does but on the jsfiddle seems to speed up the interval time.

(function($){
  playing = function() {
window.setInterval(function() {
    $(".divafter").after("playing <br/>");
}, 500);
};
})(jQuery);
$(".play").click(function(){
    playing().live();
});
$(".pause").click(function(){
    playing().die();
});​

Answer by j08691

Try this jsFiddle example. You need to use clearInterval() to stop setInterval().

jQuery:

var foo;
playing = function() {
    foo = window.setInterval(function() {
        $(".divafter").after("playing <br/>");
    }, 500);
}

$(".play").click(function() {
    playing();
});
$(".pause").click(function() {
    clearInterval(foo);
});​

Answer by Starx

You will have to the clearInterval to simulate the pause effect.

Grab the instance of the interval like this

playing = setInterval(function() {
            $(".divafter").after("playing <br/>");
          }, 500);

And clear to pause

clearInterval(playing);

Usage on your code would be this:

var playstatus;
(function($){
    playing = function() {
        return setInterval(function() {
           $(".divafter").after("playing <br/>");
           }, 500);
    };

})(jQuery);

$(".play").click(function(){
    playstatus = playing();
});
$(".pause").click(function(){
   clearInterval(playstatus);
});

Demo

...

Please fill the form - I will response as fast as I can!