@livedigital/client 2.25.0-webinar-highload-test.1 → 2.26.0-stop-streams.2

package/dist/types/common.d.ts

@@ -20,6 +20,7 @@ export declare type TrackProduceParams = {
     codecOptions?: ProducerCodecOptions;
     preferredCodec?: string;
     transformParams?: TrackTransformParams;
+    keyFrameRequestDelay?: number;
 };
 export declare type TrackTransformParams = {
     width?: number;
@@ -169,6 +170,10 @@ export declare type PayloadOfPublishedMedia = {
     kind: MediaKind;
     label: TrackLabel;
 };
+export declare type SubscribeOptions = {
+    producerId: string;
+    paused?: boolean;
+};
 export declare type PayloadOfUnpublishedMedia = PayloadOfPublishedMedia;
 export declare type ChangePreferredLayersPayload = PreferredLayersParams & {
     consumerId: string;
@@ -299,3 +304,10 @@ export declare type UpdatePeerAppDataPayload = {
     peerId: string;
     appData: Record<string, unknown>;
 };
+export declare type CreateTracksPayload = {
+    mediaStreamTracks: MediaStreamTrack[];
+    constraints: MediaStreamConstraints;
+};
+export declare type TrackPublishParams = {
+    keyFrameRequestDelay?: number;
+};

package/package.json

@@ -2,7 +2,7 @@
   "name": "@livedigital/client",
   "author": "vlprojects",
   "license": "MIT",
-  "version": "2.25.0-webinar-highload-test.1",
+  "version": "2.26.0-stop-streams.2",
   "private": false,
   "bugs": {
     "url": "https://github.com/vlprojects/livedigital-sdk/issues"

package/src/engine/Peer.ts

@@ -9,6 +9,7 @@ import {
   Role,
   ProducerSetMaxSpatialLayer,
   PeerInfo,
+  SubscribeOptions,
 } from '../types/common';
 import EnhancedEventEmitter from '../EnhancedEventEmitter';
 import Engine from './index';
@@ -118,7 +119,7 @@ class Peer {
     }));
   }
 
