CODEWITHSUNDEEP
javascript
jollyr6
jollyr6

Reputation: 35

Javascript restart feature

So I got a personal website that has both a pause/resume and a mute button and I would like for the pause/resume button to change to "restart" video after the video has finished playing. Once the user presses restart, the video restarts. Any idea on howto implement this feature? Here's the code at the moment.

const video = document.currentScript.parentElement;
    video.volume = 0.15;

    function pause_resume() {
      const button = document.getElementById("pause_resume_button");

      if (video.paused) {
        video.play()
        button.textContent = "pause video";
      } else {
        video.pause()
        button.textContent = "resume video";
      }
    }
    function mute_unmute() {
      const button = document.getElementById("mute_unmute_button");

      video.muted = !video.muted;
      button.textContent = video.muted ? "unmute video" : "mute video";
}

Upvotes: 2

Views: 79

Answers (1)

dippas
dippas

Reputation: 60543

You have to look for ended event, something like this:

-- Using the onended event handler property:

video.onended = () => {
  button.textContent = 'Restart';
  video.currentTime = 0;
}

-- Using addEventListener()

video.addEventListener('ended', () => {
  button.textContent = 'Restart';
  video.currentTime = 0;
});

Upvotes: 1

Related Questions