Cloudflare Developers•14mo ago

i m using the cloudflare stream player

i'm using the cloudflare stream player and am trying to pause a video if it is playing when a users clicks on another tab

const player = Stream(playerFrame);
if (document.visibilityState === "hidden") {
  console.log("pausing");
  player.pause();
}

const player = Stream(playerFrame);
if (document.visibilityState === "hidden") {
  console.log("pausing");
  player.pause();
}

My log shows up but the player doesn't pause. Any ideas / suggestions?

2 Replies

Unknown User•14mo ago

Message Not Public

kingmesalOP•14mo ago

no, I was just following the code example from the documentation page. I uploaded a video to test this functionality with. https://developers.cloudflare.com/stream/viewing-videos/using-the-stream-player/using-the-player-api/

  window.onload = () => {
    var iframes = document.getElementsByTagName("iframe");
    for (var i = 0; i < iframes.length; i++) {
      const playerFrame = iframes.item(i);
      if (playerFrame.src.includes("cloudflarestream.com")) {
        console.log("Found a cloudflare video iframe: ", playerFrame.src);
    const player = Stream(playerFrame);
    document.addEventListener('visibilitychange', () => {
      if (document.visibilityState === "hidden") {
        console.log("pausing");
        player.pause();
      }
    });
      }
    }
  }

  window.onload = () => {
    var iframes = document.getElementsByTagName("iframe");
    for (var i = 0; i < iframes.length; i++) {
      const playerFrame = iframes.item(i);
      if (playerFrame.src.includes("cloudflarestream.com")) {
        console.log("Found a cloudflare video iframe: ", playerFrame.src);
    const player = Stream(playerFrame);
    document.addEventListener('visibilitychange', () => {
      if (document.visibilityState === "hidden") {
        console.log("pausing");
        player.pause();
      }
    });
      }
    }
  }

This will reproduce it though.

Gaming

Programming

i m using the cloudflare stream player