Compare commits

...

3 Commits

Author SHA1 Message Date
Horatiu Muresan 44c02d5ebf alpha-sort 2023-01-27 14:37:48 +02:00
Horatiu Muresan 6bcc253145 some improvements 2023-01-26 21:51:20 +02:00
bogdandarie e3f5975433 fix(disableSelfView) enable disable self view when alone in meeting 2023-01-26 12:40:24 +02:00
11 changed files with 53 additions and 31 deletions

View File

@ -14,11 +14,13 @@ import { i18next } from '../../../react/features/base/i18n';
import { JitsiTrackEvents } from '../../../react/features/base/lib-jitsi-meet'; import { JitsiTrackEvents } from '../../../react/features/base/lib-jitsi-meet';
import { VIDEO_TYPE } from '../../../react/features/base/media'; import { VIDEO_TYPE } from '../../../react/features/base/media';
import { import {
getLocalParticipant,
getParticipantById, getParticipantById,
getParticipantDisplayName, getParticipantDisplayName,
isLocalScreenshareParticipant, isLocalScreenshareParticipant,
isScreenShareParticipant isScreenShareParticipant
} from '../../../react/features/base/participants'; } from '../../../react/features/base/participants';
import { getHideSelfView } from '../../../react/features/base/settings/functions.any';
import { import {
getVideoTrackByParticipant, getVideoTrackByParticipant,
trackStreamingStatusChanged trackStreamingStatusChanged
@ -232,6 +234,10 @@ export default class LargeVideoManager {
preUpdate.then(() => { preUpdate.then(() => {
const { id, stream, videoType, resolve } = this.newStreamData; const { id, stream, videoType, resolve } = this.newStreamData;
const state = APP.store.getState();
const shouldHideSelfView = getHideSelfView(state);
const localId = getLocalParticipant(state)?.id;
// FIXME this does not really make sense, because the videoType // FIXME this does not really make sense, because the videoType
// (camera or desktop) is a completely different thing than // (camera or desktop) is a completely different thing than
@ -245,13 +251,16 @@ export default class LargeVideoManager {
// eslint-disable-next-line no-shadow // eslint-disable-next-line no-shadow
const container = this.getCurrentContainer(); const container = this.getCurrentContainer();
if (shouldHideSelfView && localId === id) {
return container.hide();
}
container.setStream(id, stream, videoType); container.setStream(id, stream, videoType);
// change the avatar url on large // change the avatar url on large
this.updateAvatar(); this.updateAvatar();
const isVideoMuted = !stream || stream.isMuted(); const isVideoMuted = !stream || stream.isMuted();
const state = APP.store.getState();
const participant = getParticipantById(state, id); const participant = getParticipantById(state, id);
const videoTrack = getVideoTrackByParticipant(state, participant); const videoTrack = getVideoTrackByParticipant(state, participant);

View File

@ -3,7 +3,6 @@ import { IStateful } from '../app/types';
import CONFIG_WHITELIST from '../config/configWhitelist'; import CONFIG_WHITELIST from '../config/configWhitelist';
import { IConfigState } from '../config/reducer'; import { IConfigState } from '../config/reducer';
import { IJwtState } from '../jwt/reducer'; import { IJwtState } from '../jwt/reducer';
import { getParticipantCount } from '../participants/functions';
import { toState } from '../redux/functions'; import { toState } from '../redux/functions';
import { parseURLParams } from '../util/parseURLParams'; import { parseURLParams } from '../util/parseURLParams';
@ -114,16 +113,6 @@ export function shouldHideShareAudioHelper(state: IReduxState): boolean | undefi
return state['features/base/settings'].hideShareAudioHelper; return state['features/base/settings'].hideShareAudioHelper;
} }
/**
* Whether we should hide self view.
*
* @param {Object} state - Redux state.
* @returns {boolean}
*/
export function shouldHideSelfView(state: IReduxState) {
return getParticipantCount(state) === 1 ? false : getHideSelfView(state);
}
/** /**
* Gets the disable self view setting. * Gets the disable self view setting.
* *

View File

@ -5,7 +5,7 @@ import {
getParticipantById, getParticipantById,
getRemoteParticipantCountWithFake getRemoteParticipantCountWithFake
} from '../base/participants/functions'; } from '../base/participants/functions';
import { shouldHideSelfView } from '../base/settings/functions.web'; import { getHideSelfView } from '../base/settings/functions.any';
import { getMaxColumnCount } from '../video-layout/functions.web'; import { getMaxColumnCount } from '../video-layout/functions.web';
import { import {
@ -146,7 +146,7 @@ export function setVerticalViewDimensions() {
const state = getState(); const state = getState();
const { clientHeight = 0, clientWidth = 0 } = state['features/base/responsive-ui']; const { clientHeight = 0, clientWidth = 0 } = state['features/base/responsive-ui'];
const { width: filmstripWidth } = state['features/filmstrip']; const { width: filmstripWidth } = state['features/filmstrip'];
const disableSelfView = shouldHideSelfView(state); const disableSelfView = getHideSelfView(state);
const resizableFilmstrip = isFilmstripResizable(state); const resizableFilmstrip = isFilmstripResizable(state);
const _verticalViewGrid = showGridInVerticalView(state); const _verticalViewGrid = showGridInVerticalView(state);
const numberOfRemoteParticipants = getRemoteParticipantCountWithFake(state); const numberOfRemoteParticipants = getRemoteParticipantCountWithFake(state);
@ -255,7 +255,7 @@ export function setHorizontalViewDimensions() {
return (dispatch: IStore['dispatch'], getState: IStore['getState']) => { return (dispatch: IStore['dispatch'], getState: IStore['getState']) => {
const state = getState(); const state = getState();
const { clientHeight = 0, clientWidth = 0 } = state['features/base/responsive-ui']; const { clientHeight = 0, clientWidth = 0 } = state['features/base/responsive-ui'];
const disableSelfView = shouldHideSelfView(state); const disableSelfView = getHideSelfView(state);
const thumbnails = calculateThumbnailSizeForHorizontalView(clientHeight); const thumbnails = calculateThumbnailSizeForHorizontalView(clientHeight);
const remoteVideosContainerWidth const remoteVideosContainerWidth
= clientWidth - (disableSelfView ? 0 : thumbnails?.local?.width) - HORIZONTAL_FILMSTRIP_MARGIN; = clientWidth - (disableSelfView ? 0 : thumbnails?.local?.width) - HORIZONTAL_FILMSTRIP_MARGIN;

View File

@ -8,7 +8,7 @@ import { getLocalParticipant } from '../../../base/participants';
import { Platform } from '../../../base/react'; import { Platform } from '../../../base/react';
import { connect } from '../../../base/redux'; import { connect } from '../../../base/redux';
import { ASPECT_RATIO_NARROW } from '../../../base/responsive-ui/constants'; import { ASPECT_RATIO_NARROW } from '../../../base/responsive-ui/constants';
import { shouldHideSelfView } from '../../../base/settings/functions.any'; import { getHideSelfView } from '../../../base/settings/functions.any';
import { isToolboxVisible } from '../../../toolbox/functions'; import { isToolboxVisible } from '../../../toolbox/functions';
import { setVisibleRemoteParticipants } from '../../actions'; import { setVisibleRemoteParticipants } from '../../actions';
import { import {
@ -320,7 +320,7 @@ class Filmstrip extends PureComponent<Props> {
*/ */
function _mapStateToProps(state) { function _mapStateToProps(state) {
const { enabled, remoteParticipants } = state['features/filmstrip']; const { enabled, remoteParticipants } = state['features/filmstrip'];
const disableSelfView = shouldHideSelfView(state); const disableSelfView = getHideSelfView(state);
const showRemoteVideos = shouldRemoteVideosBeVisible(state); const showRemoteVideos = shouldRemoteVideosBeVisible(state);
const responsiveUI = state['features/base/responsive-ui']; const responsiveUI = state['features/base/responsive-ui'];

View File

@ -11,7 +11,7 @@ import type { Dispatch } from 'redux';
import { getLocalParticipant, getParticipantCountWithFake } from '../../../base/participants'; import { getLocalParticipant, getParticipantCountWithFake } from '../../../base/participants';
import { connect } from '../../../base/redux'; import { connect } from '../../../base/redux';
import { shouldHideSelfView } from '../../../base/settings/functions.any'; import { getHideSelfView } from '../../../base/settings/functions.any';
import { setVisibleRemoteParticipants } from '../../actions.web'; import { setVisibleRemoteParticipants } from '../../actions.web';
import Thumbnail from './Thumbnail'; import Thumbnail from './Thumbnail';
@ -283,7 +283,7 @@ class TileView extends PureComponent<Props> {
function _mapStateToProps(state, ownProps) { function _mapStateToProps(state, ownProps) {
const responsiveUi = state['features/base/responsive-ui']; const responsiveUi = state['features/base/responsive-ui'];
const { remoteParticipants, tileViewDimensions } = state['features/filmstrip']; const { remoteParticipants, tileViewDimensions } = state['features/filmstrip'];
const disableSelfView = shouldHideSelfView(state); const disableSelfView = getHideSelfView(state);
const { height } = tileViewDimensions.thumbnailSize; const { height } = tileViewDimensions.thumbnailSize;
const { columns } = tileViewDimensions; const { columns } = tileViewDimensions;

View File

@ -16,7 +16,7 @@ import Icon from '../../../base/icons/components/Icon';
import { IconArrowDown, IconArrowUp } from '../../../base/icons/svg'; import { IconArrowDown, IconArrowUp } from '../../../base/icons/svg';
import { IParticipant } from '../../../base/participants/types'; import { IParticipant } from '../../../base/participants/types';
import { connect } from '../../../base/redux/functions'; import { connect } from '../../../base/redux/functions';
import { shouldHideSelfView } from '../../../base/settings/functions.web'; import { getHideSelfView } from '../../../base/settings/functions.any';
import { showToolbox } from '../../../toolbox/actions.web'; import { showToolbox } from '../../../toolbox/actions.web';
import { isButtonEnabled, isToolboxVisible } from '../../../toolbox/functions.web'; import { isButtonEnabled, isToolboxVisible } from '../../../toolbox/functions.web';
import { LAYOUTS } from '../../../video-layout/constants'; import { LAYOUTS } from '../../../video-layout/constants';
@ -877,7 +877,7 @@ function _mapStateToProps(state: IReduxState, ownProps: Partial<IProps>) {
const reduceHeight = state['features/toolbox'].visible && toolbarButtons.length; const reduceHeight = state['features/toolbox'].visible && toolbarButtons.length;
const remoteVideosVisible = shouldRemoteVideosBeVisible(state); const remoteVideosVisible = shouldRemoteVideosBeVisible(state);
const { isOpen: shiftRight } = state['features/chat']; const { isOpen: shiftRight } = state['features/chat'];
const disableSelfView = shouldHideSelfView(state); const disableSelfView = getHideSelfView(state);
const { clientWidth, clientHeight } = state['features/base/responsive-ui']; const { clientWidth, clientHeight } = state['features/base/responsive-ui'];
const collapseTileView = reduceHeight const collapseTileView = reduceHeight

View File

@ -4,7 +4,7 @@ import { shouldComponentUpdate } from 'react-window';
import { getLocalParticipant } from '../../../base/participants'; import { getLocalParticipant } from '../../../base/participants';
import { connect } from '../../../base/redux'; import { connect } from '../../../base/redux';
import { shouldHideSelfView } from '../../../base/settings/functions.any'; import { getHideSelfView } from '../../../base/settings/functions.any';
import { LAYOUTS, getCurrentLayout } from '../../../video-layout'; import { LAYOUTS, getCurrentLayout } from '../../../video-layout';
import { FILMSTRIP_TYPE, TILE_ASPECT_RATIO, TILE_HORIZONTAL_MARGIN } from '../../constants'; import { FILMSTRIP_TYPE, TILE_ASPECT_RATIO, TILE_HORIZONTAL_MARGIN } from '../../constants';
import { getActiveParticipantsIds, showGridInVerticalView } from '../../functions'; import { getActiveParticipantsIds, showGridInVerticalView } from '../../functions';
@ -152,7 +152,7 @@ function _mapStateToProps(state, ownProps) {
const _currentLayout = getCurrentLayout(state); const _currentLayout = getCurrentLayout(state);
const { remoteParticipants: remote } = state['features/filmstrip']; const { remoteParticipants: remote } = state['features/filmstrip'];
const activeParticipants = getActiveParticipantsIds(state); const activeParticipants = getActiveParticipantsIds(state);
const disableSelfView = shouldHideSelfView(state); const disableSelfView = getHideSelfView(state);
const _verticalViewGrid = showGridInVerticalView(state); const _verticalViewGrid = showGridInVerticalView(state);
const filmstripType = ownProps.data?.filmstripType; const filmstripType = ownProps.data?.filmstripType;
const stageFilmstrip = filmstripType === FILMSTRIP_TYPE.STAGE; const stageFilmstrip = filmstripType === FILMSTRIP_TYPE.STAGE;

View File

@ -10,7 +10,7 @@ import {
import Platform from '../base/react/Platform.native'; import Platform from '../base/react/Platform.native';
import { toState } from '../base/redux/functions'; import { toState } from '../base/redux/functions';
import { ASPECT_RATIO_NARROW } from '../base/responsive-ui/constants'; import { ASPECT_RATIO_NARROW } from '../base/responsive-ui/constants';
import { shouldHideSelfView } from '../base/settings/functions.native'; import { getHideSelfView } from '../base/settings/functions.any';
// eslint-disable-next-line lines-around-comment // eslint-disable-next-line lines-around-comment
// @ts-ignore // @ts-ignore
import conferenceStyles from '../conference/components/native/styles'; import conferenceStyles from '../conference/components/native/styles';
@ -104,7 +104,7 @@ export function getPinnedActiveParticipants(_state: any) {
*/ */
export function getTileViewParticipantCount(stateful: IStateful) { export function getTileViewParticipantCount(stateful: IStateful) {
const state = toState(stateful); const state = toState(stateful);
const disableSelfView = shouldHideSelfView(state); const disableSelfView = getHideSelfView(state);
const localParticipant = getLocalParticipant(state); const localParticipant = getLocalParticipant(state);
const participantCount = getParticipantCountWithFake(state) - (disableSelfView && localParticipant ? 1 : 0); const participantCount = getParticipantCountWithFake(state) - (disableSelfView && localParticipant ? 1 : 0);
@ -152,7 +152,7 @@ export function isFilmstripScrollVisible(state: IReduxState) {
const { aspectRatio, clientWidth, clientHeight, safeAreaInsets = {} } = state['features/base/responsive-ui']; const { aspectRatio, clientWidth, clientHeight, safeAreaInsets = {} } = state['features/base/responsive-ui'];
const isNarrowAspectRatio = aspectRatio === ASPECT_RATIO_NARROW; const isNarrowAspectRatio = aspectRatio === ASPECT_RATIO_NARROW;
const disableSelfView = shouldHideSelfView(state); const disableSelfView = getHideSelfView(state);
const localParticipant = Boolean(getLocalParticipant(state)); const localParticipant = Boolean(getLocalParticipant(state));
const localParticipantVisible = localParticipant && !disableSelfView; const localParticipantVisible = localParticipant && !disableSelfView;
const participantCount const participantCount

View File

@ -11,7 +11,7 @@ import {
isScreenShareParticipant isScreenShareParticipant
} from '../base/participants/functions'; } from '../base/participants/functions';
import { toState } from '../base/redux/functions'; import { toState } from '../base/redux/functions';
import { shouldHideSelfView } from '../base/settings/functions.web'; import { getHideSelfView } from '../base/settings/functions.any';
import { import {
getVideoTrackByParticipant, getVideoTrackByParticipant,
isLocalTrackMuted, isLocalTrackMuted,
@ -218,7 +218,7 @@ export function getTileDefaultAspectRatio(disableResponsiveTiles: boolean,
*/ */
export function getNumberOfPartipantsForTileView(state: IReduxState) { export function getNumberOfPartipantsForTileView(state: IReduxState) {
const { iAmRecorder } = state['features/base/config']; const { iAmRecorder } = state['features/base/config'];
const disableSelfView = shouldHideSelfView(state); const disableSelfView = getHideSelfView(state);
const { localScreenShare } = state['features/base/participants']; const { localScreenShare } = state['features/base/participants'];
const localParticipantsCount = localScreenShare ? 2 : 1; const localParticipantsCount = localScreenShare ? 2 : 1;
const numberOfParticipants = getParticipantCountWithFake(state) const numberOfParticipants = getParticipantCountWithFake(state)

View File

@ -2,7 +2,7 @@ import { pinParticipant } from '../base/participants/actions';
import { getParticipantCountWithFake } from '../base/participants/functions'; import { getParticipantCountWithFake } from '../base/participants/functions';
import StateListenerRegistry from '../base/redux/StateListenerRegistry'; import StateListenerRegistry from '../base/redux/StateListenerRegistry';
import { clientResized, setNarrowLayout } from '../base/responsive-ui/actions'; import { clientResized, setNarrowLayout } from '../base/responsive-ui/actions';
import { shouldHideSelfView } from '../base/settings/functions.web'; import { getHideSelfView } from '../base/settings/functions.any';
import { selectParticipantInLargeVideo } from '../large-video/actions.any'; import { selectParticipantInLargeVideo } from '../large-video/actions.any';
import { getParticipantsPaneOpen } from '../participants-pane/functions'; import { getParticipantsPaneOpen } from '../participants-pane/functions';
import { setOverflowDrawer } from '../toolbox/actions.web'; import { setOverflowDrawer } from '../toolbox/actions.web';
@ -37,7 +37,7 @@ StateListenerRegistry.register(
/* selector */ state => { /* selector */ state => {
return { return {
numberOfParticipants: getParticipantCountWithFake(state), numberOfParticipants: getParticipantCountWithFake(state),
disableSelfView: shouldHideSelfView(state), disableSelfView: getHideSelfView(state),
localScreenShare: state['features/base/participants'].localScreenShare localScreenShare: state['features/base/participants'].localScreenShare
}; };
}, },

View File

@ -7,6 +7,7 @@ import { VIDEO_TYPE } from '../../base/media';
import { getLocalParticipant } from '../../base/participants'; import { getLocalParticipant } from '../../base/participants';
import { Watermarks } from '../../base/react'; import { Watermarks } from '../../base/react';
import { connect } from '../../base/redux'; import { connect } from '../../base/redux';
import { getHideSelfView } from '../../base/settings/functions.any';
import { getVideoTrackByParticipant } from '../../base/tracks'; import { getVideoTrackByParticipant } from '../../base/tracks';
import { setColorAlpha } from '../../base/util'; import { setColorAlpha } from '../../base/util';
import { StageParticipantNameLabel } from '../../display-name'; import { StageParticipantNameLabel } from '../../display-name';
@ -105,6 +106,16 @@ type Props = {
*/ */
_whiteboardEnabled: boolean; _whiteboardEnabled: boolean;
/**
* Whether or not the hideSelfView is enabled.
*/
_hideSelfView: boolean;
/**
* Local Participant id.
*/
_localParticipantId: string;
/** /**
* The Redux dispatch function. * The Redux dispatch function.
*/ */
@ -146,7 +157,13 @@ class LargeVideo extends Component<Props> {
* @inheritdoc * @inheritdoc
*/ */
componentDidUpdate(prevProps: Props) { componentDidUpdate(prevProps: Props) {
const { _visibleFilmstrip, _isScreenSharing, _seeWhatIsBeingShared, _largeVideoParticipantId } = this.props; const {
_visibleFilmstrip,
_isScreenSharing,
_seeWhatIsBeingShared,
_largeVideoParticipantId,
_hideSelfView,
_localParticipantId } = this.props;
if (prevProps._visibleFilmstrip !== _visibleFilmstrip) { if (prevProps._visibleFilmstrip !== _visibleFilmstrip) {
this._updateLayout(); this._updateLayout();
@ -159,6 +176,11 @@ class LargeVideo extends Component<Props> {
if (_isScreenSharing && _seeWhatIsBeingShared) { if (_isScreenSharing && _seeWhatIsBeingShared) {
VideoLayout.updateLargeVideo(_largeVideoParticipantId, true, true); VideoLayout.updateLargeVideo(_largeVideoParticipantId, true, true);
} }
if (_largeVideoParticipantId === _localParticipantId
&& prevProps._hideSelfView !== _hideSelfView) {
VideoLayout.updateLargeVideo(_largeVideoParticipantId, true, false);
}
} }
/** /**
@ -351,9 +373,11 @@ function _mapStateToProps(state) {
_customBackgroundColor: backgroundColor, _customBackgroundColor: backgroundColor,
_customBackgroundImageUrl: backgroundImageUrl, _customBackgroundImageUrl: backgroundImageUrl,
_displayScreenSharingPlaceholder: isLocalScreenshareOnLargeVideo && !seeWhatIsBeingShared && !isOnSpot, _displayScreenSharingPlaceholder: isLocalScreenshareOnLargeVideo && !seeWhatIsBeingShared && !isOnSpot,
_hideSelfView: getHideSelfView(state),
_isChatOpen: isChatOpen, _isChatOpen: isChatOpen,
_isScreenSharing: isLocalScreenshareOnLargeVideo, _isScreenSharing: isLocalScreenshareOnLargeVideo,
_largeVideoParticipantId: largeVideoParticipant?.id, _largeVideoParticipantId: largeVideoParticipant?.id,
_localParticipantId: localParticipantId,
_noAutoPlayVideo: testingConfig?.noAutoPlayVideo, _noAutoPlayVideo: testingConfig?.noAutoPlayVideo,
_resizableFilmstrip: isFilmstripResizable(state), _resizableFilmstrip: isFilmstripResizable(state),
_seeWhatIsBeingShared: seeWhatIsBeingShared, _seeWhatIsBeingShared: seeWhatIsBeingShared,