Matrix/element-call-Github
1
0
Fork 0
mirror of https://github.com/vector-im/element-call.git synced 2024-11-15 00:04:59 +08:00
Code Issues Packages Projects Releases Wiki Activity

Mobile positions, first pass

Browse Source
This commit is contained in:
Robert Long 2021-08-23 23:40:26 -07:00
parent f93103c2a1
commit 618eae64de
1 changed files with 43 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
src/VideoGrid.jsx
View File

@ -38,6 +38,8 @@ function getTilePositions(tileCount, gridBounds) {
const newTilePositions = [];
const { width: gridWidth, height: gridHeight } = gridBounds;
const gap = 8;
let paddingLeft = 8;
let paddingTop = 8;
if (tileCount > 12) {
console.warn("Over 12 tiles is not currently supported");
@ -89,20 +91,54 @@ function getTilePositions(tileCount, gridBounds) {
}
}
let tileHeight = Math.round((gridHeight - gap * (rowCount + 1)) / rowCount);
let tileWidth = Math.round(
const maxTileHeight = Math.round(
(gridHeight - gap * (rowCount + 1)) / rowCount
);
const maxTileWidth = Math.round(
(gridWidth - gap * (columnCount + 1)) / columnCount
);
// TODO Constrain Aspect
let tileHeight = maxTileHeight;
let tileWidth = maxTileWidth;
const tileAspectRatio = tileWidth / tileHeight;
if (tileAspectRatio > 16 / 9) {
tileWidth = (16 * tileHeight) / 9;
if (aspectRatio < 1) {
if (tileCount === 1) {
tileHeight = maxTileHeight;
tileWidth = maxTileWidth;
} else if (tileCount <= 4) {
tileHeight = Math.round((maxTileWidth * 9) / 16);
} else {
tileHeight = tileWidth;
}
} else {
}
const totalHeight = tileHeight * rowCount + gap * (rowCount - 1);
if (totalHeight > gridHeight) {
const overflow = totalHeight - gridHeight;
tileHeight = Math.round(tileHeight - overflow / rowCount);
}
// if (tileAspectRatio > 16 / 9) {
// tileWidth = (16 * tileHeight) / 9;
// }
paddingTop =
(gridHeight - tileHeight * rowCount - gap * (rowCount - 1)) / 2;
paddingLeft =
(gridWidth - tileWidth * columnCount - gap * (columnCount - 1)) / 2;
for (let i = 0; i < tileCount; i++) {
const verticalIndex = Math.floor(i / columnCount);
const top = verticalIndex * tileHeight + (verticalIndex + 1) * gap;
const top = verticalIndex * tileHeight + verticalIndex * gap + paddingTop;
console.log(top);
let rowItemCount;
@ -121,7 +157,8 @@ function getTilePositions(tileCount, gridBounds) {
const left =
tileWidth * horizontalIndex +
rowLeftMargin +
(horizontalIndex + 1) * gap;
horizontalIndex * gap +
paddingLeft;
newTilePositions.push({
width: tileWidth,