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

ref(SmallVideo): figure out what is to be displayed 

At any point of time we display one of the three: video, avatar or
blackness. The purpose of this commit is to make that fact more clear
in the code.
This commit is contained in:
paweldomas 2016-09-19 15:59:56 -05:00
parent 30cb948dcf
commit 40f2c593a2
2 changed files with 69 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
modules/UI/videolayout/RemoteVideo.js
View File

@ -238,6 +238,18 @@ RemoteVideo.prototype.isConnectionActive = function() {
return this.user.isConnectionActive();
};
/**
* The remote video is considered "playable" once the stream has started
* according to the {@link #hasVideoStarted} result.
*
* @inheritdoc
* @override
*/
RemoteVideo.prototype.isVideoPlayable = function () {
return SmallVideo.prototype.isVideoPlayable.call(this)
&& this.hasVideoStarted();
};
/**
* @inheritDoc
*/

81
modules/UI/videolayout/SmallVideo.js
View File

@ -5,6 +5,27 @@ import UIEvents from "../../../service/UI/UIEvents";
const RTCUIHelper = JitsiMeetJS.util.RTCUIHelper;
/**
* Display mode constant used when video is being displayed on the small video.
* @type {number}
* @constant
*/
const DISPLAY_VIDEO = 0;
/**
* Display mode constant used when the user's avatar is being displayed on
* the small video.
* @type {number}
* @constant
*/
const DISPLAY_AVATAR = 1;
/**
* Display mode constant used when neither video nor avatar is being displayed
* on the small video.
* @type {number}
* @constant
*/
const DISPLAY_BLACKNESS = 2;
function SmallVideo(VideoLayout) {
this.isAudioMuted = false;
this.hasAvatar = false;
@ -380,6 +401,36 @@ SmallVideo.prototype.isCurrentlyOnLargeVideo = function () {
return this.VideoLayout.isCurrentlyOnLarge(this.id);
};
/**
* Checks whether there is a playable video stream available for the user
* associated with this <tt>SmallVideo</tt>.
*
* @return {boolean} <tt>true</tt> if there is a playable video stream available
* or <tt>false</tt> otherwise.
*/
SmallVideo.prototype.isVideoPlayable = function() {
return this.videoStream // Is there anything to display ?
&& !this.isVideoMuted && !this.videoStream.isMuted() // Muted ?
&& (this.isLocal || this.VideoLayout.isInLastN(this.id));
};
/**
* Determines what should be display on the thumbnail.
*
* @return {number} one of <tt>DISPLAY_VIDEO</tt>,<tt>DISPLAY_AVATAR</tt>
* or <tt>DISPLAY_BLACKNESS</tt>.
*/
SmallVideo.prototype.selectDisplayMode = function() {
// Display name is always and only displayed when user is on the stage
if (this.isCurrentlyOnLargeVideo()) {
return DISPLAY_BLACKNESS;
} else if (this.isVideoPlayable() && this.selectVideoElement().length) {
return DISPLAY_VIDEO;
} else {
return DISPLAY_AVATAR;
}
};
/**
* Hides or shows the user's avatar.
* This update assumes that large video had been updated and we will
@ -399,30 +450,12 @@ SmallVideo.prototype.updateView = function () {
}
}
let video = this.selectVideoElement();
let avatar = this.$avatar;
var isCurrentlyOnLarge = this.isCurrentlyOnLargeVideo();
var showVideo = !this.isVideoMuted && !isCurrentlyOnLarge;
var showAvatar;
if ((!this.isLocal
&& !this.VideoLayout.isInLastN(this.id))
|| this.isVideoMuted) {
showAvatar = true;
} else {
// We want to show the avatar when the video is muted or not exists
// that is when 'true' or 'null' is returned
showAvatar = !this.videoStream || this.videoStream.isMuted();
}
showAvatar = showAvatar && !isCurrentlyOnLarge;
if (video && video.length > 0) {
setVisibility(video, showVideo);
}
setVisibility(avatar, showAvatar);
// Determine whether video, avatar or blackness should be displayed
let displayMode = this.selectDisplayMode();
// Show/hide video
setVisibility(this.selectVideoElement(), displayMode === DISPLAY_VIDEO);
// Show/hide the avatar
setVisibility(this.$avatar(), displayMode === DISPLAY_AVATAR);
};
SmallVideo.prototype.avatarChanged = function (avatarUrl) {