matty/ncd-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

pl-fe: fix media ratios

Browse Source 
Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
This commit is contained in:
marcin mikołajczak
2024-09-09 11:04:57 +02:00
parent 6d13d26fdb
commit 95be38fde3
2 changed files with 7 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/pl-fe/src/components/media-gallery.tsx
View File

@ -329,9 +329,7 @@ const MediaGallery: React.FC<IMediaGallery> = (props) => {
const style: React.CSSProperties = {};
let itemsDimensions: Dimensions[] = [];
const ratios = Array(size).fill(null).map((_, i) =>
getAspectRatio(media[i]) as number,
);
const ratios = Array(size).fill(null).map((_, i) => getAspectRatio(media[i]));
const [ar1, ar2, ar3, ar4] = ratios;

12
packages/pl-fe/src/utils/media-aspect-ratio.ts
View File

@ -1,18 +1,18 @@
const minimumAspectRatio = 9 / 16; // Portrait phone
const maximumAspectRatio = 10; // Generous min-height
const isPanoramic = (ar: number) => {
if (isNaN(ar)) return false;
const isPanoramic = (ar: number | null) => {
if (ar === null || isNaN(ar)) return false;
return ar >= maximumAspectRatio;
};
const isPortrait = (ar: number) => {
if (isNaN(ar)) return false;
const isPortrait = (ar: number | null) => {
if (ar === null || isNaN(ar)) return false;
return ar <= minimumAspectRatio;
};
const isNonConformingRatio = (ar: number) => {
if (isNaN(ar)) return false;
const isNonConformingRatio = (ar: number | null) => {
if (ar === null || isNaN(ar)) return false;
return !isPanoramic(ar) && !isPortrait(ar);
};