浏览代码

Moves method for selecting thumbnail's video element from videolayout to SmallVideo. Fixes issue with muted audio in IE after switching between thumbnails.

master
paweldomas 9 年前
父节点
当前提交
a8a0945d73
共有 3 个文件被更改,包括 52 次插入41 次删除
  1. 1
    4
      modules/UI/videolayout/RemoteVideo.js
  2. 16
    7
      modules/UI/videolayout/SmallVideo.js
  3. 35
    30
      modules/UI/videolayout/VideoLayout.js

+ 1
- 4
modules/UI/videolayout/RemoteVideo.js 查看文件

191
             APP.RTC.attachMediaStream(sel, stream);
191
             APP.RTC.attachMediaStream(sel, stream);
192
         }
192
         }
193
         if (RTCBrowserType.isTemasysPluginUsed()) {
193
         if (RTCBrowserType.isTemasysPluginUsed()) {
194
-            sel = self.VideoLayout.getPeerVideoSel(resourceJid);
194
+            sel = self.selectVideoElement();
195
         }
195
         }
196
         self.VideoLayout.videoactive(sel, resourceJid);
196
         self.VideoLayout.videoactive(sel, resourceJid);
197
         sel[0].onplaying = null;
197
         sel[0].onplaying = null;
233
 
233
 
234
     };
234
     };
235
 
235
 
236
-    // Name of video element name is different for IE/Safari
237
-    var videoElem = APP.RTC.getVideoElementName();
238
-
239
     // Add click handler.
236
     // Add click handler.
240
     var onClickHandler = function (event) {
237
     var onClickHandler = function (event) {
241
 
238
 

+ 16
- 7
modules/UI/videolayout/SmallVideo.js 查看文件

284
     APP.translation.translateElement($('#' + this.videoSpanId + ' .focusindicator'));
284
     APP.translation.translateElement($('#' + this.videoSpanId + ' .focusindicator'));
285
 };
285
 };
286
 
286
 
287
+SmallVideo.prototype.selectVideoElement = function () {
288
+    var videoElem = APP.RTC.getVideoElementName();
289
+    if (!RTCBrowserType.isTemasysPluginUsed()) {
290
+        return $('#' + this.videoSpanId).find(videoElem);
291
+    } else {
292
+        return $('#' + this.videoSpanId +
293
+               (this.isLocal ? '>>' : '>') +
294
+               videoElem + '>param[value="video"]').parent();
295
+    }
296
+};
297
+
287
 SmallVideo.prototype.getSrc = function () {
298
 SmallVideo.prototype.getSrc = function () {
288
-    var videoElement = APP.RTC.getVideoElementName();
289
-    return APP.RTC.getVideoSrc(
290
-            $('#' + this.videoSpanId).find(videoElement).get(0));
299
+    var videoElement = this.selectVideoElement().get(0);
300
+    return APP.RTC.getVideoSrc(videoElement);
291
 };
301
 };
292
 
302
 
293
 SmallVideo.prototype.focus = function(isFocused) {
303
 SmallVideo.prototype.focus = function(isFocused) {
299
 };
309
 };
300
 
310
 
301
 SmallVideo.prototype.hasVideo = function () {
311
 SmallVideo.prototype.hasVideo = function () {
302
-    return $("#" + this.videoSpanId).find(
303
-                APP.RTC.getVideoElementName()).length !== 0;
312
+    return this.selectVideoElement().length !== 0;
304
 };
313
 };
305
 
314
 
