ref(filmstrip) Remove the option to disable thumbnail re-ordering.
This commit is contained in:
Jaya Allamsetty
parent
146cc2f9c9
commit
aebe4885bb
|
|
@ -65,10 +65,6 @@ var config = {
|
|||
// issues related to insertable streams.
|
||||
// disableE2EE: false,
|
||||
|
||||
// Enables/disables thumbnail reordering in the filmstrip. It is enabled by default unless explicitly
|
||||
// disabled by the below option.
|
||||
// enableThumbnailReordering: true,
|
||||
|
||||
// Enables XMPP WebSocket (as opposed to BOSH) for the given amount of users.
|
||||
// mobileXmppWsThreshold: 10, // enable XMPP WebSockets on mobile for 10% of the users
|
||||
|
||||
|
|
|
|||
|
|
@ -448,7 +448,6 @@ export interface IConfig {
|
|||
callStatsThreshold?: number;
|
||||
capScreenshareBitrate?: number;
|
||||
disableE2EE?: boolean;
|
||||
enableThumbnailReordering?: boolean;
|
||||
mobileXmppWsThreshold?: number;
|
||||
noAutoPlayVideo?: boolean;
|
||||
p2pTestMode?: boolean;
|
||||
|
|
|
|||
|
|
@ -169,11 +169,6 @@ interface IProps extends WithTranslation {
|
|||
*/
|
||||
_thumbnailWidth: number;
|
||||
|
||||
/**
|
||||
* Flag that indicates whether the thumbnails will be reordered.
|
||||
*/
|
||||
_thumbnailsReordered: Boolean;
|
||||
|
||||
/**
|
||||
* Whether or not the filmstrip is top panel.
|
||||
*/
|
||||
|
|
@ -551,11 +546,11 @@ class Filmstrip extends PureComponent <IProps, State> {
|
|||
* @returns {Object}
|
||||
*/
|
||||
_calculateIndices(startIndex: number, stopIndex: number) {
|
||||
const { _currentLayout, _iAmRecorder, _thumbnailsReordered, _disableSelfView } = this.props;
|
||||
const { _currentLayout, _iAmRecorder, _disableSelfView } = this.props;
|
||||
let start = startIndex;
|
||||
let stop = stopIndex;
|
||||
|
||||
if (_thumbnailsReordered && !_disableSelfView) {
|
||||
if (!_disableSelfView) {
|
||||
// In tile view, the indices needs to be offset by 1 because the first thumbnail is that of the local
|
||||
// endpoint. The remote participants start from index 1.
|
||||
if (!_iAmRecorder && _currentLayout === LAYOUTS.TILE_VIEW) {
|
||||
|
|
@ -609,14 +604,13 @@ class Filmstrip extends PureComponent <IProps, State> {
|
|||
_columns,
|
||||
_iAmRecorder,
|
||||
_remoteParticipants,
|
||||
_remoteParticipantsLength,
|
||||
_thumbnailsReordered
|
||||
_remoteParticipantsLength
|
||||
} = this.props;
|
||||
const index = (rowIndex * _columns) + columnIndex;
|
||||
|
||||
// When the thumbnails are reordered, local participant is inserted at index 0.
|
||||
const localIndex = _thumbnailsReordered && !_disableSelfView ? 0 : _remoteParticipantsLength;
|
||||
const remoteIndex = _thumbnailsReordered && !_iAmRecorder && !_disableSelfView ? index - 1 : index;
|
||||
const localIndex = _disableSelfView ? _remoteParticipantsLength : 0;
|
||||
const remoteIndex = !_iAmRecorder && !_disableSelfView ? index - 1 : index;
|
||||
|
||||
if (index > _remoteParticipantsLength - (_iAmRecorder ? 1 : 0)) {
|
||||
return `empty-${index}`;
|
||||
|
|
@ -883,8 +877,7 @@ class Filmstrip extends PureComponent <IProps, State> {
|
|||
function _mapStateToProps(state: IReduxState, ownProps: Partial<IProps>) {
|
||||
const { _hasScroll = false, filmstripType, _topPanelFilmstrip, _remoteParticipants } = ownProps;
|
||||
const toolbarButtons = getToolbarButtons(state);
|
||||
const { testing = {}, iAmRecorder } = state['features/base/config'];
|
||||
const enableThumbnailReordering = testing.enableThumbnailReordering ?? true;
|
||||
const { iAmRecorder } = state['features/base/config'];
|
||||
const { topPanelHeight, topPanelVisible, visible, width: verticalFilmstripWidth } = state['features/filmstrip'];
|
||||
const { localScreenShare } = state['features/base/participants'];
|
||||
const reduceHeight = state['features/toolbox'].visible && toolbarButtons.length;
|
||||
|
|
@ -929,7 +922,6 @@ function _mapStateToProps(state: IReduxState, ownProps: Partial<IProps>) {
|
|||
_maxFilmstripWidth: clientWidth - MIN_STAGE_VIEW_WIDTH,
|
||||
_maxTopPanelHeight: clientHeight - MIN_STAGE_VIEW_HEIGHT,
|
||||
_remoteParticipantsLength: _remoteParticipants?.length,
|
||||
_thumbnailsReordered: enableThumbnailReordering,
|
||||
_topPanelHeight: topPanelHeight.current,
|
||||
_topPanelMaxHeight: topPanelHeight.current || TOP_FILMSTRIP_HEIGHT,
|
||||
_topPanelVisible,
|
||||
|
|
|
|||
|
|
@ -153,9 +153,7 @@ function _mapStateToProps(state, ownProps) {
|
|||
const _currentLayout = getCurrentLayout(state);
|
||||
const { remoteParticipants: remote } = state['features/filmstrip'];
|
||||
const activeParticipants = getActiveParticipantsIds(state);
|
||||
const { testing = {} } = state['features/base/config'];
|
||||
const disableSelfView = shouldHideSelfView(state);
|
||||
const enableThumbnailReordering = testing.enableThumbnailReordering ?? true;
|
||||
const sourceNameSignalingEnabled = getSourceNameSignalingFeatureFlag(state);
|
||||
const _verticalViewGrid = showGridInVerticalView(state);
|
||||
const filmstripType = ownProps.data?.filmstripType;
|
||||
|
|
@ -244,18 +242,18 @@ function _mapStateToProps(state, ownProps) {
|
|||
}
|
||||
|
||||
// When the thumbnails are reordered, local participant is inserted at index 0.
|
||||
const localIndex = enableThumbnailReordering && !disableSelfView ? 0 : remoteParticipantsLength;
|
||||
const localIndex = disableSelfView ? remoteParticipantsLength : 0;
|
||||
|
||||
// Local screen share is inserted at index 1 after the local camera.
|
||||
const localScreenShareIndex = enableThumbnailReordering && !disableSelfView ? 1 : remoteParticipantsLength;
|
||||
const localScreenShareIndex = disableSelfView ? remoteParticipantsLength : 1;
|
||||
|
||||
let remoteIndex;
|
||||
|
||||
if (sourceNameSignalingEnabled) {
|
||||
remoteIndex = enableThumbnailReordering && !iAmRecorder && !disableSelfView
|
||||
remoteIndex = !iAmRecorder && !disableSelfView
|
||||
? index - localParticipantsLength : index;
|
||||
} else {
|
||||
remoteIndex = enableThumbnailReordering && !iAmRecorder && !disableSelfView ? index - 1 : index;
|
||||
remoteIndex = !iAmRecorder && !disableSelfView ? index - 1 : index;
|
||||
}
|
||||
|
||||
if (!iAmRecorder && index === localIndex) {
|
||||
|
|
|
|||
|
|
@ -17,10 +17,9 @@ import { isFilmstripScrollVisible } from './functions';
|
|||
export function updateRemoteParticipants(store: Object, participantId: ?number) {
|
||||
const state = store.getState();
|
||||
let reorderedParticipants = [];
|
||||
|
||||
const { sortedRemoteVirtualScreenshareParticipants } = state['features/base/participants'];
|
||||
|
||||
if (!isReorderingEnabled(state) && !sortedRemoteVirtualScreenshareParticipants.size) {
|
||||
if (!isFilmstripScrollVisible(state) && !sortedRemoteVirtualScreenshareParticipants.size) {
|
||||
if (participantId) {
|
||||
const { remoteParticipants } = state['features/filmstrip'];
|
||||
|
||||
|
|
@ -114,17 +113,3 @@ export function updateRemoteParticipantsOnLeave(store: Object, participantId: ?s
|
|||
reorderedParticipants.delete(participantId)
|
||||
&& store.dispatch(setRemoteParticipants(Array.from(reorderedParticipants)));
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns true if thumbnail reordering is enabled and false otherwise.
|
||||
* Note: The function will return false if all participants are displayed on the screen.
|
||||
*
|
||||
* @param {Object} state - The redux state.
|
||||
* @returns {boolean} - True if thumbnail reordering is enabled and false otherwise.
|
||||
*/
|
||||
export function isReorderingEnabled(state) {
|
||||
const { testing = {} } = state['features/base/config'];
|
||||
const enableThumbnailReordering = testing.enableThumbnailReordering ?? true;
|
||||
|
||||
return enableThumbnailReordering && isFilmstripScrollVisible(state);
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue