How to show next button only after a video (inserted as media file) is finished playing?

https://community.qualtrics.com/XMcommunity/discussion/comment/19309#Comment_19309Hey Tom, thanks for helping the community. Unfortunately I'm having the same problem with a youtube video. I can't find the video id/tag. I'd really appreciate your help.
thanks

https://community.qualtrics.com/XMcommunity/discussion/comment/43272#Comment_43272YouTube is completely different. See this.

hi, 

I have a survey which asks respondents to view a video in entirety before proceeding to answer questions on the next page. I would like to hide the next button until the video is finished playing. Of note, I specifically don’t want to use a timer to hide the next button in case someone chooses to watch the video on a higher watch speed (e.g., 1.5x, 2x).

my issue seems to be with using iFrame as the code I’ve found is written for other embedded video formats.

Does anyone have any experience with using JS with iFrame videos in Qualtrics? Thank you!!

This is the code I have tried but it didn't work. 

<div style="text-align: left;">
    <span style="font-size: 19px;">
      <strong>Play Video</strong>
    </span>
    <br />
    &nbsp;
  </div>

  <div style="text-align: center;">
    <iframe
      id="video-player"
      src="VIDEO-SRC LINK" //video is hosted on canvas
      width="560"
      height="320"
    ></iframe>
  </div>

Qualtrics.SurveyEngine.addOnload(function() {
    this.hideNextButton();
  });



  Qualtrics.SurveyEngine.addOnReady(function() {
    var iframe = document.getElementById("video-player");
    var that = this;



    iframe.addEventListener("load", function() {
      var videoPlayer = iframe.contentWindow.document.querySelector("video");



      videoPlayer.addEventListener("ended", function() {
        that.showNextButton();
      });



      videoPlayer.addEventListener("timeupdate", function() {
        if (isVideoNearEnd(videoPlayer)) {
          videoPlayer.pause();
          that.showNextButton();
        }
      });
    });



    function isVideoNearEnd(player) {
      var currentTime = player.currentTime;
      var duration = player.duration;
      var threshold = 1.5; // Adjust this threshold as needed



      return currentTime >= duration - threshold;
    }
  });