Fixes the issues with resolution value when simulcast is enabled.

index.html

@@ -45,9 +45,9 @@
     <script src="replacement.js?v=6"></script><!-- link and smiley replacement -->
     <script src="moderatemuc.js?v=4"></script><!-- moderator plugin -->
     <script src="analytics.js?v=1"></script><!-- google analytics plugin -->
-    <script src="rtp_sts.js?v=3"></script><!-- RTP stats processing -->
+    <script src="rtp_sts.js?v=4"></script><!-- RTP stats processing -->
     <script src="local_sts.js?v=2"></script><!-- Local stats processing -->
-    <script src="videolayout.js?v=20"></script><!-- video ui -->
+    <script src="videolayout.js?v=21"></script><!-- video ui -->
     <script src="connectionquality.js?v=1"></script>
     <script src="toolbar.js?v=6"></script><!-- toolbar ui -->
     <script src="toolbar_toggler.js?v=2"></script>

rtp_sts.js

@@ -18,7 +18,7 @@ function PeerStats()
     this.ssrc2Loss = {};
     this.ssrc2AudioLevel = {};
     this.ssrc2bitrate = {};
-    this.resolution = null;
+    this.ssrc2resolution = {};
 }
 
 /**
@@ -52,6 +52,22 @@ PeerStats.prototype.setSsrcLoss = function (ssrc, lossRate)
     this.ssrc2Loss[ssrc] = lossRate;
 };
 
+/**
+ * Sets resolution for given <tt>ssrc</tt> that belong to the peer
+ * represented by this instance.
+ * @param ssrc audio or video RTP stream SSRC.
+ * @param resolution new resolution value to be set.
+ */
+PeerStats.prototype.setSsrcResolution = function (ssrc, resolution)
+{
+    if(resolution == null && this.ssrc2resolution[ssrc])
+    {
+        delete this.ssrc2resolution[ssrc];
+    }
+    else if(resolution != null)
+        this.ssrc2resolution[ssrc] = resolution;
+};
+
 /**
  * Sets the bit rate for given <tt>ssrc</tt> that blong to the peer
  * represented by this instance.
@@ -318,22 +334,13 @@ StatsCollector.prototype.processStatsReport = function () {
             resolution.width = now.stat("googFrameWidthSent");
         }
 
-        if(!jidStats.resolution)
-            jidStats.resolution = null;
-
         if(resolution.height && resolution.width)
         {
-            if(!jidStats.resolution)
-                jidStats.resolution = { hq: resolution, lq: resolution};
-            else if(jidStats.resolution.hq.width > resolution.width &&
-                jidStats.resolution.hq.height > resolution.height)
-            {
-                jidStats.resolution.lq = resolution;
-            }
-            else
-            {
-                jidStats.resolution.hq = resolution;
-            }
+            jidStats.setSsrcResolution(ssrc, resolution);
+        }
+        else
+        {
+            jidStats.setSsrcResolution(ssrc, null);
         }
 
 
@@ -365,8 +372,7 @@ StatsCollector.prototype.processStatsReport = function () {
                     bitrateUpload += self.jid2stats[jid].ssrc2bitrate[ssrc].upload;
                 }
             );
-            resolution[jid] = self.jid2stats[jid].resolution;
-            delete self.jid2stats[jid].resolution;
+            resolution[jid] = self.jid2stats[jid].ssrc2resolution;
         }
     );
 

videolayout.js

@@ -8,6 +8,8 @@ var VideoLayout = (function (my) {
     };
     my.connectionIndicators = {};
 
+    var displayedSsrcs = {};
+
     my.changeLocalAudio = function(stream) {
         connection.jingle.localAudio = stream;
 
@@ -33,7 +35,7 @@ var VideoLayout = (function (my) {
 
         if(!VideoLayout.connectionIndicators["localVideoContainer"]) {
             VideoLayout.connectionIndicators["localVideoContainer"]
-                = new ConnectionIndicator($("#localVideoContainer")[0]);
+                = new ConnectionIndicator($("#localVideoContainer")[0], null);
         }
 
         AudioLevels.updateAudioLevelCanvas();
@@ -181,38 +183,12 @@ var VideoLayout = (function (my) {
                     if (largeVideoState.oldJid) {
                         var oldResourceJid = Strophe.getResourceFromJid(largeVideoState.oldJid);
                         VideoLayout.enableDominantSpeaker(oldResourceJid, false);
-                        if(VideoLayout.connectionIndicators) {
-                            var videoContainerId = null;
-                            if (oldResourceJid == Strophe.getResourceFromJid(connection.emuc.myroomjid)) {
-                                videoContainerId = 'localVideoContainer';
-                            }
-                            else {
-                                videoContainerId = 'participant_' + oldResourceJid;
-                            }
-                            if(VideoLayout.connectionIndicators[videoContainerId])
-                                VideoLayout.connectionIndicators[videoContainerId].setShowHQ(false);
-                        }
-
                     }
 
                     // Enable new dominant speaker in the remote videos section.
                     if (largeVideoState.userJid) {
                         var resourceJid = Strophe.getResourceFromJid(largeVideoState.userJid);
                         VideoLayout.enableDominantSpeaker(resourceJid, true);
-                        if(VideoLayout.connectionIndicators)
-                        {
-                            var videoContainerId = null;
-                            if (resourceJid
-                                === Strophe.getResourceFromJid(connection.emuc.myroomjid)) {
-                                videoContainerId = 'localVideoContainer';
-                            }
-                            else {
-                                videoContainerId = 'participant_' + resourceJid;
-                            }
-                            if(VideoLayout.connectionIndicators[videoContainerId])
-                                VideoLayout.connectionIndicators[videoContainerId].setShowHQ(true);
-                        }
-
                     }
 
                     if (fade && largeVideoState.isVisible) {
@@ -376,7 +352,7 @@ var VideoLayout = (function (my) {
             // Set default display name.
             setDisplayName(videoSpanId);
 
-            VideoLayout.connectionIndicators[videoSpanId] = new ConnectionIndicator(container);
+            VideoLayout.connectionIndicators[videoSpanId] = new ConnectionIndicator(container, peerJid);
 
             var nickfield = document.createElement('span');
             nickfield.className = "nick";
@@ -1482,6 +1458,21 @@ var VideoLayout = (function (my) {
                 if (updateFocusedVideoSrc) {
                     focusedVideoSrc = electedStreamUrl;
                 }
+                var ssrc = videoSrcToSsrc[selRemoteVideo.attr('src')];
+                displayedSsrcs[ssrc2jid[ssrc]] = ssrc;
+                var jid = ssrc2jid[ssrc];
+                var videoId;
+                if(jid == connection.emuc.myroomjid)
+                {
+                    videoId = "localVideoContainer";
+                }
+                else
+                {
+                    videoId = "participant_" + Strophe.getResourceFromJid(jid);
+                }
+                var connectionIndicator = VideoLayout.connectionIndicators[videoId];
+                if(connectionIndicator)
+                    connectionIndicator.updatePopoverData();
 
             } else {
                 console.error('Could not find a stream or a session.', session, electedStream);
@@ -1494,7 +1485,7 @@ var VideoLayout = (function (my) {
      * @param videoContainer the video container associated with the indicator.
      * @constructor
      */
