diff --git a/modules/UI/videolayout/SmallVideo.js b/modules/UI/videolayout/SmallVideo.js index f13c4c656..651a499aa 100644 --- a/modules/UI/videolayout/SmallVideo.js +++ b/modules/UI/videolayout/SmallVideo.js @@ -520,40 +520,33 @@ SmallVideo.prototype.isVideoPlayable = function() { * @return {number} one of DISPLAY_VIDEO,DISPLAY_AVATAR * or DISPLAY_BLACKNESS_WITH_NAME. */ -SmallVideo.prototype.selectDisplayMode = function() { - const isAudioOnly = APP.conference.isAudioOnly(); - const tileViewEnabled = shouldDisplayTileView(APP.store.getState()); - const isVideoPlayable = this.isVideoPlayable(); - const hasVideo = Boolean(this.selectVideoElement().length); +SmallVideo.prototype.selectDisplayMode = function(input) { // Display name is always and only displayed when user is on the stage - if (this.isCurrentlyOnLargeVideo() && !tileViewEnabled) { - return isVideoPlayable && !isAudioOnly ? DISPLAY_BLACKNESS_WITH_NAME : DISPLAY_AVATAR_WITH_NAME; - } else if (isVideoPlayable && hasVideo && !isAudioOnly) { + if (input.isCurrentlyOnLargeVideo && !input.tileViewEnabled) { + return input.isVideoPlayable && !input.isAudioOnly ? DISPLAY_BLACKNESS_WITH_NAME : DISPLAY_AVATAR_WITH_NAME; + } else if (input.isVideoPlayable && input.hasVideo && !input.isAudioOnly) { // check hovering and change state to video with name - return this._isHovered() ? DISPLAY_VIDEO_WITH_NAME : DISPLAY_VIDEO; + return input.isHovered ? DISPLAY_VIDEO_WITH_NAME : DISPLAY_VIDEO; } // check hovering and change state to avatar with name - return this._isHovered() ? DISPLAY_AVATAR_WITH_NAME : DISPLAY_AVATAR; + return input.isHovered ? DISPLAY_AVATAR_WITH_NAME : DISPLAY_AVATAR; }; /** - * Prints information about the current display mode. + * Computes information that determine the display mode. * - * @param {string} mode - The current mode. - * @returns {void} + * @returns {Object} */ -SmallVideo.prototype._printDisplayModeInfo = function(mode) { - const isAudioOnly = APP.conference.isAudioOnly(); - const tileViewEnabled = shouldDisplayTileView(APP.store.getState()); - const isVideoPlayable = this.isVideoPlayable(); - const hasVideo = Boolean(this.selectVideoElement().length); - const displayModeInfo = { - isAudioOnly, - tileViewEnabled, - isVideoPlayable, - hasVideo, +SmallVideo.prototype.computeDisplayModeInput = function() { + return { + isCurrentlyOnLargeVideo: this.isCurrentlyOnLargeVideo(), + isHovered: this._isHovered(), + isAudioOnly: APP.conference.isAudioOnly(), + tileViewEnabled: shouldDisplayTileView(APP.store.getState()), + isVideoPlayable: this.isVideoPlayable(), + hasVideo: Boolean(this.selectVideoElement().length), connectionStatus: APP.conference.getParticipantConnectionStatus(this.id), mutedWhileDisconnected: this.mutedWhileDisconnected, wasVideoPlayed: this.wasVideoPlayed, @@ -561,8 +554,6 @@ SmallVideo.prototype._printDisplayModeInfo = function(mode) { isVideoMuted: this.isVideoMuted, videoStreamMuted: this.videoStream ? this.videoStream.isMuted() : 'no stream' }; - - logger.debug(`Displaying ${mode} for ${this.id}, reason: [${JSON.stringify(displayModeInfo)}]`); }; /** @@ -596,8 +587,10 @@ SmallVideo.prototype.updateView = function() { const oldDisplayMode = this.displayMode; let displayModeString = ''; + const displayModeInput = this.computeDisplayModeInput(); + // Determine whether video, avatar or blackness should be displayed - this.displayMode = this.selectDisplayMode(); + this.displayMode = this.selectDisplayMode(displayModeInput); switch (this.displayMode) { case DISPLAY_AVATAR_WITH_NAME: @@ -624,7 +617,7 @@ SmallVideo.prototype.updateView = function() { } if (this.displayMode !== oldDisplayMode) { - this._printDisplayModeInfo(displayModeString); + logger.debug(`Displaying ${displayModeString} for ${this.id}, reason: [${JSON.stringify(displayModeInput)}]`); } };