mirror of
https://github.com/fluxerapp/fluxer
synced 2026-10-17 04:55:42 +09:00
fix(app): give mature media blur the real media dimensions (#2084)
This commit is contained in:
1 parent
827451d12d
commit
4d15c39cd7
1 file changed
+12
-6
@@ -408,7 +408,7 @@ export const EmbedGifv: FC<
|
||||
},
|
||||
[visibilityRef],
|
||||
);
|
||||
const {dimensions, style} = mediaCalculator.calculate({width: naturalWidth, height: naturalHeight});
|
||||
const {dimensions} = mediaCalculator.calculate({width: naturalWidth, height: naturalHeight});
|
||||
const canPlayInline = isInlinePlayableVideoSize({width: naturalWidth, height: naturalHeight});
|
||||
const posterSource = thumbnailProxyURL && thumbnailProxyURL.length > 0 ? thumbnailProxyURL : videoProxyURL;
|
||||
const posterURL = useMemo(() => {
|
||||
@@ -534,8 +534,11 @@ export const EmbedGifv: FC<
|
||||
safePause(video);
|
||||
}, [shouldPlay]);
|
||||
if (shouldBlur) {
|
||||
const {width: _width, height: _height, ...styleWithoutDimensions} = style;
|
||||
const blurContainerStyle = {...styleWithoutDimensions, maxWidth: '100%', width: '100%'};
|
||||
const blurContainerStyle: React.CSSProperties = {
|
||||
maxWidth: '100%',
|
||||
width: remFromPx(dimensions.width),
|
||||
...aspectRatioStyle,
|
||||
};
|
||||
return (
|
||||
<div
|
||||
ref={visibilityRef}
|
||||
@@ -719,7 +722,7 @@ export const EmbedGif: FC<
|
||||
},
|
||||
[visibilityRef],
|
||||
);
|
||||
const {dimensions, style} = mediaCalculator.calculate({width: naturalWidth, height: naturalHeight});
|
||||
const {dimensions} = mediaCalculator.calculate({width: naturalWidth, height: naturalHeight});
|
||||
const {width: displayWidth, height: displayHeight} = dimensions;
|
||||
const gifAutoPlay = useShouldAnimate({kind: 'gif'});
|
||||
const animationPolicyAllowed = useShouldAnimate({
|
||||
@@ -856,8 +859,11 @@ export const EmbedGif: FC<
|
||||
],
|
||||
);
|
||||
if (shouldBlur) {
|
||||
const {width: _width, height: _height, ...styleWithoutDimensions} = style;
|
||||
const blurContainerStyle = {...styleWithoutDimensions, maxWidth: '100%', width: '100%'};
|
||||
const blurContainerStyle: React.CSSProperties = {
|
||||
maxWidth: '100%',
|
||||
width: remFromPx(dimensions.width),
|
||||
...aspectRatioStyle,
|
||||
};
|
||||
return (
|
||||
<div
|
||||
ref={visibilityRef}
|
||||
|
||||
Reference in new issue
Block a user