openvidu-browser: MediaDevices.getDisplayMedia

openvidu-browser/src/OpenVidu/OpenVidu.ts

@@ -521,9 +521,9 @@ export class OpenVidu {
               reject(error);
             } else {
 
-              if (!!this.advancedConfiguration.screenShareChromeExtension && !(platform.name!.indexOf('Firefox') !== -1)) {
+              if (!!this.advancedConfiguration.screenShareChromeExtension && !(platform.name!.indexOf('Firefox') !== -1) && !navigator.mediaDevices['getDisplayMedia']) {
 
-                // Custom screen sharing extension for Chrome (and Opera)
+                // Custom screen sharing extension for Chrome (and Opera) and no support for MediaDevices.getDisplayMedia()
 
                 screenSharing.getScreenConstraints((error, screenConstraints) => {
                   if (!!error || !!screenConstraints.mandatory && screenConstraints.mandatory.chromeMediaSource === 'screen') {
@@ -553,8 +553,11 @@ export class OpenVidu {
                 });
               } else {
 
-                // Default screen sharing extension for Chrome (or is Firefox)
+                if ((platform.name === 'Chrome' || platform.name === 'Opera') && navigator.mediaDevices['getDisplayMedia']) {
-
+                  // Chrome or Opera with MediaDevices.getDisplayMedia() support
+                  resolve(mediaConstraints);
+                } else {
+                  // Default screen sharing extension for Chrome/Opera, or is Firefox
                   const firefoxString = platform.name!.indexOf('Firefox') !== -1 ? publisherProperties.videoSource : undefined;
 
                   screenSharingAuto.getScreenId(firefoxString, (error, sourceId, screenConstraints) => {
@@ -580,6 +583,7 @@ export class OpenVidu {
                     }
                   });
                 }
+              }
 
               publisherProperties.videoSource = 'screen';
 

openvidu-browser/src/OpenVidu/Publisher.ts

@@ -269,6 +269,11 @@ export class Publisher extends StreamManager {
     initialize(): Promise<any> {
         return new Promise((resolve, reject) => {
 
+            let constraints: MediaStreamConstraints = {};
+            let constraintsAux: MediaStreamConstraints = {};
+            const timeForDialogEvent = 1250;
+            let startTime;
+
             const errorCallback = (openViduError: OpenViduError) => {
                 this.accessDenied = true;
                 this.accessAllowed = false;
@@ -421,50 +426,8 @@ export class Publisher extends StreamManager {
                 resolve();
             };
 
-            // Check if new constraints need to be generated. No constraints needed if
+            const afterGetMedia = (mediaStream: MediaStream, definedAudioConstraint) => {
-            // - video track is given and no audio
-            // - audio track is given and no video
-            // - both video and audio tracks are given
-            if ((this.properties.videoSource instanceof MediaStreamTrack && !this.properties.audioSource)
-                || (this.properties.audioSource instanceof MediaStreamTrack && !this.properties.videoSource)
-                || (this.properties.videoSource instanceof MediaStreamTrack && this.properties.audioSource instanceof MediaStreamTrack)) {
-                const mediaStream = new MediaStream();
-                if (this.properties.videoSource instanceof MediaStreamTrack) {
-                    mediaStream.addTrack((<MediaStreamTrack>this.properties.videoSource));
-                }
-                if (this.properties.audioSource instanceof MediaStreamTrack) {
-                    mediaStream.addTrack((<MediaStreamTrack>this.properties.audioSource));
-                }
-                // MediaStreamTracks are handled within callback - just call callback with new MediaStream() and let it handle the sources
-                successCallback(mediaStream);
-                // Return as we do not need to process further
-                return;
-            }
-
-            this.openvidu.generateMediaConstraints(this.properties)
-                .then(constraints => {
-
-                    const outboundStreamOptions = {
-                        mediaConstraints: constraints,
-                        publisherProperties: this.properties
-                    };
-
-                    this.stream.setOutboundStreamOptions(outboundStreamOptions);
-
-                    const constraintsAux: MediaStreamConstraints = {};
-                    const timeForDialogEvent = 1250;
-
-                    if (this.stream.isSendVideo() || this.stream.isSendAudio()) {
-                        const definedAudioConstraint = ((constraints.audio === undefined) ? true : constraints.audio);
-                        constraintsAux.audio = this.stream.isSendScreen() ? false : definedAudioConstraint;
-                        constraintsAux.video = constraints.video;
-                        let startTime = Date.now();
-                        this.setPermissionDialogTimer(timeForDialogEvent);
-
-                        navigator.mediaDevices.getUserMedia(constraintsAux)
-                            .then(mediaStream => {
                 this.clearPermissionDialogTimer(startTime, timeForDialogEvent);
-
                 if (this.stream.isSendScreen() && this.stream.isSendAudio()) {
                     // When getting desktop as user media audio constraint must be false. Now we can ask for it if required
                     constraintsAux.audio = definedAudioConstraint;
@@ -511,6 +474,56 @@ export class Publisher extends StreamManager {
                 } else {
                     successCallback(mediaStream);
                 }
+            };
+
+            // Check if new constraints need to be generated. No constraints needed if
+            // - video track is given and no audio
+            // - audio track is given and no video
+            // - both video and audio tracks are given
+            if ((this.properties.videoSource instanceof MediaStreamTrack && !this.properties.audioSource)
+                || (this.properties.audioSource instanceof MediaStreamTrack && !this.properties.videoSource)
+                || (this.properties.videoSource instanceof MediaStreamTrack && this.properties.audioSource instanceof MediaStreamTrack)) {
+                const mediaStream = new MediaStream();
+                if (this.properties.videoSource instanceof MediaStreamTrack) {
+                    mediaStream.addTrack((<MediaStreamTrack>this.properties.videoSource));
+                }
+                if (this.properties.audioSource instanceof MediaStreamTrack) {
+                    mediaStream.addTrack((<MediaStreamTrack>this.properties.audioSource));
+                }
+                // MediaStreamTracks are handled within callback - just call callback with new MediaStream() and let it handle the sources
+                successCallback(mediaStream);
+                // Return as we do not need to process further
+                return;
+            }
+
+            this.openvidu.generateMediaConstraints(this.properties)
+                .then(myConstraints => {
+
+                    constraints = myConstraints;
+
+                    const outboundStreamOptions = {
+                        mediaConstraints: constraints,
+                        publisherProperties: this.properties
+                    };
+
+                    this.stream.setOutboundStreamOptions(outboundStreamOptions);
+
+                    if (this.stream.isSendVideo() || this.stream.isSendAudio()) {
+                        const definedAudioConstraint = ((constraints.audio === undefined) ? true : constraints.audio);
+                        constraintsAux.audio = this.stream.isSendScreen() ? false : definedAudioConstraint;
+                        constraintsAux.video = constraints.video;
+                        startTime = Date.now();
+                        this.setPermissionDialogTimer(timeForDialogEvent);
+
+                        if (this.stream.isSendScreen() && navigator.mediaDevices['getDisplayMedia']) {
+                            navigator.mediaDevices['getDisplayMedia']({ video: true })
+                                .then(mediaStream => {
+                                    afterGetMedia(mediaStream, definedAudioConstraint);
+                                });
+                        } else {
+                            navigator.mediaDevices.getUserMedia(constraintsAux)
+                                .then(mediaStream => {
+                                    afterGetMedia(mediaStream, definedAudioConstraint);
                                 })
                                 .catch(error => {
                                     this.clearPermissionDialogTimer(startTime, timeForDialogEvent);
@@ -582,8 +595,10 @@ export class Publisher extends StreamManager {
                                             errorMessage = error.toString();
                                             errorCallback(new OpenViduError(errorName, errorMessage));
                                             break;
+
                                     }
                                 });
+                        }
                     } else {
                         reject(new OpenViduError(OpenViduErrorName.NO_INPUT_SOURCE_SET,
                             "Properties 'audioSource' and 'videoSource' cannot be set to false or null at the same time when calling 'OpenVidu.initPublisher'"));