Twitch vod Current time display

Question

I have this Twitch Vod that I want to show on my webpage, Now I want to show the current time of the video when it is playing separate. There is this function that returns this time but I can't get it to work.

here where i set my time to be display

<p data-a-target="player-seekbar-current-time" class="CoreText-sc-1txzju1-0 ffZeRf"></p>

and here is my script for the tiwtich embed

<script src="https://embed.twitch.tv/embed/v1.js"></script>

<script>
  let twitchPlayer = null; // Variable to store the Twitch embed player instance

  function loadTwitchVideo() {
    var input = document.getElementById("urlTwitch");
    var videoUrl = input.value;
    var videoId = getVideoIdFromUrl(videoUrl);

    if (!twitchPlayer) {
      // If the Twitch player instance doesn't exist, create a new one
      twitchPlayer = new Twitch.Embed("twitch-embed", {
        width: 680,
        height: 420,
        video: videoId,
        autoplay: false,
        time: '',
      });
    } else {
      // If the Twitch player instance exists, update the video ID
      twitchPlayer.setVideo(videoId);
    }

    // Enable the "vodPerspective" div
    var vodPerspectiveDiv = document.querySelector(".vodPerspective");
    var inputField = vodPerspectiveDiv.querySelector(".urlTwitch");
    var generateButton = vodPerspectiveDiv.querySelector("button");
    inputField.disabled = false;
    generateButton.disabled = false;
  }

  function getVideoIdFromUrl(url) {
    var parts = url.split("/");
    var videoId = parts[parts.length - 1];
    return videoId;
  }

</script>

here is the code that im working to call time

function updateCurrentTime() {
  if (twitchPlayer && twitchPlayer.getCurrentTime) {
    // Get the current time in seconds
    const currentTimeInSeconds = twitchPlayer.getCurrentTime();
    
    // Convert seconds to a human-readable format (HH:mm:ss)
    const currentTime = new Date(currentTimeInSeconds * 1000).toISOString().substr(11, 8);

    // Display the current time in the designated element
    const timeElement = document.getElementById("time");
    if (timeElement) {
      timeElement.textContent = `Current Time: ${currentTime}`;
    }
  }
}

// Update the current time every second
setInterval(updateCurrentTime, 1000);

Twitch vod Current time display

0 Answers0