@flashphoner/websdk 2.0.223 → 2.0.224

package/flashphoner-room-api.js

@@ -9955,6 +9955,7 @@ var createSession = function (options) {
      * @param {Array<string>=} options.sipSDP Array of custom SDP params (ex. bandwidth (b=))
      * @param {Array<string>=} options.sipHeaders Array of custom SIP headers
      * @param {string=} options.videoContentHint Video content hint for browser ('detail' by default to maintain resolution), {@link Flashphoner.constants.CONTENT_HINT_TYPE}
+     * @param {Boolean=} options.useControls Use a standard HTML5 video controls (play, pause, fullscreen). May be a workaround for fullscreen mode to work in Safari 16
      * @param {Object=} options.logger Call logger options
      * @param {sdpHook} sdpHook The callback that handles sdp from the server
      * @returns {Call} Call
@@ -10019,6 +10020,7 @@ var createSession = function (options) {
         var sipSDP = options.sipSDP;
         var sipHeaders = options.sipHeaders;
         var videoContentHint = options.videoContentHint;
+        var useControls = options.useControls;
         /**
          * Represents sip call.
          *
@@ -10115,6 +10117,7 @@ var createSession = function (options) {
                     connectionConfig: mediaOptions,
                     audioOutputId: audioOutputId,
                     videoContentHint: videoContentHint,
+                    useControls: useControls,
                     logger: logger
                 }).then(function (newConnection) {
                     mediaConnection = newConnection;
@@ -10253,7 +10256,8 @@ var createSession = function (options) {
                     login: cConfig.sipLogin,
                     constraints: constraints,
                     connectionConfig: mediaOptions,
-                    audioOutputId: audioOutputId
+                    audioOutputId: audioOutputId,
+                    useControls: useControls
                 }).then(function (newConnection) {
                     mediaConnection = newConnection;
                     return mediaConnection.setRemoteSdp(sdp);
@@ -10731,6 +10735,7 @@ var createSession = function (options) {
      * @param {string=} options.useCanvasMediaStream EXPERIMENTAL: when publish bind browser's media stream to the canvas. It can be useful for image filtering
      * @param {string=} options.videoContentHint Video content hint for browser ('detail' by default to maintain resolution), {@link Flashphoner.constants.CONTENT_HINT_TYPE}
      * @param {Boolean=} options.unmutePlayOnStart Unmute playback on start. May be used after user gesture only, so set 'unmutePlayOnStart: false' for autoplay
+     * @param {Boolean=} options.useControls Use a standard HTML5 video controls (play, pause, fullscreen). May be a workaround for fullscreen mode to work in Safari 16
      * @param {Object=} options.logger Stream logger options
      * @param {sdpHook} sdpHook The callback that handles sdp from the server
      * @returns {Stream} Stream
@@ -10841,6 +10846,7 @@ var createSession = function (options) {
         var useCanvasMediaStream = options.useCanvasMediaStream;
         var videoContentHint = options.videoContentHint;
         var unmutePlayOnStart = options.unmutePlayOnStart;
+        var useControls = options.useControls;
 
         var audioState_;
         var videoState_;
@@ -11026,6 +11032,7 @@ var createSession = function (options) {
                 remoteVideo: remoteVideo,
                 playoutDelay: playoutDelay,
                 unmutePlayOnStart: unmutePlayOnStart,
+                useControls: useControls,
                 logger: logger
             }, streamRefreshHandlers[id_]).then(function (newConnection) {
                 mediaConnection = newConnection;
@@ -11115,6 +11122,7 @@ var createSession = function (options) {
                     connectionConstraints: mediaConnectionConstraints,
                     customStream: constraints && constraints.customStream ? constraints.customStream : false,
                     videoContentHint: videoContentHint,
+                    useControls: useControls,
                     logger: logger
                 }).then(function (newConnection) {
                     mediaConnection = newConnection;
@@ -13234,7 +13242,7 @@ const Browser = {
         return !!window.chrome && /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor) && !/OPR/.test(navigator.userAgent);
     },
     isEdge: function () {
-        return !isIE && !!window.StyleMedia;
+        return !this.isIE() && !!window.StyleMedia;
     },
     isOpera: function () {
         return (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
@@ -13260,6 +13268,33 @@ const Browser = {
     },
     isChromiumEdge: function () {
         return /Chrome/i.test(navigator.userAgent) && /Edg/i.test(navigator.userAgent);
+    },
+    version: function () {
+        var version = navigator.userAgent.match(/version\/(\d+)/i);
+        if (version) {
+            return version[1];
+        } else {
+            if (this.isEdge()) {
+                version = /\brv[ :]+(\d+)/g.exec(navigator.userAgent) || [];
+            }
+            if (this.isOpera()) {
+                version = navigator.userAgent.match(/\b(OPR)\/(\d+)/) || [];
+            }
+            if (this.isChromiumEdge()) {
+                version = navigator.userAgent.match(/\b(Edg)\/(\d+)/) || [];
+            }
+            if (this.isSamsungBrowser()) {
+                version = navigator.userAgent.match(/\b(SamsungBrowser)\/(\d+)/) || [];
+            }
+            if (this.isChrome()) {
+                version = navigator.userAgent.match(/\b(Chrome)\/(\d+)/) || [];
+            }
+            if (this.isFirefox()) {
+                version = navigator.userAgent.match(/\b(Firefox)\/(\d+)/) || [];
+            }
+            return version[2] || 0;
+        }
+        return 0;
     }
 };
 
@@ -13526,6 +13561,16 @@ const getCurrentCodecAndSampleRate = function(sdp, mediaType) {
     return ret;
 };
 
+const isPromise = function(object) {
+    if (object !== null &&
+        typeof object === 'object' &&
+        typeof object.then === 'function' &&
+        typeof object.catch === 'function') {
+        return true;
+    }
+    
+    return false;
+};
 
 module.exports = {
     isEmptyObject,
@@ -13536,11 +13581,12 @@ module.exports = {
     SDP,
     logger,
     stripCodecs,
-    getCurrentCodecAndSampleRate
+    getCurrentCodecAndSampleRate,
+    isPromise
 };
 
 },{}],45:[function(require,module,exports){
-'use strict';
+-'use strict';
 
 var browserDetails = require('webrtc-adapter').default.browserDetails;
 const { v1: uuid_v1 } = require('uuid');
@@ -13601,6 +13647,8 @@ var createConnection = function (options) {
         var videoContentHint = options.videoContentHint ? options.videoContentHint : 'detail';
         // Pass the option to unmute automatically (true by default) #WCS-2425
         var unmutePlayOnStart = options.unmutePlayOnStart !== undefined ? options.unmutePlayOnStart : true;
+        // Use a standard HTML5 video controls if needed (to enable fullscreen in Safari 16 for example) #WCS-3606
+        var useControls = options.useControls || false;
 
         if (bidirectional) {
             localVideo = getCacheInstance(localDisplay);
@@ -13616,7 +13664,7 @@ var createConnection = function (options) {
             }
             remoteVideo = getCacheInstance(remoteDisplay);
             if (!remoteVideo) {
-                remoteVideo = createVideoElement();
+                remoteVideo = createVideoElement(useControls);
                 remoteDisplay.appendChild(remoteVideo);
             }
             remoteVideo.id = id + "-remote";
@@ -13637,7 +13685,7 @@ var createConnection = function (options) {
                     if (cachedVideo) {
                         remoteVideo = cachedVideo;
                     } else {
-                        remoteVideo = createVideoElement();
+                        remoteVideo = createVideoElement(useControls);
                         display.appendChild(remoteVideo);
                     }
                     remoteVideo.id = id;
@@ -13655,9 +13703,18 @@ var createConnection = function (options) {
                     setContentHint(localVideo.srcObject, videoContentHint);
                     connection.addStream(localVideo.srcObject);
                 }
+            } else {
+                // There is a custom video element, get its id if set #WCS-3606
+                if (remoteVideo.id) {
+                    id = remoteVideo.id;
+                }
             }
         }
         if (localVideo) {
+            // Enable local video controls if option requires #WCS-3606
+            if (useControls) {
+                enableVideoControls(localVideo);
+            }
             var videoTrack = localVideo.srcObject.getVideoTracks()[0];
             if (videoTrack) {
                 videoCams.forEach((cam, index) => {
@@ -13675,6 +13732,12 @@ var createConnection = function (options) {
                 });
             }
         }
+        if (remoteVideo) {
+            // Enable remote video  controls if option requires #WCS-3606
+            if (useControls) {
+                enableVideoControls(remoteVideo);
+            }
+        }
         function setContentHint(stream, hint) {
             stream.getVideoTracks().forEach(function(track) {
                 if(track.contentHint === undefined) {
@@ -14022,7 +14085,13 @@ var createConnection = function (options) {
                 if (!document.fullscreenElement && !document.mozFullScreenElement &&
                     !document.webkitFullscreenElement && !document.msFullscreenElement) {
                     if (video.requestFullscreen) {
-                        video.requestFullscreen();
+                        var result = video.requestFullscreen();
+                        // Chromium based browsers return a promise which is rejected although user click is present #WCS-3606
+                        if (util.isPromise(result)) {
+                            result.catch(function(e) {
+                                logger.debug(LOG_PREFIX, e);
+                            });
+                        }
                     } else if (video.msRequestFullscreen) {
                         video.msRequestFullscreen();
                     } else if (video.mozRequestFullScreen) {
@@ -14031,10 +14100,18 @@ var createConnection = function (options) {
                         video.webkitRequestFullscreen();
                     } else if (video.webkitEnterFullscreen) {
                         video.webkitEnterFullscreen();
-                        //hack for iOS safari. Video is getting paused when switching from fullscreen to normal mode.
+                        // iOS (all versions)/MacOS (since 15) Safari hack: video is paused when leaving fullscreen mode #WCS-3606
+                        var needRestart = false;
                         video.addEventListener("pause", function () {
-                            video.play();
+                            if(needRestart) {
+                                video.play();
+                                needRestart = false;
+                            }
                         });
+                        video.addEventListener("webkitendfullscreen", function () {
+                            video.play();
+                            needRestart = true;
+                        });                
                     }
                 } else {
                     if (document.exitFullscreen) {
@@ -14410,7 +14487,9 @@ var loadOrdinaryVideo = function(display, stream, screenShare, constraints, vide
         vEl = createVideoElement();
         display.appendChild(vEl);
     }
-    vEl.id = uuid_v1() + LOCAL_CACHED_VIDEO;
+    if (!vEl.id) {
+        vEl.id = uuid_v1() + LOCAL_CACHED_VIDEO;
+    }
     vEl.srcObject = stream;
     vEl.onloadedmetadata = function (e) {
         //WCS-2751 Add screen capture using getDisplayMedia in Safari
@@ -14438,7 +14517,9 @@ var loadCanvasVideo = function (display, stream, video) {
             vEl = canvas;
         }
     }
-    vEl.id = uuid_v1() + LOCAL_CACHED_VIDEO;
+    if (!vEl.id) {
+        vEl.id = uuid_v1() + LOCAL_CACHED_VIDEO;
+    }
 
     let child = vEl.children[0];
     child.srcObject = stream;
@@ -14745,13 +14826,16 @@ function getCacheInstance(display) {
     }
 }
 
-function createVideoElement() {
+function createVideoElement(useControls = false) {
     let video = document.createElement('video');
     // Prepare video tag to auto play and add specific Safari tweaks #WCS-2425
     video.muted = true;
-    if(util.Browser.isSafariWebRTC()) {
-       video.setAttribute("playsinline", "");
-       video.setAttribute("webkit-playsinline", "");
+    if (util.Browser.isSafariWebRTC()) {
+        video.setAttribute("playsinline", "");
+        video.setAttribute("webkit-playsinline", "");
+    }
+    if (useControls) {
+        enableVideoControls(video);
     }
     return(video);
 }
@@ -14777,6 +14861,12 @@ function removeVideoElement(video) {
     }
 }
 
+function enableVideoControls(video) {
+    if(video && !video.controls) {
+        video.setAttribute("controls", "controls");
+    }
+}
+
 /**
  * Check WebRTC available
  *
@@ -14947,12 +15037,10 @@ var playFirstSound = function () {
     return false;
 };
 
-var playFirstVideo = function (display, isLocal, src) {
+var playFirstVideo = function (display, isLocal, src, useControls = false) {
     return new Promise(function (resolve, reject) {
         if (!getCacheInstance(display)) {
-            var video = document.createElement('video');
-            video.setAttribute("playsinline", "");
-            video.setAttribute("webkit-playsinline", "");
+            var video = createVideoElement(useControls);
             //Mute video tag to prevent local audio playback in Safari #WCS-3430
             video.muted = true;
             video.id = uuid_v1() + (isLocal ? LOCAL_CACHED_VIDEO : REMOTE_CACHED_VIDEO);
@@ -14963,6 +15051,7 @@ var playFirstVideo = function (display, isLocal, src) {
                 video.src = src;
                 video.play().then(function () {
                     display.appendChild(video);
+                    video.removeAttribute("src");
                     resolve();
                 }).catch(function () {
                     //WCS-2375. fixed autoplay in ios safari
@@ -14970,6 +15059,7 @@ var playFirstVideo = function (display, isLocal, src) {
                     video.muted = true;
                     video.play().then(function () {
                         display.appendChild(video);
+                        video.removeAttribute("src");
                         resolve();
                     });
                     //WCS-2375. low power mode suspends video play