-    function ConnectionIndicator(videoContainer)
+    function ConnectionIndicator(videoContainer, jid)
     {
         this.videoContainer = videoContainer;
         this.bandwidth = null;
@@ -1504,7 +1495,7 @@ var VideoLayout = (function (my) {
         this.resolution = null;
         this.transport = [];
         this.popover = null;
-        this.showHQ = false;
+        this.jid = jid;
         this.create();
     }
 
@@ -1521,16 +1512,6 @@ var VideoLayout = (function (my) {
         0: "0px"//empty
     };
 
-    /**
-     * Sets the value of the property that indicates whether the displayed resolution si the
-     * resolution of High Quality stream or Low Quality
-     * @param value boolean.
-     */
-    ConnectionIndicator.prototype.setShowHQ = function (value) {
-        this.showHQ = value;
-        this.updatePopoverData();
-    };
-
     ConnectionIndicator.getIP = function(value)
     {
         return value.substring(0, value.indexOf(":"));
@@ -1583,17 +1564,38 @@ var VideoLayout = (function (my) {
         var resolutionValue = null;
         if(this.resolution)
         {
-            if(this.showHQ && this.resolution.hq)
+            var keys = Object.keys(this.resolution);
+            if(keys.length == 1)
             {
-                resolutionValue = this.resolution.hq;
+                for(var ssrc in this.resolution)
+                {
+                    resolutionValue = this.resolution[ssrc];
+                }
             }
-            else if(!this.showHQ && this.resolution.lq)
+            else if(keys.length > 1)
             {
-                resolutionValue = this.resolution.lq;
+                resolutionValue = this.resolution[displayedSsrcs[this.jid]];
             }
         }
 
-        if(!resolutionValue ||
+        if(this.jid==null)
+        {
+            resolution = "";
+            for(var i in this.resolution)
+            {
+                resolutionValue = this.resolution[i];
+                if(resolutionValue)
+                {
+                    if(resolutionValue.height &&
+                        resolutionValue.width)
+                    {
+                        resolution += (resolution == ""? "" : ", ")
+                            + resolutionValue.width + "x" + resolutionValue.height;
+                    }
+                }
+            }
+        }
+        else if(!resolutionValue ||
             !resolutionValue.height ||
             !resolutionValue.width)
         {