How to update a running animation?

[Chrundle]

First post! 

I want to animate an object's position based on input from the user's mouse wheel. The mouse wheel can fire events many times per second. I don't want to destroy the old animation, and create a new one, for each of these many events. I'd prefer to "update" the keyframes of the existing animation instead (i.e. continue the animation from its current frame and position, to a new endPosition at a new keyframe). I'd also like to "restart" the animation again from its current value, if it happens to reach the final keyframe and stop, then the user scrolls again later. 

What is the preferred way to "update" an animation in Babylon.js? Can I just use animation.setKeys() again to update the keyframes? Also, if the animation completes, then more scroll events are fired later: how can I "restart" the animation from its previous end position, and trigger it to run again to a new end position? 

Thank you so much in advance for your help! 

[Nesh108]

Heya @Chrundle, interesting project.

Anyway, I am not aware of any "pretty" solution so here is how I would do it:

Normal Animation:

scene.beginAnimation(myAnimatedMesh, 0, 120, true, 1);

Simple and sweet. This runs the animation from frame 0 to 120 and loops it.

Manual Animation:

let frameFrom = 0;
let frameTo = 1;
let lastFrame = 120;
let frameAdvance = 1;
let isRunning = false;

function executeFrame() {
   if(!isRunning) {
     isRunning = true;
     scene.beginAnimation(myManuallyAnimatedMesh, frameFrom, frameTo, false, 1, function() {
      if(frameTo < lastFrame) {
        frameFrom = frameTo;
        frameTo += frameAdvance;
      } else {
        frameFrom = 0;
        frameTo = 1;
      }
      isRunning = false;
     });
  }
}

With this, you can adjust how many frames each "executeFrame" can play and loop at the end. I haven't tested it but it shouldn't be too far from the working version  

[Chrundle]

Hi Nesh, 

Thanks so much for your help! Your solution definitely solves the issue of controlling the number of frames / looping of the animation. 

However, I'm still confused on how to update the keyframes of the animation WHILE it is running. (Ex. if the user scrolls the mouse wheel again while the first animation is still running.) Should I just use setKeys() again? Or retrieve the existing keys with getKeys(), then update their values? Or is there a better way? 

Thanks again for your help!