@flashphoner/websdk 2.0.206 → 2.0.210

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flashphoner/websdk",
-  "version": "2.0.206",
+  "version": "2.0.210",
   "description": "Official Flashphoner WebCallServer WebSDK package",
   "main": "./src/flashphoner-core.js",
   "types": "./src/flashphoner-core.d.ts",

package/src/flashphoner-core.d.ts

@@ -6,7 +6,7 @@ export declare class Call {
         receiveAudio?: boolean | undefined;
         receiveVideo?: boolean | undefined;
         constraints?: string | undefined;
-        stripCodecs?: Array<string> | undefined;
+        stripCodecs?: string | undefined;
         sipSDP?: Array<string> | undefined;
         sipHeaders?: Array<string> | undefined;
     }) => void;
@@ -91,12 +91,25 @@ export declare class Session {
         cacheLocalResources?: boolean | undefined;
         playWidth?: number | undefined;
         playHeight?: number | undefined;
-
+        record?: boolean | undefined;
+        display: any;
+        custom?: any | undefined;
+        stripCodecs?: string | undefined;
+        rtmpUrl?: string | undefined;
+        mediaConnectionConstraints?: any | undefined;
+        flashShowFullScreenButton?: boolean | undefined;
+        transport?: string | undefined;
+        cvoExtension?: boolean | undefined;
+        playoutDelay?: number | undefined;
+        useCanvasMediaStream?: boolean | undefined;
+        videoContentHint?: string | undefined;
+        unmutePlayOnStart?: boolean | undefined;
+        sdpHook?: any | undefined
     }) => Stream;
     createCall: (options: {
         callee: string;
         visibleName?: string | undefined;
-        constraints: any;
+        constraints?: any | undefined;
         mediaProvider: string;
         receiveAudio?: boolean | undefined;
         receiveVideo?: boolean | undefined;
@@ -104,10 +117,11 @@ export declare class Session {
         localVideoDisplay: HTMLElement;
         remoteVideoDisplay: HTMLElement;
         custom?: any | undefined;
-        stripCodecs?: Array<string> | undefined;
+        stripCodecs?: string | undefined;
         sipSDP?: Array<string> | undefined;
         sipHeaders?: Array<string> | undefined;
         videoContentHint?: string | undefined;
+        toStream?: string | undefined;
     }) => Call;
     getStream: (streamId: string) => any;
     getStreams: () => any[];
@@ -179,7 +193,10 @@ export function createSession(options: {
     custom?: any | undefined;
     sipOptions?: any | undefined;
     mediaOptions?: any | undefined;
-    timeout?: any | undefined;
+    timeout?: number | undefined;
+    pingInterval?: number | undefined;
+    receiveProbes?: number | undefined;
+    probesInterval?: number | undefined;
 }): Session;
 export function playFirstSound (noise?: boolean): any;
 export function playFirstVideo (display: any, isLocal: boolean, src: any): any;

package/src/flashphoner-core.js

@@ -403,6 +403,9 @@ var getSession = function (id) {
  * @param {Object=} options.sipOptions Sip configuration
  * @param {Object=} options.mediaOptions Media connection configuration
  * @param {Integer=} options.timeout Connection timeout in milliseconds
+ * @param {Integer=} options.pingInterval Server ping interval in milliseconds [0]
+ * @param {Integer=} options.receiveProbes A maximum subsequental pings received missing count [0]
+ * @param {Integer=} options.probesInterval Interval to check subsequental pings received [0]
  * @returns {Session} Created session
  * @throws {Error} Error if API is not initialized
  * @throws {TypeError} Error if options.urlServer is not specified
@@ -427,6 +430,8 @@ var createSession = function (options) {
     var mediaOptions = options.mediaOptions;
     var keepAlive = options.keepAlive;
     var timeout = options.timeout;
+    var wsPingSender = new WSPingSender(options.pingInterval || 0);
+    var wsPingReceiver = new WSPingReceiver(options.receiveProbes || 0, options.probesInterval || 0);
     var connectionTimeout;
 
     var cConfig;
@@ -534,7 +539,7 @@ var createSession = function (options) {
                 mediaProviders: Object.keys(MediaProvider),
                 keepAlive: keepAlive,
                 authToken:authToken,
-                clientVersion: "2.0.206",
+                clientVersion: "2.0.210",
                 clientOSVersion: window.navigator.appVersion,
                 clientBrowserVersion: window.navigator.userAgent,
                 msePacketizationVersion: 2,
@@ -546,6 +551,10 @@ var createSession = function (options) {
             //connect to REST App
             send("connection", cConfig);
             logger.setConnection(wsConnection);
+            // Send ping messages to server to check if connection is still alive #WCS-3410
+            wsPingSender.start();
+            // Check subsequintel pings received from server to check if connection is still alive #WCS-3410
+            wsPingReceiver.start();
         };
         wsConnection.onmessage = function (event) {
             var data = {};
@@ -558,6 +567,7 @@ var createSession = function (options) {
             switch (data.message) {
                 case 'ping':
                     send("pong", null);
+                    wsPingReceiver.success();
                     break;
                 case 'getUserData':
                     authToken = obj.authToken;
@@ -684,6 +694,10 @@ var createSession = function (options) {
     function onSessionStatusChange(newStatus, obj) {
         sessionStatus = newStatus;
         if (sessionStatus == SESSION_STATUS.DISCONNECTED || sessionStatus == SESSION_STATUS.FAILED) {
+            // Stop pinging server #WCS-3410
+            wsPingSender.stop();
+            // Stop checking pings received #WCS-3410
+            wsPingReceiver.stop();
             //remove streams
             for (var prop in streamRefreshHandlers) {
                 if (streamRefreshHandlers.hasOwnProperty(prop) && typeof streamRefreshHandlers[prop] === 'function') {
@@ -698,6 +712,65 @@ var createSession = function (options) {
         }
     }
 
+    // Websocket periodic ping sender
+    function WSPingSender(interval) {
+        this.interval = interval || 0;
+        this.intervalId = null;
+        this.start = function() {
+            if (this.interval > 0) {
+                this.intervalId = setInterval(function() {
+                    send("ping", null);
+                }, this.interval);
+            }
+        };
+        this.stop = function() {
+            if (this.intervalId) {
+                clearInterval(this.intervalId);
+            }
+        };
+        
+        return(this);
+    }
+
+    // Websocket ping receive prober
+    function WSPingReceiver(receiveProbes, probesInterval) {
+        this.maxPings = receiveProbes || 0;
+        this.interval = probesInterval || 0;
+        this.intervalId = null;
+        this.pingsMissing = 0;
+        this.start = function() {
+            if (this.maxPings > 0 && this.interval > 0) {
+                let receiver = this;
+                this.intervalId = setInterval(function() {
+                    receiver.checkPingsReceived();
+                }, this.interval);
+            }
+        };
+        this.stop = function() {
+            if (this.intervalId) {
+                clearInterval(this.intervalId);
+            }
+            this.pingsMissing = 0;
+        };
+        this.checkPingsReceived = function() {
+            this.pingsMissing++;
+            if (this.pingsMissing >= this.maxPings) {
+                this.failure();
+            }
+        };
+        this.success = function() {
+            this.pingsMissing = 0;
+        };
+        this.failure = function() {
+            logger.info(LOG_PREFIX, "Missing " + this.pingsMissing + " pings from server, connection seems to be down");
+            onSessionStatusChange(SESSION_STATUS.FAILED);
+            wsConnection.close();
+        };
+
+        return(this);
+    }
+
+
     /**
      * @callback sdpHook
      * @param {Object} sdp Callback options
@@ -1472,7 +1545,7 @@ var createSession = function (options) {
      * @param {HTMLElement} options.display Div element stream should be displayed in
      * @param {Object=} options.custom User provided custom object that will be available in REST App code
      * @param {Integer} [options.flashBufferTime=0] Specifies how long to buffer messages before starting to display the stream (Flash-only)
-     * @param {String=} options.stripCodecs Comma separated string of codecs which should be stripped from WebRTC SDP (ex. "H264,PCMA,PCMU,G722")
+     * @param {string=} options.stripCodecs Comma separated string of codecs which should be stripped from WebRTC SDP (ex. "H264,PCMA,PCMU,G722")
      * @param {string=} options.rtmpUrl Rtmp url stream should be forwarded to
      * @param {Object=} options.mediaConnectionConstraints Stream specific constraints for underlying RTCPeerConnection
      * @param {Boolean=} options.flashShowFullScreenButton Show full screen button in flash
@@ -1481,6 +1554,7 @@ var createSession = function (options) {
      * @param {Integer=} options.playoutDelay Time delay between network reception of media and playout
      * @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 {sdpHook} sdpHook The callback that handles sdp from the server
      * @returns {Stream} Stream
      * @throws {TypeError} Error if no options provided
@@ -1584,6 +1658,7 @@ var createSession = function (options) {
         var playoutDelay = options.playoutDelay;
         var useCanvasMediaStream = options.useCanvasMediaStream;
         var videoContentHint = options.videoContentHint;
+        var unmutePlayOnStart = options.unmutePlayOnStart;
 
         var audioState_;
         var videoState_;
@@ -1758,7 +1833,8 @@ var createSession = function (options) {
                 connectionConstraints: mediaConnectionConstraints,
                 audioOutputId: audioOutputId,
                 remoteVideo: remoteVideo,
-                playoutDelay: playoutDelay
+                playoutDelay: playoutDelay,
+                unmutePlayOnStart: unmutePlayOnStart
             }, streamRefreshHandlers[id_]).then(function (newConnection) {
                 mediaConnection = newConnection;
                 try {

package/src/webrtc-media-provider.js

@@ -52,6 +52,8 @@ var createConnection = function (options) {
         var playoutDelay = options.playoutDelay;
         // Set video track contentHint to `detail` by default to workaround Chromium 91 bug #WCS-3257
         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;
 
         if (bidirectional) {
             localVideo = getCacheInstance(localDisplay);
@@ -67,7 +69,7 @@ var createConnection = function (options) {
             }
             remoteVideo = getCacheInstance(remoteDisplay);
             if (!remoteVideo) {
-                remoteVideo = document.createElement('video');
+                remoteVideo = createVideoElement();
                 remoteDisplay.appendChild(remoteVideo);
             }
             remoteVideo.id = id + "-remote";
@@ -88,7 +90,7 @@ var createConnection = function (options) {
                     if (cachedVideo) {
                         remoteVideo = cachedVideo;
                     } else {
-                        remoteVideo = document.createElement('video');
+                        remoteVideo = createVideoElement();
                         display.appendChild(remoteVideo);
                     }
                     remoteVideo.id = id;
@@ -141,7 +143,12 @@ var createConnection = function (options) {
                 remoteVideo.srcObject = event.streams[0];
                 remoteVideo.onloadedmetadata = function (e) {
                     if (remoteVideo) {
-                        remoteVideo.play().catch(function (e) {
+                        remoteVideo.play().then(function() {
+                            // Automatically unmute video if needed #WCS-2425
+                            if (unmutePlayOnStart) {
+                                remoteVideo.muted = false;
+                            }
+                        }).catch(function (e) {
                             if (validBrowsers.includes(browserDetails.browser)) {
                                 //WCS-1698. fixed autoplay in chromium based browsers
                                 //WCS-2375. fixed autoplay in ios safari
@@ -417,14 +424,14 @@ var createConnection = function (options) {
                                 if (!report.isRemote) {
                                     if (report.type == 'outbound-rtp') {
                                         fillStatObject(result.outboundStream, report);
-                                        if (report.mediaType == 'video') {
+                                        if (report.mediaType == 'video' && localVideo != undefined && localVideo != null) {
                                             var vSettings = localVideo.srcObject.getVideoTracks()[0].getSettings();
                                             result.outboundStream[report.mediaType].height = vSettings.height;
                                             result.outboundStream[report.mediaType].width = vSettings.width;
                                         }
                                     } else if (report.type == 'inbound-rtp') {
                                         fillStatObject(result.inboundStream, report);
-                                        if (report.mediaType == 'video' && remoteVideo != undefined) {
+                                        if (report.mediaType == 'video' && remoteVideo != undefined && remoteVideo != null) {
                                             result.inboundStream[report.mediaType].height = remoteVideo.videoHeight;
                                             result.inboundStream[report.mediaType].width = remoteVideo.videoWidth;
                                         }
@@ -585,7 +592,7 @@ var createConnection = function (options) {
                     if (browserDetails.browser === 'firefox') {
                         clonedConstraints.video.mediaSource = source;
                     }
-                    if (window.chrome && woExtension) {
+                    if (woExtension) {
                         getScreenDeviceIdWoExtension(clonedConstraints).then(function (screenSharingConstraints) {
                             navigator.mediaDevices.getDisplayMedia(screenSharingConstraints).then(
                                 (stream) => {
@@ -714,6 +721,7 @@ var createConnection = function (options) {
 };
 
 
+
 var mixAudioTracks = function (stream1, stream2) {
     var stream1Sound = audioContext.createMediaStreamSource(stream1);
     var stream2Sound = audioContext.createMediaStreamSource(stream2);
@@ -845,13 +853,11 @@ var getMediaAccess = function (constraints, display, disableConstraintsNormaliza
 var loadOrdinaryVideo = function(display, stream, screenShare, constraints, video) {
     let vEl = video;
     if (!vEl) {
-        vEl = document.createElement('video');
+        vEl = createVideoElement();
         display.appendChild(vEl);
     }
     vEl.id = uuid_v1() + LOCAL_CACHED_VIDEO;
     vEl.srcObject = stream;
-    //mute audio
-    vEl.muted = true;
     vEl.onloadedmetadata = function (e) {
         //WCS-2751 Add screen capture using getDisplayMedia in Safari
         if (screenShare && !screenCaptureSupportedBrowsers()) {
@@ -1185,6 +1191,17 @@ function getCacheInstance(display) {
     }
 }
 
+function createVideoElement() {
+    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", "");
+    }
+    return(video);
+}
+
 function removeVideoElement(video) {
     if (video.srcObject) {
         //pause