@mux/mux-react-native-player 0.1.0

package/android/src/main/java/com/mux/reactnativeplayer/MuxVideoView.kt

@@ -0,0 +1,452 @@
+package com.mux.reactnativeplayer
+
+import android.content.Context
+import android.os.Handler
+import android.os.Looper
+import android.view.LayoutInflater
+import android.view.ViewGroup
+import androidx.annotation.OptIn
+import androidx.media3.common.C
+import androidx.media3.common.PlaybackException
+import androidx.media3.common.Player
+import androidx.media3.common.TrackGroup
+import androidx.media3.common.TrackSelectionOverride
+import androidx.media3.common.Tracks
+import androidx.media3.exoplayer.DefaultLoadControl
+import androidx.media3.common.util.UnstableApi
+import androidx.media3.ui.AspectRatioFrameLayout
+import androidx.media3.ui.PlayerView
+import com.mux.player.MuxPlayer
+import expo.modules.kotlin.AppContext
+import expo.modules.kotlin.viewevent.EventDispatcher
+import expo.modules.kotlin.views.ExpoView
+
+@OptIn(UnstableApi::class)
+class MuxVideoView(
+  context: Context,
+  appContext: AppContext,
+) : ExpoView(context, appContext) {
+  private val onStatusChange by EventDispatcher()
+  private val onPlayingChange by EventDispatcher()
+  private val onTimeUpdate by EventDispatcher()
+  private val onSourceLoad by EventDispatcher()
+  private val onSourceError by EventDispatcher()
+
+  private val mainHandler = Handler(Looper.getMainLooper())
+  private val playerView = (LayoutInflater.from(context)
+    .inflate(R.layout.mux_video_player_view, this, false) as PlayerView).also {
+    it.layoutParams = LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT)
+    it.useController = true
+    it.resizeMode = AspectRatioFrameLayout.RESIZE_MODE_FIT
+    it.setKeepContentOnPlayerReset(true)
+    addView(it)
+  }
+
+  private var player: MuxPlayer? = null
+  private var sourceFingerprint: String? = null
+  private var currentPlaybackId: String? = null
+  private var didEmitSourceLoad = false
+  private var muted = false
+  private var volume = 1f
+  private var loop = false
+  private var playbackRate = 1f
+  private var shouldPlay = false
+  private var timeUpdateEventIntervalMs = 500L
+  private var startupBufferDurationMs = 0L
+
+  private data class TextTrackSelection(
+    val id: String,
+    val trackGroup: TrackGroup,
+    val trackIndex: Int,
+  )
+
+  private val timeUpdateRunnable = object : Runnable {
+    override fun run() {
+      sendTimeUpdate()
+      mainHandler.postDelayed(this, timeUpdateEventIntervalMs)
+    }
+  }
+
+  private val listener = object : Player.Listener {
+    override fun onPlaybackStateChanged(playbackState: Int) {
+      if (playbackState == Player.STATE_READY && !didEmitSourceLoad) {
+        didEmitSourceLoad = true
+        onSourceLoad(
+          mapOf(
+            "playbackId" to currentPlaybackId.orEmpty(),
+            "duration" to durationSeconds(),
+            "captionTracks" to captionTracksPayload(),
+            "selectedCaptionTrackId" to selectedCaptionTrackId().orEmpty(),
+          )
+        )
+      }
+      if (playbackState == Player.STATE_READY && shouldPlay && player?.isPlaying != true) {
+        player?.play()
+      }
+      sendStatusChange()
+    }
+
+    override fun onIsPlayingChanged(isPlaying: Boolean) {
+      onPlayingChange(mapOf("isPlaying" to isPlaying))
+      sendStatusChange()
+    }
+
+    override fun onPlayerError(error: PlaybackException) {
+      val message = error.localizedMessage ?: "Mux playback failed."
+      onSourceError(
+        mutableMapOf<String, Any>(
+          "playbackId" to currentPlaybackId.orEmpty(),
+          "message" to message,
+          "code" to error.errorCodeName
+        )
+      )
+      sendStatusChange("error", message)
+    }
+
+    override fun onTracksChanged(tracks: Tracks) {
+      sendStatusChange()
+    }
+  }
+
+  override fun onAttachedToWindow() {
+    super.onAttachedToWindow()
+    startTimeUpdates()
+  }
+
+  override fun onDetachedFromWindow() {
+    stopTimeUpdates()
+    super.onDetachedFromWindow()
+  }
+
+  fun setSource(source: MuxVideoSourceRecord?) {
+    if (source == null) {
+      release()
+      return
+    }
+
+    if (source.fingerprint == sourceFingerprint) {
+      return
+    }
+
+    releasePlayer()
+    sourceFingerprint = source.fingerprint
+    currentPlaybackId = source.playbackId
+    didEmitSourceLoad = false
+    sendStatusChange("loading")
+
+    val bufferForPlaybackMs = startupBufferDurationMs.coerceAtLeast(500L).toInt()
+    val bufferForPlaybackAfterRebufferMs = startupBufferDurationMs.coerceAtLeast(1_500L).toInt()
+    val minBufferMs = startupBufferDurationMs.coerceAtLeast(3_000L).toInt()
+    val loadControl = DefaultLoadControl.Builder()
+      .setBufferDurationsMs(
+        minBufferMs,
+        12_000,
+        bufferForPlaybackMs,
+        bufferForPlaybackAfterRebufferMs,
+      )
+      .setPrioritizeTimeOverSizeThresholds(true)
+      .build()
+
+    val builder = MuxPlayer.Builder(context)
+      .enableSmartCache(true)
+      .applyExoConfig {
+        setLoadControl(loadControl)
+      }
+      .addMonitoringData(source.toCustomerData())
+
+    source.metadata?.envKey?.takeIf { it.isNotBlank() }?.let {
+      builder.setMuxDataEnv(it)
+    }
+
+    val nextPlayer = builder.build()
+    nextPlayer.addListener(listener)
+    nextPlayer.setMediaItem(source.toMediaItem())
+    nextPlayer.playWhenReady = shouldPlay
+    nextPlayer.prepare()
+
+    player = nextPlayer
+    playerView.player = nextPlayer
+    applyPlayerConfiguration()
+  }
+
+  fun setNativeControls(enabled: Boolean) {
+    playerView.useController = enabled
+  }
+
+  fun setContentFit(contentFit: String) {
+    playerView.resizeMode = when (contentFit) {
+      "cover" -> AspectRatioFrameLayout.RESIZE_MODE_ZOOM
+      "fill" -> AspectRatioFrameLayout.RESIZE_MODE_FILL
+      else -> AspectRatioFrameLayout.RESIZE_MODE_FIT
+    }
+  }
+
+  fun setTimeUpdateEventInterval(interval: Double) {
+    timeUpdateEventIntervalMs = (interval.coerceAtLeast(0.1) * 1000).toLong()
+    stopTimeUpdates()
+    startTimeUpdates()
+  }
+
+  fun setStartupBufferDuration(duration: Double) {
+    startupBufferDurationMs = (duration.coerceAtLeast(0.0) * 1000).toLong()
+  }
+
+  fun setPlayWhenReady(playWhenReady: Boolean) {
+    if (shouldPlay == playWhenReady) {
+      return
+    }
+
+    if (playWhenReady) {
+      play()
+    } else {
+      pause()
+    }
+  }
+
+  fun setMuted(muted: Boolean) {
+    this.muted = muted
+    player?.volume = if (muted) 0f else volume
+    sendStatusChange()
+  }
+
+  fun setVolume(volume: Double) {
+    this.volume = volume.coerceIn(0.0, 1.0).toFloat()
+    if (!muted) {
+      player?.volume = this.volume
+    }
+    sendStatusChange()
+  }
+
+  fun setLoop(loop: Boolean) {
+    this.loop = loop
+    player?.repeatMode = if (loop) Player.REPEAT_MODE_ONE else Player.REPEAT_MODE_OFF
+    sendStatusChange()
+  }
+
+  fun setPlaybackRate(rate: Double) {
+    playbackRate = rate.coerceIn(0.25, 4.0).toFloat()
+    player?.setPlaybackSpeed(playbackRate)
+    sendStatusChange()
+  }
+
+  fun setCaptionTrack(trackId: String?) {
+    val currentPlayer = player ?: return
+    val builder = currentPlayer.trackSelectionParameters.buildUpon()
+
+    if (trackId == null) {
+      currentPlayer.trackSelectionParameters = builder
+        .setTrackTypeDisabled(C.TRACK_TYPE_TEXT, true)
+        .build()
+      sendStatusChange()
+      return
+    }
+
+    val selection = findTextTrack(trackId) ?: return
+    currentPlayer.trackSelectionParameters = builder
+      .setTrackTypeDisabled(C.TRACK_TYPE_TEXT, false)
+      .setOverrideForType(
+        TrackSelectionOverride(selection.trackGroup, listOf(selection.trackIndex))
+      )
+      .build()
+    sendStatusChange()
+  }
+
+  fun play() {
+    shouldPlay = true
+    player?.play()
+    sendStatusChange()
+  }
+
+  fun pause() {
+    shouldPlay = false
+    player?.pause()
+    sendStatusChange()
+  }
+
+  fun replay() {
+    shouldPlay = true
+    seekTo(0.0)
+    play()
+  }
+
+  fun seekBy(seconds: Double) {
+    val current = (player?.currentPosition ?: 0L) / 1000.0
+    seekTo(current + seconds)
+  }
+
+  fun seekTo(seconds: Double) {
+    player?.seekTo((seconds.coerceAtLeast(0.0) * 1000).toLong())
+    sendStatusChange()
+    sendTimeUpdate()
+  }
+
+  fun release() {
+    releasePlayer()
+    sourceFingerprint = null
+    currentPlaybackId = null
+    didEmitSourceLoad = false
+    shouldPlay = false
+    sendStatusChange("idle")
+  }
+
+  private fun applyPlayerConfiguration() {
+    player?.volume = if (muted) 0f else volume
+    player?.repeatMode = if (loop) Player.REPEAT_MODE_ONE else Player.REPEAT_MODE_OFF
+    player?.setPlaybackSpeed(playbackRate)
+  }
+
+  private fun releasePlayer() {
+    playerView.player = null
+    player?.removeListener(listener)
+    player?.release()
+    player = null
+  }
+
+  private fun startTimeUpdates() {
+    mainHandler.removeCallbacks(timeUpdateRunnable)
+    mainHandler.postDelayed(timeUpdateRunnable, timeUpdateEventIntervalMs)
+  }
+
+  private fun stopTimeUpdates() {
+    mainHandler.removeCallbacks(timeUpdateRunnable)
+  }
+
+  private fun sendTimeUpdate() {
+    onTimeUpdate(
+      mapOf(
+        "currentTime" to currentTimeSeconds(),
+        "duration" to durationSeconds(),
+        "bufferedPosition" to bufferedPositionSeconds()
+      )
+    )
+  }
+
+  private fun sendStatusChange(status: String? = null, error: String? = null) {
+    val payload = mutableMapOf<String, Any>(
+      "status" to (status ?: inferStatus()),
+      "currentTime" to currentTimeSeconds(),
+      "duration" to durationSeconds(),
+      "bufferedPosition" to bufferedPositionSeconds(),
+      "muted" to muted,
+      "volume" to volume.toDouble(),
+      "loop" to loop,
+      "playbackRate" to playbackRate.toDouble(),
+      "captionTracks" to captionTracksPayload(),
+      "selectedCaptionTrackId" to selectedCaptionTrackId().orEmpty(),
+    )
+
+    if (error != null) {
+      payload["error"] = error
+    }
+
+    onStatusChange(
+      payload
+    )
+  }
+
+  private fun inferStatus(): String {
+    val player = player ?: return "idle"
+    return when (player.playbackState) {
+      Player.STATE_BUFFERING -> "buffering"
+      Player.STATE_READY -> if (player.isPlaying) "playing" else "paused"
+      Player.STATE_ENDED -> "ended"
+      Player.STATE_IDLE -> if (currentPlaybackId == null) "idle" else "loading"
+      else -> "idle"
+    }
+  }
+
+  private fun currentTimeSeconds(): Double {
+    return ((player?.currentPosition ?: 0L).coerceAtLeast(0L)) / 1000.0
+  }
+
+  private fun durationSeconds(): Double {
+    val duration = player?.duration ?: C.TIME_UNSET
+    return if (duration == C.TIME_UNSET || duration < 0) 0.0 else duration / 1000.0
+  }
+
+  private fun bufferedPositionSeconds(): Double {
+    return ((player?.bufferedPosition ?: 0L).coerceAtLeast(0L)) / 1000.0
+  }
+
+  private fun captionTracksPayload(): List<Map<String, Any>> {
+    val currentPlayer = player ?: return emptyList()
+    val tracks = mutableListOf<Map<String, Any>>()
+    var fallbackIndex = 1
+
+    currentPlayer.currentTracks.groups.forEachIndexed { groupIndex, group ->
+      if (group.type != C.TRACK_TYPE_TEXT) {
+        return@forEachIndexed
+      }
+
+      for (trackIndex in 0 until group.length) {
+        if (!group.isTrackSupported(trackIndex)) {
+          continue
+        }
+
+        val format = group.getTrackFormat(trackIndex)
+        val language = format.language
+        val label = format.label
+          ?.takeIf { it.isNotBlank() }
+          ?: language?.takeIf { it.isNotBlank() }
+          ?: "Captions ${fallbackIndex++}"
+        val payload = mutableMapOf<String, Any>(
+          "id" to "$groupIndex:$trackIndex",
+          "label" to label,
+          "kind" to captionTrackKind(format.selectionFlags, format.roleFlags),
+        )
+
+        language?.takeIf { it.isNotBlank() }?.let {
+          payload["language"] = it
+        }
+
+        tracks.add(payload)
+      }
+    }
+
+    return tracks
+  }
+
+  private fun selectedCaptionTrackId(): String? {
+    val currentPlayer = player ?: return null
+
+    currentPlayer.currentTracks.groups.forEachIndexed { groupIndex, group ->
+      if (group.type != C.TRACK_TYPE_TEXT) {
+        return@forEachIndexed
+      }
+
+      for (trackIndex in 0 until group.length) {
+        if (group.isTrackSelected(trackIndex)) {
+          return "$groupIndex:$trackIndex"
+        }
+      }
+    }
+
+    return null
+  }
+
+  private fun findTextTrack(trackId: String): TextTrackSelection? {
+    val currentPlayer = player ?: return null
+
+    currentPlayer.currentTracks.groups.forEachIndexed { groupIndex, group ->
+      if (group.type != C.TRACK_TYPE_TEXT) {
+        return@forEachIndexed
+      }
+
+      for (trackIndex in 0 until group.length) {
+        if ("$groupIndex:$trackIndex" == trackId && group.isTrackSupported(trackIndex)) {
+          return TextTrackSelection(trackId, group.mediaTrackGroup, trackIndex)
+        }
+      }
+    }
+
+    return null
+  }
+
+  private fun captionTrackKind(selectionFlags: Int, roleFlags: Int): String {
+    return when {
+      selectionFlags and C.SELECTION_FLAG_FORCED != 0 -> "forced"
+      roleFlags and C.ROLE_FLAG_CAPTION != 0 -> "captions"
+      else -> "subtitles"
+    }
+  }
+}

