@editframe/elements 0.18.3-beta.0 → 0.18.7-beta.0

package/src/services/MediaSourceManager.ts

@@ -1,333 +0,0 @@
-export interface MediaSourceManagerOptions {
-  onError?: (error: Error) => void;
-  onReady?: () => void;
-  onUpdateEnd?: () => void;
-  timeout?: number;
-}
-
-/**
- * Manages MediaSource for audio streaming
- */
-export class MediaSourceManager {
-  private mediaSource: MediaSource | null = null;
-  private audioElement: HTMLAudioElement | null = null;
-  private sourceBuffer: SourceBuffer | null = null;
-  private mediaSourceReady = false;
-  private pendingSegments: ArrayBuffer[] = [];
-  private options: MediaSourceManagerOptions;
-
-  constructor(options: MediaSourceManagerOptions = {}) {
-    this.options = {
-      timeout: 10000,
-      ...options,
-    };
-  }
-
-  /**
-   * Initialize MediaSource for audio streaming
-   */
-  async initialize(): Promise<void> {
-    this.cleanup(true);
-
-    this.mediaSource = new MediaSource();
-    this.audioElement = document.createElement("audio");
-
-    // Add error event listeners to the audio element
-    this.audioElement.addEventListener("error", (event) => {
-      const error = this.audioElement?.error;
-      console.error("🎵 [AUDIO_ELEMENT_ERROR] Audio element error:", {
-        code: error?.code,
-        message: error?.message,
-        event,
-      });
-
-      if (this.options.onError) {
-        this.options.onError(
-          new Error(`Audio element error: ${error?.message}`),
-        );
-      }
-    });
-
-    this.audioElement.src = URL.createObjectURL(this.mediaSource);
-
-    return new Promise((resolve, reject) => {
-      this.mediaSource?.addEventListener("sourceopen", () => {
-        try {
-          const sourceBuffer = this.createSourceBuffer();
-          if (!sourceBuffer) {
-            throw new Error(
-              "Failed to create SourceBuffer with any supported codec",
-            );
-          }
-
-          this.sourceBuffer = sourceBuffer;
-          this.setupSourceBufferListeners();
-
-          this.mediaSourceReady = true;
-
-          if (this.options.onReady) {
-            this.options.onReady();
-          }
-
-          resolve();
-        } catch (error) {
-          console.error(
-            "🎵 [MEDIA_SOURCE_ERROR] Failed to create SourceBuffer:",
-            error,
-          );
-          reject(error);
-        }
-      });
-
-      this.mediaSource?.addEventListener("error", (error) => {
-        console.error("🎵 [MEDIA_SOURCE_ERROR] MediaSource error:", error);
-        reject(error);
-      });
-
-      // Add timeout for MediaSource opening
-      setTimeout(() => {
-        if (!this.mediaSourceReady) {
-          const timeoutError = new Error(
-            "MediaSource failed to open within timeout",
-          );
-          console.error(
-            "🎵 [MEDIA_SOURCE_TIMEOUT] MediaSource initialization timeout",
-          );
-          reject(timeoutError);
-        }
-      }, 4000);
-    });
-  }
-
-  /**
-   * Create SourceBuffer with codec fallback
-   */
-  private createSourceBuffer(): SourceBuffer | undefined {
-    const codecOptions = [
-      'audio/mp4; codecs="mp4a.40.2"', // AAC-LC (most common)
-      'audio/mp4; codecs="mp4a.40.5"', // AAC-HE
-      "audio/mp4", // Generic MP4 audio
-    ];
-
-    let sourceBuffer: SourceBuffer | undefined;
-    let lastError: Error | undefined;
-
-    for (const codec of codecOptions) {
-      try {
-        if (MediaSource.isTypeSupported(codec)) {
-          sourceBuffer = this.mediaSource?.addSourceBuffer(codec);
-          break;
-        }
-      } catch (error) {
-        console.error(
-          `🎵 [CODEC_ERROR] Failed to create SourceBuffer with ${codec}:`,
-          error,
-        );
-        lastError = error as Error;
-      }
-    }
-
-    if (!sourceBuffer && lastError) {
-      throw new Error(
-        `Failed to create SourceBuffer with any supported codec. Last error: ${lastError.message}`,
-      );
-    }
-
-    return sourceBuffer;
-  }
-
-  /**
-   * Setup SourceBuffer event listeners
-   */
-  private setupSourceBufferListeners(): void {
-    if (!this.sourceBuffer) return;
-
-    this.sourceBuffer.addEventListener("updateend", () => {
-      this.processPendingSegments();
-
-      if (this.options.onUpdateEnd) {
-        this.options.onUpdateEnd();
-      }
-    });
-
-    this.sourceBuffer.addEventListener("error", (event) => {
-      console.error(
-        "🎵 [SOURCE_BUFFER_EVENT_ERROR] SourceBuffer error event:",
-        event,
-      );
-
-      if (this.options.onError) {
-        this.options.onError(new Error("SourceBuffer error"));
-      }
-    });
-  }
-
-  /**
-   * Feed audio segments directly to MediaSource SourceBuffer
-   */
-  async feedSegment(segmentBuffer: ArrayBuffer): Promise<void> {
-    if (!this.mediaSourceReady || !this.sourceBuffer) {
-      this.pendingSegments.push(segmentBuffer);
-      return;
-    }
-
-    if (this.sourceBuffer.updating) {
-      this.pendingSegments.push(segmentBuffer);
-      return;
-    }
-
-    // Check for HTMLMediaElement errors before appending
-    if (this.audioElement?.error) {
-      const error = this.audioElement.error;
-      console.error(
-        "🎵 [MEDIA_ELEMENT_ERROR] HTMLMediaElement error detected:",
-        {
-          code: error.code,
-          message: error.message,
-          MEDIA_ERR_ABORTED: error.code === MediaError.MEDIA_ERR_ABORTED,
-          MEDIA_ERR_NETWORK: error.code === MediaError.MEDIA_ERR_NETWORK,
-          MEDIA_ERR_DECODE: error.code === MediaError.MEDIA_ERR_DECODE,
-          MEDIA_ERR_SRC_NOT_SUPPORTED:
-            error.code === MediaError.MEDIA_ERR_SRC_NOT_SUPPORTED,
-        },
-      );
-
-      // Reset the audio element to try to recover
-      this.audioElement.load();
-      return;
-    }
-
-    try {
-      this.sourceBuffer.appendBuffer(segmentBuffer);
-    } catch (error) {
-      console.error(
-        "🎵 [SOURCE_BUFFER_ERROR] Failed to append segment:",
-        error,
-      );
-      this.logDebugInfo();
-      this.pendingSegments.push(segmentBuffer);
-    }
-  }
-
-  /**
-   * Process any queued segments when SourceBuffer becomes available
-   */
-  private processPendingSegments(): void {
-    if (
-      !this.sourceBuffer ||
-      this.sourceBuffer.updating ||
-      this.pendingSegments.length === 0
-    ) {
-      return;
-    }
-
-    const nextSegment = this.pendingSegments.shift();
-    if (nextSegment) {
-      this.feedSegment(nextSegment);
-    }
-  }
-
-  /**
-   * Log debug information for troubleshooting
-   */
-  private logDebugInfo(): void {
-    console.error("🎵 [SOURCE_BUFFER_DEBUG] SourceBuffer state:", {
-      updating: this.sourceBuffer?.updating,
-      buffered: this.sourceBuffer?.buffered
-        ? Array.from(
-            { length: this.sourceBuffer.buffered.length },
-            (_, i) =>
-              `${this.sourceBuffer?.buffered.start(i)}-${this.sourceBuffer?.buffered.end(i)}`,
-          )
-        : [],
-      mode: this.sourceBuffer?.mode,
-      timestampOffset: this.sourceBuffer?.timestampOffset,
-    });
-
-    console.error("🎵 [MEDIA_SOURCE_DEBUG] MediaSource state:", {
-      readyState: this.mediaSource?.readyState,
-      sourceBuffers: this.mediaSource?.sourceBuffers.length,
-      duration: this.mediaSource?.duration,
-    });
-
-    console.error("🎵 [AUDIO_ELEMENT_DEBUG] Audio element state:", {
-      readyState: this.audioElement?.readyState,
-      networkState: this.audioElement?.networkState,
-      error: this.audioElement?.error?.code,
-      src: `${this.audioElement?.src.substring(0, 50)}...`,
-    });
-  }
-
-  /**
-   * Set audio element current time
-   */
-  setCurrentTime(timeMs: number): void {
-    if (this.audioElement) {
-      this.audioElement.currentTime = timeMs / 1000;
-    }
-  }
-
-  /**
-   * Get the audio element for MediaElementSource
-   */
-  getAudioElement(): HTMLAudioElement | null {
-    return this.audioElement;
-  }
-
-  /**
-   * Check if MediaSource is ready
-   */
-  isReady(): boolean {
-    return this.mediaSourceReady;
-  }
-
-  /**
-   * Get buffered time ranges
-   */
-  getBuffered(): TimeRanges | null {
-    return this.sourceBuffer?.buffered || null;
-  }
-
-  /**
-   * Clean up MediaSource resources
-   */
-  cleanup(_preserveCache = false): void {
-    // Clean up existing MediaSource
-    if (
-      this.sourceBuffer &&
-      this.mediaSource &&
-      this.mediaSource.readyState === "open"
-    ) {
-      try {
-        this.mediaSource.removeSourceBuffer(this.sourceBuffer);
-      } catch (error) {
-        console.warn("🎵 [CLEANUP_ERROR] Error removing SourceBuffer:", error);
-      }
-    }
-
-    if (this.mediaSource) {
-      try {
-        if (this.mediaSource.readyState === "open") {
-          this.mediaSource.endOfStream();
-        }
-      } catch (error) {
-        console.warn("🎵 [CLEANUP_ERROR] Error ending MediaSource:", error);
-      }
-    }
-
-    if (this.audioElement) {
-      try {
-        URL.revokeObjectURL(this.audioElement.src);
-      } catch (error) {
-        console.warn("🎵 [CLEANUP_ERROR] Error revoking URL:", error);
-      }
-    }
-
-    // Reset state
-    this.mediaSource = null;
-    this.audioElement = null;
-    this.sourceBuffer = null;
-    this.mediaSourceReady = false;
-    this.pendingSegments = [];
-  }
-}