Extract shouldRenderParticipantVideo from ParticipantView
This commit is contained in:
parent
1b59b21fa8
commit
f2b2cfda44
|
@ -9,7 +9,6 @@ import { translate } from '../../i18n';
|
||||||
import { JitsiParticipantConnectionStatus } from '../../lib-jitsi-meet';
|
import { JitsiParticipantConnectionStatus } from '../../lib-jitsi-meet';
|
||||||
import {
|
import {
|
||||||
MEDIA_TYPE,
|
MEDIA_TYPE,
|
||||||
shouldRenderVideoTrack,
|
|
||||||
VideoTrack
|
VideoTrack
|
||||||
} from '../../media';
|
} from '../../media';
|
||||||
import { Container, TintedView } from '../../react';
|
import { Container, TintedView } from '../../react';
|
||||||
|
@ -20,7 +19,8 @@ import Avatar from './Avatar';
|
||||||
import {
|
import {
|
||||||
getAvatarURL,
|
getAvatarURL,
|
||||||
getParticipantById,
|
getParticipantById,
|
||||||
getParticipantDisplayName
|
getParticipantDisplayName,
|
||||||
|
shouldRenderParticipantVideo
|
||||||
} from '../functions';
|
} from '../functions';
|
||||||
import styles from './styles';
|
import styles from './styles';
|
||||||
|
|
||||||
|
@ -29,14 +29,6 @@ import styles from './styles';
|
||||||
*/
|
*/
|
||||||
type Props = {
|
type Props = {
|
||||||
|
|
||||||
/**
|
|
||||||
* The indicator which determines whether conferencing is in audio-only
|
|
||||||
* mode.
|
|
||||||
*
|
|
||||||
* @private
|
|
||||||
*/
|
|
||||||
_audioOnly: boolean,
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* The source (e.g. URI, URL) of the avatar image of the participant with
|
* The source (e.g. URI, URL) of the avatar image of the participant with
|
||||||
* {@link #participantId}.
|
* {@link #participantId}.
|
||||||
|
@ -61,6 +53,11 @@ type Props = {
|
||||||
*/
|
*/
|
||||||
_participantName: string,
|
_participantName: string,
|
||||||
|
|
||||||
|
/**
|
||||||
|
* True if the video should be rendered, false otherwise.
|
||||||
|
*/
|
||||||
|
_renderVideo: boolean,
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* The video Track of the participant with {@link #participantId}.
|
* The video Track of the participant with {@link #participantId}.
|
||||||
*/
|
*/
|
||||||
|
@ -192,23 +189,11 @@ class ParticipantView extends Component<Props> {
|
||||||
onPress,
|
onPress,
|
||||||
_avatar: avatar,
|
_avatar: avatar,
|
||||||
_connectionStatus: connectionStatus,
|
_connectionStatus: connectionStatus,
|
||||||
|
_renderVideo: renderVideo,
|
||||||
_videoTrack: videoTrack
|
_videoTrack: videoTrack
|
||||||
} = this.props;
|
} = this.props;
|
||||||
|
|
||||||
// Is the video to be rendered?
|
|
||||||
// FIXME It's currently impossible to have true as the value of
|
|
||||||
// waitForVideoStarted because videoTrack's state videoStarted will be
|
|
||||||
// updated only after videoTrack is rendered.
|
|
||||||
// XXX Note that, unlike on web, we don't render video when the
|
|
||||||
// connection status is interrupted, this is because the renderer
|
|
||||||
// doesn't retain the last frame forever, so we would end up with a
|
|
||||||
// black screen.
|
|
||||||
const waitForVideoStarted = false;
|
const waitForVideoStarted = false;
|
||||||
const renderVideo
|
|
||||||
= !this.props._audioOnly
|
|
||||||
&& (connectionStatus
|
|
||||||
=== JitsiParticipantConnectionStatus.ACTIVE)
|
|
||||||
&& shouldRenderVideoTrack(videoTrack, waitForVideoStarted);
|
|
||||||
|
|
||||||
// Is the avatar to be rendered?
|
// Is the avatar to be rendered?
|
||||||
const renderAvatar = Boolean(!renderVideo && avatar);
|
const renderAvatar = Boolean(!renderVideo && avatar);
|
||||||
|
@ -271,10 +256,10 @@ class ParticipantView extends Component<Props> {
|
||||||
* associated (instance of) {@code ParticipantView}.
|
* associated (instance of) {@code ParticipantView}.
|
||||||
* @private
|
* @private
|
||||||
* @returns {{
|
* @returns {{
|
||||||
* _audioOnly: boolean,
|
|
||||||
* _avatar: string,
|
* _avatar: string,
|
||||||
* _connectionStatus: string,
|
* _connectionStatus: string,
|
||||||
* _participantName: string,
|
* _participantName: string,
|
||||||
|
* _renderVideo: boolean,
|
||||||
* _videoTrack: Track
|
* _videoTrack: Track
|
||||||
* }}
|
* }}
|
||||||
*/
|
*/
|
||||||
|
@ -308,12 +293,12 @@ function _mapStateToProps(state, ownProps) {
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
_audioOnly: state['features/base/conference'].audioOnly,
|
|
||||||
_avatar: avatar,
|
_avatar: avatar,
|
||||||
_connectionStatus:
|
_connectionStatus:
|
||||||
connectionStatus
|
connectionStatus
|
||||||
|| JitsiParticipantConnectionStatus.ACTIVE,
|
|| JitsiParticipantConnectionStatus.ACTIVE,
|
||||||
_participantName: participantName,
|
_participantName: participantName,
|
||||||
|
_renderVideo: shouldRenderParticipantVideo(state, participantId),
|
||||||
_videoTrack:
|
_videoTrack:
|
||||||
getTrackByMediaTypeAndParticipant(
|
getTrackByMediaTypeAndParticipant(
|
||||||
state['features/base/tracks'],
|
state['features/base/tracks'],
|
||||||
|
|
|
@ -3,6 +3,10 @@ import { getAvatarURL as _getAvatarURL } from 'js-utils/avatar';
|
||||||
|
|
||||||
import { toState } from '../redux';
|
import { toState } from '../redux';
|
||||||
|
|
||||||
|
import { JitsiParticipantConnectionStatus } from '../lib-jitsi-meet';
|
||||||
|
import { MEDIA_TYPE, shouldRenderVideoTrack } from '../media';
|
||||||
|
import { getTrackByMediaTypeAndParticipant } from '../tracks';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
DEFAULT_AVATAR_RELATIVE_PATH,
|
DEFAULT_AVATAR_RELATIVE_PATH,
|
||||||
LOCAL_PARTICIPANT_DEFAULT_ID,
|
LOCAL_PARTICIPANT_DEFAULT_ID,
|
||||||
|
@ -121,7 +125,8 @@ export function getNormalizedDisplayName(name: string) {
|
||||||
* @private
|
* @private
|
||||||
* @returns {(Participant|undefined)}
|
* @returns {(Participant|undefined)}
|
||||||
*/
|
*/
|
||||||
export function getParticipantById(stateful: Object | Function, id: string) {
|
export function getParticipantById(
|
||||||
|
stateful: Object | Function, id: string): ?Object {
|
||||||
const participants = _getAllParticipants(stateful);
|
const participants = _getAllParticipants(stateful);
|
||||||
|
|
||||||
return participants.find(p => p.id === id);
|
return participants.find(p => p.id === id);
|
||||||
|
@ -276,3 +281,45 @@ export function isLocalParticipantModerator(stateful: Object | Function) {
|
||||||
&& (!state['features/base/config'].enableUserRolesBasedOnToken
|
&& (!state['features/base/config'].enableUserRolesBasedOnToken
|
||||||
|| !state['features/base/jwt'].isGuest));
|
|| !state['features/base/jwt'].isGuest));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Returns true if the video of the participant should be rendered.
|
||||||
|
*
|
||||||
|
* @param {Object|Function} stateful - Object or function that can be resolved
|
||||||
|
* to the Redux state.
|
||||||
|
* @param {string} id - The ID of the participant.
|
||||||
|
* @returns {boolean}
|
||||||
|
*/
|
||||||
|
export function shouldRenderParticipantVideo(
|
||||||
|
stateful: Object | Function, id: string) {
|
||||||
|
const state = toState(stateful);
|
||||||
|
const participant = getParticipantById(state, id);
|
||||||
|
|
||||||
|
if (!participant) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
const audioOnly = state['features/base/conference'].audioOnly;
|
||||||
|
const connectionStatus = participant.connectionStatus
|
||||||
|
|| JitsiParticipantConnectionStatus.ACTIVE;
|
||||||
|
const videoTrack = getTrackByMediaTypeAndParticipant(
|
||||||
|
state['features/base/tracks'],
|
||||||
|
MEDIA_TYPE.VIDEO,
|
||||||
|
id);
|
||||||
|
|
||||||
|
// Is the video to be rendered?
|
||||||
|
// FIXME It's currently impossible to have true as the value of
|
||||||
|
// waitForVideoStarted because videoTrack's state videoStarted will be
|
||||||
|
// updated only after videoTrack is rendered.
|
||||||
|
// XXX Note that, unlike on web, we don't render video when the
|
||||||
|
// connection status is interrupted, this is because the renderer
|
||||||
|
// doesn't retain the last frame forever, so we would end up with a
|
||||||
|
// black screen.
|
||||||
|
const waitForVideoStarted = false;
|
||||||
|
|
||||||
|
return !audioOnly
|
||||||
|
&& (connectionStatus
|
||||||
|
=== JitsiParticipantConnectionStatus.ACTIVE)
|
||||||
|
&& shouldRenderVideoTrack(videoTrack, waitForVideoStarted);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in New Issue