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.