diff --git a/src/view/com/util/post-embeds/ExternalGifEmbed.tsx b/src/view/com/util/post-embeds/ExternalGifEmbed.tsx index b2720752ca..4093511c44 100644 --- a/src/view/com/util/post-embeds/ExternalGifEmbed.tsx +++ b/src/view/com/util/post-embeds/ExternalGifEmbed.tsx @@ -1,4 +1,4 @@ -import React from 'react' +import React, {useRef} from 'react' import { ActivityIndicator, GestureResponderEvent, @@ -18,6 +18,17 @@ import {isIOS, isNative, isWeb} from '#/platform/detection' import {useExternalEmbedsPrefs} from '#/state/preferences' import {useDialogControl} from '#/components/Dialog' import {EmbedConsentDialog} from '#/components/dialogs/EmbedConsent' +import {VideoPlayer} from '../../../../../modules/expo-bluesky-video-player' + +const GIF_LIST = [ + 'https://media1.giphy.com/media/duexIlfr9yYwYE23UA/200w.mp4', + 'https://media2.giphy.com/media/p9FB3WC9Xju4o/200w.mp4', + 'https://media2.giphy.com/media/iGAXf0OlUUMYo/200w.mp4', + 'https://media4.giphy.com/media/cFeXVeTKDB0fm/200w.mp4', + 'https://media3.giphy.com/media/qs6ev2pm8g9dS/200w.mp4', + 'https://media2.giphy.com/media/6R2mLi910HL4VXFwOG/200w.mp4', + 'https://media4.giphy.com/media/rOGuft1jgiq66zpQI2/200w.mp4', +] export function ExternalGifEmbed({ link, @@ -102,55 +113,79 @@ export function ExternalGifEmbed({ viewWidth.current = e.nativeEvent.layout.width }, []) + const onDidLoad = React.useCallback(() => {}, []) + + const rand = React.useMemo( + () => GIF_LIST[Math.floor(Math.random() * GIF_LIST.length)], + [], + ) + + const playerRef = useRef() + return ( <> - + {/**/} - {(!isPrefetched || !isAnimating) && ( // If we have not loaded or are not animating, show the overlay - - - {!isAnimating || !isPlayerActive ? ( // Play button when not animating or not active - - ) : ( - // Activity indicator while gif loads - - )} - - - )} - { + playerRef.current.toggleAsync() + }}> + + + {/**/} + {/* {(!isPrefetched || !isAnimating) && ( // If we have not loaded or are not animating, show the overlay*/} + {/* */} + {/* */} + {/* {!isAnimating || !isPlayerActive ? ( // Play button when not animating or not active*/} + {/* */} + {/* ) : (*/} + {/* // Activity indicator while gif loads*/} + {/* */} + {/* )}*/} + {/* */} + {/* */} + {/* )}*/} + {/* */} + {/**/} ) }