Audio loop setting?

JavaScript
41

Nope not the problem. I tried it. Hmm…

42

My CodePen is based on (forked from) ‘The Media Session API’ CodePen here:

That seemed to be the code you have been using.

1 Like
43

I have looked into that, yes. It’s also on CodePen as you shared earlier, and I copied and pasted the code as exact, and just made the changes to the style. I don’t know about the JS part, don’t know why that code that should reset the player won’t work for me.

44

Ok I just tried something. I tried taking out the loop attribute from the code on my Pen. That may be the problem. Because when I took it out the audio didn’t reset.

45

Well, maybe not… the pen you sent doesn’t have that attribute either, and it still reset as we want it to on mine.

46

I feel that maybe we need an if statement to this

audio.addEventListener("ended", () => {
  playIconContainer.click();
  cancelAnimationFrame(raf);
  currentTimeContainer.textContent = "0.00";
  seekSlider.value = "0";
});

To say that if audio has ended, go back to the beginning

47

With my CodePen: if the audio reaches the end it does go back to the beginning and the pause button becomes a play button (Firefox, Chrome and Edge).

48

Right, I understand that. It does for me too in CodePen.

49

On my own pen I sent, it won’t reset. Only the one you sent did.

50

I’m not having any luck trying different codes. How’re we going to do this?

51

Update - I managed fixing the one on my Pen. It didn’t have all of this code

audio.addEventListener("ended", () => {
  playIconContainer.click();
  cancelAnimationFrame(raf);
  currentTimeContainer.textContent = "0.00";
  seekSlider.value = "0";
});
1 Like
52

Let me know if there’s anything else we can try for the reset.

53

I also see this error on CodePen pop up at times

IndexSizeError: Index or size is negative or greater than the allowed amount

54

@Archibald I think I have finally found the magic code to add to the “ended”

Put this after it

function stopAudio(){
  //pause playing
  $("audio").trigger('pause');
  //set play time to 0
  $("audio").prop("currentTime",0);
}
55

It works in CodePen. Not sure why it doesn’t on my page.

56

Eh, nevermind. It seems to work with and without, so it’s not really that. Still need to work on it then…

57

I’m feeling discouraged :pensive:

58

What is the URL of your page?

1 Like
59
61

This for some reason wasn’t there in the script on that website I saved it to

audio.addEventListener("ended", () => {
  playIconContainer.click();
  cancelAnimationFrame(raf);
  currentTimeContainer.textContent = "0.00";
  seekSlider.value = "0";
});

I just put it back in. Really strange, dunno why it wasn’t there. It was before.