@vapi-ai/web 1.0.106 → 1.0.107

package/AtomicMediaSource.ts

@@ -0,0 +1,58 @@
+import async, { QueueObject } from "async";
+
+class AtomicMediaSource {
+  mediaSource: MediaSource;
+  private sourceBuffer: SourceBuffer | null = null;
+  private operationsQueue: QueueObject<() => Promise<void>>;
+
+  constructor() {
+    this.mediaSource = new MediaSource();
+    this.operationsQueue = this.createOperationQueue();
+
+    this.mediaSource.addEventListener("sourceopen", () => {
+      this.mediaSource.duration = Number.POSITIVE_INFINITY;
+      this.sourceBuffer = this.mediaSource.addSourceBuffer(
+        'audio/webm; codecs="opus"'
+      );
+      this.sourceBuffer.mode = "sequence";
+    });
+  }
+
+  public appendBuffer(buffer: ArrayBuffer) {
+    this.operationsQueue.push(() => {
+      return new Promise((resolve, reject) => {
+        if (this.sourceBuffer) {
+          this.sourceBuffer.addEventListener("updateend", () => {
+            resolve();
+          });
+          this.sourceBuffer.appendBuffer(buffer);
+        } else {
+          reject();
+        }
+      });
+    });
+  }
+
+  public clearBuffer() {
+    this.operationsQueue.push(() => {
+      return new Promise((resolve, reject) => {
+        if (this.sourceBuffer) {
+          this.sourceBuffer.addEventListener("updateend", () => {
+            resolve();
+          });
+          this.sourceBuffer.remove(0, this.mediaSource.duration);
+        } else {
+          reject();
+        }
+      });
+    });
+  }
+
+  private createOperationQueue() {
+    return async.queue<() => Promise<void>>((task, callback) => {
+      task().then(() => callback());
+    }, 1);
+  }
+}
+
+export default AtomicMediaSource;

package/dist/AtomicMediaSource.d.ts

@@ -0,0 +1,10 @@
+declare class AtomicMediaSource {
+    mediaSource: MediaSource;
+    private sourceBuffer;
+    private operationsQueue;
+    constructor();
+    appendBuffer(buffer: ArrayBuffer): void;
+    clearBuffer(): void;
+    private createOperationQueue;
+}
+export default AtomicMediaSource;

package/dist/AtomicMediaSource.js

@@ -0,0 +1,54 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const async_1 = __importDefault(require("async"));
+class AtomicMediaSource {
+    constructor() {
+        this.sourceBuffer = null;
+        this.mediaSource = new MediaSource();
+        this.operationsQueue = this.createOperationQueue();
+        this.mediaSource.addEventListener("sourceopen", () => {
+            this.mediaSource.duration = Number.POSITIVE_INFINITY;
+            this.sourceBuffer = this.mediaSource.addSourceBuffer('audio/webm; codecs="opus"');
+            this.sourceBuffer.mode = "sequence";
+        });
+    }
+    appendBuffer(buffer) {
+        this.operationsQueue.push(() => {
+            return new Promise((resolve, reject) => {
+                if (this.sourceBuffer) {
+                    this.sourceBuffer.addEventListener("updateend", () => {
+                        resolve();
+                    });
+                    this.sourceBuffer.appendBuffer(buffer);
+                }
+                else {
+                    reject();
+                }
+            });
+        });
+    }
+    clearBuffer() {
+        this.operationsQueue.push(() => {
+            return new Promise((resolve, reject) => {
+                if (this.sourceBuffer) {
+                    this.sourceBuffer.addEventListener("updateend", () => {
+                        resolve();
+                    });
+                    this.sourceBuffer.remove(0, this.mediaSource.duration);
+                }
+                else {
+                    reject();
+                }
+            });
+        });
+    }
+    createOperationQueue() {
+        return async_1.default.queue((task, callback) => {
+            task().then(() => callback());
+        }, 1);
+    }
+}
+exports.default = AtomicMediaSource;

package/dist/player.d.ts

