2021-08-23 23:02:41 +00:00
|
|
|
// @flow
|
|
|
|
|
2021-08-20 23:32:38 +00:00
|
|
|
import { getParticipantCountWithFake } from '../base/participants';
|
|
|
|
import { StateListenerRegistry } from '../base/redux';
|
|
|
|
import { getTileViewGridDimensions, shouldDisplayTileView } from '../video-layout';
|
|
|
|
|
|
|
|
import { setTileViewDimensions } from './actions';
|
2021-08-23 23:02:41 +00:00
|
|
|
import './subscriber.any';
|
2021-08-20 23:32:38 +00:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Listens for changes in the number of participants to calculate the dimensions of the tile view grid and the tiles.
|
|
|
|
*/
|
|
|
|
StateListenerRegistry.register(
|
|
|
|
/* selector */ state => {
|
|
|
|
const participantCount = getParticipantCountWithFake(state);
|
|
|
|
|
2021-08-27 21:56:46 +00:00
|
|
|
if (participantCount < 6) { // the dimensions are updated only when the participant count is lower than 6.
|
2021-08-20 23:32:38 +00:00
|
|
|
return participantCount;
|
|
|
|
}
|
|
|
|
|
2021-08-27 21:56:46 +00:00
|
|
|
return 5; // make sure we don't update the dimensions.
|
2021-08-20 23:32:38 +00:00
|
|
|
},
|
|
|
|
/* listener */ (_, store) => {
|
|
|
|
const state = store.getState();
|
|
|
|
|
|
|
|
if (shouldDisplayTileView(state)) {
|
|
|
|
store.dispatch(setTileViewDimensions());
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Listens for changes in the selected layout to calculate the dimensions of the tile view grid and horizontal view.
|
|
|
|
*/
|
|
|
|
StateListenerRegistry.register(
|
|
|
|
/* selector */ state => shouldDisplayTileView(state),
|
|
|
|
/* listener */ (isTileView, store) => {
|
|
|
|
const state = store.getState();
|
|
|
|
|
|
|
|
if (isTileView) {
|
|
|
|
store.dispatch(setTileViewDimensions(getTileViewGridDimensions(state)));
|
|
|
|
}
|
|
|
|
});
|