howler pause() not stop the audio from looping

62 Views Asked by At

I've created a state function in my application that is supposed to notify me when a certain status, let's call it "danger," is reached. Once in the "danger" status, I want to loop an audio file until the status changes to "success." However, I'm encountering a problem where the pause() and stop() functions are not stopping the audio from looping as expected.

if (value <= threshold) {
          timer.reset();
          status = statesName.SUCCESS;
        } else if (value > threshold) {
          timer.start({ precision: 'secondTenths' });
          if (
            timer.getTotalTimeValues().seconds >
            appContext.timer_timeUntilBadPosture
          ) {
            status = statesName.DANGER;
          } else {
            status = statesName.WARNING;
          }
        }

        // RUN ONLY IF STATUS CHANGED
        if (currentState !== status) {
          setTimelineData([
            ...timelineData,
            [
              name,
              currentState,
              statesColourHex[currentState],
              currentStateTimeStamp,
              nextObj.createdAt,
            ],
          ]);
          cbCurrentStateTimeStamp(nextObj.createdAt);

          if (status === statesName.SUCCESS) {
            showToast(toastMsgSuccess, Intent.SUCCESS);
            pauseAudio();
          }
          if (status === statesName.DANGER) {
            showToast(toastMsgDanger, Intent.DANGER);
            playAudio();
          }

this is the howler audio outside xState function:

  const dangerAudio = new Howl({
        src: [audio],
        html5: true,
        loop: true, // Set the audio to loop
      });

      let audioPlaying = false; // Flag to track if audio is playing

      const playAudio = () => {
        if (!audioPlaying) {
          dangerAudio.play();
          audioPlaying = true;
        }
      };

      const pauseAudio = () => {
        if (audioPlaying) {
          dangerAudio.pause();
          audioPlaying = false;
        }
      };

It tried console.log the status success and the pauseAudio and in console only show the status success and not the pauseAudio, it seems the code just not run the function pauseAudio.

0

There are 0 best solutions below