livekit-client 2.0.2 → 2.0.4

package/src/room/track/LocalTrack.ts

@@ -8,6 +8,7 @@ import { Mutex, compareVersions, isMobile, sleep } from '../utils';
 import { Track, attachToElement, detachTrack } from './Track';
 import type { VideoCodec } from './options';
 import type { TrackProcessor } from './processor/types';
+import type { ReplaceTrackOptions } from './types';
 
 const defaultDimensionsTimeout = 1000;
 
@@ -42,6 +43,8 @@ export default abstract class LocalTrack<
 
   protected audioContext?: AudioContext;
 
+  private restartLock: Mutex;
+
   /**
    *
    * @param mediaTrack
@@ -62,6 +65,7 @@ export default abstract class LocalTrack<
     this.muteLock = new Mutex();
     this.pauseUpstreamLock = new Mutex();
     this.processorLock = new Mutex();
+    this.restartLock = new Mutex();
     this.setMediaStreamTrack(mediaTrack, true);
 
     // added to satisfy TS compiler, constraints are synced with MediaStreamTrack
@@ -221,62 +225,83 @@ export default abstract class LocalTrack<
     return this;
   }
 
-  async replaceTrack(track: MediaStreamTrack, userProvidedTrack = true) {
+  async replaceTrack(track: MediaStreamTrack, options?: ReplaceTrackOptions): Promise<typeof this>;
+  async replaceTrack(track: MediaStreamTrack, userProvidedTrack?: boolean): Promise<typeof this>;
+  async replaceTrack(
+    track: MediaStreamTrack,
+    userProvidedOrOptions: boolean | ReplaceTrackOptions | undefined,
+  ) {
     if (!this.sender) {
       throw new TrackInvalidError('unable to replace an unpublished track');
     }
 
+    let userProvidedTrack: boolean | undefined;
+    let stopProcessor: boolean | undefined;
+
+    if (typeof userProvidedOrOptions === 'boolean') {
+      userProvidedTrack = userProvidedOrOptions;
+    } else if (userProvidedOrOptions !== undefined) {
+      userProvidedTrack = userProvidedOrOptions.userProvidedTrack;
+      stopProcessor = userProvidedOrOptions.stopProcessor;
+    }
+
+    this.providedByUser = userProvidedTrack ?? true;
+
     this.log.debug('replace MediaStreamTrack', this.logContext);
     await this.setMediaStreamTrack(track);
     // this must be synced *after* setting mediaStreamTrack above, since it relies
     // on the previous state in order to cleanup
-    this.providedByUser = userProvidedTrack;
 
-    if (this.processor) {
+    if (stopProcessor && this.processor) {
       await this.stopProcessor();
     }
     return this;
   }
 
   protected async restart(constraints?: MediaTrackConstraints) {
-    if (!constraints) {
-      constraints = this._constraints;
-    }
-    this.log.debug('restarting track with constraints', { ...this.logContext, constraints });
+    const unlock = await this.restartLock.lock();
+    try {
+      if (!constraints) {
+        constraints = this._constraints;
+      }
+      this.log.debug('restarting track with constraints', { ...this.logContext, constraints });
 
-    const streamConstraints: MediaStreamConstraints = {
-      audio: false,
-      video: false,
-    };
+      const streamConstraints: MediaStreamConstraints = {
+        audio: false,
+        video: false,
+      };
 
-    if (this.kind === Track.Kind.Video) {
-      streamConstraints.video = constraints;
-    } else {
-      streamConstraints.audio = constraints;
-    }
+      if (this.kind === Track.Kind.Video) {
+        streamConstraints.video = constraints;
+      } else {
+        streamConstraints.audio = constraints;
+      }
 
-    // these steps are duplicated from setMediaStreamTrack because we must stop
-    // the previous tracks before new tracks can be acquired
-    this.attachedElements.forEach((el) => {
-      detachTrack(this.mediaStreamTrack, el);
-    });
-    this._mediaStreamTrack.removeEventListener('ended', this.handleEnded);
-    // on Safari, the old audio track must be stopped before attempting to acquire
-    // the new track, otherwise the new track will stop with
-    // 'A MediaStreamTrack ended due to a capture failure`
-    this._mediaStreamTrack.stop();
+      // these steps are duplicated from setMediaStreamTrack because we must stop
+      // the previous tracks before new tracks can be acquired
+      this.attachedElements.forEach((el) => {
+        detachTrack(this.mediaStreamTrack, el);
+      });
+      this._mediaStreamTrack.removeEventListener('ended', this.handleEnded);
+      // on Safari, the old audio track must be stopped before attempting to acquire
+      // the new track, otherwise the new track will stop with
+      // 'A MediaStreamTrack ended due to a capture failure`
+      this._mediaStreamTrack.stop();
 
-    // create new track and attach
-    const mediaStream = await navigator.mediaDevices.getUserMedia(streamConstraints);
-    const newTrack = mediaStream.getTracks()[0];
-    newTrack.addEventListener('ended', this.handleEnded);
-    this.log.debug('re-acquired MediaStreamTrack', this.logContext);
+      // create new track and attach
+      const mediaStream = await navigator.mediaDevices.getUserMedia(streamConstraints);
+      const newTrack = mediaStream.getTracks()[0];
+      newTrack.addEventListener('ended', this.handleEnded);
+      this.log.debug('re-acquired MediaStreamTrack', this.logContext);
 
-    await this.setMediaStreamTrack(newTrack);
-    this._constraints = constraints;
+      await this.setMediaStreamTrack(newTrack);
+      this._constraints = constraints;
 
-    this.emit(TrackEvent.Restarted, this);
-    return this;
+      this.emit(TrackEvent.Restarted, this);
+      return this;
+    } finally {
+      unlock();
+    }
   }
 
   protected setTrackMuted(muted: boolean) {
@@ -459,6 +484,7 @@ export default abstract class LocalTrack<
         }
         await this.sender?.replaceTrack(this.processor.processedTrack);
       }
+      this.emit(TrackEvent.TrackProcessorUpdate, this.processor);
     } finally {
       unlock();
     }
@@ -484,8 +510,8 @@ export default abstract class LocalTrack<
     this.processor = undefined;
     this.processorElement?.remove();
     this.processorElement = undefined;
-
     await this.restart();
+    this.emit(TrackEvent.TrackProcessorUpdate);
   }
 
   protected abstract monitorSender(): void;

package/src/room/track/LocalVideoTrack.ts

@@ -118,6 +118,11 @@ export default class LocalVideoTrack extends LocalTrack<Track.Kind.Video> {
   async mute(): Promise<typeof this> {
     const unlock = await this.muteLock.lock();
     try {
+      if (this.isMuted) {
+        this.log.debug('Track already muted', this.logContext);
+        return this;
+      }
+
       if (this.source === Track.Source.Camera && !this.isUserProvided) {
         this.log.debug('stopping camera track', this.logContext);
         // also stop the track, so that camera indicator is turned off
@@ -133,6 +138,11 @@ export default class LocalVideoTrack extends LocalTrack<Track.Kind.Video> {
   async unmute(): Promise<typeof this> {
     const unlock = await this.muteLock.lock();
     try {
+      if (!this.isMuted) {
+        this.log.debug('Track already unmuted', this.logContext);
+        return this;
+      }
+
       if (this.source === Track.Source.Camera && !this.isUserProvided) {
         this.log.debug('reacquiring camera track', this.logContext);
         await this.restartTrack();

package/src/room/track/Track.ts

@@ -11,6 +11,7 @@ import { StreamState as ProtoStreamState } from '../../proto/livekit_rtc_pb';
 import { TrackEvent } from '../events';
 import type { LoggerOptions } from '../types';
 import { isFireFox, isSafari, isWeb } from '../utils';
+import type { TrackProcessor } from './processor/types';
 import { getLogContextFromTrack } from './utils';
 
 const BACKGROUND_REACTION_DELAY = 5000;
@@ -502,4 +503,5 @@ export type TrackEventCallbacks = {
   elementDetached: (element: HTMLMediaElement) => void;
   upstreamPaused: (track: any) => void;
   upstreamResumed: (track: any) => void;
+  trackProcessorUpdate: (processor?: TrackProcessor<Track.Kind, any>) => void;
 };

package/src/room/track/options.ts

@@ -257,6 +257,15 @@ export interface VideoEncoding {
   priority?: RTCPriorityType;
 }
 
+export interface VideoPresetOptions {
+  width: number;
+  height: number;
+  aspectRatio?: number;
+  maxBitrate: number;
+  maxFramerate?: number;
+  priority?: RTCPriorityType;
+}
+
 export class VideoPreset {
   encoding: VideoEncoding;
 
@@ -264,20 +273,44 @@ export class VideoPreset {
 
   height: number;
 
+  aspectRatio?: number;
+
+  constructor(videoPresetOptions: VideoPresetOptions);
   constructor(
     width: number,
     height: number,
     maxBitrate: number,
     maxFramerate?: number,
     priority?: RTCPriorityType,
+  );
+  constructor(
+    widthOrOptions: number | VideoPresetOptions,
+    height?: number,
+    maxBitrate?: number,
+    maxFramerate?: number,
+    priority?: RTCPriorityType,
   ) {
-    this.width = width;
-    this.height = height;
-    this.encoding = {
-      maxBitrate,
-      maxFramerate,
-      priority,
-    };
+    if (typeof widthOrOptions === 'object') {
+      this.width = widthOrOptions.width;
+      this.height = widthOrOptions.height;
+      this.aspectRatio = widthOrOptions.aspectRatio;
+      this.encoding = {
+        maxBitrate: widthOrOptions.maxBitrate,
+        maxFramerate: widthOrOptions.maxFramerate,
+        priority: widthOrOptions.priority,
+      };
+    } else if (height !== undefined && maxBitrate !== undefined) {
+      this.width = widthOrOptions;
+      this.height = height;
+      this.aspectRatio = widthOrOptions / height;
+      this.encoding = {
+        maxBitrate,
+        maxFramerate,
+        priority,
+      };
+    } else {
+      throw new TypeError('Unsupported options: provide at least width, height and maxBitrate');
+    }
   }
 
   get resolution(): VideoResolution {
@@ -285,7 +318,7 @@ export class VideoPreset {
       width: this.width,
       height: this.height,
       frameRate: this.encoding.maxFramerate,
-      aspectRatio: this.width / this.height,
+      aspectRatio: this.aspectRatio,
     };
   }
 }

package/src/room/track/types.ts

@@ -23,3 +23,8 @@ export type AdaptiveStreamSettings = {
    */
   pauseVideoInBackground?: boolean;
 };
+
+export interface ReplaceTrackOptions {
+  userProvidedTrack?: boolean;
+  stopProcessor?: boolean;
+}