@@ -1,18 +1,10 @@
 /// <reference types="node" />
-import async from "async";
 import EventEmitter from "events";
 export declare class ContinuousPlayer extends EventEmitter {
-    private mediaSource;
-    private sourceBuffer;
+    private atomic;
     private audio;
-    private operationsQueue;
     constructor();
-    createOperationQueue(): async.QueueObject<() => Promise<void>>;
     start(): void;
     playChunk(audioData: ArrayBuffer): void;
-    private performBufferOperation;
-    private appendNextChunk;
-    private removeBuffer;
-    private resetTimestampOffset;
     clear(): void;
 }

package/dist/player.js

@@ -4,88 +4,27 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ContinuousPlayer = void 0;
-const async_1 = __importDefault(require("async"));
+const AtomicMediaSource_1 = __importDefault(require("./AtomicMediaSource"));
 const events_1 = __importDefault(require("events"));
 class ContinuousPlayer extends events_1.default {
     constructor() {
         super();
-        this.sourceBuffer = null;
-        this.mediaSource = new MediaSource();
+        this.atomic = new AtomicMediaSource_1.default();
         this.audio = document.createElement("audio");
         this.audio.addEventListener("playing", () => this.emit("speech-start"));
         this.audio.addEventListener("play", () => this.emit("speech-start"));
         this.audio.addEventListener("waiting", () => this.emit("speech-end"));
-        this.audio.src = URL.createObjectURL(this.mediaSource);
+        this.audio.src = URL.createObjectURL(this.atomic.mediaSource);
         document.body.appendChild(this.audio);
-        this.operationsQueue = this.createOperationQueue();
-        this.mediaSource.addEventListener("sourceopen", () => {
-            this.mediaSource.duration = Number.POSITIVE_INFINITY;
-            this.sourceBuffer = this.mediaSource.addSourceBuffer('audio/webm; codecs="opus"');
-            this.sourceBuffer.mode = "sequence";
-        });
-    }
-    createOperationQueue() {
-        return async_1.default.queue((task, callback) => {
-            task().then(() => callback());
-        }, 1);
     }
     start() {
         this.audio.play();
     }
     playChunk(audioData) {
-        console.log("playChunk");
-        this.operationsQueue.push(() => this.appendNextChunk(audioData));
-    }
-    performBufferOperation(operation) {
-        return new Promise((resolve) => {
-            if (!this.sourceBuffer) {
-                resolve();
-                return;
-            }
-            if (this.sourceBuffer.updating) {
-                this.sourceBuffer.addEventListener("updateend", () => {
-                    operation();
-                    resolve();
-                }, {
-                    once: true,
-                });
-                return;
-            }
-            operation();
-            resolve();
-        });
-    }
-    appendNextChunk(chunk) {
-        return this.performBufferOperation(() => {
-            if (!this.sourceBuffer)
-                return;
-            console.log("appending");
-            this.sourceBuffer.appendBuffer(chunk);
-        });
-    }
-    removeBuffer() {
-        return this.performBufferOperation(() => {
-            if (!this.sourceBuffer)
-                return;
-            if (this.sourceBuffer.buffered.length > 0) {
-                this.sourceBuffer.remove(0, this.sourceBuffer.buffered.end(this.sourceBuffer.buffered.length - 1));
-            }
-        });
-    }
-    resetTimestampOffset() {
-        return this.performBufferOperation(() => {
-            if (!this.sourceBuffer)
-                return;
-            this.sourceBuffer.timestampOffset = 0;
-        });
+        this.atomic.appendBuffer(audioData);
     }
     clear() {
-        // if (!this.sourceBuffer) return;
-        // this.sourceBuffer.abort();
-        // this.operationsQueue.kill();
-        // this.operationsQueue = this.createOperationQueue();
-        // this.operationsQueue.push(() => this.removeBuffer());
-        // this.operationsQueue.push(() => this.resetTimestampOffset());
+        this.atomic.clearBuffer();
     }
 }
 exports.ContinuousPlayer = ContinuousPlayer;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vapi-ai/web",
