Timer won't die javascript

Question

I am doing some long polling.. and I have a function to make a button blink when a certain statement is true.. Here it is:

function blinking(object, x) {

    console.log(x);

    if(x>0){

        var existing_timer = object.data('clock');
        if (existing_timer){
            clearInterval(existing_timer);
        }

        timer = setInterval(blink, 10);

        function blink() {
            object.fadeOut(400, function() {
               object.fadeIn(400);
            });
        }

    }

}

Now.. Notice the timer being set as 'timer'. When someone does something that makes the statement false (making x=0), I want the timer to stop making the button blink when it sees that x=0. This may sound easy but I have tried everything ha.

I've been researching and trying different things, but It doesn't seem to work.

How would `timer` ever stop? You are calling `clearInterval` on `existing_timer`, not `timer`. Also, `blink` is your repeating function, but the clear happens in `blinking` which only ever gets called once. — jbabey, Jan 07 '13 at 21:13
You only query the `x` value once, not on every blink interval. — Bergi, Jan 07 '13 at 21:14
Queuing two animations - which last 400ms each - every 10ms is a very, very bad idea. — Bergi, Jan 07 '13 at 21:16
If `x` is equal to zero, your `if` statement will return false and the whole logic block is skipped. — Madbreaks, Jan 07 '13 at 21:13

score 1 · Answer 1 · answered Jan 07 '13 at 21:14

1

If your variable timer is global, then you should be able to clear the interval using that:

clearInterval(timer);

The integer returned from the setInterval is unique to that timer, so that is what you need to clear.

answered Jan 07 '13 at 21:14

Justin Bicknell

4,804
18
26

I tried that.. @justin doesnt work. The function is constantly called by the long polling portion – greycode Jan 07 '13 at 21:19
probably something else going on... you should create a jsfiddle and we can go from there – Justin Bicknell Jan 07 '13 at 21:23
1

You can always isolate your components. And isolating just the javascript and timers will help you debug your own issue. – Nate Jan 07 '13 at 21:59

Nate · Answer 2 · 2013-01-07T21:33:31.247

0

Here's a simple implementation.

http://jsfiddle.net/AQgBc/

var $led = $('#led'),
    blinkState = 0,
    blinkTimer,
    blinkDuration = 300,
    blink = function () {
      if (blinkState) {
        $led.toggleClass('on');
      }
      console.log('blink');
      blinkTimer = setTimeout(blink, blinkDuration);     
    };

$('button').on('click', function () {
  blinkState = (blinkState) ? 0 : 1;
});

blink();

I just wrote my own without duplicating yours, but the most relevant issue, I think, is just using a setTimeout rather than worrying about a setInterval and clearing that interval.

Edit in response to comment:

If you want it to blink until a user action, then stop polling, it's even simpler.

http://jsfiddle.net/AQgBc/1/

var $led = $('#led'),
    blinkState = 1,
    blinkTimer,
    blinkDuration = 300,
    blink = function () {
      if (blinkState) {
        console.log('blink');
        $led.toggleClass('on');

        blinkTimer = setTimeout(blink, blinkDuration);
      }   
    };

$('button').on('click', function () {
  blinkState = (blinkState) ? 0 : 1;
});

blink();

edited Jan 07 '13 at 21:33

answered Jan 07 '13 at 21:22

Nate

4,718
2
25
26

Thank you! But see I need to keep it to loop until the user click something somewhere else that tells the database they seen it. Then the button will stop blinking. – greycode Jan 07 '13 at 21:25
can you incorporate my original script – greycode Jan 07 '13 at 21:40
Where are you having trouble? I'd rather help you understand than write your code for you. – Nate Jan 07 '13 at 21:52
please check my clarified question: http://stackoverflow.com/questions/14224263/json-data-if-else-parse – greycode Jan 08 '13 at 21:33

Timer won't die javascript

2 Answers2