haskal
/
jiti-meet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

LargeVideo: show watermark even if video is muted

This commit is contained in:
isymchych 2016-02-12 16:47:42 +02:00
parent 401e5e7ae0
commit 24ffc816f4
1 changed files with 44 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
modules/UI/videolayout/LargeVideo.js
View File

@ -170,6 +170,8 @@ class VideoContainer extends LargeContainer {
this.stream = null;
this.videoType = null;
this.isVisible = false;
this.$avatar = $('#dominantSpeaker');
this.$wrapper = $('#largeVideoWrapper');
@ -298,6 +300,14 @@ class VideoContainer extends LargeContainer {
this.$avatar.css("visibility", show ? "visible" : "hidden");
}
/**
* Show or hide watermark.
* @param {boolean} show
*/
showWatermark (show) {
$('.watermark').css('visibility', show ? 'visible' : 'hidden');
}
// We are doing fadeOut/fadeIn animations on parent div which wraps
// largeVideo, because when Temasys plugin is in use it replaces
// <video> elements with plugin <object> tag. In Safari jQuery is
@ -305,27 +315,36 @@ class VideoContainer extends LargeContainer {
// animation effects performed on it directly.
show () {
// its already visible
if (this.isVisible) {
return Promise.resolve();
}
let $wrapper = this.$wrapper;
return new Promise(function(resolve) {
$wrapper.css('visibility', 'visible');
$wrapper.fadeTo(FADE_DURATION_MS, 1, function () {
$('.watermark').css('visibility', 'visible');
return new Promise((resolve) => {
this.$wrapper.css('visibility', 'visible').fadeTo(
FADE_DURATION_MS,
1,
() => {
this.showWatermark(true);
this.isVisible = true;
resolve();
});
}
);
});
}
hide () {
let $wrapper = this.$wrapper;
let id = this.id;
return new Promise(function(resolve) {
// There is no id on initial render
// so first time we hide wrapper immediately
// instead of slowly fading it out.
// This improves startup time.
$wrapper.fadeTo(id ? FADE_DURATION_MS : 1, 0, function () {
$wrapper.css('visibility', 'hidden');
$('.watermark').css('visibility', 'hidden');
// its already hidden
if (!this.isVisible) {
return Promise.resolve();
}
return new Promise((resolve) => {
this.$wrapper.fadeTo(FADE_DURATION_MS, 0, () => {
this.$wrapper.css('visibility', 'hidden');
this.showWatermark(false);
this.isVisible = false;
resolve();
});
});
@ -426,9 +445,16 @@ export default class LargeVideoManager {
// show the avatar on large if needed
this.videoContainer.showAvatar(isVideoMuted);
let promise;
// do not show stream if video is muted
let promise
= isVideoMuted ? Promise.resolve() : this.videoContainer.show();
// but we still should show watermark
if (isVideoMuted) {
this.videoContainer.showWatermark(true);
promise = Promise.resolve();
} else {
promise = this.videoContainer.show();
}
// resolve updateLargeVideo promise after everything is done
promise.then(resolve);