Fixes bugs with thumbnails getting black when prezi is playing or etherpad is viewed.
This commit is contained in:
parent
36065b935c
commit
f0a4c08f26
|
@ -73,8 +73,9 @@ var Avatar = (function(my) {
|
|||
}
|
||||
|
||||
//if the user is the currently focused, the dominant speaker or if
|
||||
//there is no focused and no dominant speaker
|
||||
if (activeSpeakerJid === jid) {
|
||||
//there is no focused and no dominant speaker and the large video is
|
||||
//currently shown
|
||||
if (activeSpeakerJid === jid && VideoLayout.isLargeVideoOnTop()) {
|
||||
setVisibility($("#largeVideo"), !show);
|
||||
setVisibility($('#activeSpeakerAvatar'), show);
|
||||
setVisibility(avatar, false);
|
||||
|
|
|
@ -36,8 +36,6 @@
|
|||
#remoteVideos .videocontainer {
|
||||
display: inline-block;
|
||||
background-color: black;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 45;
|
||||
background-size: contain;
|
||||
border-radius:8px;
|
||||
border: 2px solid #212425;
|
||||
|
@ -376,6 +374,7 @@
|
|||
position: absolute;
|
||||
z-index: 0;
|
||||
border-radius:10px;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#mixedstream {
|
||||
|
|
10
etherpad.js
10
etherpad.js
|
@ -48,29 +48,35 @@ var Etherpad = (function (my) {
|
|||
} else {
|
||||
VideoLayout.setLargeVideoVisible(false);
|
||||
}
|
||||
});
|
||||
|
||||
$('#etherpad>iframe').fadeIn(300, function () {
|
||||
document.body.style.background = '#eeeeee';
|
||||
$('#etherpad>iframe').css({visibility: 'visible'});
|
||||
$('#etherpad').css({zIndex: 2});
|
||||
});
|
||||
});
|
||||
}
|
||||
else if ($('#etherpad>iframe')) {
|
||||
$('#etherpad>iframe').fadeOut(300, function () {
|
||||
$('#etherpad>iframe').css({visibility: 'hidden'});
|
||||
$('#etherpad').css({zIndex: 0});
|
||||
document.body.style.background = 'black';
|
||||
});
|
||||
|
||||
if (!isPresentation) {
|
||||
$('#largeVideo').fadeIn(300, function () {
|
||||
VideoLayout.setLargeVideoVisible(true);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
resize();
|
||||
};
|
||||
|
||||
my.isVisible = function() {
|
||||
var etherpadIframe = $('#etherpad>iframe');
|
||||
return etherpadIframe && etherpadIframe.is(':visible');
|
||||
};
|
||||
|
||||
/**
|
||||
* Resizes the etherpad.
|
||||
*/
|
||||
|
|
20
prezi.js
20
prezi.js
|
@ -13,23 +13,24 @@ var Prezi = (function (my) {
|
|||
* Shows/hides a presentation.
|
||||
*/
|
||||
my.setPresentationVisible = function (visible) {
|
||||
var prezi = $('#presentation>iframe');
|
||||
if (visible) {
|
||||
// Trigger the video.selected event to indicate a change in the
|
||||
// large video.
|
||||
$(document).trigger("video.selected", [true]);
|
||||
|
||||
$('#largeVideo').fadeOut(300, function () {
|
||||
VideoLayout.setLargeVideoVisible(false);
|
||||
$('#presentation>iframe').fadeIn(300, function() {
|
||||
$('#presentation>iframe').css({opacity:'1'});
|
||||
$('#largeVideo').fadeOut(300);
|
||||
prezi.fadeIn(300, function() {
|
||||
prezi.css({opacity:'1'});
|
||||
ToolbarToggler.dockToolbar(true);
|
||||
VideoLayout.setLargeVideoVisible(false);
|
||||
});
|
||||
});
|
||||
$('#activeSpeakerAvatar').css('visibility', 'hidden');
|
||||
}
|
||||
else {
|
||||
if ($('#presentation>iframe').css('opacity') == '1') {
|
||||
$('#presentation>iframe').fadeOut(300, function () {
|
||||
$('#presentation>iframe').css({opacity:'0'});
|
||||
if (prezi.css('opacity') == '1') {
|
||||
prezi.fadeOut(300, function () {
|
||||
prezi.css({opacity:'0'});
|
||||
$('#reloadPresentation').css({display:'none'});
|
||||
$('#largeVideo').fadeIn(300, function() {
|
||||
VideoLayout.setLargeVideoVisible(true);
|
||||
|
@ -332,8 +333,9 @@ var Prezi = (function (my) {
|
|||
* On video selected event.
|
||||
*/
|
||||
$(document).bind('video.selected', function (event, isPresentation) {
|
||||
if (!isPresentation && $('#presentation>iframe'))
|
||||
if (!isPresentation && $('#presentation>iframe')) {
|
||||
Prezi.setPresentationVisible(false);
|
||||
}
|
||||
});
|
||||
|
||||
$(window).resize(function () {
|
||||
|
|
|
@ -310,6 +310,7 @@ var VideoLayout = (function (my) {
|
|||
connection.emuc.findJidFromResource(
|
||||
largeVideoState.userResourceJid));
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
my.handleVideoThumbClicked = function(videoSrc,
|
||||
|
@ -318,7 +319,7 @@ var VideoLayout = (function (my) {
|
|||
// Restore style for previously focused video
|
||||
var oldContainer = null;
|
||||
if(focusedVideoInfo) {
|
||||
var focusResourceJid = focusedVideoInfo.resouceJid;
|
||||
var focusResourceJid = focusedVideoInfo.resourceJid;
|
||||
oldContainer = getParticipantContainer(focusResourceJid);
|
||||
}
|
||||
|
||||
|
@ -354,7 +355,7 @@ var VideoLayout = (function (my) {
|
|||
// Lock new video
|
||||
focusedVideoInfo = {
|
||||
src: videoSrc,
|
||||
resouceJid: resourceJid
|
||||
resourceJid: resourceJid
|
||||
};
|
||||
|
||||
// Update focused/pinned interface.
|
||||
|
@ -368,7 +369,8 @@ var VideoLayout = (function (my) {
|
|||
}
|
||||
}
|
||||
|
||||
if ($('#largeVideo').attr('src') === videoSrc) {
|
||||
if ($('#largeVideo').attr('src') === videoSrc &&
|
||||
VideoLayout.isLargeVideoOnTop()) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
@ -433,15 +435,18 @@ var VideoLayout = (function (my) {
|
|||
$('#largeVideo').css({visibility: 'hidden'});
|
||||
$('.watermark').css({visibility: 'hidden'});
|
||||
VideoLayout.enableDominantSpeaker(resourceJid, false);
|
||||
var focusJid = VideoLayout.getLargeVideoState().userJid;
|
||||
var oldContainer = getParticipantContainer(focusJid);
|
||||
if(focusedVideoInfo) {
|
||||
var focusResourceJid = focusedVideoInfo.resourceJid;
|
||||
var oldContainer = getParticipantContainer(focusResourceJid);
|
||||
|
||||
if (oldContainer) {
|
||||
if (oldContainer && oldContainer.length > 0) {
|
||||
oldContainer.removeClass("videoContainerFocused");
|
||||
}
|
||||
focusedVideoInfo = null;
|
||||
if(focusJid) {
|
||||
Avatar.showUserAvatar(focusJid);
|
||||
if(focusResourceJid) {
|
||||
Avatar.showUserAvatar(
|
||||
connection.emuc.findJidFromResource(focusResourceJid));
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
@ -455,6 +460,10 @@ var VideoLayout = (function (my) {
|
|||
return $('#largeVideo').is(':visible');
|
||||
};
|
||||
|
||||
my.isLargeVideoOnTop = function () {
|
||||
return !Prezi.isPresentationVisible() && !Etherpad.isVisible();
|
||||
};
|
||||
|
||||
/**
|
||||
* Checks if container for participant identified by given peerJid exists
|
||||
* in the document and creates it eventually.
|
||||
|
@ -596,13 +605,14 @@ var VideoLayout = (function (my) {
|
|||
* no actual video).
|
||||
*/
|
||||
var videoThumb = $('#' + container.id + '>video').get(0);
|
||||
|
||||
if (videoThumb)
|
||||
if (videoThumb) {
|
||||
VideoLayout.handleVideoThumbClicked(
|
||||
RTC.getVideoSrc(videoThumb),
|
||||
false,
|
||||
Strophe.getResourceFromJid(peerJid));
|
||||
}
|
||||
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
return false;
|
||||
};
|
||||
|
@ -1098,21 +1108,21 @@ var VideoLayout = (function (my) {
|
|||
|
||||
if (video && video.length > 0) {
|
||||
if (isEnable) {
|
||||
VideoLayout.showDisplayName(videoContainerId, true);
|
||||
var isLargeVideoVisible = VideoLayout.isLargeVideoOnTop();
|
||||
VideoLayout.showDisplayName(videoContainerId, isLargeVideoVisible);
|
||||
|
||||
if (!videoSpan.classList.contains("dominantspeaker"))
|
||||
videoSpan.classList.add("dominantspeaker");
|
||||
|
||||
video.css({visibility: 'hidden'});
|
||||
}
|
||||
else {
|
||||
VideoLayout.showDisplayName(videoContainerId, false);
|
||||
|
||||
if (videoSpan.classList.contains("dominantspeaker"))
|
||||
videoSpan.classList.remove("dominantspeaker");
|
||||
|
||||
video.css({visibility: 'visible'});
|
||||
}
|
||||
|
||||
Avatar.showUserAvatar(
|
||||
connection.emuc.findJidFromResource(resourceJid));
|
||||
}
|
||||
};
|
||||
|
||||
|
@ -1715,12 +1725,13 @@ var VideoLayout = (function (my) {
|
|||
= VideoLayout.getPeerContainerResourceJid(videoParent[0]);
|
||||
|
||||
// Update the large video to the last added video only if there's no
|
||||
// current dominant or focused speaker or update it to the current
|
||||
// dominant speaker.
|
||||
if ((!focusedVideoInfo && !VideoLayout.getDominantSpeakerResourceJid())
|
||||
|| (parentResourceJid
|
||||
&& VideoLayout.getDominantSpeakerResourceJid()
|
||||
=== parentResourceJid)) {
|
||||
// current dominant, focused speaker or prezi playing or update it to
|
||||
// the current dominant speaker.
|
||||
if ((!focusedVideoInfo &&
|
||||
!VideoLayout.getDominantSpeakerResourceJid() &&
|
||||
!Prezi.isPresentationVisible()) ||
|
||||
(parentResourceJid &&
|
||||
VideoLayout.getDominantSpeakerResourceJid() === parentResourceJid)) {
|
||||
VideoLayout.updateLargeVideo(
|
||||
RTC.getVideoSrc(videoelem[0]),
|
||||
1,
|
||||
|
|
Loading…
Reference in New Issue