The Screen Can Be Your Cam in a Videomeeting

Sending the screen capture is usually only possible when displayed in the presentation view. This means, that only the presentation can be seen, but not the other participants. With Screen Cam, you can share your screen capture stream in a simple way instead of the camera stream. This way you can share your desktop, your browser, or a browser tab (depending on the browser the client is using) as part of a meeting.

Usage

In the stream control section of the docs, you have options to start or change the stream with audio and/or video. Now there’s a new option to use the screen instead.

eyeson.send({ type: 'start_stream', screen: true });

Good to know: change_stream event is only used to mute/unmute your cam/mic or screen by its given parameters.

Switching back and forth

To switch temporarily between cam and screen, one would usually start with cam, switch to screen, and then return to cam.

eyeson.start(, { audio: true, video: true });

// […]
eyeson.send({ type: 'start_stream', audio: true, screen: true });

// […]
eyeson.send({ type: 'start_stream', audio: true, video: true });

In this example audio: true enables the microphone and automatically accompanies any detected screen-audio capture.

Mute video during screen cam

Use the change_stream event to mute and unmute the video.

let showScreen = true;

eyeson.send({ type: 'start_stream', audio: true, screen: showScreen });

function toggleVideo() {
  showScreen = !showScreen;
  eyeson.send({ type: 'change_stream', audio: true, screen: showScreen });
}

Stop sharing screen…

When the screen capture was stopped from the outside like for example by hitting the browser’s button “Stop sharing screen”, the eyeson.onEvent() handler will receive an event type “screen_video_ended”. Now your app can react to it.

eyeson.onEvent(event => {
  if (event.type === 'screen_video_ended') {
    eyeson.send({ type: 'start_stream', audio: true, video: true });
  }
});
eyeson.start(, { audio: true, video: true });

// […]
eyeson.send({ type: 'start_stream', audio: true, screen: true });

Error handling

Any error related to screen cam will raise the screen_capture_error event. Note that this is different from the capture_error that is thrown by the start_screen_capture event.

Both error events will deliver more detailed information in the name attribute.

const phrases = {
  'error_Screen_NotAllowedError': 'Allow screen access in your browser.'
};

eyeson.onEvent(event => {
  if (event.type === 'screen_capture_error') {
    const message = phrases[event.name] || 'Unable to start screen capture';
    alert(message);
  }
});

// […]
eyeson.send({ type: 'start_stream', audio: true, screen: true });

What about screen audio?

The browser’s screen share dialog will offer share audio where possible. So it is up to the meeting participant to enable it. Whenever screen audio is detected, it will be sent along with the screen’s video and accompanies the microphone.

More about this can be found in our help center “sharing browser tab with audio”.