@5stones/react-native-audio-browser 0.1.3 → 0.1.5

package/src/web/TrackPlayer/Player.ts

@@ -1,14 +1,14 @@
-import { State } from './State'
-import type { State as StateType } from './State'
+import type shaka from 'shaka-player/dist/shaka-player.ui'
 import type {
   Progress,
   PartialSetupPlayerOptions,
   Playback,
-  PlaybackError,
+  PlaybackError
 } from '../../features'
 import type { Track } from '../../types'
+import type { State as StateType } from './State'
 import { SetupNotCalledError } from './SetupNotCalledError'
-import type shaka from 'shaka-player/dist/shaka-player.ui'
+import { State } from './State'
 
 // Extend Window interface for debug purposes
 declare global {
@@ -38,6 +38,9 @@ export class Player {
   protected _current?: Track = undefined
   protected _playWhenReady = false
   protected _state: Playback = { state: State.None }
+  protected _isStopped = false
+  protected _loadInProgress = false
+  protected _pendingSeek: number | undefined
 
   // current getter/setter
   public get current(): Track | undefined {
@@ -86,7 +89,7 @@ export class Player {
     if (this.hasInitialized === true) {
       const error: PlaybackError = {
         code: 'player_already_initialized',
-        message: 'The player has already been initialized via setupPlayer.',
+        message: 'The player has already been initialized via setupPlayer.'
       }
       // eslint-disable-next-line @typescript-eslint/only-throw-error
       throw error
@@ -102,8 +105,8 @@ export class Player {
         state: State.Error,
         error: {
           code: 'not_supported',
-          message: 'Browser not supported...',
-        },
+          message: 'Browser not supported...'
+        }
       }
       throw new Error('Browser not supported.')
     }
@@ -152,6 +155,8 @@ export class Player {
    * event handlers
    */
   protected onStateUpdate(state: Exclude<StateType, typeof State.Error>): void {
+    // Ignore Shaka/element events while stopped (e.g., from unload)
+    if (this._isStopped) return
     this.state = { state }
   }
 
@@ -178,34 +183,33 @@ export class Player {
 
     const error: PlaybackError = {
       code: shakaError.code.toString(),
-      message: shakaError.message,
+      message: shakaError.message
     }
 
     this.state = {
       state: State.Error,
-      error,
+      error
     }
 
     // Log the error.
     console.debug('Error code', shakaError.code, 'object', shakaError)
   }
 
-  /**
-   * NOTE: this method is sync despite the actual load being async. This
-   * behavior is intentional as it mirrors what happens in Android. State
-   * changes should be captured by event listeners.
-   */
-  public load(track: Track, onComplete?: (track: Track) => void): void {
+  public load(track: Track, onLoaded?: (track: Track) => void): void {
     const player = this.requirePlayer()
+    this._isStopped = false
+    this._loadInProgress = true
 
     if (!track.src) {
+      this._loadInProgress = false
+      this._pendingSeek = undefined
       const error: PlaybackError = {
         code: 'invalid_track',
-        message: 'Track does not have a valid src URL',
+        message: 'Track does not have a valid src URL'
       }
       this.state = {
         state: State.Error,
-        error,
+        error
       }
       return
     }
@@ -213,8 +217,15 @@ export class Player {
     player
       .load(track.src)
       .then(() => {
+        this._loadInProgress = false
         this.current = track
-        onComplete?.(track)
+        onLoaded?.(track)
+
+        // Execute any pending seek that arrived during loading
+        if (this._pendingSeek !== undefined) {
+          this.requireElement().currentTime = this._pendingSeek
+          this._pendingSeek = undefined
+        }
 
         // Auto-play if playWhenReady is true
         if (this.playWhenReady) {
@@ -222,19 +233,23 @@ export class Player {
         }
       })
       .catch((err: unknown) => {
+        this._loadInProgress = false
+        this._pendingSeek = undefined
         this.onError(this.toNormalizedError(err))
       })
   }
 
-  /**
-   * NOTE: this method is sync despite the actual load being async. This
-   * behavior is intentional as it mirrors what happens in Android. State
-   * changes should be captured by event listeners.
-   */
   public stop(onComplete?: () => void): void {
     const player = this.requirePlayer()
 
-    this.current = undefined
+    // Match Android: stop sets playWhenReady=false and state=stopped,
+    // but keeps the current track so play() can resume.
+    this._isStopped = true
+    this._loadInProgress = false
+    this._pendingSeek = undefined
+    this.playWhenReady = false
+    this.state = { state: State.Stopped }
+
     player
       .unload()
       .then(() => onComplete?.())
@@ -244,11 +259,6 @@ export class Player {
       })
   }
 
-  /**
-   * NOTE: this method is sync despite the actual load being async. This
-   * behavior is intentional as it mirrors what happens in Android. State
-   * changes should be captured by event listeners.
-   */
   public play(): void {
     const element = this.requireElement()
     this.playWhenReady = true
@@ -258,6 +268,12 @@ export class Player {
       return
     }
 
+    // Match Android: play() after stop() re-prepares the current track
+    if (this._isStopped && this.current) {
+      this.load(this.current)
+      return
+    }
+
     element.play().catch((err: unknown) => console.error(err))
   }
 
@@ -293,11 +309,19 @@ export class Player {
   }
 
   public seekBy(offset: number): void {
+    if (this._loadInProgress) {
+      this._pendingSeek = (this._pendingSeek ?? 0) + offset
+      return
+    }
     const element = this.requireElement()
     element.currentTime += offset
   }
 
   public seekTo(seconds: number): void {
+    if (this._loadInProgress) {
+      this._pendingSeek = seconds
+      return
+    }
     const element = this.requireElement()
     element.currentTime = seconds
   }
@@ -314,10 +338,14 @@ export class Player {
 
   public getProgress(): Progress {
     const element = this.requireElement()
+    let buffered = 0
+    if (element.buffered.length > 0) {
+      buffered = element.buffered.end(element.buffered.length - 1)
+    }
     return {
       position: element.currentTime,
       duration: element.duration || 0,
-      buffered: 0, // TODO: element.buffered.end,
+      buffered
     }
   }
 }

package/src/web/TrackPlayer/PlaylistPlayer.ts

@@ -1,11 +1,11 @@
-import { Player } from './Player'
-import { State } from './State'
-import type { State as StateType } from './State'
-
-import type { Track } from '../../types'
 import type { RepeatMode as RepeatModeType } from '../../features'
-import { RepeatMode } from './RepeatMode'
+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
@@ -19,6 +19,8 @@ export class PlaylistPlayer extends Player {
   protected onStateUpdate(state: Exclude<StateType, typeof State.Error>) {
     super.onStateUpdate(state)
 
+    if (this._isStopped) return
+
     if (state === State.Ended) {
       this.onTrackEnded()
     }
@@ -63,19 +65,15 @@ export class PlaylistPlayer extends Player {
     if (!track) return
 
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    const onCompletedLoading = (_track: Track) => {
+    const onLoaded = (_track: Track) => {
       if (initialPosition !== undefined) {
         this.seekTo(initialPosition)
       }
-
-      if (this.playWhenReady) {
-        this.play()
-      }
     }
 
     if (this.currentIndex !== index) {
       this.currentIndex = index
-      this.load(track, onCompletedLoading)
+      this.load(track, onLoaded)
     } else {
       // Replay the same track - seek to start (or initialPosition if specified)
       this.seekTo(initialPosition ?? 0)
@@ -124,7 +122,8 @@ export class PlaylistPlayer extends Player {
   public skipToPrevious(initialPosition?: number): void {
     if (this.currentIndex === undefined) return
 
-    const previousIndex = this.getPreviousIndex() ?? this.getWrapAroundLastIndex()
+    const previousIndex =
+      this.getPreviousIndex() ?? this.getWrapAroundLastIndex()
     if (previousIndex === undefined) return
 
     this.goToIndex(previousIndex, initialPosition)
@@ -184,13 +183,17 @@ export class PlaylistPlayer extends Player {
 
   protected getWrapAroundLastIndex(): number | undefined {
     if (this.repeatMode !== RepeatMode.Playlist) return undefined
-    if (this.shuffleEnabled) return this.shuffleOrder[this.shuffleOrder.length - 1]
+    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)
+    this.shuffleOrder = Array.from(
+      { length: this.playlist.length },
+      (_, i) => i
+    )
 
     // Shuffle the indices
     fisherYatesShuffle(this.shuffleOrder)
@@ -203,8 +206,8 @@ export class PlaylistPlayer extends Player {
     // 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 = this.shuffleOrder[0]!
-      this.shuffleOrder[0] = this.shuffleOrder[currentPos]!
+      const temp = assertedNotNullish(this.shuffleOrder[0])
+      this.shuffleOrder[0] = assertedNotNullish(this.shuffleOrder[currentPos])
       this.shuffleOrder[currentPos] = temp
     }
   }
@@ -236,16 +239,19 @@ export class PlaylistPlayer extends Player {
   }
 
   public remove(indexes: number[]): void {
-    const idxMap = indexes.reduce<Record<number, boolean>>((acc, elem) => {
-      acc[elem] = true
-      return acc
-    }, {})
+    const idxSet = new Set(indexes)
     let isCurrentRemoved = false
+    let removedBeforeCurrent = 0
+
     this.playlist = this.playlist.filter((_track, idx) => {
-      const keep = !idxMap[idx]
+      const keep = !idxSet.has(idx)
 
-      if (!keep && idx === this.currentIndex) {
-        isCurrentRemoved = true
+      if (!keep) {
+        if (idx === this.currentIndex) {
+          isCurrentRemoved = true
+        } else if (this.currentIndex !== undefined && idx < this.currentIndex) {
+          removedBeforeCurrent++
+        }
       }
 
       return keep
@@ -255,11 +261,22 @@ export class PlaylistPlayer extends Player {
       return
     }
 
-    const hasItems = this.playlist.length > 0
-    if (isCurrentRemoved && hasItems) {
-      this.goToIndex(this.currentIndex % this.playlist.length)
-    } else if (isCurrentRemoved) {
-      this.stop()
+    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
@@ -269,16 +286,17 @@ export class PlaylistPlayer extends Player {
   }
 
   public stop(onComplete?: () => void): void {
-    super.stop(() => {
-      this.currentIndex = undefined
-      onComplete?.()
-    })
+    super.stop(onComplete)
   }
 
   public reset(): void {
-    this.stop(() => {
-      this.playlist = []
-    })
+    // 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 {
@@ -296,37 +314,28 @@ export class PlaylistPlayer extends Player {
       throw new Error('index out of bounds')
     }
 
-    if (this.currentIndex === fromIndex) {
-      throw new Error('you cannot move the currently playing track')
-    }
-
-    if (this.currentIndex === toIndex) {
-      throw new Error('you cannot replace the currently playing track')
-    }
-
-    // calculate `currentIndex` after move
-    let shift: number | undefined
-    if (
-      this.currentIndex !== undefined &&
-      fromIndex < this.currentIndex &&
-      toIndex > this.currentIndex
-    ) {
-      shift = -1
-    } else if (
-      this.currentIndex !== undefined &&
-      fromIndex > this.currentIndex &&
-      toIndex < this.currentIndex
-    ) {
-      shift = 1
-    }
-
-    // move the track
+    // Move the track in the playlist
     const fromItem = this.playlist[fromIndex]
     this.playlist.splice(fromIndex, 1)
     this.playlist.splice(toIndex, 0, fromItem)
 
-    if (this.currentIndex !== undefined && shift) {
-      this.currentIndex = this.currentIndex + shift
+    // 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

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,
-  Playlist: 'queue' as const,
+  Playlist: 'queue' as const
 } satisfies Record<string, RepeatModeType>

package/src/web/TrackPlayer/State.ts

@@ -1,15 +1,15 @@
 import type { PlaybackState } from '../../features'
 
 export const State = {
-  None: 'none' as const,
-  Ready: 'ready' as const,
-  Playing: 'playing' as const,
-  Paused: 'paused' as const,
-  Stopped: 'stopped' as const,
-  Loading: 'loading' as const,
-  Buffering: 'buffering' as const,
-  Error: 'error' as const,
-  Ended: 'ended' as const
+  None: 'none',
+  Ready: 'ready',
+  Playing: 'playing',
+  Paused: 'paused',
+  Stopped: 'stopped',
+  Loading: 'loading',
+  Buffering: 'buffering',
+  Error: 'error',
+  Ended: 'ended'
 } satisfies Record<string, PlaybackState>
 
 export type State = (typeof State)[keyof typeof State]