306
 /**
315
 /**
320
     }
329
     }
321
 
330
 
322
     var resourceJid = this.getResourceJid();
331
     var resourceJid = this.getResourceJid();
323
-    var videoElem = APP.RTC.getVideoElementName();
324
-    var video = $('#' + this.videoSpanId).find(videoElem);
332
+    var video = this.selectVideoElement();
333
+
325
     var avatar = $('#avatar_' + resourceJid);
334
     var avatar = $('#avatar_' + resourceJid);
326
 
335
 
327
     if (show === undefined || show === null) {
336
     if (show === undefined || show === null) {

+ 35
- 30
modules/UI/videolayout/VideoLayout.js 查看文件

145
         }
145
         }
146
     };
146
     };
147
 
147
 
148
-    my.electLastVisibleVideo = function() {
148
+    my.electLastVisibleVideo = function () {
149
         // pick the last visible video in the row
149
         // pick the last visible video in the row
150
         // if nobody else is left, this picks the local video
150
         // if nobody else is left, this picks the local video
151
         var jid;
151
         var jid;
152
-        var videoElem = RTC.getVideoElementName();
153
-        var pick = $('#remoteVideos>span[id!="mixedstream"]:visible:last>' + videoElem);
154
-        if (pick.length && APP.RTC.getVideoSrc(pick[0])) {
155
-            jid = VideoLayout.getPeerContainerResourceJid(pick[0].parentNode);
152
+        var pick = $('#remoteVideos>span[id!="mixedstream"]:visible:last');
153
+        if (pick.length) {
154
+            jid = VideoLayout.getPeerContainerResourceJid(pick[0]);
156
         } else {
155
         } else {
157
             console.info("Last visible video no longer exists");
156
             console.info("Last visible video no longer exists");
158
-            pick = $('#remoteVideos>span[id!="mixedstream"]>' + videoElem);
159
-            if (pick.length && APP.RTC.getVideoSrc(pick[0])) {
160
-                jid = VideoLayout.getPeerContainerResourceJid(pick[0].parentNode);
161
-            } else {
162
-                // Try local video
157
+            pick = $('#remoteVideos>span[id!="mixedstream"]');
158
+            if (pick.length) {
159
+                jid = VideoLayout.getPeerContainerResourceJid(pick[0]);
160
+            }
161
+            if (!jid) {
162
+                // Go with local video
163
                 console.info("Fallback to local video...");
163
                 console.info("Fallback to local video...");
164
                 jid = APP.xmpp.myResource();
164
                 jid = APP.xmpp.myResource();
165
             }
165
             }
467
      * DOM element
467
      * DOM element
468
      */
468
      */
469
     my.getPeerContainerResourceJid = function (containerElement) {
469
     my.getPeerContainerResourceJid = function (containerElement) {
470
+        if (localVideoThumbnail.container === containerElement) {
471
+            return localVideoThumbnail.getResourceJid();
472
+        }
473
+
470
         var i = containerElement.id.indexOf('participant_');
474
         var i = containerElement.id.indexOf('participant_');
471
 
475
 
472
         if (i >= 0)
476
         if (i >= 0)
473
-            return containerElement.id.substring(i + 12); 
474
-    };
475
-
476
-    my.getPeerVideoSel = function (peerResourceJid) {
477
-        return $('#participant_'  + peerResourceJid +
478
-                 '>' + APP.RTC.getVideoElementName());
477
+            return containerElement.id.substring(i + 12);
479
     };
478
     };
480
 
479
 
