react-native-audio-browser 0.2.0-next.9 → 0.2.0

package/src/web/TrackPlayer/Player.ts

@@ -1,15 +1,12 @@
-import type shaka from 'shaka-player/dist/shaka-player.compiled'
+import type shaka from 'shaka-player/dist/shaka-player.ui'
 import type {
   Progress,
-  NativeSetupPlayerOptions,
+  PartialSetupPlayerOptions,
   Playback,
-  PlaybackError,
-  PlaybackState
+  PlaybackError
 } from '../../features'
 import type { Track } from '../../types'
-import type { PlaybackEvent } from './PlaybackStateMachine'
-import { playbackErrorKind } from '../playbackErrorKind'
-import { nextPlaybackState } from './PlaybackStateMachine'
+import type { State as StateType } from './State'
 import { SetupNotCalledError } from './SetupNotCalledError'
 import { State } from './State'
 
@@ -22,14 +19,10 @@ declare global {
 
 // Shaka event type definitions
 interface ShakaErrorEvent extends CustomEvent {
-  detail: ShakaError
-}
-
-interface ShakaError {
-  code: number
-  message: string
-  /** Shaka's per-code payload; for BAD_HTTP_STATUS `data[1]` is the status. */
-  data?: unknown[]
+  detail: {
+    code: number
+    message: string
+  }
 }
 
 interface ShakaBufferingEvent extends CustomEvent {
@@ -90,15 +83,19 @@ export class Player {
   }
 
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  async setupPlayer(_options: NativeSetupPlayerOptions = {}): Promise<void> {
+  async setupPlayer(_options: PartialSetupPlayerOptions = {}): Promise<void> {
     // shaka only runs in a browser
     if (typeof window === 'undefined') return
-    // Re-setup reconfigures: web has no construction-bound engine options, so
-    // there's nothing to rebuild — the caller re-applies options/state on top.
-    if (this.hasInitialized === true) return
+    if (this.hasInitialized === true) {
+      const error: PlaybackError = {
+        code: 'player_already_initialized',
+        message: 'The player has already been initialized via setupPlayer.'
+      }
+      // eslint-disable-next-line @typescript-eslint/only-throw-error
+      throw error
+    }
 
-    const shaka = (await import('shaka-player/dist/shaka-player.compiled'))
-      .default
+    const shaka = (await import('shaka-player/dist/shaka-player.ui')).default
     // Install built-in polyfills to patch browser incompatibilities.
     shaka.polyfill.installAll()
     // Check to see if the browser supports the basic APIs Shaka needs.
@@ -107,7 +104,6 @@ export class Player {
       this.state = {
         state: State.Error,
         error: {
-          kind: 'unplayable',
           code: 'not_supported',
           message: 'Browser not supported...'
         }
@@ -131,30 +127,20 @@ export class Player {
       this.onError(errorEvent.detail)
     })
 
-    element.addEventListener('ended', () =>
-      this.dispatch({ type: 'trackEndedNaturally' })
-    )
-    element.addEventListener('playing', () =>
-      this.dispatch({ type: 'playing' })
-    )
-    element.addEventListener('pause', () =>
-      this.dispatch({ type: 'paused', hasAsset: this.current !== undefined })
-    )
-
-    player.addEventListener('loading', () =>
-      this.dispatch({ type: 'trackLoading' })
-    )
-    player.addEventListener('loaded', () =>
-      this.dispatch({ type: 'loadSeekCompleted' })
-    )
+    element.addEventListener('ended', () => this.onStateUpdate(State.Ended))
+    element.addEventListener('playing', () => this.onStateUpdate(State.Playing))
+    element.addEventListener('pause', () => this.onStateUpdate(State.Paused))
+
+    player.addEventListener('loading', () => this.onStateUpdate(State.Loading))
+    player.addEventListener('loaded', () => this.onStateUpdate(State.Ready))
 
     player.addEventListener('buffering', (event: Event) => {
       const bufferingEvent = event as ShakaBufferingEvent
-      this.dispatch(
-        bufferingEvent.detail.buffering === true
-          ? { type: 'waiting' }
-          : { type: 'bufferingSufficient' }
-      )
+      if (bufferingEvent.detail.buffering === true) {
+        this.onStateUpdate(State.Buffering)
+      } else {
+        this.onStateUpdate(State.Ready)
+      }
     })
 
     // Attach player to the window to make it easy to access in the JS console.
@@ -166,65 +152,38 @@ export class Player {
   }
 
   /**
-   * Routes a racy element/Shaka observation through the state machine. The
-   * machine decides the next state (or suppresses the transition); commands
-   * (stop, error) set their terminal state directly instead.
+   * event handlers
    */
-  protected dispatch(event: PlaybackEvent): void {
-    // Ignore element/Shaka events while stopped. This is broader than the
-    // machine's own stopped guards on purpose: native engines are torn down on
-    // stop so they emit nothing, but Shaka's unload() emits spurious events
-    // (pause, buffering) that would otherwise clobber the stopped state.
+  protected onStateUpdate(state: Exclude<StateType, typeof State.Error>): void {
+    // Ignore Shaka/element events while stopped (e.g., from unload)
     if (this._isStopped) return
-    const next = nextPlaybackState(this.state.state, event)
-    if (next !== null) this.applyState(next)
-  }
-
-  /**
-   * Applies a machine-decided state. Overridable so subclasses can react to
-   * specific transitions (e.g. QueuePlayer advancing the queue on `ended`).
-   */
-  protected applyState(state: PlaybackState): void {
     this.state = { state }
   }
 
-  private toNormalizedError(err: unknown): ShakaError {
+  private toNormalizedError(err: unknown): { code: number; message: string } {
     if (
       typeof err === 'object' &&
       err !== null &&
       'code' in err &&
       typeof (err as Record<string, unknown>).code === 'number'
     ) {
-      const e = err as ShakaError
-      return {
-        code: e.code,
-        message: e.message ?? 'Unknown error',
-        data: e.data
-      }
+      const e = err as { code: number; message?: string }
+      return { code: e.code, message: e.message ?? 'Unknown error' }
     }
 
     const message = err instanceof Error ? err.message : String(err)
     return { code: -1, message }
   }
 
-  protected onError(shakaError: ShakaError): void {
+  protected onError(shakaError: { code: number; message: string }): void {
     // unload the current track to allow for clean playback on other
     this.player?.unload().catch((err) => {
       console.error(`Error unloading player on 'onError'`, err)
     })
 
-    const status = shakaError.data?.[1]
-    const httpStatus = typeof status === 'number' ? status : undefined
     const error: PlaybackError = {
-      kind: playbackErrorKind(
-        shakaError.code,
-        httpStatus,
-        // `navigator` is absent when this runs outside a browser (SSR, tests).
-        typeof navigator === 'undefined' || navigator.onLine
-      ),
       code: shakaError.code.toString(),
-      message: shakaError.message,
-      statusCode: httpStatus
+      message: shakaError.message
     }
 
     this.state = {
@@ -236,22 +195,15 @@ export class Player {
     console.debug('Error code', shakaError.code, 'object', shakaError)
   }
 
-  /** Invalidates the .then/.catch of superseded loads — a Shaka load
-   * interrupted by stop() or a newer load() rejects, and only the active load
-   * may surface that (or run its onLoaded side effects). */
-  private _loadGeneration = 0
-
   public load(track: Track, onLoaded?: (track: Track) => void): void {
     const player = this.requirePlayer()
     this._isStopped = false
     this._loadInProgress = true
-    const generation = ++this._loadGeneration
 
     if (!track.src) {
       this._loadInProgress = false
       this._pendingSeek = undefined
       const error: PlaybackError = {
-        kind: 'unplayable',
         code: 'invalid_track',
         message: 'Track does not have a valid src URL'
       }
@@ -265,7 +217,6 @@ export class Player {
     player
       .load(track.src)
       .then(() => {
-        if (generation !== this._loadGeneration || this._isStopped) return
         this._loadInProgress = false
         this.current = track
         onLoaded?.(track)
@@ -282,7 +233,6 @@ export class Player {
         }
       })
       .catch((err: unknown) => {
-        if (generation !== this._loadGeneration || this._isStopped) return
         this._loadInProgress = false
         this._pendingSeek = undefined
         this.onError(this.toNormalizedError(err))
@@ -314,29 +264,19 @@ export class Player {
     this.playWhenReady = true
 
     if (this.state.state === State.Error && this.current) {
-      this.reloadCurrent()
+      this.load(this.current)
       return
     }
 
     // Match Android: play() after stop() re-prepares the current track
     if (this._isStopped && this.current) {
-      this.reloadCurrent()
+      this.load(this.current)
       return
     }
 
     element.play().catch((err: unknown) => console.error(err))
   }
 
-  /**
-   * Reloads the current track. `current` holds the *resolved* track, so
-   * subclasses that resolve media URLs override this to reload from the
-   * original source instead — re-feeding `current` into `load()` would
-   * re-resolve an already-resolved URL and leak it into the queue.
-   */
-  protected reloadCurrent(): void {
-    if (this.current) this.load(this.current)
-  }
-
   public retry(): void {
     const player = this.requirePlayer()
     player.retryStreaming()
@@ -386,20 +326,6 @@ export class Player {
     element.currentTime = seconds
   }
 
-  public seekToLiveEdge(): void {
-    if (this.current?.live !== true) return
-    const element = this.requireElement()
-    // Live with a seekable window (HLS): jump to the window end. Without one
-    // (non-seekable stream): reload to reconnect at the live edge.
-    const { seekable } = element
-    const end = seekable.length > 0 ? seekable.end(seekable.length - 1) : 0
-    if (end > 0) {
-      element.currentTime = end
-    } else {
-      this.reloadCurrent()
-    }
-  }
-
   public setVolume(volume: number): void {
     const element = this.requireElement()
     element.volume = volume

package/src/web/TrackPlayer/PlaylistPlayer.ts

@@ -0,0 +1,346 @@
+import type { RepeatMode as RepeatModeType } from '../../features'
+import type { Track } from '../../types'
+import type { State as StateType } from './State'
+import { assertedNotNullish } from '../../utils/validation'
+import { fisherYatesShuffle } from '../util/shuffle'
+import { Player } from './Player'
+import { RepeatMode } from './RepeatMode'
+import { State } from './State'
+
+export class PlaylistPlayer extends Player {
+  // TODO: use immer to make the `playlist` immutable
+  protected playlist: Track[] = []
+  protected lastIndex?: number
+  protected _currentIndex?: number
+  protected repeatMode: RepeatModeType = RepeatMode.Off
+  protected shuffleEnabled: boolean = false
+  protected shuffleOrder: number[] = []
+
+  protected onStateUpdate(state: Exclude<StateType, typeof State.Error>) {
+    super.onStateUpdate(state)
+
+    if (this._isStopped) return
+
+    if (state === State.Ended) {
+      this.onTrackEnded()
+    }
+  }
+
+  protected onTrackEnded() {
+    switch (this.repeatMode) {
+      case RepeatMode.Track:
+        if (this.currentIndex !== undefined) {
+          this.goToIndex(this.currentIndex)
+        }
+        break
+      case RepeatMode.Playlist:
+        this.skipToNext()
+        break
+      default:
+        if (this.getNextIndex() !== undefined) {
+          this.skipToNext()
+        } else {
+          this.onPlaylistEnded()
+        }
+        break
+    }
+  }
+
+  protected onPlaylistEnded() {
+    console.warn('`onPlaylistEnded` is currently unimplemented')
+  }
+
+  protected get currentIndex() {
+    return this._currentIndex
+  }
+
+  protected set currentIndex(current: number | undefined) {
+    this.lastIndex = this.currentIndex
+    this._currentIndex = current
+  }
+
+  protected goToIndex(index: number, initialPosition?: number) {
+    const track = this.playlist[index]
+
+    if (!track) return
+
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    const onLoaded = (_track: Track) => {
+      if (initialPosition !== undefined) {
+        this.seekTo(initialPosition)
+      }
+    }
+
+    if (this.currentIndex !== index) {
+      this.currentIndex = index
+      this.load(track, onLoaded)
+    } else {
+      // Replay the same track - seek to start (or initialPosition if specified)
+      this.seekTo(initialPosition ?? 0)
+      if (this.playWhenReady) {
+        this.play()
+      }
+    }
+  }
+
+  public add(tracks: Track[], insertBeforeIndex?: number): void {
+    if (insertBeforeIndex !== -1 && insertBeforeIndex !== undefined) {
+      this.playlist.splice(insertBeforeIndex, 0, ...tracks)
+    } else {
+      this.playlist.push(...tracks)
+    }
+
+    if (this.currentIndex === undefined) {
+      this.goToIndex(0)
+    }
+
+    // Regenerate shuffle order when tracks are added
+    if (this.shuffleEnabled) {
+      this.generateShuffleOrder()
+    }
+  }
+
+  public skip(index: number, initialPosition?: number): void {
+    const track = this.playlist[index]
+
+    if (track === undefined) {
+      throw new Error('index out of bounds')
+    }
+
+    this.goToIndex(index, initialPosition)
+  }
+
+  public skipToNext(initialPosition?: number): void {
+    if (this.currentIndex === undefined) return
+
+    const nextIndex = this.getNextIndex() ?? this.getWrapAroundFirstIndex()
+    if (nextIndex === undefined) return
+
+    this.goToIndex(nextIndex, initialPosition)
+  }
+
+  public skipToPrevious(initialPosition?: number): void {
+    if (this.currentIndex === undefined) return
+
+    const previousIndex =
+      this.getPreviousIndex() ?? this.getWrapAroundLastIndex()
+    if (previousIndex === undefined) return
+
+    this.goToIndex(previousIndex, initialPosition)
+  }
+
+  protected getNextIndex(): number | undefined {
+    if (this.currentIndex === undefined) return undefined
+
+    if (!this.shuffleEnabled) {
+      // Normal sequential order
+      const nextIndex = this.currentIndex + 1
+      if (nextIndex >= this.playlist.length) return undefined
+      return nextIndex
+    }
+
+    // Find current position in shuffle order
+    const currentShufflePos = this.shuffleOrder.indexOf(this.currentIndex)
+    if (currentShufflePos === -1) return undefined
+
+    // Get next position in shuffle order
+    const nextShufflePos = currentShufflePos + 1
+    if (nextShufflePos >= this.shuffleOrder.length) {
+      return undefined
+    }
+
+    return this.shuffleOrder[nextShufflePos]
+  }
+
+  protected getPreviousIndex(): number | undefined {
+    if (this.currentIndex === undefined) return undefined
+
+    if (!this.shuffleEnabled) {
+      // Normal sequential order
+      const prevIndex = this.currentIndex - 1
+      if (prevIndex < 0) return undefined
+      return prevIndex
+    }
+
+    // Find current position in shuffle order
+    const currentShufflePos = this.shuffleOrder.indexOf(this.currentIndex)
+    if (currentShufflePos === -1) return undefined
+
+    // Get previous position in shuffle order
+    const previousShufflePos = currentShufflePos - 1
+    if (previousShufflePos < 0) {
+      return undefined
+    }
+
+    return this.shuffleOrder[previousShufflePos]
+  }
+
+  protected getWrapAroundFirstIndex(): number | undefined {
+    if (this.repeatMode !== RepeatMode.Playlist) return undefined
+    if (this.shuffleEnabled) return this.shuffleOrder[0]
+    return 0
+  }
+
+  protected getWrapAroundLastIndex(): number | undefined {
+    if (this.repeatMode !== RepeatMode.Playlist) return undefined
+    if (this.shuffleEnabled)
+      return this.shuffleOrder[this.shuffleOrder.length - 1]
+    return this.playlist.length - 1
+  }
+
+  protected generateShuffleOrder(): void {
+    // Create array of indices [0, 1, 2, ..., n-1]
+    this.shuffleOrder = Array.from(
+      { length: this.playlist.length },
+      (_, i) => i
+    )
+
+    // Shuffle the indices
+    fisherYatesShuffle(this.shuffleOrder)
+
+    // If there is NOT a current track, exit
+    if (this.currentIndex === undefined) {
+      return
+    }
+
+    // If there is a current track, move it to the beginning of the shuffle order
+    const currentPos = this.shuffleOrder.indexOf(this.currentIndex)
+    if (currentPos > 0) {
+      const temp = assertedNotNullish(this.shuffleOrder[0])
+      this.shuffleOrder[0] = assertedNotNullish(this.shuffleOrder[currentPos])
+      this.shuffleOrder[currentPos] = temp
+    }
+  }
+
+  public setShuffleEnabled(enabled: boolean): void {
+    this.shuffleEnabled = enabled
+
+    if (enabled) {
+      // Generate new shuffle order when enabling shuffle
+      this.generateShuffleOrder()
+    }
+  }
+
+  public getShuffleEnabled(): boolean {
+    return this.shuffleEnabled
+  }
+
+  public getTrack(index: number): Track | undefined {
+    const track = this.playlist[index]
+    return track
+  }
+
+  public setRepeatMode(mode: RepeatModeType): void {
+    this.repeatMode = mode
+  }
+
+  public getRepeatMode(): RepeatModeType {
+    return this.repeatMode
+  }
+
+  public remove(indexes: number[]): void {
+    const idxSet = new Set(indexes)
+    let isCurrentRemoved = false
+    let removedBeforeCurrent = 0
+
+    this.playlist = this.playlist.filter((_track, idx) => {
+      const keep = !idxSet.has(idx)
+
+      if (!keep) {
+        if (idx === this.currentIndex) {
+          isCurrentRemoved = true
+        } else if (this.currentIndex !== undefined && idx < this.currentIndex) {
+          removedBeforeCurrent++
+        }
+      }
+
+      return keep
+    })
+
+    if (this.currentIndex === undefined) {
+      return
+    }
+
+    if (isCurrentRemoved) {
+      const hasItems = this.playlist.length > 0
+      if (hasItems) {
+        // Adjust for removed items before current, then clamp to valid range
+        const adjustedIndex = this.currentIndex - removedBeforeCurrent
+        // Reset so goToIndex always loads the new track at this position
+        this._currentIndex = undefined
+        this.goToIndex(Math.min(adjustedIndex, this.playlist.length - 1))
+      } else {
+        this.current = undefined
+        this._currentIndex = undefined
+        this.stop()
+      }
+    } else {
+      // Adjust currentIndex to account for removed items before it
+      this._currentIndex = this.currentIndex - removedBeforeCurrent
+    }
+
+    // Regenerate shuffle order when tracks are removed
+    if (this.shuffleEnabled) {
+      this.generateShuffleOrder()
+    }
+  }
+
+  public stop(onComplete?: () => void): void {
+    super.stop(onComplete)
+  }
+
+  public reset(): void {
+    // Clear queue state synchronously so subsequent add()/load() calls
+    // see a clean slate. The async player.unload() in stop() can finish
+    // in the background — it only releases the Shaka source.
+    this.playlist = []
+    this.current = undefined
+    this._currentIndex = undefined
+    this.stop()
+  }
+
+  public removeUpcomingTracks(): void {
+    if (this.currentIndex === undefined) return
+    this.playlist = this.playlist.slice(0, this.currentIndex + 1)
+
+    // Regenerate shuffle order when tracks are removed
+    if (this.shuffleEnabled) {
+      this.generateShuffleOrder()
+    }
+  }
+
+  public move(fromIndex: number, toIndex: number): void {
+    if (!this.playlist[fromIndex]) {
+      throw new Error('index out of bounds')
+    }
+
+    // Move the track in the playlist
+    const fromItem = this.playlist[fromIndex]
+    this.playlist.splice(fromIndex, 1)
+    this.playlist.splice(toIndex, 0, fromItem)
+
+    // Update currentIndex to track the currently playing item's new position.
+    // Matches Android's exoPlayer.moveMediaItem() which has no restrictions.
+    if (this.currentIndex !== undefined) {
+      if (fromIndex === this.currentIndex) {
+        // Moving the current track — follow it to its new position
+        this._currentIndex = toIndex
+      } else if (
+        fromIndex < this.currentIndex &&
+        toIndex >= this.currentIndex
+      ) {
+        this._currentIndex = this.currentIndex - 1
+      } else if (
+        fromIndex > this.currentIndex &&
+        toIndex <= this.currentIndex
+      ) {
+        this._currentIndex = this.currentIndex + 1
+      }
+    }
+
+    // Regenerate shuffle order when tracks are moved
+    if (this.shuffleEnabled) {
+      this.generateShuffleOrder()
+    }
+  }
+}

package/src/web/TrackPlayer/RepeatMode.ts

@@ -3,5 +3,5 @@ import type { RepeatMode as RepeatModeType } from '../../features'
 export const RepeatMode = {
   Off: 'off' as const,
   Track: 'track' as const,
-  Queue: 'queue' as const
+  Playlist: 'queue' as const
 } satisfies Record<string, RepeatModeType>