diff --git a/ios/tooot/Info.plist b/ios/tooot/Info.plist
index e325df39..33e171e2 100644
--- a/ios/tooot/Info.plist
+++ b/ios/tooot/Info.plist
@@ -50,8 +50,6 @@
- NSMicrophoneUsageDescription
- $(PRODUCT_NAME) DOES NOT need microphone permission. Please reject this request.
NSCameraUsageDescription
Allow $(PRODUCT_NAME) to capture photo or video and attach it to your toot
NSLocationWhenInUseUsageDescription
diff --git a/src/components/Timeline/Shared/Attachment/Video.tsx b/src/components/Timeline/Shared/Attachment/Video.tsx
index 35ad16e9..4c204716 100644
--- a/src/components/Timeline/Shared/Attachment/Video.tsx
+++ b/src/components/Timeline/Shared/Attachment/Video.tsx
@@ -1,8 +1,14 @@
import Button from '@components/Button'
import { StyleConstants } from '@utils/styles/constants'
import { Video } from 'expo-av'
-import React, { useCallback, useRef, useState } from 'react'
-import { Pressable, StyleSheet, View } from 'react-native'
+import React, { useCallback, useEffect, useRef, useState } from 'react'
+import {
+ AppState,
+ AppStateStatus,
+ Pressable,
+ StyleSheet,
+ View
+} from 'react-native'
import { Blurhash } from 'react-native-blurhash'
import attachmentAspectRatio from './aspectRatio'
import analytics from '@components/analytics'
@@ -45,15 +51,43 @@ const AttachmentVideo: React.FC = ({
videoPlayer.current?.setOnPlaybackStatusUpdate(props => {
if (props.isLoaded) {
setVideoLoaded(true)
- }
- // @ts-ignore
- if (props.positionMillis) {
- // @ts-ignore
- setVideoPosition(props.positionMillis)
+ if (props.positionMillis) {
+ setVideoPosition(props.positionMillis)
+ }
}
})
}, [videoLoaded, videoPosition])
+ const appState = useRef(AppState.currentState)
+ useEffect(() => {
+ AppState.addEventListener('change', _handleAppStateChange)
+
+ return () => {
+ AppState.removeEventListener('change', _handleAppStateChange)
+ }
+ }, [])
+ const _handleAppStateChange = async (nextAppState: AppStateStatus) => {
+ if (appState.current.match(/active/) && nextAppState.match(/inactive/)) {
+ await videoPlayer.current?.pauseAsync()
+ } else if (
+ gifv &&
+ appState.current.match(/background/) &&
+ nextAppState.match(/active/)
+ ) {
+ await videoPlayer.current?.setIsMutedAsync(true)
+ await videoPlayer.current?.playAsync()
+ }
+
+ appState.current = nextAppState
+ }
+
+ const playerStatus = useRef(null)
+ useEffect(() => {
+ videoPlayer.current?.setOnPlaybackStatusUpdate(playbackStatus => {
+ playerStatus.current = playbackStatus
+ })
+ }, [])
+
return (
= ({
posterStyle: { resizeMode: 'cover' }
})}
useNativeControls={false}
- onFullscreenUpdate={event => {
+ onFullscreenUpdate={async event => {
if (
event.fullscreenUpdate ===
Video.FULLSCREEN_UPDATE_PLAYER_DID_DISMISS
) {
if (gifv) {
- videoPlayer.current?.setIsLoopingAsync(true)
- videoPlayer.current?.playAsync()
+ await videoPlayer.current?.pauseAsync()
} else {
- videoPlayer.current?.pauseAsync()
+ await videoPlayer.current?.pauseAsync()
}
}
}}
@@ -108,7 +141,7 @@ const AttachmentVideo: React.FC = ({
}}
/>
) : null
- ) : !gifv ? (
+ ) : !gifv || (gifv && playerStatus.current === false) ? (