481
     /**
480
     /**
492
         }
491
         }
493
 
492
 
494
         var resource = Strophe.getResourceFromJid(jid);
493
         var resource = Strophe.getResourceFromJid(jid);
495
-        var videoSel = VideoLayout.getPeerVideoSel(resource);
496
-        if (videoSel.length > 0) {
497
-            var videoThumb = videoSel[0];
494
+        var remoteVideo = remoteVideos[resource];
495
+        if (remoteVideo && remoteVideo.selectVideoElement().length) {
496
+            var videoThumb = remoteVideo.selectVideoElement()[0];
498
             // It is not always the case that a videoThumb exists (if there is
497
             // It is not always the case that a videoThumb exists (if there is
499
             // no actual video).
498
             // no actual video).
500
             if (RTC.getVideoSrc(videoThumb)) {
499
             if (RTC.getVideoSrc(videoThumb)) {
553
             var resource = Strophe.getResourceFromJid(jid);
552
             var resource = Strophe.getResourceFromJid(jid);
554
 
553
 
555
             VideoLayout.ensurePeerContainerExists(jid);
554
             VideoLayout.ensurePeerContainerExists(jid);
556
-            remoteVideos[resource].showVideoIndicator(value);
555
+            var remoteVideo = remoteVideos[resource];
556
+            remoteVideo.showVideoIndicator(value);
557
 
557
 
558
-            var el = VideoLayout.getPeerVideoSel(resource);
558
+            var el = remoteVideo.selectVideoElement();
559
             if (!value)
559
             if (!value)
560
                 el.show();
560
                 el.show();
561
             else
561
             else
587
         if (resourceJid === APP.xmpp.myResource())
587
         if (resourceJid === APP.xmpp.myResource())
588
             return;
588
             return;
589
 
589
 
590
+        var remoteVideo = remoteVideos[resourceJid];
590
         var members = APP.xmpp.getMembers();
591
         var members = APP.xmpp.getMembers();
591
         // Update the current dominant speaker.
592
         // Update the current dominant speaker.
592
         if (resourceJid !== currentDominantSpeaker) {
593
         if (resourceJid !== currentDominantSpeaker) {
593
             var currentJID = APP.xmpp.findJidFromResource(currentDominantSpeaker);
594
             var currentJID = APP.xmpp.findJidFromResource(currentDominantSpeaker);
594
             var newJID = APP.xmpp.findJidFromResource(resourceJid);
595
             var newJID = APP.xmpp.findJidFromResource(resourceJid);
595
-            if(currentDominantSpeaker && (!members || !members[currentJID] ||
596
-                !members[currentJID].displayName) && remoteVideos[resourceJid]) {
597
-                remoteVideos[resourceJid].setDisplayName(null);
596
+            if (currentDominantSpeaker && (!members || !members[currentJID] ||
597
+                !members[currentJID].displayName) && remoteVideo) {
598
+                remoteVideo.setDisplayName(null);
598
             }
599
             }
599
-            if(resourceJid && (!members || !members[newJID] ||
600
-                !members[newJID].displayName) && remoteVideos[resourceJid]) {
601
-                remoteVideos[resourceJid].setDisplayName(null,
600
+            if (resourceJid && (!members || !members[newJID] ||
601
+                !members[newJID].displayName) && remoteVideo) {
602
+                remoteVideo.setDisplayName(null,
602
                     interfaceConfig.DEFAULT_DOMINANT_SPEAKER_DISPLAY_NAME);
603
                     interfaceConfig.DEFAULT_DOMINANT_SPEAKER_DISPLAY_NAME);
603
             }
604
             }
604
             currentDominantSpeaker = resourceJid;
605
             currentDominantSpeaker = resourceJid;
606
             return;
607
             return;
607
         }
608
         }
608
 
609
 
610
+        if (!remoteVideo)
611
+            return;
612
+
609
         // Obtain container for new dominant speaker.
613
         // Obtain container for new dominant speaker.
610
-        var videoSel  = VideoLayout.getPeerVideoSel(resourceJid);
614
+        var videoSel  = remoteVideo.selectVideoElement();
611
 
615
 
612
         // Local video will not have container found, but that's ok
616
         // Local video will not have container found, but that's ok
613
         // since we don't want to switch to local video.
617
         // since we don't want to switch to local video.
706
             endpointsEnteringLastN.forEach(function (resourceJid) {
710
             endpointsEnteringLastN.forEach(function (resourceJid) {
707
 
711
 
708
                 var isVisible = $('#participant_' + resourceJid).is(':visible');
712
                 var isVisible = $('#participant_' + resourceJid).is(':visible');
709
-                remoteVideos[resourceJid].showPeerContainer('show');
713
+                var remoteVideo = remoteVideos[resourceJid];
714
+                remoteVideo.showPeerContainer('show');
710
                 if (!isVisible) {
715
                 if (!isVisible) {
711
                     console.log("Add to last N", resourceJid);
716
                     console.log("Add to last N", resourceJid);
712
 
717
 
713
                     var jid = APP.xmpp.findJidFromResource(resourceJid);
718
                     var jid = APP.xmpp.findJidFromResource(resourceJid);
714
                     var mediaStream =
719
                     var mediaStream =
715
                         APP.RTC.remoteStreams[jid][MediaStreamType.VIDEO_TYPE];
720
                         APP.RTC.remoteStreams[jid][MediaStreamType.VIDEO_TYPE];
716
-                    var sel = VideoLayout.getPeerVideoSel(resourceJid);
721
+                    var sel = remoteVideo.selectVideoElement();
717
 
722
 
718
                     APP.RTC.attachMediaStream(sel, mediaStream.stream);
723
                     APP.RTC.attachMediaStream(sel, mediaStream.stream);
719
                     if (lastNPickupJid == mediaStream.peerjid) {
724
                     if (lastNPickupJid == mediaStream.peerjid) {

正在加载...
取消
保存