Fixes video switching issue. 'oldSmallVideo' field is no longer used as it is might be overwritten before fadeOut 'complete' callback of #largeVideo is called(and we miss UI update on it).

modules/UI/videolayout/LargeVideo.js

@@ -13,7 +13,6 @@ var currentVideoHeight = null;
 var getVideoSize = getCameraVideoSize;
 var getVideoPosition = getCameraVideoPosition;
 var currentSmallVideo = null;
-var oldSmallVideo = null;
 
 
 
@@ -236,22 +235,11 @@ function changeVideo(isVisible) {
 
 
     // Only if the large video is currently visible.
-    // Disable previous dominant speaker video.
-    if (oldSmallVideo) {
-        oldSmallVideo.enableDominantSpeaker(false);
-    }
-
-    // Enable new dominant speaker in the remote videos section.
-    if (currentSmallVideo) {
-        currentSmallVideo.enableDominantSpeaker(true);
-    }
-
     if (isVisible) {
+        LargeVideo.VideoLayout.largeVideoUpdated(currentSmallVideo);
+
         $('#largeVideo').fadeIn(300);
     }
-
-    if(oldSmallVideo)
-        oldSmallVideo.showAvatar();
 }
 
 var LargeVideo = {
@@ -297,22 +285,19 @@ var LargeVideo = {
         if (!LargeVideo.isCurrentlyOnLarge(resourceJid) || forceUpdate) {
             $('#activeSpeaker').css('visibility', 'hidden');
 
+            var oldSmallVideo = null;
             if (currentSmallVideo) {
                 oldSmallVideo = currentSmallVideo;
-            } else {
-                oldSmallVideo = null;
             }
-
             currentSmallVideo = newSmallVideo;
+
             var oldJid = null;
             if (oldSmallVideo)
                 oldJid = oldSmallVideo.peerJid;
-
             if (oldJid !== resourceJid) {
                 // we want the notification to trigger even if userJid is undefined,
                 // or null.
-                this.eventEmitter.emit(UIEvents.SELECTED_ENDPOINT,
-                    resourceJid);
+                this.eventEmitter.emit(UIEvents.SELECTED_ENDPOINT, resourceJid);
             }
             $('#largeVideo').fadeOut(300,
                 changeVideo.bind($('#largeVideo'), this.isLargeVideoVisible()));

modules/UI/videolayout/VideoLayout.js

@@ -167,6 +167,26 @@ var VideoLayout = (function (my) {
         return LargeVideo.getResourceJid();
     };
 
+    /**
+     * Called when large video update is finished
+     * @param currentSmallVideo small video currently displayed on large video
+     */
+    my.largeVideoUpdated = function (currentSmallVideo) {
+        // Makes sure that dominant speaker UI
+        // is enabled only on current small video
+        localVideoThumbnail.enableDominantSpeaker(
+            localVideoThumbnail === currentSmallVideo);
+        Object.keys(remoteVideos).forEach(
+            function (resourceJid) {
+                var remoteVideo = remoteVideos[resourceJid];
+                if (remoteVideo) {
+                    remoteVideo.enableDominantSpeaker(
+                        remoteVideo === currentSmallVideo);
+                }
+            }
+        );
+    };
+
     my.handleVideoThumbClicked = function(noPinnedEndpointChangedEvent,
                                           resourceJid) {
         if(focusedVideoResourceJid) {