-  public async subscribe(producerId: string): Promise<void> {
+  public async subscribe({ producerId, paused = false }: SubscribeOptions): Promise<void> {
     try {
       const producer = this.producers.get(producerId);
       if (!producer) {
@@ -132,7 +133,7 @@ class Peer {
         return;
       }
 
-      const { consumer } = await this.engine.network.createConsumer({
+      const { consumer, isProducerPaused } = await this.engine.network.createConsumer({
         producerId: producer.id,
         rtpCapabilities: this.engine.media.mediasoupDevice.rtpCapabilities,
         producerPeerId: this.id,
@@ -147,9 +148,13 @@ class Peer {
         engine: this.engine,
         isPaused: true,
         peerEventEmitter: this.observer,
+        isProducerPaused,
       });
 
-      await track.resume();
+      if (!paused) {
+        await track.resume();
+      }
+
       this.tracks.set(track.label, track);
       this.logger.debug(`Subscribed for ${producer.kind}`, { peer: this });
     } catch (error) {
@@ -222,6 +227,7 @@ class Peer {
         return;
       }
 
+      track.setIsTrackProducerPaused(true);
       await track.pause();
     });
 
@@ -231,6 +237,7 @@ class Peer {
         return;
       }
 
+      track.setIsTrackProducerPaused(false);
       await track.resume();
     });
 

package/src/engine/index.ts

@@ -223,6 +223,12 @@ class Engine {
   }
 
   public removePeer(peerId: string): void {
+    const peer = this.peersRepository.get(peerId);
+    if (!peer) {
+      return;
+    }
+
+    peer.tracks.forEach((track) => track.close());
     this.peersRepository.delete(peerId);
   }
 
@@ -451,20 +457,7 @@ class Engine {
 
   private watchClientEvents(): void {
     this.clientEventEmitter.on(INTERNAL_CLIENT_EVENTS.trackProduced, (track: Track) => {
-      const myPeer = this.peersRepository.get(<string> this.mySocketId);
-      if (!myPeer) {
-        return;
-      }
-
-      const peerTrack = new PeerTrack({
-        mediaStreamTrack: track.mediaStreamTrack,
-        label: track.getLabel(),
-        engine: this,
-        isPaused: track.isPaused,
-        peerEventEmitter: myPeer.observer,
-      });
-
-      myPeer.tracks.set(peerTrack.label, peerTrack);
+      this.createSelfPeerTrack(track);
     });
 
     this.clientEventEmitter.on(INTERNAL_CLIENT_EVENTS.trackUnproduced, (track: Track) => {
@@ -475,14 +468,30 @@ class Engine {
 
     this.clientEventEmitter.on(INTERNAL_CLIENT_EVENTS.trackPaused, (track: Track) => {
       const peerTrack = this.myPeer?.tracks.get(track.getLabel());
-      peerTrack?.pause();
+      peerTrack?.close();
     });
 
     this.clientEventEmitter.on(INTERNAL_CLIENT_EVENTS.trackResumed, (track: Track) => {
-      const peerTrack = this.myPeer?.tracks.get(track.getLabel());
-      peerTrack?.resume();
+      this.createSelfPeerTrack(track);
     });
   }
+
+  private createSelfPeerTrack(track: Track): void {
+    const myPeer = this.peersRepository.get(<string> this.mySocketId);
+    if (!myPeer) {
+      return;
+    }
+
+    const peerTrack = new PeerTrack({
+      mediaStreamTrack: track.mediaStreamTrack,
+      label: track.getLabel(),
+      engine: this,
+      isPaused: track.isPaused,
+      peerEventEmitter: myPeer.observer,
+    });
+
+    myPeer.tracks.set(peerTrack.label, peerTrack);
+  }
 }
 
 export default Engine;

package/src/engine/media/index.ts

@@ -3,7 +3,11 @@ import { RtpCapabilities, RtpCodecCapability } from 'mediasoup-client/lib/RtpPar
 import VideoTrack from './tracks/VideoTrack';
 import AudioTrack from './tracks/AudioTrack';
 import {
-  CreateScreenVideoTrackOptions, CreateVideoTrackParams, LogLevel, Track,
+  CreateScreenVideoTrackOptions,
+  CreateTracksPayload,
+  CreateVideoTrackParams,
+  LogLevel,
+  Track,
 } from '../../types/common';
 import Logger from '../Logger';
 import { VIDEO_CONSTRAINS } from '../../constants/videoConstrains';
@@ -11,6 +15,7 @@ import { SCREEN_SHARING_SIMULCAST_ENCODINGS, WEBCAM_SIMULCAST_ENCODINGS } from '
 import { CreateMediaParams } from '../../types/engine';
 import Engine from '../index';
 import EnhancedEventEmitter from '../../EnhancedEventEmitter';
+import MediaStreamTrackManager from './tracks/MediaStreamTrackManager';
 
 class Media {
   public isDeviceLoaded = false;
@@ -27,6 +32,8 @@ class Media {
 
   readonly #clientEventEmitter: EnhancedEventEmitter;
 
+  readonly #mediaStreamTrackManager: MediaStreamTrackManager;
+
   constructor(params: CreateMediaParams) {
     this.#logLevel = params.logLevel;
     this.#logger = new Logger({
@@ -35,6 +42,7 @@ class Media {
     });
     this.#engine = params.engine;
     this.#clientEventEmitter = params.clientEventEmitter;
+    this.#mediaStreamTrackManager = new MediaStreamTrackManager(params.logLevel);
   }
 
   get mediasoupDevice(): Device {
@@ -62,20 +70,20 @@ class Media {
     return codecs.find((c) => c.mimeType.toLowerCase() === `${track.kind}/${track.getPreferredCodec()}`);
   }
 
-  private createTracks(stream: MediaStream): Track[] {
-    const mediaStreamTracks = stream.getTracks();
+  private createTracks({ constraints, mediaStreamTracks }: CreateTracksPayload): Track[] {
     return mediaStreamTracks.map((mediaStreamTrack) => {
       const params = {
         mediaStreamTrack,
         logLevel: this.#logLevel,
         engine: this.#engine,
         clientEventEmitter: this.#clientEventEmitter,
+        constraints,
+        mediaStreamTrackManager: this.#mediaStreamTrackManager,
       };
 
       const track = mediaStreamTrack.kind === 'audio' ? new AudioTrack(params) : new VideoTrack(params);
       this.tracks.set(track.id, track);
       this.#logger.debug('createTrack() track created', {
-        streamId: stream.id,
         trackId: track.id,
         kind: track.kind,
       });
@@ -85,14 +93,13 @@ class Media {
   }
 
   async createUserMediaTracks(constraints: MediaStreamConstraints): Promise<Track[]> {
-    const stream = await navigator.mediaDevices.getUserMedia(constraints);
-    this.#logger.debug('createUserMediaTrack() stream created', { streamId: stream.id });
-    return this.createTracks(stream);
+    const mediaStreamTracks = await this.#mediaStreamTrackManager.createUserMediaTracks(constraints);
+    return this.createTracks({ constraints, mediaStreamTracks });
   }
 
   async createDisplayMediaTracks(constraints: MediaStreamConstraints): Promise<Track[]> {
-    const stream = await navigator.mediaDevices.getDisplayMedia(constraints);
-    return this.createTracks(stream);
+    const mediaStreamTracks = await this.#mediaStreamTrackManager.createDisplayMediaTracks(constraints);
+    return this.createTracks({ constraints, mediaStreamTracks });
   }
 
   deleteTrack(track: Track) {

package/src/engine/media/tracks/BaseTrack.ts

@@ -5,27 +5,31 @@ import {
   EncoderConfig,
   LogLevel,
   SocketResponse,
-  TrackLabel, TrackOutboundStats,
+  TrackLabel,
+  TrackOutboundStats,
   TrackProduceParams,
 } from '../../../types/common';
 import Logger from '../../Logger';
 import Engine from '../../index';
 import PeerConsumer from '../../PeerConsumer';
 import { PRODUCER_CHECK_STATE_TIMEOUT } from '../../../constants/common';
-import Timeout = NodeJS.Timeout;
-import { MEDIASOUP_EVENTS, INTERNAL_CLIENT_EVENTS, CLIENT_EVENTS } from '../../../constants/events';
+import { CLIENT_EVENTS, INTERNAL_CLIENT_EVENTS, MEDIASOUP_EVENTS } from '../../../constants/events';
 import EnhancedEventEmitter from '../../../EnhancedEventEmitter';
 import filterStatsCodecs from '../../../helpers/filterStatsCodecs';
+import Timeout = NodeJS.Timeout;
+import MediaStreamTrackManager from './MediaStreamTrackManager';
 
 export type BaseTrackConstructorParams = {
   mediaStreamTrack: MediaStreamTrack,
   logLevel: LogLevel,
   engine: Engine,
   clientEventEmitter: EnhancedEventEmitter,
+  constraints: MediaStreamConstraints;
+  mediaStreamTrackManager: MediaStreamTrackManager;
 };
 
 class BaseTrack {
-  readonly #mediaStreamTrack: MediaStreamTrack;
+  #mediaStreamTrack: MediaStreamTrack;
 
   protected encoderConfig: EncoderConfig = {};
 
@@ -47,13 +51,19 @@ class BaseTrack {
 
   #closed = false;
 
+  readonly #constraints: MediaStreamConstraints;
+
+  readonly #mediaStreamTrackManager: MediaStreamTrackManager;
+
   constructor(params: BaseTrackConstructorParams) {
     const {
-      mediaStreamTrack, logLevel, engine, clientEventEmitter,
+      mediaStreamTrack, logLevel, engine, clientEventEmitter, constraints, mediaStreamTrackManager,
     } = params;
     this.#mediaStreamTrack = mediaStreamTrack;
     this.#engine = engine;
     this.#clientEventEmitter = clientEventEmitter;
+    this.#constraints = constraints;
+    this.#mediaStreamTrackManager = mediaStreamTrackManager;
     this.logger = new Logger({
       namespace: 'Track',
       logLevel,
@@ -212,6 +222,7 @@ class BaseTrack {
         codecOptions,
         trackTransformParams,
         preferredCodec,
+        keyFrameRequestDelay,
       },
     } = this.producer;
 
@@ -222,6 +233,7 @@ class BaseTrack {
       codecOptions,
       transformParams: trackTransformParams,
       preferredCodec,
+      keyFrameRequestDelay,
     });
 
     this.logger.debug('restartProducer()', { track: this });
@@ -257,6 +269,7 @@ class BaseTrack {
   }
 
   private async cancelProducerCheckState(): Promise<void> {
+    this.logger.debug('cancelProducerCheckState()', { track: this });
     if (this.#checkStateTimeout) {
       clearTimeout(this.#checkStateTimeout);
     }
@@ -265,7 +278,11 @@ class BaseTrack {
   }
 
   async produce({
-    encodings, codecOptions, preferredCodec, transformParams,
+    encodings,
+    codecOptions,
+    preferredCodec,
+    transformParams,
+    keyFrameRequestDelay,
   }: TrackProduceParams): Promise<void> {
     if (!this.#engine.cahPublish) {
       this.logger.error('produce()', { message: 'Not enough access to produce' });
@@ -285,6 +302,7 @@ class BaseTrack {
         codecOptions,
         preferredCodec,
         codec,
+        keyFrameRequestDelay,
       };
 
       const producer = await this.#engine.network.sendTransport?.produce({
@@ -355,8 +373,10 @@ class BaseTrack {
     }
 
     try {
+      await this.cancelProducerCheckState();
       await this.pauseRemoteProducer(this.producer.id);
       this.producer.pause();
+      this.#mediaStreamTrack.stop();
       this.clientEventEmitter.emit(INTERNAL_CLIENT_EVENTS.trackPaused, this);
       this.logger.debug('pause()', { track: this });
     } catch (error) {
@@ -372,10 +392,16 @@ class BaseTrack {
     }
 
     try {
+      const track = await this.#mediaStreamTrackManager.createMediaStreamTrack({
+        label: this.label,
+        constraints: this.#constraints,
+      });
+      this.#mediaStreamTrack = track;
+      await this.producer.replaceTrack({ track });
       await this.resumeRemoteProducer(this.producer.id);
       this.producer.resume();
       this.clientEventEmitter.emit(INTERNAL_CLIENT_EVENTS.trackResumed, this);
-      this.logger.error('resume()', { track: this });
+      this.logger.debug('resume()', { track: this });
     } catch (error) {
       this.logger.error('resume()', { error, track: this });
       throw new Error('Can`t resume track');

package/src/engine/media/tracks/MediaStreamTrackManager.ts

@@ -0,0 +1,46 @@
+import { LogLevel, TrackLabel } from '../../../types/common';
+import Logger from '../../Logger';
+
+export type GetMediaStreamTrackParams = {
+  label: TrackLabel;
+  constraints: MediaStreamConstraints;
+};
+
+class MediaStreamTrackManager {
+  readonly #logger: Logger;
+
+  constructor(logLevel: LogLevel) {
+    this.#logger = new Logger({
+      namespace: 'MediaStreamTrackManager',
+      logLevel,
+    });
+  }
+
+  async createMediaStreamTrack({ label, constraints }: GetMediaStreamTrackParams): Promise<MediaStreamTrack> {
+    if (MediaStreamTrackManager.isDisplayMedia(label)) {
+      const [track] = await this.createDisplayMediaTracks(constraints);
+      return track;
+    }
+
+    const [track] = await this.createUserMediaTracks(constraints);
+    return track;
+  }
+
+  private static isDisplayMedia(label: TrackLabel): boolean {
+    return [TrackLabel.ScreenVideo, TrackLabel.ScreenAudio].includes(label);
+  }
+
+  async createUserMediaTracks(constraints: MediaStreamConstraints): Promise<MediaStreamTrack[]> {
+    const stream = await navigator.mediaDevices.getUserMedia(constraints);
+    this.#logger.debug('createUserMediaTracks() stream created', { streamId: stream.id });
+    return stream.getTracks();
+  }
+
+  async createDisplayMediaTracks(constraints: MediaStreamConstraints): Promise<MediaStreamTrack[]> {
+    const stream = await navigator.mediaDevices.getDisplayMedia(constraints);
+    this.#logger.debug('getDisplayMediaTracks() stream created', { streamId: stream.id });
+    return stream.getTracks();
+  }
+}
+
+export default MediaStreamTrackManager;

package/src/engine/media/tracks/PeerTrack.ts

@@ -20,6 +20,7 @@ interface PeerTrackConstructor {
   consumer?: PeerConsumer,
   engine: Engine,
   isPaused: boolean,
+  isProducerPaused?: boolean,
   peerEventEmitter: EnhancedEventEmitter,
 }
 
@@ -44,6 +45,8 @@ class PeerTrack {
 
   #closed = false;
 
+  #isTrackProducerPaused?: boolean;
+
   constructor(payload: PeerTrackConstructor) {
     this.#mediaStreamTrack = payload.mediaStreamTrack;
     this.label = payload.label;
@@ -55,6 +58,7 @@ class PeerTrack {
     });
     this.#peerEventEmitter = payload.peerEventEmitter;
     this.#paused = payload.isPaused;
+    this.#isTrackProducerPaused = payload.isProducerPaused;
     this.#peerEventEmitter.safeEmit(PEER_EVENTS.trackStart, this);
   }
 
@@ -131,11 +135,17 @@ class PeerTrack {
       return;
     }
 
+    if (this.#isTrackProducerPaused) {
+      this.#logger.debug('resume()', { message: 'Can not resume track, producer is paused', track: this, peer: this });
+      return;
+    }
+
     try {
       await this.#engine.network.resumeRemoteConsumer(this.consumer.id);
       this.consumer.resume();
       this.#paused = false;
       this.#peerEventEmitter.safeEmit(PEER_EVENTS.trackResumed, this);
+      this.checkConsumerState();
       this.#logger.debug('resume()', { track: this, peer: this });
     } catch (error) {
       this.#logger.warn('resume()', { error });
@@ -427,6 +437,10 @@ class PeerTrack {
 
     clearTimeout(this.#checkStateTimeout);
   }
+
+  setIsTrackProducerPaused(value: boolean): void {
+    this.#isTrackProducerPaused = value;
+  }
 }
 
 export default PeerTrack;

package/src/engine/media/tracks/VideoTrack.ts

@@ -1,7 +1,9 @@
 import { ProducerCodecOptions } from 'mediasoup-client/lib/Producer';
 import { RtpEncodingParameters } from 'mediasoup-client/lib/RtpParameters';
 import { WEBCAM_SIMULCAST_ENCODINGS } from '../../../constants/simulcastEncodings';
-import { TrackLabel, VideoCodec, VideoEncoderConfig } from '../../../types/common';
+import {
+  TrackLabel, TrackPublishParams, VideoCodec, VideoEncoderConfig,
+} from '../../../types/common';
 import BaseTrack from './BaseTrack';
 import TrackWithCodecOptions from './TrackWithCodecOptions';
 import TrackWithEncodings from './TrackWithEncodings';
@@ -65,12 +67,13 @@ class VideoTrack extends BaseTrack implements TrackWithCodecOptions, TrackWithEn
     return producer.maxSpatialLayer;
   }
 
-  async publish(): Promise<void> {
+  async publish(params: TrackPublishParams = {}): Promise<void> {
     await this.produce({
       encodings: this.getEncodings(),
       preferredCodec: this.getPreferredCodec(),
       transformParams: this.transformParams,
       codecOptions: this.getCodecOptions(),
+      keyFrameRequestDelay: params.keyFrameRequestDelay ?? 0,
     });
 
     this.clientEventEmitter.emit(INTERNAL_CLIENT_EVENTS.trackProduced, this);

package/src/types/common.ts

@@ -27,6 +27,7 @@ export type TrackProduceParams = {
   codecOptions?: ProducerCodecOptions,
   preferredCodec?: string,
   transformParams?: TrackTransformParams,
+  keyFrameRequestDelay?: number,
 };
 
 export type TrackTransformParams = {
@@ -205,6 +206,11 @@ export type PayloadOfPublishedMedia = {
   label: TrackLabel,
 };
 
+export type SubscribeOptions = {
+  producerId: string,
+  paused?: boolean,
+};
+
 export type PayloadOfUnpublishedMedia = PayloadOfPublishedMedia;
 
 export type ChangePreferredLayersPayload = PreferredLayersParams & {
@@ -343,3 +349,12 @@ export type UpdatePeerAppDataPayload = {
   peerId: string,
   appData: Record<string, unknown>,
 };
+
+export type CreateTracksPayload = {
+  mediaStreamTracks: MediaStreamTrack[],
+  constraints: MediaStreamConstraints,
+};
+
+export type TrackPublishParams = {
+  keyFrameRequestDelay?: number;
+};