diff --git a/src/view/com/composer/videos/VideoPreview.tsx b/src/view/com/composer/videos/VideoPreview.tsx index 199a1fff..28b46bae 100644 --- a/src/view/com/composer/videos/VideoPreview.tsx +++ b/src/view/com/composer/videos/VideoPreview.tsx @@ -6,8 +6,10 @@ import {useVideoPlayer, VideoView} from 'expo-video' import {CompressedVideo} from '#/lib/media/video/types' import {clamp} from '#/lib/numbers' +import {useAutoplayDisabled} from '#/state/preferences' import {ExternalEmbedRemoveBtn} from 'view/com/composer/ExternalEmbedRemoveBtn' import {atoms as a, useTheme} from '#/alf' +import {PlayButtonIcon} from '#/components/video/PlayButtonIcon' export function VideoPreview({ asset, @@ -20,10 +22,13 @@ export function VideoPreview({ clear: () => void }) { const t = useTheme() + const autoplayDisabled = useAutoplayDisabled() const player = useVideoPlayer(video.uri, player => { player.loop = true player.muted = true - player.play() + if (!autoplayDisabled) { + player.play() + } }) let aspectRatio = asset.width / asset.height @@ -53,6 +58,11 @@ export function VideoPreview({ contentFit="contain" /> + {autoplayDisabled && ( + + + + )} ) } diff --git a/src/view/com/composer/videos/VideoPreview.web.tsx b/src/view/com/composer/videos/VideoPreview.web.tsx index 4c44781c..9473be07 100644 --- a/src/view/com/composer/videos/VideoPreview.web.tsx +++ b/src/view/com/composer/videos/VideoPreview.web.tsx @@ -6,9 +6,11 @@ import {useLingui} from '@lingui/react' import {CompressedVideo} from '#/lib/media/video/types' import {clamp} from '#/lib/numbers' +import {useAutoplayDisabled} from '#/state/preferences' import * as Toast from '#/view/com/util/Toast' import {ExternalEmbedRemoveBtn} from 'view/com/composer/ExternalEmbedRemoveBtn' import {atoms as a} from '#/alf' +import {PlayButtonIcon} from '#/components/video/PlayButtonIcon' export function VideoPreview({ asset, @@ -23,6 +25,7 @@ export function VideoPreview({ }) { const ref = useRef(null) const {_} = useLingui() + const autoplayDisabled = useAutoplayDisabled() useEffect(() => { if (!ref.current) return @@ -66,17 +69,23 @@ export function VideoPreview({ {aspectRatio}, a.overflow_hidden, {backgroundColor: 'black'}, + a.relative, ]}>