fix(rn,filmstrip) simplify code
viewableItems always comes in order and indexes are always ascending. In addition, if the array comes empty (I saw it happen on Android at least, when scrolling like a maniac) we'd calculate the right value, instead of Infinity.
This commit is contained in:
parent
36f604aab8
commit
20a1833c6c
|
@ -170,14 +170,24 @@ class Filmstrip extends PureComponent<Props> {
|
||||||
* @returns {void}
|
* @returns {void}
|
||||||
*/
|
*/
|
||||||
_onViewableItemsChanged({ viewableItems = [] }) {
|
_onViewableItemsChanged({ viewableItems = [] }) {
|
||||||
const indexArray: Array<number> = viewableItems.map(i => i.index);
|
if (!this._separateLocalThumbnail && viewableItems[0]?.index === 0) {
|
||||||
|
// Skip the local thumbnail.
|
||||||
|
viewableItems.shift();
|
||||||
|
}
|
||||||
|
|
||||||
// If the local video placed at the beginning we need to shift the start index of the remoteParticipants array
|
if (viewableItems.length === 0) {
|
||||||
// with 1 because and in the same time we don't need to adjust the end index because the end index will not be
|
// User might be fast-scrolling, it will stabilize.
|
||||||
// included.
|
return;
|
||||||
const startIndex
|
}
|
||||||
= this._separateLocalThumbnail ? Math.min(...indexArray) : Math.max(Math.min(...indexArray) - 1, 0);
|
|
||||||
const endIndex = Math.max(...indexArray) + (this._separateLocalThumbnail ? 1 : 0);
|
let startIndex = viewableItems[0].index;
|
||||||
|
let endIndex = viewableItems[viewableItems.length - 1].index;
|
||||||
|
|
||||||
|
if (!this._separateLocalThumbnail) {
|
||||||
|
// We are off by one in the remote participants array.
|
||||||
|
startIndex -= 1;
|
||||||
|
endIndex -= 1;
|
||||||
|
}
|
||||||
|
|
||||||
this.props.dispatch(setVisibleRemoteParticipants(startIndex, endIndex));
|
this.props.dispatch(setVisibleRemoteParticipants(startIndex, endIndex));
|
||||||
}
|
}
|
||||||
|
|
|
@ -146,13 +146,19 @@ class TileView extends PureComponent<Props> {
|
||||||
* @returns {void}
|
* @returns {void}
|
||||||
*/
|
*/
|
||||||
_onViewableItemsChanged({ viewableItems = [] }: { viewableItems: Array<Object> }) {
|
_onViewableItemsChanged({ viewableItems = [] }: { viewableItems: Array<Object> }) {
|
||||||
const indexArray = viewableItems.map(i => i.index);
|
if (viewableItems[0]?.index === 0) {
|
||||||
|
// Skip the local thumbnail.
|
||||||
|
viewableItems.shift();
|
||||||
|
}
|
||||||
|
|
||||||
// We need to shift the start index of the remoteParticipants array with 1 because of the local video placed
|
if (viewableItems.length === 0) {
|
||||||
// at the beginning and in the same time we don't need to adjust the end index because the end index will not be
|
// User might be fast-scrolling, it will stabilize.
|
||||||
// included.
|
return;
|
||||||
const startIndex = Math.max(Math.min(...indexArray) - 1, 0);
|
}
|
||||||
const endIndex = Math.max(...indexArray);
|
|
||||||
|
// We are off by one in the remote participants array.
|
||||||
|
const startIndex = viewableItems[0].index - 1;
|
||||||
|
const endIndex = viewableItems[viewableItems.length - 1].index - 1;
|
||||||
|
|
||||||
this.props.dispatch(setVisibleRemoteParticipants(startIndex, endIndex));
|
this.props.dispatch(setVisibleRemoteParticipants(startIndex, endIndex));
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue