coding with lottie

Ask the community
,
1

hi. AI made me this code for my lottie animation and it doent seem to work. i wanted the animation to pause at the first frame, start playing after a button press til some point then resume of button click and so on.
button click → start → pause → button click → start → pause…
i added a lottie embed and a button. this is the code.
if anyone has any idea why it doesnt work i would love an explanation and a way to solve this to get the actual results i wanted.
thank you!


$w.onReady(() => {
  let animationState = {
    paused: true,
    currentTime: 0
  };

  const playAnimation = () => {
    animationState.paused = false;
    $w('#lottieEmbed1').play();
  };

  const pauseAnimation = () => {
    animationState.paused = true;
    $w('#lottieEmbed1').pause();
  };

  const handleClick = () => {
    if (animationState.paused) {
      playAnimation();
    } else {
      pauseAnimation();
    }
  };

  const handleAnimationComplete = () => {
    pauseAnimation();
  };

  const handleAnimationUpdate = () => {
    const currentTime = $w('#lottieEmbed1').getCurrentTime();
    animationState.currentTime = currentTime;

    if (currentTime >= 1.03 && currentTime < 2.42) {
      pauseAnimation();
    } else if (currentTime >= 2.42 && currentTime < 3.43) {
      pauseAnimation();
    } else if (currentTime >= 3.43 && currentTime < 3.44) {
      pauseAnimation();
    }
  };

  $w('#lottieEmbed1').onReady(() => {
    $w('#lottieEmbed1').onEnd(handleAnimationComplete);
    $w('#lottieEmbed1').onProgress(handleAnimationUpdate);
    $w('#button1').onClick(handleClick);
  });
});