xmj/element-call
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Fix order of tiles in 1:1 layout

Browse source
This commit is contained in:
Robin Townsend 2022-05-24 16:54:33 -04:00
parent 426e1a433b
commit 266861bdad
1 changed files with 26 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/video-grid/VideoGrid.jsx
View file

@ -603,7 +603,11 @@ function getSubGridPositions(
return newTilePositions; return newTilePositions;
} }
function reorderTiles(tiles) { function reorderTiles(tiles, layout) {
if (layout === "freedom" && tiles.length === 2) {
// 1:1 layout
tiles.forEach((tile) => tile.order = tile.item.isLocal ? 0 : 1);
} else {
const focusedTiles = []; const focusedTiles = [];
const presenterTiles = []; const presenterTiles = [];
const otherTiles = []; const otherTiles = [];
@ -624,6 +628,7 @@ function reorderTiles(tiles) {
(tile, i) => (tile.order = i) (tile, i) => (tile.order = i)
); );
} }
}
export function VideoGrid({ items, layout, disableAnimations, children }) { export function VideoGrid({ items, layout, disableAnimations, children }) {
// Place the PiP in the bottom right corner by default // Place the PiP in the bottom right corner by default
@ -707,7 +712,7 @@ export function VideoGrid({ items, layout, disableAnimations, children }) {
} }
} }
reorderTiles(newTiles); reorderTiles(newTiles, layout);
if (removedTileKeys.size > 0) { if (removedTileKeys.size > 0) {
setTimeout(() => { setTimeout(() => {
@ -719,7 +724,7 @@ export function VideoGrid({ items, layout, disableAnimations, children }) {
const newTiles = tiles const newTiles = tiles
.filter((tile) => !removedTileKeys.has(tile.key)) .filter((tile) => !removedTileKeys.has(tile.key))
.map((tile) => ({ ...tile })); // clone before reordering .map((tile) => ({ ...tile })); // clone before reordering
reorderTiles(newTiles); reorderTiles(newTiles, layout);
const presenterTileCount = newTiles.reduce( const presenterTileCount = newTiles.reduce(
(count, tile) => count + (tile.focused ? 1 : 0), (count, tile) => count + (tile.focused ? 1 : 0),
@ -873,7 +878,7 @@ export function VideoGrid({ items, layout, disableAnimations, children }) {
return newTile; return newTile;
}); });
reorderTiles(newTiles); reorderTiles(newTiles, layout);
return { return {
...state, ...state,
@ -974,7 +979,7 @@ export function VideoGrid({ items, layout, disableAnimations, children }) {
return { ...tile, order, focused }; return { ...tile, order, focused };
}); });
reorderTiles(newTiles); reorderTiles(newTiles, layout);
setTileState((state) => ({ ...state, tiles: newTiles })); setTileState((state) => ({ ...state, tiles: newTiles }));
} }