If not displayed, make sure to pause the audio / video

libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/local/LocalMediaView.kt

@@ -27,6 +27,7 @@ fun LocalMediaView(
     bottomPaddingInPixels: Int,
     onClick: () -> Unit,
     modifier: Modifier = Modifier,
+    isDisplayed: Boolean = true,
     localMediaViewState: LocalMediaViewState = rememberLocalMediaViewState(),
     mediaInfo: MediaInfo? = localMedia?.info,
 ) {
@@ -39,6 +40,7 @@ fun LocalMediaView(
             onClick = onClick,
         )
         mimeType.isMimeTypeVideo() -> MediaVideoView(
+            isDisplayed = isDisplayed,
             localMediaViewState = localMediaViewState,
             bottomPaddingInPixels = bottomPaddingInPixels,
             localMedia = localMedia,
@@ -51,6 +53,7 @@ fun LocalMediaView(
             onClick = onClick,
         )
         mimeType.isMimeTypeAudio() -> MediaAudioView(
+            isDisplayed = isDisplayed,
             localMediaViewState = localMediaViewState,
             bottomPaddingInPixels = bottomPaddingInPixels,
             localMedia = localMedia,

libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/local/audio/MediaAudioView.kt

@@ -83,9 +83,11 @@ fun MediaAudioView(
     localMedia: LocalMedia?,
     info: MediaInfo?,
     modifier: Modifier = Modifier,
+    isDisplayed: Boolean = true,
 ) {
     val exoPlayer = rememberExoPlayer()
     ExoPlayerMediaAudioView(
+        isDisplayed = isDisplayed,
         localMediaViewState = localMediaViewState,
         bottomPaddingInPixels = bottomPaddingInPixels,
         exoPlayer = exoPlayer,
@@ -98,6 +100,7 @@ fun MediaAudioView(
 @SuppressLint("UnsafeOptInUsageError")
 @Composable
 private fun ExoPlayerMediaAudioView(
+    isDisplayed: Boolean,
     localMediaViewState: LocalMediaViewState,
     bottomPaddingInPixels: Int,
     exoPlayer: ExoPlayer,
@@ -176,6 +179,12 @@ private fun ExoPlayerMediaAudioView(
             )
         }
     }
+    LaunchedEffect(isDisplayed) {
+        // If not displayed, make sure to pause the audio
+        if (!isDisplayed) {
+            exoPlayer.pause()
+        }
+    }
     if (localMedia?.uri != null) {
         LaunchedEffect(localMedia.uri) {
             val mediaItem = MediaItem.fromUri(localMedia.uri)

libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/local/video/MediaVideoView.kt

@@ -57,6 +57,7 @@ import kotlin.time.Duration.Companion.seconds
 @SuppressLint("UnsafeOptInUsageError")
 @Composable
 fun MediaVideoView(
+    isDisplayed: Boolean,
     localMediaViewState: LocalMediaViewState,
     bottomPaddingInPixels: Int,
     localMedia: LocalMedia?,
@@ -64,6 +65,7 @@ fun MediaVideoView(
 ) {
     val exoPlayer = rememberExoPlayer()
     ExoPlayerMediaVideoView(
+        isDisplayed = isDisplayed,
         localMediaViewState = localMediaViewState,
         bottomPaddingInPixels = bottomPaddingInPixels,
         exoPlayer = exoPlayer,
@@ -75,6 +77,7 @@ fun MediaVideoView(
 @SuppressLint("UnsafeOptInUsageError")
 @Composable
 private fun ExoPlayerMediaVideoView(
+    isDisplayed: Boolean,
     localMediaViewState: LocalMediaViewState,
     bottomPaddingInPixels: Int,
     exoPlayer: ExoPlayer,
@@ -161,6 +164,12 @@ private fun ExoPlayerMediaVideoView(
             )
         }
     }
+    LaunchedEffect(isDisplayed) {
+        // If not displayed, make sure to pause the video
+        if (!isDisplayed) {
+            exoPlayer.pause()
+        }
+    }
     if (localMedia?.uri != null) {
         LaunchedEffect(localMedia.uri) {
             val mediaItem = MediaItem.fromUri(localMedia.uri)
@@ -245,6 +254,7 @@ private fun ExoPlayerMediaVideoView(
 @Composable
 internal fun MediaVideoViewPreview() = ElementPreview {
     MediaVideoView(
+        isDisplayed = true,
         modifier = Modifier.fillMaxSize(),
         bottomPaddingInPixels = 0,
         localMediaViewState = rememberLocalMediaViewState(),

libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/viewer/MediaViewerView.kt

@@ -135,6 +135,7 @@ fun MediaViewerView(
                         state.eventSink(MediaViewerEvents.LoadMedia(dataForPage))
                     }
                     MediaViewerPage(
+                        isDisplayed = page == pagerState.settledPage,
                         showOverlay = showOverlay,
                         bottomPaddingInPixels = bottomPaddingInPixels,
                         data = dataForPage,
@@ -246,6 +247,7 @@ fun MediaViewerView(
 
 @Composable
 private fun MediaViewerPage(
+    isDisplayed: Boolean,
     showOverlay: Boolean,
     bottomPaddingInPixels: Int,
     state: MediaViewerState,
@@ -307,6 +309,7 @@ private fun MediaViewerPage(
 
                 LocalMediaView(
                     modifier = Modifier.fillMaxSize(),
+                    isDisplayed = isDisplayed,
                     bottomPaddingInPixels = bottomPaddingInPixels,
                     localMediaViewState = localMediaViewState,
                     localMedia = data.downloadedMedia.dataOrNull(),