forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
[Video] Minor player tweaks (#5044)
authored by
Samuel Newman
and committed by
GitHub
ab260c35
8647c8e9
+35
-15
+11
-2
src/view/com/composer/videos/VideoPreview.tsx
+11
-2
src/view/com/composer/videos/VideoPreview.tsx
···
5
5
import {useVideoPlayer, VideoView} from 'expo-video'
6
6
7
7
import {CompressedVideo} from '#/lib/media/video/types'
8
+
import {clamp} from '#/lib/numbers'
8
9
import {ExternalEmbedRemoveBtn} from 'view/com/composer/ExternalEmbedRemoveBtn'
9
10
import {atoms as a, useTheme} from '#/alf'
10
11
···
25
26
player.play()
26
27
})
27
28
28
-
const aspectRatio = asset.width / asset.height
29
+
let aspectRatio = asset.width / asset.height
30
+
31
+
if (isNaN(aspectRatio)) {
32
+
aspectRatio = 16 / 9
33
+
}
34
+
35
+
aspectRatio = clamp(aspectRatio, 1 / 1, 3 / 1)
29
36
30
37
return (
31
38
<View
32
39
style={[
33
40
a.w_full,
34
41
a.rounded_sm,
35
-
{aspectRatio: isNaN(aspectRatio) ? 16 / 9 : aspectRatio},
42
+
{aspectRatio},
36
43
a.overflow_hidden,
37
44
a.border,
38
45
t.atoms.border_contrast_low,
46
+
{backgroundColor: t.palette.black},
39
47
]}>
40
48
<VideoView
41
49
player={player}
42
50
style={a.flex_1}
43
51
allowsPictureInPicture={false}
44
52
nativeControls={false}
53
+
contentFit="contain"
45
54
/>
46
55
<ExternalEmbedRemoveBtn onRemove={clear} />
47
56
</View>
+9
-3
src/view/com/composer/videos/VideoPreview.web.tsx
+9
-3
src/view/com/composer/videos/VideoPreview.web.tsx
···
3
3
import {ImagePickerAsset} from 'expo-image-picker'
4
4
5
5
import {CompressedVideo} from '#/lib/media/video/types'
6
+
import {clamp} from '#/lib/numbers'
6
7
import {ExternalEmbedRemoveBtn} from 'view/com/composer/ExternalEmbedRemoveBtn'
7
8
import {atoms as a, useTheme} from '#/alf'
8
9
···
38
39
}
39
40
}, [setDimensions])
40
41
41
-
const aspectRatio = asset.width / asset.height
42
+
let aspectRatio = asset.width / asset.height
43
+
44
+
if (isNaN(aspectRatio)) {
45
+
aspectRatio = 16 / 9
46
+
}
47
+
48
+
aspectRatio = clamp(aspectRatio, 1 / 1, 3 / 1)
42
49
43
50
return (
44
51
<View
45
52
style={[
46
53
a.w_full,
47
54
a.rounded_sm,
48
-
49
-
{aspectRatio: isNaN(aspectRatio) ? 16 / 9 : aspectRatio},
55
+
{aspectRatio},
50
56
a.overflow_hidden,
51
57
{backgroundColor: t.palette.black},
52
58
]}>
+4
-4
src/view/com/composer/videos/VideoTranscodeBackdrop.tsx
+4
-4
src/view/com/composer/videos/VideoTranscodeBackdrop.tsx
···
21
21
}, [])
22
22
23
23
return (
24
-
<Animated.View style={a.flex_1} entering={FadeIn}>
25
-
{thumbnail && (
24
+
thumbnail && (
25
+
<Animated.View style={a.flex_1} entering={FadeIn}>
26
26
<Image
27
27
style={a.flex_1}
28
28
source={thumbnail.path}
···
31
31
blurRadius={15}
32
32
contentFit="cover"
33
33
/>
34
-
)}
35
-
</Animated.View>
34
+
</Animated.View>
35
+
)
36
36
)
37
37
}
+10
-3
src/view/com/composer/videos/VideoTranscodeProgress.tsx
+10
-3
src/view/com/composer/videos/VideoTranscodeProgress.tsx
···
4
4
import ProgressPie from 'react-native-progress/Pie'
5
5
import {ImagePickerAsset} from 'expo-image-picker'
6
6
7
+
import {clamp} from '#/lib/numbers'
7
8
import {isWeb} from '#/platform/detection'
8
9
import {atoms as a, useTheme} from '#/alf'
9
10
import {ExternalEmbedRemoveBtn} from '../ExternalEmbedRemoveBtn'
···
20
21
}) {
21
22
const t = useTheme()
22
23
23
-
const aspectRatio = asset.width / asset.height
24
+
if (isWeb) return null
25
+
26
+
let aspectRatio = asset.width / asset.height
27
+
28
+
if (isNaN(aspectRatio)) {
29
+
aspectRatio = 16 / 9
30
+
}
24
31
25
-
if (isWeb) return null
32
+
aspectRatio = clamp(aspectRatio, 1 / 1, 3 / 1)
26
33
27
34
return (
28
35
<View
···
32
39
t.atoms.bg_contrast_50,
33
40
a.rounded_md,
34
41
a.overflow_hidden,
35
-
{aspectRatio: isNaN(aspectRatio) ? 16 / 9 : aspectRatio},
42
+
{aspectRatio},
36
43
]}>
37
44
<VideoTranscodeBackdrop uri={asset.uri} />
38
45
<View
+1
-3
src/view/com/util/post-embeds/VideoEmbed.tsx
+1
-3
src/view/com/util/post-embeds/VideoEmbed.tsx