radiodraws
5/6/2017 - 10:55 AM

request frame animation frame requestAnimationFrame setinterval animation loop

request frame animation frame requestAnimationFrame setinterval animation loop

//--------ANIMATION

var requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame ||
  window.webkitRequestAnimationFrame || window.msRequestAnimationFrame;
var cancelAnimationFrame = window.cancelAnimationFrame || window.mozCancelAnimationFrame;

var fps, fpsInterval, startTime, now, then, elapsed, time = botCfg.speed;
var animation;

startAnimating(1);

function startAnimating(fps) {
  fpsInterval = time / fps;
  then = Date.now();
  startTime = then;
  animate();
}

//---STOP BUTTON
$('#stop-animation').on('click', function() {
  cancelAnimationFrame(animation);

});
$('#play-animation').on('click', function() {
  startAnimating(1);
});

function animate(par) {
  animation = requestAnimationFrame(animate);

  now = Date.now();
  elapsed = now - then;

  if (elapsed > fpsInterval) {
    then = now - (elapsed % fpsInterval);

    /*--STUFF ANIMATED--*/
    botMove(par);
  }
}