-  "version": "1.0.106",
+  "version": "1.0.107",
   "description": "",
   "main": "dist/vapi.js",
   "types": "dist/vapi.d.ts",

package/player.ts

@@ -1,42 +1,22 @@
-import async, { QueueObject } from "async";
-
+import AtomicMediaSource from "./AtomicMediaSource";
 import EventEmitter from "events";
 
 export class ContinuousPlayer extends EventEmitter {
-  private mediaSource: MediaSource;
-  private sourceBuffer: SourceBuffer | null = null;
+  private atomic: AtomicMediaSource;
   private audio: HTMLAudioElement;
-  private operationsQueue: QueueObject<() => Promise<void>>;
 
   constructor() {
     super();
-    this.mediaSource = new MediaSource();
+    this.atomic = new AtomicMediaSource();
 
     this.audio = document.createElement("audio");
 
     this.audio.addEventListener("playing", () => this.emit("speech-start"));
     this.audio.addEventListener("play", () => this.emit("speech-start"));
-
     this.audio.addEventListener("waiting", () => this.emit("speech-end"));
 
-    this.audio.src = URL.createObjectURL(this.mediaSource);
+    this.audio.src = URL.createObjectURL(this.atomic.mediaSource);
     document.body.appendChild(this.audio);
-
-    this.operationsQueue = this.createOperationQueue();
-
-    this.mediaSource.addEventListener("sourceopen", () => {
-      this.mediaSource.duration = Number.POSITIVE_INFINITY;
-      this.sourceBuffer = this.mediaSource.addSourceBuffer(
-        'audio/webm; codecs="opus"'
-      );
-      this.sourceBuffer.mode = "sequence";
-    });
-  }
-
-  createOperationQueue() {
-    return async.queue<() => Promise<void>>((task, callback) => {
-      task().then(() => callback());
-    }, 1);
   }
 
   start() {
@@ -44,71 +24,10 @@ export class ContinuousPlayer extends EventEmitter {
   }
 
   playChunk(audioData: ArrayBuffer) {
-    console.log("playChunk");
-    this.operationsQueue.push(() => this.appendNextChunk(audioData));
-  }
-
-  private performBufferOperation(operation: () => void) {
-    return new Promise<void>((resolve) => {
-      if (!this.sourceBuffer) {
-        resolve();
-        return;
-      }
-
-      if (this.sourceBuffer.updating) {
-        this.sourceBuffer.addEventListener(
-          "updateend",
-          () => {
-            operation();
-            resolve();
-          },
-          {
-            once: true,
-          }
-        );
-        return;
-      }
-
-      operation();
-      resolve();
-    });
-  }
-
-  private appendNextChunk(chunk: ArrayBuffer) {
-    return this.performBufferOperation(() => {
-      if (!this.sourceBuffer) return;
-      console.log("appending");
-
-      this.sourceBuffer.appendBuffer(chunk);
-    });
-  }
-
-  private removeBuffer() {
-    return this.performBufferOperation(() => {
-      if (!this.sourceBuffer) return;
-
-      if (this.sourceBuffer.buffered.length > 0) {
-        this.sourceBuffer.remove(
-          0,
-          this.sourceBuffer.buffered.end(this.sourceBuffer.buffered.length - 1)
-        );
-      }
-    });
-  }
-
-  private resetTimestampOffset() {
-    return this.performBufferOperation(() => {
-      if (!this.sourceBuffer) return;
-      this.sourceBuffer.timestampOffset = 0;
-    });
+    this.atomic.appendBuffer(audioData);
   }
 
   clear() {
-    // if (!this.sourceBuffer) return;
-    // this.sourceBuffer.abort();
-    // this.operationsQueue.kill();
-    // this.operationsQueue = this.createOperationQueue();
-    // this.operationsQueue.push(() => this.removeBuffer());
-    // this.operationsQueue.push(() => this.resetTimestampOffset());
+    this.atomic.clearBuffer();
   }
 }