package/android/src/main/res/layout/mux_video_player_view.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.media3.ui.PlayerView xmlns:android="http://schemas.android.com/apk/res/android"
+  xmlns:app="http://schemas.android.com/apk/res-auto"
+  android:layout_width="match_parent"
+  android:layout_height="match_parent"
+  app:surface_type="texture_view" />

package/build/MuxVideoControls.d.ts

@@ -0,0 +1,21 @@
+import type { MuxPlayerStatus, MuxVideoChapter, MuxVideoControlsTheme, MuxVideoKeyMoment, MuxVideoRobotsConfig, MuxVideoSummary } from './types';
+import { MuxVideoPlayer } from './MuxVideoPlayer';
+type MuxVideoControlsProps = {
+    player: MuxVideoPlayer;
+    status: MuxPlayerStatus;
+    shouldPlay: boolean;
+    theme?: MuxVideoControlsTheme;
+    robots?: MuxVideoRobotsConfig;
+    allowsFullscreen?: boolean;
+    isFullscreen?: boolean;
+    onToggleFullscreen?: () => void;
+    generatedSummary?: MuxVideoSummary;
+    generatedChapters?: MuxVideoChapter[];
+    generatedKeyMoments?: MuxVideoKeyMoment[];
+    onGeneratedSummaryChange?: (summary: MuxVideoSummary | undefined) => void;
+    onGeneratedChaptersChange?: (chapters: MuxVideoChapter[] | undefined) => void;
+    onGeneratedKeyMomentsChange?: (keyMoments: MuxVideoKeyMoment[] | undefined) => void;
+};
+export declare function MuxVideoControls({ player, status, shouldPlay, theme, robots, allowsFullscreen, isFullscreen, onToggleFullscreen, generatedSummary, generatedChapters, generatedKeyMoments, onGeneratedSummaryChange, onGeneratedChaptersChange, onGeneratedKeyMomentsChange, }: MuxVideoControlsProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=MuxVideoControls.d.ts.map

package/build/MuxVideoControls.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MuxVideoControls.d.ts","sourceRoot":"","sources":["../src/MuxVideoControls.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EACV,eAAe,EAEf,eAAe,EACf,qBAAqB,EACrB,iBAAiB,EACjB,oBAAoB,EACpB,eAAe,EAChB,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAKlD,KAAK,qBAAqB,GAAG;IAC3B,MAAM,EAAE,cAAc,CAAC;IACvB,MAAM,EAAE,eAAe,CAAC;IACxB,UAAU,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,qBAAqB,CAAC;IAC9B,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC,gBAAgB,CAAC,EAAE,eAAe,CAAC;IACnC,iBAAiB,CAAC,EAAE,eAAe,EAAE,CAAC;IACtC,mBAAmB,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAC1C,wBAAwB,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,GAAG,SAAS,KAAK,IAAI,CAAC;IAC1E,yBAAyB,CAAC,EAAE,CAAC,QAAQ,EAAE,eAAe,EAAE,GAAG,SAAS,KAAK,IAAI,CAAC;IAC9E,2BAA2B,CAAC,EAAE,CAAC,UAAU,EAAE,iBAAiB,EAAE,GAAG,SAAS,KAAK,IAAI,CAAC;CACrF,CAAC;AA8BF,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EACN,MAAM,EACN,UAAU,EACV,KAAK,EACL,MAAM,EACN,gBAAwB,EACxB,YAAoB,EACpB,kBAAkB,EAClB,gBAAgB,EAChB,iBAAiB,EACjB,mBAAmB,EACnB,wBAAwB,EACxB,yBAAyB,EACzB,2BAA2B,GAC5B,EAAE,qBAAqB,2CAk4BvB"}