videojs-record icon indicating copy to clipboard operation
videojs-record copied to clipboard

How to determine if the 'stop sharing button' is clicked

Open webdistortion opened this issue 4 years ago • 5 comments

Feature request.

How to determine that someone clicked the stop sharing button From stackoverflow:

  // somebody clicked on "Stop sharing"
  stream.getVideoTracks()[0].onended = function () {
    // doWhatYouNeedToDo();
  };

Wondering if videojs-record currently exposes this, or if a pull request would be welcome to do so. I couldn't see a way in the documentation to achieve this, nor could I see where the stream was exposed in the Api? Is there a better method to achieve this?

Is this the relevant line number where a call to an event for this is necessary? https://github.com/collab-project/videojs-record/blob/master/src/js/videojs.record.js#L1606

webdistortion avatar Dec 17 '20 19:12 webdistortion

Wondering if videojs-record currently exposes this, or if a pull request would be welcome to do so.

Sounds good!

thijstriemstra avatar Feb 01 '21 21:02 thijstriemstra

Also see https://github.com/muaz-khan/RecordRTC/issues/583#issuecomment-565735551

YourMediaStream.getVideoTracks()[0].addEventListener(‘ended’, () => {
    /** any method you want to fire when the screen sharing is stopped */
});

thijstriemstra avatar Mar 03 '21 23:03 thijstriemstra

Is this problem solved, still can't find a solution to this...

squaloIT avatar Aug 13 '21 11:08 squaloIT

I found the solution, with a player like this

<video id="myScreen" playsinline class="video-js vjs-default-skin"></video>

Using the hook deviceReady you can catch the event

player.on('deviceReady', function () {
    const videoPlayer = document.getElementById('myScreen').getElementsByTagName('video')[0];
    const stream = videoPlayer.captureStream();
    stream.getVideoTracks()[0].addEventListener('ended', () => {
      close()
    })
  });

MauricioDinki avatar Feb 04 '22 20:02 MauricioDinki

// screen stream
try {
  const screenStream = await navigator.mediaDevices.getDisplayMedia(params);
  const videoTrack = screenStream.getVideoTracks()[0];
  videoTrack.onended = () => {
     yourCallBack(); // callback on user click on stop sharing
  };
} catch (error) {}

bilouStrike avatar Jan 18 '24 07:01 bilouStrike