setInterval repeat 3 time and kill

Posted on
  • Hello,

    well, i'm a bit loose with setInterval et clearInterval...
    I need to repeat 3 time a function with a time of 200ms
    I've tried this

    id = setInterval( function(a,b,c) { console.log(a,b,c);} ,200, "foo", 25, id);
    

    in the console it said

    foo 25 undefined

    i've tried to use the id and it "works" (it stop)

    var idAnim;
    var compteur = 0;
    
    function anim(a,b,c) {
       compteur++;
       console.log(compteur,a,b,c);
       if (compteur >= a.length){ clearInterval(c); }
    }
    
    function onInit() {
      idAnim = setInterval( anim, 500, "foo", 0, idAnim);
    }
    

    and it stops after 3 time.

    i've tried the same in a function in a setInterval and it stops all the setInterval

    var idAnim;
    var compteurAnim = 0;
    var mot = "foo";
    
    function texte(){
        idAnim = setInterval(function(a,y,c){
          console.log(a,y);
          compteurAnim++;
          if (compteurAnim >= a.length) { clearInterval(c);}
        }, 100, mot, 0, idAnim);
        mot+="foo";
    }
    
    function onInit() {
      setInterval( texte, 4000);
    }
    

    where i'm wrong?
    is there a way to pass the id to function?
    or is there a simple way to repeat a definite time a function?
    i want to animate text letter by letter

    regards

    éric

  • I answer that i've understood.
    The id is undefined, therefor there is no id for clearInterval. So it stop all the setInterval...well.
    But it does not resolve my problem to transfer an id to a function to clear it at the end.
    An idea, please?

    Regards

  • You'll need to use either a global variable, or a closure.

    In your example, simply doing:

    function texte(){
        var idAnim = setInterval(function(a,y,c){
          console.log(a,y);
          compteurAnim++;
          if (compteurAnim >= a.length) { clearInterval(idAnim);}
        }, 100, mot, 0);
        mot+="foo";
    }
    

    will work. idAnim will then be defined in the function each time it is called, and the setInterval callback will be able to reference it.

    As I think you figured out, in idAnim = setInterval( anim, 500, "foo", 0, idAnim); the setInterval has to be called before idAnim is set to the correct return value, so you'll always get the wrong answer in there.

  • Sorry @Gordon i do not understand the difference between the 2 versions..

    what do you mean by callback? is it the function define in the setInterval?

    I've tried reinitiate a setInterval at the end of 8 "danse"move but does not works... i've got an unknown interval error!
    I'm confused

    function mecatronique(myId) {
      var tirage = Math.random();
      if (tirage >0.95) {
        clearInterval(myId);
        var tm = 800;
        var compteurDanse = 0;
        var idDanse = setInterval( function(id) {
          console.log("danse");
          compteurDanse ++;
          if (compteurDanse >= 8) {clearInterval(id);var idM = setInterval(mecatronique, 500, idM);}
        }, tm, idDanse);
      } else {
        if (tirage >0.6) {
          console.log("bouge");
        }
      }
    }
    
    function onInit() {
      var idMeca = setInterval(mecatronique, 500, idMeca);
    }
    

    sorry for my ugly code

  • The difference is that you are not passing the id in as an argument to setInterval, but are defining it in a function that the callback (the function inside setInterval) has access to.

    In it's simplest form, not this:

    var idAnim;
    function f(){
        idAnim = setInterval(function(id){
          clearInterval(id);
        }, 100, idAnim);
    }
    

    but this:

    function f(){
        var idAnim = setInterval(function(){
          clearInterval(idAnim);
        }, 100);
    }
    

    I'm not quite sure what you're trying to do, but try starting with the code above and then modifying it to do what you want.

  • ok i've understood.
    i just want to make sequence of actions.
    in that case i play with a servo... there is "normal" sequence and a "special" sequence.
    all the sequence need a different setInterval
    i want to stop one and start the other.
    for sure i could use a flag to stop one action and let's play the other and have 2 setInterval started at the beginning.
    i'm coming from Flash™ and animation software, therefor i'm thinking as an animator not as a developper... ;)

    regards
    thanks for your time.

    éric

  • If you want to reference different intervals at the same time, that can be pretty easy as well:

    var ia = setInterval(...);
    var ib = setInterval(...);
    var ic = setInterval(...);
    
    // some time later...
    clearInterval(ia);
    // and later..
    clearInterval(ib);
    // etc...
    

    I only suggest the closures because it looked like you wanted to start several copies of the same interval, which would stop themselves

  • Post a reply
    • Bold
    • Italics
    • Link
    • Image
    • List
    • Quote
    • code
    • Preview
About

setInterval repeat 3 time and kill

Posted by Avatar for Mrbbp @Mrbbp

Actions