Not able to listen to the 'complete' event

[christina-wilfing]

I would like to play several LottiePlayers in the same container one after the other.
It is possible to listen if the player is ready and set the first element to play().
However, listening to whether the animation is finished to start the next one doesn't work. (neither 'complete' nor 'loop')

Where is my error?

(My project is older and therefore still uses jquery ...)

let player;
let lottieArea = $('.js-lottie-area');
let lottiePlayers = lottieArea.find('.js-lottie-delay');
let current = 0; 

function playNextLottie() {
    if (current >= lottiePlayers.length) {
        return;
    }

    player = lottiePlayers[current];
    $(player).on('ready', function () {
        create({
            // mode: 'scroll',
            player: player,
            container: lottieArea
        })
        player.play();
    });

    $(player).on('complete', function () {
         current++;
         playNextLottie();
    });

    $(player).on('loop', function () {
         current++;
         playNextLottie();
    });

}

playNextLottie();

[kolkul]

Hey!

Already too late, but anyway maybe it will help someone

import { DotLottie } from '@lottiefiles/dotlottie-web';

const lottie: DotLottie = new DotLottie({
    autoplay: false,
    loop: true,
    canvas: getLogoLottie as HTMLCanvasElement,
    src: '/assets/lottie.json',
});

lottie.play()

lottie.addEventListener('frame', (e) => {
      if (e.currentFrame < Math.floor(lottie.totalFrames)) return;

      lottie.stop();

     // ....
}); 

Regards, guys