ref(VideoLayout): reduce 'forceUpdate' usage

modules/UI/videolayout/LargeVideoManager.js

@@ -523,6 +523,14 @@ export default class LargeVideoManager {
         return this.getContainer(this.state);
     }
 
+    /**
+     * Returns type of the current {@link LargeContainer}
+     * @return {string}
+     */
+    getCurrentContainerType() {
+        return this.state;
+    }
+
     /**
      * Remove Large container of specified type.
      * @param {string} type container type.

modules/UI/videolayout/LocalVideo.js

@@ -113,9 +113,7 @@ LocalVideo.prototype.changeVideo = function (stream) {
         // when removing only the video element and we are on stage
         // update the stage
         if (this.isCurrentlyOnLargeVideo()) {
-            this.VideoLayout.updateLargeVideo(
-                this.id,
-                true /* force - stream removed for the same user ID */);
+            this.VideoLayout.updateLargeVideo(this.id);
         }
         stream.off(TrackEvents.LOCAL_TRACK_STOPPED, endedHandler);
     };

modules/UI/videolayout/RemoteVideo.js

@@ -432,9 +432,7 @@ RemoteVideo.prototype.removeRemoteStreamElement = function (stream) {
     // when removing only the video element and we are on stage
     // update the stage
     if (isVideo && this.isCurrentlyOnLargeVideo()) {
-        this.VideoLayout.updateLargeVideo(
-            this.id,
-            true /* force - same user ID, but removed video stream */);
+        this.VideoLayout.updateLargeVideo(this.id);
     } else {
         // Missing video stream will affect display mode
         this.updateView();

modules/UI/videolayout/VideoContainer.js

@@ -254,6 +254,14 @@ export class VideoContainer extends LargeContainer {
         this.$videoBackground.toggleClass("videoProblemFilter", enable);
     }
 
+    /**
+     * Obtains media stream ID of the underlying {@link JitsiTrack}.
+     * @return {string|null}
+     */
+    getStreamID() {
+        return this.stream ? this.stream.getId() : null;
+    }
+
     /**
      * Get size of video element.
      * @returns {{width, height}}

modules/UI/videolayout/VideoLayout.js

@@ -195,9 +195,9 @@ var VideoLayout = {
 
         localVideoThumbnail.changeVideo(stream);
 
-        /* force update if we're currently being displayed */
+        /* Update if we're currently being displayed */
         if (this.isCurrentlyOnLarge(localId)) {
-            this.updateLargeVideo(localId, true);
+            this.updateLargeVideo(localId);
         }
     },
 
@@ -761,7 +761,7 @@ var VideoLayout = {
         if (remoteVideo) {
             remoteVideo.updateView();
             if (remoteVideo.isCurrentlyOnLargeVideo()) {
-                this.updateLargeVideo(id, true);
+                this.updateLargeVideo(id);
             }
         }
     },
@@ -1010,8 +1010,26 @@ var VideoLayout = {
         if (!largeVideo) {
             return;
         }
-        let isOnLarge = this.isCurrentlyOnLarge(id);
-        let currentId = largeVideo.id;
+        const currentContainer = largeVideo.getCurrentContainer();
+        const currentContainerType = largeVideo.getCurrentContainerType();
+        const currentId = largeVideo.id;
+        const isOnLarge = this.isCurrentlyOnLarge(id);
+        const smallVideo = this.getSmallVideo(id);
+
+        if (isOnLarge && !forceUpdate
+                && LargeVideoManager.isVideoContainer(currentContainerType)
+                && smallVideo) {
+            const currentStreamId = currentContainer.getStreamID();
+            const newStreamId
+                = smallVideo.videoStream
+                    ? smallVideo.videoStream.getId() : null;
+
+            // FIXME it might be possible to get rid of 'forceUpdate' argument
+            if (currentStreamId !== newStreamId) {
+                logger.debug('Enforcing large video update for stream change');
+                forceUpdate = true;
+            }
+        }
 
         if (!isOnLarge || forceUpdate) {
             let videoType = this.getRemoteVideoType(id);
@@ -1020,7 +1038,6 @@ var VideoLayout = {
                 eventEmitter.emit(UIEvents.SELECTED_ENDPOINT, id);
             }
 
-            let smallVideo = this.getSmallVideo(id);
             let oldSmallVideo;
             if (currentId) {
                 oldSmallVideo = this.getSmallVideo(currentId);