fix(filmstrip) Save stage filmstrip in settings (#12170)

Add config for stage participants number
Enable stage filmstrip by default
This commit is contained in:
Robert Pintilii 2022-09-15 10:57:48 +03:00 committed by GitHub
parent f0a45a9976
commit f5e60a7ca4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 25 additions and 51 deletions

View File

@ -1441,6 +1441,10 @@ var config = {
// // (displaying multiple participants on stage besides the vertical filmstrip)
// disableStageFilmstrip: false,
// // Default number of participants that can be displayed on stage.
// // The user can change this in settings. Number must be between 1 and 6.
// stageFilmstripParticipants: 1,
// // Disables the top panel (only shown when a user is sharing their screen).
// disableTopPanel: false,

View File

@ -74,6 +74,12 @@ function _setConfig({ dispatch, getState }: IStore, next: Function, action: AnyA
}));
}
if (action.config.filmstrip.stageFilmstripParticipants !== undefined) {
dispatch(updateSettings({
maxStageParticipants: action.config.filmstrip.stageFilmstripParticipants
}));
}
dispatch(updateConfig(config));
// FIXME On Web we rely on the global 'config' variable which gets altered

View File

@ -26,6 +26,7 @@ const DEFAULT_STATE: ISettingsState = {
displayName: undefined,
email: undefined,
localFlipX: true,
maxStageParticipants: 1,
micDeviceId: undefined,
serverURL: undefined,
hideShareAudioHelper: false,
@ -62,6 +63,7 @@ export interface ISettingsState {
email?: string;
hideShareAudioHelper?: boolean;
localFlipX?: boolean;
maxStageParticipants?: number;
micDeviceId?: string | boolean;
serverURL?: string;
soundsIncomingMessage?: boolean;

View File

@ -187,17 +187,6 @@ export const REMOVE_STAGE_PARTICIPANT = 'REMOVE_STAGE_PARTICIPANT';
*/
export const SET_STAGE_PARTICIPANTS = 'SET_STAGE_PARTICIPANTS';
/**
* The type of Redux action which sets the max number of active participants.
* (the participants displayed on the stage filmstrip).
* {
* type: SET_MAX_STAGE_PARTICIPANTS,
* maxParticipants: Number
* }
*/
export const SET_MAX_STAGE_PARTICIPANTS = 'SET_MAX_STAGE_PARTICIPANTS';
/**
* The type of Redux action which toggles the pin state of stage participants.
* {

View File

@ -24,7 +24,6 @@ import {
SET_USER_IS_RESIZING,
SET_VERTICAL_VIEW_DIMENSIONS,
SET_VOLUME,
SET_MAX_STAGE_PARTICIPANTS,
TOGGLE_PIN_STAGE_PARTICIPANT,
CLEAR_STAGE_PARTICIPANTS,
SET_SCREENSHARING_TILE_DIMENSIONS,
@ -514,19 +513,6 @@ export function setStageParticipants(queue) {
};
}
/**
* Sets the max number of participants to be displayed on stage.
*
* @param {number} maxParticipants - Max number of participants.
* @returns {Object}
*/
export function setMaxStageParticipants(maxParticipants) {
return {
type: SET_MAX_STAGE_PARTICIPANTS,
maxParticipants
};
}
/**
* Toggles the pin state of the given participant.
*

View File

@ -751,7 +751,7 @@ export function isStageFilmstripTopPanel(state, minParticipantCount = 0) {
export function isStageFilmstripEnabled(state) {
const { filmstrip } = state['features/base/config'];
return !(filmstrip?.disableStageFilmstrip ?? true) && interfaceConfig.VERTICAL_FILMSTRIP;
return !filmstrip?.disableStageFilmstrip && interfaceConfig.VERTICAL_FILMSTRIP;
}
/**

View File

@ -154,7 +154,8 @@ MiddlewareRegistry.register(store => next => action => {
const { dispatch, getState } = store;
const { participantId, pinned } = action;
const state = getState();
const { activeParticipants, maxStageParticipants } = state['features/filmstrip'];
const { activeParticipants } = state['features/filmstrip'];
const { maxStageParticipants } = state['features/base/settings'];
let queue;
if (activeParticipants.find(p => p.participantId === participantId)) {

View File

@ -16,7 +16,6 @@ import {
SET_VERTICAL_VIEW_DIMENSIONS,
SET_VISIBLE_REMOTE_PARTICIPANTS,
SET_VOLUME,
SET_MAX_STAGE_PARTICIPANTS,
CLEAR_STAGE_PARTICIPANTS,
SET_SCREENSHARING_TILE_DIMENSIONS,
SET_USER_FILMSTRIP_HEIGHT,
@ -56,14 +55,6 @@ const DEFAULT_STATE = {
*/
isResizing: false,
/**
* The current max number of participants to be displayed on the stage filmstrip.
*
* @public
* @type {Number}
*/
maxStageParticipants: 1,
/**
* The custom audio volume levels per participant.
*
@ -216,7 +207,6 @@ export interface IFilmstripState {
remoteVideosContainer?: Dimensions;
};
isResizing: boolean;
maxStageParticipants: number;
participantsVolume: {
[participantId: string]: number;
};
@ -397,12 +387,6 @@ ReducerRegistry.register<IFilmstripState>(
activeParticipants: state.activeParticipants.filter(p => p.participantId !== action.participantId)
};
}
case SET_MAX_STAGE_PARTICIPANTS: {
return {
...state,
maxStageParticipants: action.maxParticipants
};
}
case CLEAR_STAGE_PARTICIPANTS: {
return {
...state,

View File

@ -10,8 +10,9 @@ import {
pinParticipant
} from '../base/participants';
import { MiddlewareRegistry } from '../base/redux';
import { updateSettings } from '../base/settings';
import { setFilmstripVisible } from '../filmstrip';
import { addStageParticipant, setMaxStageParticipants } from '../filmstrip/actions.web';
import { addStageParticipant } from '../filmstrip/actions.web';
import { setTileView } from '../video-layout';
import {
@ -192,7 +193,9 @@ function _onFollowMeCommand(attributes = {}, id, store) {
if (attributes.maxStageParticipants !== undefined
&& oldState.maxStageParticipants !== attributes.maxStageParticipants) {
store.dispatch(setMaxStageParticipants(Number(attributes.maxStageParticipants)));
store.dispatch(updateSettings({
maxStageParticipants: Number(attributes.maxStageParticipants)
}));
}
}

View File

@ -74,7 +74,7 @@ StateListenerRegistry.register(
* Subscribes to changes to the max number of stage participants setting.
*/
StateListenerRegistry.register(
/* selector */ state => state['features/filmstrip'].maxStageParticipants,
/* selector */ state => state['features/base/settings'].maxStageParticipants,
/* listener */ _sendFollowMeCommand);
/**
@ -90,7 +90,7 @@ function _getFollowMeState(state) {
return {
filmstripVisible: state['features/filmstrip'].visible,
maxStageParticipants: stageFilmstrip ? state['features/filmstrip'].maxStageParticipants : undefined,
maxStageParticipants: stageFilmstrip ? state['features/base/settings'].maxStageParticipants : undefined,
nextOnStage: stageFilmstrip ? undefined : pinnedParticipant && pinnedParticipant.id,
pinnedStageParticipants: stageFilmstrip ? JSON.stringify(getPinnedActiveParticipants(state)) : undefined,
sharedDocumentVisible: state['features/etherpad'].editing,

View File

@ -10,7 +10,6 @@ import {
import { openDialog } from '../base/dialog';
import { i18next } from '../base/i18n';
import { updateSettings } from '../base/settings';
import { setMaxStageParticipants } from '../filmstrip/actions.web';
import { setScreenshareFramerate } from '../screen-share/actions';
import {
@ -123,8 +122,8 @@ export function submitMoreTab(newState: Object): Function {
dispatch(updateSettings({ disableSelfView: newState.hideSelfView }));
}
if (Number(newState.maxStageParticipants) !== currentState.maxStageParticipants) {
dispatch(setMaxStageParticipants(Number(newState.maxStageParticipants)));
if (newState.maxStageParticipants !== currentState.maxStageParticipants) {
dispatch(updateSettings({ maxStageParticipants: Number(newState.maxStageParticipants) }));
}
};
}

View File

@ -134,7 +134,7 @@ export function getMoreTabProps(stateful: Object | Function) {
showNotificationsSettings: Object.keys(enabledNotifications).length > 0,
showPrejoinPage: !state['features/base/settings'].userSelectedSkipPrejoin,
showPrejoinSettings: state['features/base/config'].prejoinConfig?.enabled,
maxStageParticipants: state['features/filmstrip'].maxStageParticipants,
maxStageParticipants: state['features/base/settings'].maxStageParticipants,
stageFilmstripEnabled
};
}