PIXI.js + TweenJS: Await finish of tween animation?

[Matheus Vinícius]

Hi, I've recently been trying to make the for (loop) wait for an animation of the tween to end, but I can't in any way, is that possible? I really need to wait for the tween animation to finish before continuing the loop.

* Remember that the loop in which I speak is not a requestAnimFrame.

I can't show the loop in the photo because it is far away.

[Exca]

If I understood correctly you want to animate habbo to coord1 in a loop and then continue the loop after animation is done?

That is not possible with await as tween does not return a promise. You would have to have your tween in a separate function and have it return a promise and then have it resolve the promise in completion.

That would make your code pretty complex for no good reason. I assume that you want to animate the habbo-character from coord1 to coordN right?

You could do that with tweenjs chaining:

const moveChar = (char,points) =>{
  const tween = Tween.get(char);
  let coord = null;
  for( let i = 0; i < points.length; i++)
  {
    coord = points[i];
    tween.to( {x:coord.x, y: coord.y}, 500)
    tween.wait( 50 ); //Wait 50 milliseconds before moving to next to make the movement nicer?
  }
  //Add callback to chain ending.
  tween.call( () => {
    console.log("FINISH: " + coord);
  });
}

moveChar( this.habbo, [
 {x:0, y:0},
 {x:100, y:0},
 {x:100, y:100},
 {x:200, y:100}
]);

If I misunderstood the problem please describe it a bit more. As usually having synchronous code requirement inside a for loop is an issue that should not happen when doing rendering related stuff.