* add ffmpeg-kit-react-native * get select video button + compression working * up res to 1080p * add progress component * move logic out of compressVideo * (WIP) add lonestar compression * rework web compression a bit * mess around with adding a thumbnail * 3mbps * replace * use 3mbps * add expo-video * remove unnecessary try/catch * rm ToastAndroid * fix web * wrap lazy component in suspense * gate video select button * rm web compression * flip sign * remove expo-video from web * review nits * add video picker permissions + rm temp buttons * add ffmpeg-kit-react-native * replace * hls-capable player * start trying to hoist up video player instance * hoist video player and move things around * always show native controls * fix controls on expo video android * gate temp video player in feed * rm IS_DEV, doesn't do what I thought it did * use __DEV__ instead --------- Co-authored-by: Samuel Newman <10959775+mozzius@users.noreply.github.com> Co-authored-by: Hailey <me@haileyok.com>
This commit is contained in:
parent
4ec999cab7
commit
00240b95b9
16 changed files with 489 additions and 105 deletions
41
src/view/com/util/post-embeds/VideoPlayerContext.tsx
Normal file
41
src/view/com/util/post-embeds/VideoPlayerContext.tsx
Normal file
|
|
@ -0,0 +1,41 @@
|
|||
import React, {useContext, useEffect} from 'react'
|
||||
import type {VideoPlayer} from 'expo-video'
|
||||
import {useVideoPlayer as useExpoVideoPlayer} from 'expo-video'
|
||||
|
||||
const VideoPlayerContext = React.createContext<VideoPlayer | null>(null)
|
||||
|
||||
export function VideoPlayerProvider({
|
||||
viewId,
|
||||
source,
|
||||
children,
|
||||
}: {
|
||||
viewId: string | null
|
||||
source: string
|
||||
children: React.ReactNode
|
||||
}) {
|
||||
// eslint-disable-next-line @typescript-eslint/no-shadow
|
||||
const player = useExpoVideoPlayer(source, player => {
|
||||
player.loop = true
|
||||
player.play()
|
||||
})
|
||||
|
||||
// make sure we're playing every time the viewId changes
|
||||
// this means the video is different
|
||||
useEffect(() => {
|
||||
player.play()
|
||||
}, [viewId, player])
|
||||
|
||||
return (
|
||||
<VideoPlayerContext.Provider value={player}>
|
||||
{children}
|
||||
</VideoPlayerContext.Provider>
|
||||
)
|
||||
}
|
||||
|
||||
export function useVideoPlayer() {
|
||||
const context = useContext(VideoPlayerContext)
|
||||
if (!context) {
|
||||
throw new Error('useVideoPlayer must be used within a VideoPlayerProvider')
|
||||
}
|
||||
return context
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue