Update src/lib/audio-recorder.ts

src/lib/audio-recorder.ts

@@ -1,108 +1,237 @@
 // src/lib/audio-recorder.ts
 
-import EventEmitter from "eventemitter3";
 import { audioContext } from "./utils";
+import AudioRecordingWorklet from "./worklets/audio-processing";
+import SafariAudioRecordingWorklet from "./worklets/safari-audio-processing";
 import VolMeterWorket from "./worklets/vol-meter";
 
-const CHUNK_SIZE = 2048;
-
-export class AudioRecorder extends EventEmitter {
-  recording = false;
-  private audioCtx: AudioContext | null = null;
-  private microphone: MediaStreamAudioSourceNode | null = null;
-  private processor: ScriptProcessorNode | null = null;
-  private worklet: AudioWorkletNode | null = null;
-  private stream: MediaStream | null = null;
-
-  async start(): Promise<void> {
-    if (this.recording) return;
+import { createWorketFromSrc } from "./audioworklet-registry";
+import EventEmitter from "eventemitter3";
 
+function arrayBufferToBase64(buffer: ArrayBuffer) {
+  var binary = "";
+  var bytes = new Uint8Array(buffer);
+  var len = bytes.byteLength;
+  for (var i = 0; i < len; i++) {
+    binary += String.fromCharCode(bytes[i]);
+  }
+  return window.btoa(binary);
+}
+
+async function createSafariAudioContext(sampleRate: number): Promise<AudioContext> {
+  console.log('Creating Safari audio context with options:', { sampleRate });
+  const AudioContextClass = (window as any).webkitAudioContext || window.AudioContext;
+  console.log('Using AudioContext class:', AudioContextClass.name);
+  const ctx = new AudioContextClass({ sampleRate, latencyHint: 'interactive' });
+  console.log('Safari AudioContext initial state:', { state: ctx.state, sampleRate: ctx.sampleRate, baseLatency: ctx.baseLatency, destination: ctx.destination });
+  if (ctx.state === 'suspended') {
+    console.log('Attempting to resume suspended Safari audio context...');
     try {
-      this.stream = await navigator.mediaDevices.getUserMedia({ audio: true });
-      this.audioCtx = await audioContext({ id: "audio-in" });
-
-      if (this.audioCtx.state === "suspended") {
-        await this.audioCtx.resume();
-      }
-
-      await this.audioCtx.audioWorklet.addModule(VolMeterWorket);
-      
-      this.microphone = this.audioCtx.createMediaStreamSource(this.stream);
-      this.processor = this.audioCtx.createScriptProcessor(CHUNK_SIZE, 1, 1);
-      
-      this.worklet = new AudioWorkletNode(this.audioCtx, "vumeter-in");
-      this.worklet.port.onmessage = (ev) => {
-        // رویداد جدید برای ارسال ولوم
-        this.emit("volume", ev.data.volume);
-      };
-
-      this.processor.onaudioprocess = (e: AudioProcessingEvent) => {
-        if (!this.recording) return;
-        const inputData = e.inputBuffer.getChannelData(0);
-        const pcm16Data = this.convertToPCM16(inputData);
-        const base64 = this.toBase64(pcm16Data);
-        // محاسبه ولوم در اینجا و ارسال آن همراه با داده‌ها
-        const volume = this.getVolume(inputData);
-        this.emit("data", base64, volume);
-      };
-
-      this.microphone.connect(this.processor);
-      this.microphone.connect(this.worklet); // اتصال worklet برای گرفتن ولوم
-      this.processor.connect(this.audioCtx.destination);
-
-      this.recording = true;
-      this.emit("start");
+      await ctx.resume();
+      console.log('Successfully resumed Safari audio context:', ctx.state);
     } catch (err) {
-      console.error("Error starting audio recording:", err);
-      this.emit("error", err);
+      console.error('Failed to resume Safari audio context:', err);
+      throw err;
     }
   }
+  return ctx;
+}
 
-  stop(): void {
-    if (!this.recording) return;
-
-    this.recording = false;
-    this.emit("stop");
-
-    if (this.stream) {
-      this.stream.getTracks().forEach((track) => track.stop());
-    }
-    if (this.microphone) {
-      this.microphone.disconnect();
-    }
-    if (this.processor) {
-      this.processor.disconnect();
-    }
-    if (this.worklet) {
-        this.worklet.disconnect();
-    }
+export class AudioRecorder extends EventEmitter {
+  stream: MediaStream | undefined;
+  audioContext: AudioContext | undefined;
+  source: MediaStreamAudioSourceNode | undefined;
+  recording: boolean = false;
+  recordingWorklet: AudioWorkletNode | undefined;
+  vuWorklet: AudioWorkletNode | undefined;
+
+  private starting: Promise<void> | null = null;
+
+  isSafari: boolean;
+  isIOS: boolean;
+
+  constructor(public sampleRate = 16000) {
+    super();
+    this.isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
+    this.isIOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !(window as any).MSStream;
+    console.log('AudioRecorder initialized:', { isSafari: this.isSafari, isIOS: this.isIOS, sampleRate: this.sampleRate, userAgent: navigator.userAgent, webAudioSupport: !!(window.AudioContext || (window as any).webkitAudioContext), mediaDevicesSupport: !!navigator.mediaDevices });
   }
 
-  private getVolume(data: Float32Array): number {
-    let sum = 0;
-    for (let i = 0; i < data.length; i++) {
-        sum += data[i] * data[i];
+  async start() {
+    if (!navigator.mediaDevices?.getUserMedia) {
+      console.error('MediaDevices API not available:', { mediaDevices: !!navigator.mediaDevices, getUserMedia: !!(navigator.mediaDevices && navigator.mediaDevices.getUserMedia) });
+      throw new Error("Could not request user media");
     }
-    const rms = Math.sqrt(sum / data.length);
-    // نرمال‌سازی ولوم به یک مقدار بین 0 و 1
-    return Math.min(1, rms * 5); // ضریب 5 برای محسوس‌تر کردن
-  }
 
-  private convertToPCM16(input: Float32Array): Int16Array {
-    const output = new Int16Array(input.length);
-    for (let i = 0; i < input.length; i++) {
-      const s = Math.max(-1, Math.min(1, input[i]));
-      output[i] = s < 0 ? s * 0x8000 : s * 0x7fff;
-    }
-    return output;
+    console.log('Starting AudioRecorder with full environment info:', { userAgent: navigator.userAgent, platform: navigator.platform, vendor: navigator.vendor, audioWorkletSupport: !!(window.AudioWorklet), sampleRate: this.sampleRate, existingAudioContext: !!this.audioContext, existingStream: !!this.stream, isSafari: this.isSafari });
+
+    this.starting = new Promise(async (resolve, reject) => {
+      try {
+        const constraints = {
+            audio: {
+              echoCancellation: !this.isSafari, // Safari handles this differently
+              noiseSuppression: !this.isSafari,
+              autoGainControl: !this.isSafari,
+              sampleRate: this.sampleRate,
+              channelCount: 1
+            }
+        };
+        console.log('Using audio constraints:', constraints);
+
+        // 1. Get User Media
+        try {
+            this.stream = await navigator.mediaDevices.getUserMedia(constraints);
+            const track = this.stream.getAudioTracks()[0];
+            console.log('Audio permissions granted:', { track: track.label, settings: track.getSettings() });
+        } catch (err) {
+            console.error('Failed to get audio permissions:', err);
+            throw err;
+        }
+
+        // 2. Create Audio Context
+        try {
+            this.audioContext = this.isSafari 
+                ? await createSafariAudioContext(this.sampleRate) 
+                : await audioContext({ sampleRate: this.sampleRate });
+            console.log('Audio context ready:', { state: this.audioContext.state, sampleRate: this.audioContext.sampleRate });
+        } catch (err) {
+            console.error('Failed to initialize audio context:', err);
+            throw err;
+        }
+
+        // 3. Create Audio Source
+        try {
+            this.source = this.audioContext.createMediaStreamSource(this.stream);
+            console.log('Audio source created.');
+        } catch (err) {
+            console.error('Failed to create audio source:', err);
+            throw err;
+        }
+
+        // 4. Load and Create Worklets (Recording and VU Meter for ALL browsers)
+        try {
+            const recordingWorkletName = "audio-recorder-worklet";
+            const recordingWorkletSrc = createWorketFromSrc(recordingWorkletName, this.isSafari ? SafariAudioRecordingWorklet : AudioRecordingWorklet);
+            await this.audioContext.audioWorklet.addModule(recordingWorkletSrc);
+            console.log('Recording worklet module loaded.');
+
+            this.recordingWorklet = new AudioWorkletNode(this.audioContext, recordingWorkletName, { processorOptions: { sampleRate: this.sampleRate } });
+            
+            this.recordingWorklet.port.onmessage = (ev: MessageEvent) => {
+              const arrayBuffer = ev.data.data?.int16arrayBuffer;
+              if (arrayBuffer) {
+                // *** تغییر اصلی: حالا data و volume را با هم می‌فرستیم ***
+                // توجه: در worklet ها محاسبه حجم صدا را اضافه خواهیم کرد
+                const arrayBufferString = arrayBufferToBase64(arrayBuffer);
+                // ما به جای رویداد مجزا، حجم را همراه با داده‌ها می‌فرستیم
+                // این کار را در ControlTray.tsx مدیریت خواهیم کرد
+                // this.emit("data", arrayBufferString); 
+              } else {
+                console.warn('Invalid audio chunk received:', ev.data);
+              }
+            };
+            this.recordingWorklet.onprocessorerror = (event) => console.error('AudioWorklet processor error:', event);
+            console.log('Recording worklet node created.');
+            
+            // --- 👇 بخش حیاتی: افزودن VU Meter برای همه مرورگرها 👇 ---
+            const vuWorkletName = "vu-meter";
+            await this.audioContext.audioWorklet.addModule(createWorketFromSrc(vuWorkletName, VolMeterWorket));
+            this.vuWorklet = new AudioWorkletNode(this.audioContext, vuWorkletName);
+
+            // *** تغییر اصلی: رویداد data را با حجم صدا ترکیب می‌کنیم ***
+            this.vuWorklet.port.onmessage = (ev: MessageEvent) => {
+                if (ev.data.volume && this.recordingWorklet) {
+                    // حالا هم داده خام صدا و هم حجم صدا را داریم
+                    // یک پیام به worklet ضبط می‌فرستیم تا داده‌های بافر شده را بگیریم
+                    this.recordingWorklet.port.postMessage({ getBuffer: true });
+                }
+            };
+            
+            // دریافت پاسخ از worklet ضبط و ارسال نهایی
+            this.recordingWorklet.port.onmessage = (ev: MessageEvent) => {
+                const arrayBuffer = ev.data.buffer;
+                const volume = ev.data.volume; // فرض می‌کنیم worklet حجم را هم برمی‌گرداند
+                
+                if (arrayBuffer && typeof volume !== 'undefined') {
+                    const arrayBufferString = arrayBufferToBase64(arrayBuffer);
+                    // *** حالا هر دو مقدار را با هم emit می‌کنیم ***
+                    this.emit("data", arrayBufferString, volume);
+                }
+            };
+            
+            console.log('VU meter worklet created and configured.');
+
+        } catch (err) {
+            console.error('Failed to setup audio worklets:', err);
+            throw err;
+        }
+
+        // 5. Connect Nodes
+        try {
+            this.source.connect(this.recordingWorklet);
+            this.source.connect(this.vuWorklet); // اتصال VU متر به منبع
+            console.log('Audio nodes connected successfully.');
+        } catch (err) {
+            console.error('Failed to connect audio nodes:', err);
+            throw err;
+        }
+        
+        this.recording = true;
+        console.log('Recording started successfully');
+        resolve();
+        this.starting = null;
+
+      } catch (error) {
+        console.error('Failed to start recording:', error);
+        this.stop();
+        reject(error);
+        this.starting = null;
+      }
+    });
+    return this.starting;
   }
 
-  private toBase64(pcm16Data: Int16Array): string {
-    const bytes = new Uint8Array(pcm16Data.buffer);
-    let binary = "";
-    for (let i = 0; i < bytes.byteLength; i++) {
-      binary += String.fromCharCode(bytes[i]);
+  stop() {
+    console.log('Stopping audio recorder...');
+    const handleStop = () => {
+      try {
+        if (this.source) {
+          console.log('Disconnecting audio source...');
+          this.source.disconnect();
+          this.source = undefined;
+        }
+        if (this.stream) {
+          console.log('Stopping media stream tracks...');
+          this.stream.getTracks().forEach(track => {
+            track.stop();
+            console.log('Stopped track:', track.label);
+          });
+          this.stream = undefined;
+        }
+        // بستن audioContext فقط در سافاری و در صورت نیاز
+        if (this.audioContext && this.isSafari && this.audioContext.state !== 'closed') {
+          console.log('Closing Safari audio context...');
+          this.audioContext.close();
+          this.audioContext = undefined;
+        }
+        
+        this.recordingWorklet = undefined;
+        this.vuWorklet = undefined;
+        this.recording = false;
+        this.emit("stop");
+        console.log('Audio recorder stopped successfully');
+      } catch (err) {
+        console.error('Error while stopping audio recorder:', err);
+      }
+    };
+
+    if (this.starting) {
+      console.log('Stop called while starting - waiting for start to complete...');
+      this.starting.then(handleStop).catch(handleStop);
+      this.starting = null;
+      return;
     }
-    return btoa(binary);
+    
+    handleStop();
   }
 }