@prose-reader/enhancer-audio 1.285.0

package/dist/index.js

@@ -0,0 +1,908 @@
+import { ReactiveEntity, mapKeysTo, isDefined, DocumentRenderer } from '@prose-reader/core';
+import { BehaviorSubject, Subscription, distinctUntilChanged, switchMap, of, concat, map, defaultIfEmpty, defer, from, EMPTY, animationFrames, fromEvent, share, merge, retry, take, shareReplay, combineLatest, Subject, withLatestFrom, filter, tap, catchError, takeUntil } from 'rxjs';
+
+const AUDIO_VISUALIZER_LEVEL_COUNT = 80;
+const AUDIO_VISUALIZER_NOISE_FLOOR = 0.035;
+const getIdleVisualizerLevels = () => Array.from({ length: AUDIO_VISUALIZER_LEVEL_COUNT }, () => 0);
+const getVisualizerLevels = (data) => {
+  if (data.length === 0) return getIdleVisualizerLevels();
+  const bucketSize = Math.max(
+    1,
+    Math.floor(data.length / AUDIO_VISUALIZER_LEVEL_COUNT)
+  );
+  return Array.from({ length: AUDIO_VISUALIZER_LEVEL_COUNT }, (_, index) => {
+    const start = index * bucketSize;
+    const end = Math.min(data.length, start + bucketSize);
+    if (start >= data.length || start === end) return 0;
+    let total = 0;
+    for (let cursor = start; cursor < end; cursor += 1) {
+      total += data[cursor] ?? 0;
+    }
+    const average = total / (end - start);
+    const normalizedAverage = average / 255;
+    const gatedAverage = (normalizedAverage - AUDIO_VISUALIZER_NOISE_FLOOR) / (1 - AUDIO_VISUALIZER_NOISE_FLOOR);
+    return Math.max(0, Math.min(1, gatedAverage));
+  });
+};
+
+const AUDIO_VISUALIZER_FFT_SIZE = 256;
+class VisualizerAudioGraph {
+  constructor(audioElement) {
+    this.audioElement = audioElement;
+  }
+  audioContext;
+  audioSourceNode;
+  analyserNode;
+  frequencyData;
+  async resumeIfNeeded() {
+    if (!this.ensure()) {
+      return false;
+    }
+    const audioContext = this.audioContext;
+    if (!audioContext) {
+      return false;
+    }
+    if (audioContext.state !== `suspended`) {
+      return true;
+    }
+    try {
+      await audioContext.resume();
+      return true;
+    } catch {
+      return false;
+    }
+  }
+  readLevels() {
+    if (!this.analyserNode || !this.frequencyData) {
+      return getIdleVisualizerLevels();
+    }
+    this.analyserNode.getByteFrequencyData(this.frequencyData);
+    return getVisualizerLevels(this.frequencyData);
+  }
+  destroy() {
+    this.audioSourceNode?.disconnect();
+    this.analyserNode?.disconnect();
+    this.audioContext?.close().catch(() => void 0);
+    this.audioContext = void 0;
+    this.audioSourceNode = void 0;
+    this.analyserNode = void 0;
+    this.frequencyData = void 0;
+  }
+  ensure() {
+    if (this.audioContext && this.analyserNode && this.frequencyData) {
+      return true;
+    }
+    if (typeof window === `undefined` || !window.AudioContext) {
+      return false;
+    }
+    const audioContext = new window.AudioContext();
+    const audioSourceNode = audioContext.createMediaElementSource(
+      this.audioElement
+    );
+    const analyserNode = audioContext.createAnalyser();
+    analyserNode.fftSize = AUDIO_VISUALIZER_FFT_SIZE;
+    analyserNode.smoothingTimeConstant = 0.8;
+    audioSourceNode.connect(analyserNode);
+    analyserNode.connect(audioContext.destination);
+    this.audioContext = audioContext;
+    this.audioSourceNode = audioSourceNode;
+    this.analyserNode = analyserNode;
+    this.frequencyData = new Uint8Array(analyserNode.frequencyBinCount);
+    return true;
+  }
+}
+
+class AudioVisualizer extends ReactiveEntity {
+  audioGraph;
+  playbackState$ = new BehaviorSubject({
+    trackId: void 0,
+    isRunning: false,
+    resetLevels: false
+  });
+  subscriptions = new Subscription();
+  constructor(audioElement) {
+    super({
+      levels: getIdleVisualizerLevels(),
+      isActive: false,
+      trackId: void 0
+    });
+    this.audioGraph = new VisualizerAudioGraph(audioElement);
+    this.subscriptions.add(
+      this.playbackState$.pipe(
+        distinctUntilChanged(
+          (previous, next) => previous.trackId === next.trackId && previous.isRunning === next.isRunning && previous.resetLevels === next.resetLevels
+        ),
+        switchMap(({ trackId, isRunning, resetLevels }) => {
+          if (!trackId || !isRunning) {
+            return of({
+              trackId,
+              isActive: false,
+              ...resetLevels ? { levels: getIdleVisualizerLevels() } : void 0
+            });
+          }
+          const shouldResetLevels = this.value.trackId !== trackId;
+          return concat(
+            of({
+              trackId,
+              isActive: true,
+              ...shouldResetLevels ? { levels: getIdleVisualizerLevels() } : void 0
+            }),
+            this.createLevels$().pipe(
+              map((levels) => ({
+                trackId,
+                levels,
+                isActive: true
+              })),
+              defaultIfEmpty({
+                trackId,
+                isActive: false,
+                levels: getIdleVisualizerLevels()
+              })
+            )
+          );
+        })
+      ).subscribe((value) => {
+        this.mergeCompare(value);
+      })
+    );
+  }
+  start(currentTrack) {
+    if (!currentTrack) return;
+    this.playbackState$.next({
+      trackId: currentTrack.id,
+      isRunning: true,
+      resetLevels: false
+    });
+  }
+  setTrack(trackId) {
+    this.playbackState$.next({
+      trackId,
+      isRunning: false,
+      resetLevels: false
+    });
+  }
+  reset(trackId) {
+    this.playbackState$.next({
+      trackId,
+      isRunning: false,
+      resetLevels: true
+    });
+  }
+  stop({ resetLevels = false } = {}) {
+    this.playbackState$.next({
+      trackId: this.playbackState$.value.trackId,
+      isRunning: false,
+      resetLevels
+    });
+  }
+  destroy() {
+    this.stop({
+      resetLevels: true
+    });
+    this.subscriptions.unsubscribe();
+    this.playbackState$.complete();
+    this.audioGraph.destroy();
+    super.destroy();
+  }
+  createLevels$() {
+    return defer(() => {
+      return from(this.audioGraph.resumeIfNeeded()).pipe(
+        switchMap(
+          (isReady) => isReady ? animationFrames().pipe(map(() => this.audioGraph.readLevels())) : EMPTY
+        )
+      );
+    });
+  }
+}
+
+class AudioElementAdapter {
+  element;
+  canPlay$;
+  ended$;
+  isPlaying$;
+  metrics$;
+  constructor() {
+    this.element = document.createElement(`audio`);
+    this.element.preload = `metadata`;
+    this.canPlay$ = fromEvent(this.element, `canplay`).pipe(share());
+    this.ended$ = fromEvent(this.element, `ended`).pipe(share());
+    this.isPlaying$ = merge(
+      fromEvent(this.element, `play`).pipe(map(() => true)),
+      fromEvent(this.element, `pause`).pipe(map(() => false))
+    ).pipe(share());
+    this.metrics$ = merge(
+      fromEvent(this.element, `timeupdate`),
+      fromEvent(this.element, `seeking`),
+      fromEvent(this.element, `seeked`),
+      fromEvent(this.element, `loadedmetadata`),
+      fromEvent(this.element, `durationchange`),
+      this.canPlay$
+    ).pipe(
+      map(() => ({
+        currentTime: this.element.currentTime,
+        duration: Number.isFinite(this.element.duration) ? this.element.duration : void 0
+      })),
+      share()
+    );
+  }
+  get paused() {
+    return this.element.paused;
+  }
+  get hasSource() {
+    return this.element.hasAttribute(`src`);
+  }
+  play$() {
+    return defer(() => from(this.element.play())).pipe(
+      retry({
+        count: 1,
+        delay: () => this.canPlay$.pipe(take(1))
+      })
+    );
+  }
+  pause() {
+    this.element.pause();
+  }
+  loadSource(src) {
+    this.element.src = src;
+    this.element.load();
+  }
+  unloadSource() {
+    this.element.removeAttribute(`src`);
+    this.element.load();
+  }
+  setCurrentTime(value) {
+    this.element.currentTime = value;
+  }
+}
+
+class ResourcesResolver {
+  cachedSourceByTrackId = /* @__PURE__ */ new Map();
+  hasCachedSource(trackId) {
+    return this.cachedSourceByTrackId.has(trackId);
+  }
+  getTrackResourceUrl$ = (track, resourcesHandler) => {
+    const cachedSource = this.cachedSourceByTrackId.get(track.id);
+    if (cachedSource) {
+      return of(cachedSource.url);
+    }
+    const resource$ = from(resourcesHandler.getResource());
+    return resource$.pipe(
+      switchMap((resource) => {
+        if (resource instanceof URL) {
+          this.cachedSourceByTrackId.set(track.id, {
+            url: resource.href
+          });
+          return of(resource.href);
+        }
+        if (resource instanceof Response) {
+          return from(resource.blob()).pipe(
+            map((blob) => {
+              const objectUrl = URL.createObjectURL(blob);
+              this.cachedSourceByTrackId.set(track.id, {
+                url: objectUrl,
+                release: () => {
+                  URL.revokeObjectURL(objectUrl);
+                }
+              });
+              return objectUrl;
+            })
+          );
+        }
+        this.cachedSourceByTrackId.set(track.id, {
+          url: track.href
+        });
+        return of(track.href);
+      })
+    );
+  };
+  releaseTrackSource(trackId) {
+    const cachedSource = this.cachedSourceByTrackId.get(trackId);
+    if (!cachedSource) return;
+    this.cachedSourceByTrackId.delete(trackId);
+    cachedSource.release?.();
+  }
+  releaseAll() {
+    for (const trackId of this.cachedSourceByTrackId.keys()) {
+      this.releaseTrackSource(trackId);
+    }
+  }
+  destroy() {
+    this.releaseAll();
+  }
+}
+
+const $ = (e, n) => e === n ? true : e.length !== n.length ? false : e.every((t, r) => t === n[r]);
+const d = Object.prototype.hasOwnProperty, h = (e, n) => e === n ? e !== 0 || n !== 0 || 1 / e === 1 / n : false, _ = (e, n, t) => {
+  if (e === n)
+    return true;
+  if (typeof e != "object" || e === null || typeof n != "object" || n === null)
+    return false;
+  const r = Object.keys(e), l = Object.keys(n);
+  if (r.length !== l.length)
+    return false;
+  const o = t && typeof t.customEqual == "function" ? t.customEqual : h;
+  for (let c = 0; c < r.length; c++) {
+    const u = r[c] || "";
+    if (!d.call(n, u) || !o(e[u], n[u]))
+      return false;
+  }
+  return true;
+};
+const E = () => {
+  if (!(typeof window > "u"))
+    return window;
+};
+function w() {
+  const e = E()?.__PROSE_READER_DEBUG;
+  return e === true || e === "true";
+}
+const s = (e, n = w(), t) => {
+  let r = n;
+  const l = t?.color ? `color: ${t.color}` : void 0, o = {
+    enable: (i) => {
+      u(i);
+    },
+    namespace: (i, a) => s(`${e} [${i}]`, a, t),
+    isEnabled: () => r,
+    debug: () => {
+    },
+    info: () => {
+    },
+    log: () => {
+    },
+    groupCollapsed: () => {
+    },
+    groupEnd: () => {
+    },
+    getGroupArgs: (i) => l ? [`%c${e ? `${e} ${i}` : i}`, l] : [e ? `${e} ${i}` : i],
+    warn: () => {
+    },
+    error: () => {
+    }
+  }, c = (i) => {
+    if (!i) {
+      o.debug = () => {
+      }, o.info = () => {
+      }, o.log = () => {
+      }, o.groupCollapsed = () => {
+      }, o.groupEnd = () => {
+      }, o.warn = () => {
+      }, o.error = () => {
+      };
+      return;
+    }
+    o.debug = e ? Function.prototype.bind.call(
+      console.debug,
+      console,
+      e,
+      `%c${e}`,
+      l
+    ) : Function.prototype.bind.call(
+      console.debug,
+      console,
+      `%c${e}`,
+      l
+    ), o.info = Function.prototype.bind.call(
+      console.info,
+      console,
+      `%c${e}`,
+      l
+    ), o.log = e ? Function.prototype.bind.call(
+      console.log,
+      console,
+      `%c${e}`,
+      l
+    ) : Function.prototype.bind.call(console.log, console), o.groupCollapsed = Function.prototype.bind.call(
+      console.groupCollapsed,
+      console
+    ), o.groupEnd = Function.prototype.bind.call(console.groupEnd, console), o.warn = Function.prototype.bind.call(
+      console.warn,
+      console,
+      `%c${e}`,
+      l
+    ), o.error = Function.prototype.bind.call(
+      console.error,
+      console,
+      `%c${e}`,
+      l
+    );
+  }, u = (i) => {
+    r !== i && (r = i, c(r));
+  };
+  return c(r), o;
+}; ({
+  ...s()});
+
+const AUDIO_EXTENSIONS = /* @__PURE__ */ new Set([
+  `mp3`,
+  `m4a`,
+  `m4b`,
+  `aac`,
+  `ogg`,
+  `oga`,
+  `wav`,
+  `flac`,
+  `opus`
+]);
+const getExtensionFromHref = (href) => {
+  const [pathname = ``] = href.split(/[?#]/);
+  const segments = pathname.split(`/`);
+  const basename = segments.at(-1) ?? ``;
+  const extension = basename.split(`.`).at(-1);
+  return extension?.toLowerCase();
+};
+const isAudioSpineItem = (item) => {
+  const mediaType = item.mediaType?.split(`;`).at(0)?.trim().toLowerCase();
+  if (mediaType?.startsWith(`audio/`)) {
+    return true;
+  }
+  const extension = getExtensionFromHref(item.href);
+  return extension ? AUDIO_EXTENSIONS.has(extension) : false;
+};
+
+const getTrackAtSpineItemIndex = (tracks, index) => {
+  if (index === void 0) return void 0;
+  return tracks.find((track) => track.index === index);
+};
+const getVisibleTracks = (tracks, pagination) => {
+  const beginTrack = getTrackAtSpineItemIndex(
+    tracks,
+    pagination.beginSpineItemIndex
+  );
+  const endTrack = getTrackAtSpineItemIndex(
+    tracks,
+    pagination.endSpineItemIndex
+  );
+  return [beginTrack, endTrack].filter(
+    (track, i, arr) => track !== void 0 && arr.indexOf(track) === i
+  );
+};
+function createTrackStreams(reader, state$) {
+  const tracks$ = reader.context.manifest$.pipe(
+    map(
+      (manifest) => manifest.spineItems.filter(isAudioSpineItem).map((item) => ({
+        id: item.id,
+        href: item.href,
+        index: item.index,
+        mediaType: item.mediaType
+      }))
+    ),
+    shareReplay({ bufferSize: 1, refCount: true })
+  );
+  const pagination$ = reader.pagination.state$.pipe(
+    mapKeysTo([`beginSpineItemIndex`, `endSpineItemIndex`]),
+    distinctUntilChanged(_),
+    shareReplay({ bufferSize: 1, refCount: true })
+  );
+  const visibleTrackIds$ = combineLatest([tracks$, pagination$]).pipe(
+    map(
+      ([tracks, pagination]) => getVisibleTracks(tracks, pagination).map(({ id }) => id)
+    ),
+    distinctUntilChanged($),
+    shareReplay({ bufferSize: 1, refCount: true })
+  );
+  const currentTrack$ = state$.pipe(
+    map((state) => state.currentTrack),
+    distinctUntilChanged()
+  );
+  const nextTrack$ = combineLatest([tracks$, pagination$, currentTrack$]).pipe(
+    map(([tracks, { endSpineItemIndex }, currentTrack]) => {
+      const nextTrackInPaginationWindow = currentTrack && endSpineItemIndex !== void 0 ? tracks.find(
+        ({ index }) => index > currentTrack.index && index <= endSpineItemIndex
+      ) : void 0;
+      const nextTrackAfterCurrentTrack = currentTrack ? tracks.find(({ index }) => index > currentTrack.index) : void 0;
+      return { nextTrackInPaginationWindow, nextTrackAfterCurrentTrack };
+    }),
+    shareReplay({ bufferSize: 1, refCount: true })
+  );
+  return {
+    tracks$,
+    visibleTrackIds$,
+    nextTrack$
+  };
+}
+
+const initialDesiredPlayback = {
+  shouldPlay: false,
+  trackId: void 0
+};
+const initialState = {
+  tracks: [],
+  currentTrack: void 0,
+  isPlaying: false,
+  isLoading: false,
+  hasError: false,
+  currentTime: 0,
+  duration: void 0
+};
+class AudioController extends ReactiveEntity {
+  reader;
+  audio;
+  visualizer$;
+  resourcesResolver = new ResourcesResolver();
+  visibleTrackIds$;
+  playCommandSubject = new Subject();
+  pauseCommandSubject = new Subject();
+  selectCommandSubject = new Subject();
+  desiredPlayback$ = new BehaviorSubject(
+    initialDesiredPlayback
+  );
+  subscriptions = new Subscription();
+  constructor(reader, audio = new AudioElementAdapter()) {
+    super(initialState);
+    this.reader = reader;
+    this.audio = audio;
+    this.visualizer$ = new AudioVisualizer(this.audio.element);
+    const { tracks$, visibleTrackIds$, nextTrack$ } = createTrackStreams(
+      this.reader,
+      this.state$
+    );
+    this.visibleTrackIds$ = visibleTrackIds$;
+    const firstVisibleTrackId$ = this.visibleTrackIds$.pipe(
+      map((trackIds) => trackIds[0]),
+      distinctUntilChanged(),
+      share()
+    );
+    const visibleTrackReset$ = firstVisibleTrackId$.pipe(
+      withLatestFrom(this.state$),
+      filter(
+        ([trackId, state]) => trackId === void 0 && (state.currentTrack?.id !== void 0 || state.isLoading)
+      ),
+      map(([, state]) => state.tracks)
+    );
+    const visibleTrackSelectionIntent$ = firstVisibleTrackId$.pipe(
+      filter((trackId) => trackId !== void 0),
+      withLatestFrom(this.desiredPlayback$),
+      map(([trackId, { shouldPlay }]) => ({
+        trackId,
+        options: {
+          navigate: false,
+          play: shouldPlay ? true : void 0
+        }
+      }))
+    );
+    const tracksChanged$ = tracks$.pipe(
+      tap(() => this.resourcesResolver.releaseAll())
+    );
+    const playbackReset$ = merge(visibleTrackReset$, tracksChanged$).pipe(
+      tap((tracks) => {
+        this.emitDesiredPlayback({ shouldPlay: false, trackId: void 0 });
+        this.visualizer$.stop({ resetLevels: true });
+        this.unmountCurrentSource();
+        this.mergeCompare({
+          tracks,
+          currentTrack: void 0,
+          isLoading: false,
+          isPlaying: false,
+          hasError: false,
+          currentTime: 0,
+          duration: void 0
+        });
+        this.visualizer$.reset(void 0);
+      }),
+      share()
+    );
+    const playSelectionIntent$ = this.playCommandSubject.pipe(
+      filter(() => !this.audio.hasSource),
+      map(() => this.state.currentTrack ?? this.state.tracks[0]),
+      filter(isDefined),
+      map((track) => ({
+        trackId: track.id,
+        options: { navigate: false, play: true }
+      }))
+    );
+    const resumePlayback$ = this.playCommandSubject.pipe(
+      filter(() => this.audio.hasSource),
+      tap(() => {
+        this.emitDesiredPlayback({
+          shouldPlay: true,
+          trackId: this.state.currentTrack?.id
+        });
+      })
+    );
+    const endedSelectionIntent$ = this.audio.ended$.pipe(
+      withLatestFrom(nextTrack$),
+      switchMap(
+        ([, { nextTrackAfterCurrentTrack, nextTrackInPaginationWindow }]) => {
+          this.visualizer$.stop({ resetLevels: true });
+          if (nextTrackInPaginationWindow) {
+            return of({
+              trackId: nextTrackInPaginationWindow.id,
+              options: { navigate: false, play: true }
+            });
+          }
+          if (!nextTrackAfterCurrentTrack) {
+            this.emitDesiredPlayback({ shouldPlay: false, trackId: void 0 });
+          }
+          this.reader.navigation.goToRightOrBottomSpineItem();
+          return EMPTY;
+        }
+      )
+    );
+    const selection$ = merge(
+      this.selectCommandSubject,
+      visibleTrackSelectionIntent$,
+      endedSelectionIntent$,
+      playSelectionIntent$
+    ).pipe(
+      withLatestFrom(this.state$),
+      filter(
+        ([selectionIntent, state]) => state.tracks.some(({ id }) => id === selectionIntent.trackId)
+      ),
+      map(([selectionIntent, state]) => ({
+        selectionIntent,
+        state,
+        isReselectionWhileLoading: state.currentTrack?.id === selectionIntent.trackId && state.isLoading
+      })),
+      tap(({ selectionIntent, state, isReselectionWhileLoading }) => {
+        if (selectionIntent.options.navigate !== false) {
+          this.reader.navigation.navigate({
+            spineItem: selectionIntent.trackId,
+            animation: `turn`
+          });
+        }
+        if (isReselectionWhileLoading && selectionIntent.options.play !== void 0) {
+          this.emitDesiredPlayback({
+            shouldPlay: selectionIntent.options.play,
+            trackId: state.currentTrack?.id
+          });
+        }
+      }),
+      filter(({ isReselectionWhileLoading }) => !isReselectionWhileLoading),
+      switchMap(
+        ({ selectionIntent: { trackId, options } }) => this.selectTrack$({ trackId, options, playbackReset$ })
+      )
+    );
+    const playback$ = merge(resumePlayback$, selection$).pipe(
+      withLatestFrom(this.desiredPlayback$),
+      switchMap(([, { shouldPlay, trackId }]) => {
+        if (!shouldPlay || !this.audio.hasSource || this.state.currentTrack?.id !== trackId) {
+          return EMPTY;
+        }
+        this.mergeCompare({ hasError: false });
+        return this.audio.play$().pipe(
+          catchError(() => {
+            this.mergeCompare({ hasError: true });
+            return EMPTY;
+          })
+        );
+      })
+    );
+    this.subscriptions.add(playbackReset$.subscribe());
+    this.subscriptions.add(playback$.subscribe());
+    this.subscriptions.add(
+      this.pauseCommandSubject.subscribe(() => {
+        this.emitDesiredPlayback({ shouldPlay: false, trackId: void 0 });
+      })
+    );
+    this.subscriptions.add(
+      this.audio.isPlaying$.subscribe((isPlaying) => {
+        this.mergeCompare({ isPlaying });
+        if (!isPlaying) {
+          this.visualizer$.stop();
+          return;
+        }
+        if (!this.state.currentTrack) return;
+        this.visualizer$.start(this.state.currentTrack);
+      })
+    );
+    this.subscriptions.add(
+      this.audio.metrics$.subscribe(({ currentTime, duration }) => {
+        this.mergeCompare({ currentTime, duration });
+      })
+    );
+  }
+  get state() {
+    return this.value;
+  }
+  get visualizer() {
+    return this.visualizer$.value;
+  }
+  resetTrackSelection({
+    currentTrack,
+    isLoading
+  }) {
+    this.mergeCompare({
+      currentTrack,
+      isLoading,
+      isPlaying: false,
+      hasError: false,
+      currentTime: 0,
+      duration: void 0
+    });
+    this.visualizer$.reset(currentTrack?.id);
+  }
+  emitDesiredPlayback({ shouldPlay, trackId }) {
+    this.desiredPlayback$.next({
+      shouldPlay,
+      trackId: shouldPlay ? trackId : void 0
+    });
+    if (!shouldPlay) {
+      this.audio.pause();
+    }
+  }
+  unmountCurrentSource() {
+    if (!this.audio.hasSource) return;
+    const trackId = this.state.currentTrack?.id;
+    if (!this.audio.paused) {
+      this.audio.pause();
+    }
+    this.audio.unloadSource();
+    if (trackId) {
+      this.resourcesResolver.releaseTrackSource(trackId);
+    }
+  }
+  mountSource(source) {
+    this.unmountCurrentSource();
+    this.audio.loadSource(source);
+  }
+  resolveTrackSource(track) {
+    const spineItem = this.reader.spineItemsManager.get(track.index);
+    if (!spineItem) return EMPTY;
+    return this.resourcesResolver.getTrackResourceUrl$(
+      track,
+      spineItem.resourcesHandler
+    );
+  }
+  selectTrack$({
+    trackId,
+    options,
+    playbackReset$
+  }) {
+    const track = this.state.tracks.find(({ id }) => id === trackId);
+    if (!track) return EMPTY;
+    const currentTrack = this.state.currentTrack;
+    const shouldPlay = options.play ?? (!this.audio.paused && currentTrack !== void 0);
+    this.emitDesiredPlayback({ shouldPlay, trackId: track.id });
+    if (currentTrack?.id === track.id && this.audio.hasSource) {
+      this.visualizer$.setTrack(track.id);
+      return shouldPlay ? of(void 0) : EMPTY;
+    }
+    this.unmountCurrentSource();
+    this.resetTrackSelection({
+      currentTrack: track,
+      isLoading: true
+    });
+    return this.resolveTrackSource(track).pipe(
+      map((source) => ({ source })),
+      defaultIfEmpty({ source: void 0 }),
+      catchError(() => of({ source: void 0 })),
+      takeUntil(playbackReset$),
+      tap(({ source }) => {
+        if (!source) {
+          this.emitDesiredPlayback({ shouldPlay: false, trackId: void 0 });
+        } else {
+          this.mountSource(source);
+        }
+        this.mergeCompare({ isLoading: false });
+      }),
+      filter(({ source }) => source !== void 0),
+      map(() => void 0)
+    );
+  }
+  select(trackId, options = {}) {
+    this.selectCommandSubject.next({ trackId, options });
+  }
+  play() {
+    this.playCommandSubject.next();
+  }
+  pause() {
+    this.pauseCommandSubject.next();
+  }
+  toggle() {
+    if (this.audio.paused) {
+      this.play();
+      return;
+    }
+    this.pause();
+  }
+  setCurrentTime(value) {
+    this.mergeCompare({ currentTime: value });
+    this.audio.setCurrentTime(value);
+  }
+  destroy() {
+    this.subscriptions.unsubscribe();
+    this.playCommandSubject.complete();
+    this.pauseCommandSubject.complete();
+    this.selectCommandSubject.complete();
+    this.desiredPlayback$.complete();
+    this.visualizer$.destroy();
+    this.unmountCurrentSource();
+    this.resourcesResolver.destroy();
+    super.destroy();
+  }
+}
+
+class AudioRenderer extends DocumentRenderer {
+  onCreateDocument() {
+    const ownerDocument = this.containerElement.ownerDocument;
+    const rootElement = ownerDocument.createElement(`div`);
+    rootElement.style.cssText = `
+      box-sizing: border-box;
+      width: 100%;
+      height: 100%;
+      display: block;
+    `;
+    rootElement.setAttribute(`data-prose-reader-audio-page`, this.item.id);
+    this.setDocumentContainer(rootElement);
+    return of(rootElement);
+  }
+  onLoadDocument() {
+    this.attach();
+    return EMPTY;
+  }
+  onUnload() {
+    this.detach();
+    return EMPTY;
+  }
+  onLayout() {
+    const { width, height } = this.viewport.pageSize;
+    const rootElement = this.documentContainer;
+    if (rootElement) {
+      rootElement.style.width = `${width}px`;
+      rootElement.style.height = `${height}px`;
+    }
+    return of({ width, height });
+  }
+  onRenderHeadless() {
+    return EMPTY;
+  }
+  getDocumentFrame() {
+    return void 0;
+  }
+  /**
+   * Audio spine items are always pre-paginated (one track per page).
+   * Mixed audio/text books with reflowable audio chapters may need
+   * to revisit this if that use case arises.
+   */
+  get renditionLayout() {
+    return `pre-paginated`;
+  }
+}
+
+const audioEnhancer = (next) => (options) => {
+  const readerOptions = { ...options };
+  const reader = next({
+    ...readerOptions,
+    getRenderer(item) {
+      const maybeFactory = options.getRenderer?.(item);
+      if (maybeFactory) {
+        return maybeFactory;
+      }
+      if (isAudioSpineItem(item)) {
+        return (params) => new AudioRenderer(params);
+      }
+      return void 0;
+    }
+  });
+  const controller = new AudioController(reader);
+  const destroy = () => {
+    controller.destroy();
+    reader.destroy();
+  };
+  return {
+    ...reader,
+    __PROSE_READER_ENHANCER_AUDIO: true,
+    destroy,
+    audio: {
+      state$: controller.state$,
+      visualizer$: controller.visualizer$,
+      visibleTrackIds$: controller.visibleTrackIds$,
+      get state() {
+        return controller.state;
+      },
+      get visualizer() {
+        return controller.visualizer;
+      },
+      isAudioRenderer: (renderer) => renderer instanceof AudioRenderer,
+      play: () => controller.play(),
+      pause: () => controller.pause(),
+      toggle: () => controller.toggle(),
+      setCurrentTime: (value) => controller.setCurrentTime(value),
+      select: (trackId, options2) => controller.select(trackId, options2)
+    }
+  };
+};
+
+export { AudioRenderer, audioEnhancer, isAudioSpineItem };
+//# sourceMappingURL=index.js.map