Fixes a bug with prematurely removed remote videos on firefox.

modules/UI/videolayout/RemoteVideo.js

@@ -168,6 +168,9 @@ RemoteVideo.prototype.removeRemoteStreamElement =
 RemoteVideo.prototype.remove = function () {
     console.log("Remove thumbnail", this.peerJid);
     this.removeConnectionIndicator();
+    // Make sure that the large video is updated if are removing its
+    // corresponding small video.
+    this.VideoLayout.updateRemovedVideo(this.getResourceJid());
     // Remove whole container
     if (this.container.parentNode)
         this.container.parentNode.removeChild(this.container);
@@ -233,19 +236,6 @@ RemoteVideo.prototype.addRemoteStreamElement = function (stream) {
 
     };
 
-    /**
-     * FF is missing onended event for remote streams. The problem we are fixing
-     * here is when the last participant leaves the room the video element is
-     * not updated. So the avatar or last video frame will stay, the fix updates
-     * the video elem and switches to local video the same as behavior in other
-     * browsers.
-     */
-    if (RTCBrowserType.isFirefox()) {
-        APP.xmpp.addListener(XMPPEvents.MUC_MEMBER_LEFT, function (jid) {
-            self.removeRemoteStreamElement(stream, isVideo, newElementId);
-        });
-    }
-
     // Add click handler.
     var onClickHandler = function (event) {
 

modules/UI/videolayout/VideoLayout.js

@@ -126,12 +126,11 @@ var VideoLayout = (function (my) {
     /**
      * Checks if removed video is currently displayed and tries to display
      * another one instead.
-     * @param removedVideoSrc src stream identifier of the video.
      */
     my.updateRemovedVideo = function(resourceJid) {
+        var newResourceJid;
 
         if (resourceJid === LargeVideo.getResourceJid()) {
-            var newResourceJid;
             // We'll show user's avatar if he is the dominant speaker or if
             // his video thumbnail is pinned
             if (remoteVideos[resourceJid] &&
@@ -153,18 +152,32 @@ var VideoLayout = (function (my) {
         var pick = $('#remoteVideos>span[id!="mixedstream"]:visible:last');
         if (pick.length) {
             jid = VideoLayout.getPeerContainerResourceJid(pick[0]);
-        } else {
+            if (!remoteVideos[jid]) {
+                // The RemoteVideo was removed (but the DOM elements may still
+                // exist).
+                jid = null;
+            }
+        }
+
+        if (!jid) {
             console.info("Last visible video no longer exists");
             pick = $('#remoteVideos>span[id!="mixedstream"]');
             if (pick.length) {
                 jid = VideoLayout.getPeerContainerResourceJid(pick[0]);
-            }
-            if (!jid) {
-                // Go with local video
-                console.info("Fallback to local video...");
-                jid = APP.xmpp.myResource();
+                if (!remoteVideos[jid]) {
+                    // The RemoteVideo was removed (but the DOM elements may
+                    // still exist).
+                    jid = null;
+                }
             }
         }
+
+        if (!jid) {
+            // Go with local video
+            console.info("Fallback to local video...");
+            jid = APP.xmpp.myResource();
+        }
+
         console.info("electLastVisibleVideo: " + jid);
         return jid;
     };
@@ -830,8 +843,7 @@ var VideoLayout = (function (my) {
             focusedVideoResourceJid = null;
         }
 
-        if (currentDominantSpeaker === resourceJid)
-        {
+        if (currentDominantSpeaker === resourceJid) {
             console.info("Dominant speaker has left the conference");
             currentDominantSpeaker = null;
         }
@@ -840,8 +852,8 @@ var VideoLayout = (function (my) {
         if (remoteVideo) {
             // Remove remote video
             console.info("Removing remote video: " + resourceJid);
-            remoteVideo.remove();
             delete remoteVideos[resourceJid];
+            remoteVideo.remove();
         } else {
             console.warn("No remote video for " + resourceJid);
         }