livekit-client 0.16.5 → 0.16.6

package/src/room/Room.ts

@@ -1,4 +1,5 @@
 import { EventEmitter } from 'events';
+import type TypedEmitter from 'typed-emitter';
 import { toProtoSessionDescription } from '../api/SignalClient';
 import log from '../logger';
 import { RoomConnectOptions, RoomOptions } from '../options';
@@ -44,7 +45,7 @@ export enum RoomState {
  *
  * @noInheritDoc
  */
-class Room extends EventEmitter {
+class Room extends (EventEmitter as new () => TypedEmitter<RoomEventCallbacks>) {
   state: RoomState = RoomState.Disconnected;
 
   /** map of sid: [[RemoteParticipant]] */
@@ -145,10 +146,12 @@ class Room extends EventEmitter {
       .on(EngineEvent.Resuming, () => {
         this.state = RoomState.Reconnecting;
         this.emit(RoomEvent.Reconnecting);
+        this.emit(RoomEvent.StateChanged, this.state);
       })
       .on(EngineEvent.Resumed, () => {
         this.state = RoomState.Connected;
         this.emit(RoomEvent.Reconnected);
+        this.emit(RoomEvent.StateChanged, this.state);
         this.updateSubscriptions();
       })
       .on(EngineEvent.SignalResumed, () => {
@@ -205,6 +208,7 @@ class Room extends EventEmitter {
       }
 
       this.state = RoomState.Connected;
+      this.emit(RoomEvent.StateChanged, this.state);
       const pi = joinResponse.participant!;
       this.localParticipant = new LocalParticipant(
         pi.sid,
@@ -216,10 +220,10 @@ class Room extends EventEmitter {
       this.localParticipant.updateInfo(pi);
       // forward metadata changed for the local participant
       this.localParticipant
-        .on(ParticipantEvent.MetadataChanged, (metadata: object) => {
+        .on(ParticipantEvent.MetadataChanged, (metadata: string | undefined) => {
           this.emit(RoomEvent.MetadataChanged, metadata, this.localParticipant);
         })
-        .on(ParticipantEvent.ParticipantMetadataChanged, (metadata: object) => {
+        .on(ParticipantEvent.ParticipantMetadataChanged, (metadata: string | undefined) => {
           this.emit(RoomEvent.ParticipantMetadataChanged, metadata, this.localParticipant);
         })
         .on(ParticipantEvent.TrackMuted, (pub: TrackPublication) => {
@@ -445,6 +449,7 @@ class Room extends EventEmitter {
   private handleRestarting = () => {
     this.state = RoomState.Reconnecting;
     this.emit(RoomEvent.Reconnecting);
+    this.emit(RoomEvent.StateChanged, this.state);
 
     // also unwind existing participants & existing subscriptions
     for (const p of this.participants.values()) {
@@ -455,6 +460,7 @@ class Room extends EventEmitter {
   private handleRestarted = async (joinResponse: JoinResponse) => {
     this.state = RoomState.Connected;
     this.emit(RoomEvent.Reconnected);
+    this.emit(RoomEvent.StateChanged, this.state);
 
     // rehydrate participants
     if (joinResponse.participant) {
@@ -509,6 +515,7 @@ class Room extends EventEmitter {
     navigator.mediaDevices.removeEventListener('devicechange', this.handleDeviceChange);
     this.state = RoomState.Disconnected;
     this.emit(RoomEvent.Disconnected);
+    this.emit(RoomEvent.StateChanged, this.state);
   }
 
   private handleParticipantUpdates = (participantInfos: ParticipantInfo[]) => {
@@ -717,66 +724,72 @@ class Room extends EventEmitter {
     }
   }
 
+  private createParticipant(id: string, info?: ParticipantInfo): RemoteParticipant {
+    let participant: RemoteParticipant;
+    if (info) {
+      participant = RemoteParticipant.fromParticipantInfo(
+        this.engine.client,
+        info,
+      );
+    } else {
+      participant = new RemoteParticipant(this.engine.client, id, '');
+    }
+    return participant;
+  }
+
   private getOrCreateParticipant(
     id: string,
     info?: ParticipantInfo,
   ): RemoteParticipant {
-    let participant = this.participants.get(id);
-    if (!participant) {
-      // it's possible for the RTC track to arrive before signaling data
-      // when this happens, we'll create the participant and make the track work
-      if (info) {
-        participant = RemoteParticipant.fromParticipantInfo(
-          this.engine.client,
-          info,
-        );
-      } else {
-        participant = new RemoteParticipant(this.engine.client, id, '');
-      }
-      this.participants.set(id, participant);
-      // also forward events
-
-      // trackPublished is only fired for tracks added after both local participant
-      // and remote participant joined the room
-      participant
-        .on(ParticipantEvent.TrackPublished, (trackPublication: RemoteTrackPublication) => {
-          this.emit(RoomEvent.TrackPublished, trackPublication, participant);
-        })
-        .on(ParticipantEvent.TrackSubscribed,
-          (track: RemoteTrack, publication: RemoteTrackPublication) => {
-            // monitor playback status
-            if (track.kind === Track.Kind.Audio) {
-              track.on(TrackEvent.AudioPlaybackStarted, this.handleAudioPlaybackStarted);
-              track.on(TrackEvent.AudioPlaybackFailed, this.handleAudioPlaybackFailed);
-            }
-            this.emit(RoomEvent.TrackSubscribed, track, publication, participant);
-          })
-        .on(ParticipantEvent.TrackUnpublished, (publication: RemoteTrackPublication) => {
-          this.emit(RoomEvent.TrackUnpublished, publication, participant);
-        })
-        .on(ParticipantEvent.TrackUnsubscribed,
-          (track: RemoteTrack, publication: RemoteTrackPublication) => {
-            this.emit(RoomEvent.TrackUnsubscribed, track, publication, participant);
-          })
-        .on(ParticipantEvent.TrackSubscriptionFailed, (sid: string) => {
-          this.emit(RoomEvent.TrackSubscriptionFailed, sid, participant);
-        })
-        .on(ParticipantEvent.TrackMuted, (pub: TrackPublication) => {
-          this.emit(RoomEvent.TrackMuted, pub, participant);
-        })
-        .on(ParticipantEvent.TrackUnmuted, (pub: TrackPublication) => {
-          this.emit(RoomEvent.TrackUnmuted, pub, participant);
-        })
-        .on(ParticipantEvent.MetadataChanged, (metadata: any) => {
-          this.emit(RoomEvent.MetadataChanged, metadata, participant);
+    if (this.participants.has(id)) {
+      return (this.participants.get(id) as RemoteParticipant);
+    }
+    // it's possible for the RTC track to arrive before signaling data
+    // when this happens, we'll create the participant and make the track work
+    const participant = this.createParticipant(id, info);
+    this.participants.set(id, participant);
+
+    // also forward events
+    // trackPublished is only fired for tracks added after both local participant
+    // and remote participant joined the room
+    participant
+      .on(ParticipantEvent.TrackPublished, (trackPublication: RemoteTrackPublication) => {
+        this.emit(RoomEvent.TrackPublished, trackPublication, participant);
+      })
+      .on(ParticipantEvent.TrackSubscribed,
+        (track: RemoteTrack, publication: RemoteTrackPublication) => {
+          // monitor playback status
+          if (track.kind === Track.Kind.Audio) {
+            track.on(TrackEvent.AudioPlaybackStarted, this.handleAudioPlaybackStarted);
+            track.on(TrackEvent.AudioPlaybackFailed, this.handleAudioPlaybackFailed);
+          }
+          this.emit(RoomEvent.TrackSubscribed, track, publication, participant);
         })
-        .on(ParticipantEvent.ParticipantMetadataChanged, (metadata: any) => {
-          this.emit(RoomEvent.ParticipantMetadataChanged, metadata, participant);
+      .on(ParticipantEvent.TrackUnpublished, (publication: RemoteTrackPublication) => {
+        this.emit(RoomEvent.TrackUnpublished, publication, participant);
+      })
+      .on(ParticipantEvent.TrackUnsubscribed,
+        (track: RemoteTrack, publication: RemoteTrackPublication) => {
+          this.emit(RoomEvent.TrackUnsubscribed, track, publication, participant);
         })
-        .on(ParticipantEvent.ConnectionQualityChanged, (quality: ConnectionQuality) => {
-          this.emit(RoomEvent.ConnectionQualityChanged, quality, participant);
-        });
-    }
+      .on(ParticipantEvent.TrackSubscriptionFailed, (sid: string) => {
+        this.emit(RoomEvent.TrackSubscriptionFailed, sid, participant);
+      })
+      .on(ParticipantEvent.TrackMuted, (pub: TrackPublication) => {
+        this.emit(RoomEvent.TrackMuted, pub, participant);
+      })
+      .on(ParticipantEvent.TrackUnmuted, (pub: TrackPublication) => {
+        this.emit(RoomEvent.TrackUnmuted, pub, participant);
+      })
+      .on(ParticipantEvent.MetadataChanged, (metadata: string | undefined) => {
+        this.emit(RoomEvent.MetadataChanged, metadata, participant);
+      })
+      .on(ParticipantEvent.ParticipantMetadataChanged, (metadata: string | undefined) => {
+        this.emit(RoomEvent.ParticipantMetadataChanged, metadata, participant);
+      })
+      .on(ParticipantEvent.ConnectionQualityChanged, (quality: ConnectionQuality) => {
+        this.emit(RoomEvent.ConnectionQualityChanged, quality, participant);
+      });
     return participant;
   }
 
@@ -830,11 +843,74 @@ class Room extends EventEmitter {
     }
   }
 
-  /** @internal */
-  emit(event: string | symbol, ...args: any[]): boolean {
+  // /** @internal */
+  emit<E extends keyof RoomEventCallbacks>(
+    event: E, ...args: Parameters<RoomEventCallbacks[E]>
+  ): boolean {
     log.debug('room event', event, ...args);
     return super.emit(event, ...args);
   }
 }
 
 export default Room;
+
+export type RoomEventCallbacks = {
+  reconnecting: () => void,
+  reconnected: () => void,
+  disconnected: () => void,
+  stateChanged: (state: RoomState) => void,
+  mediaDevicesChanged: () => void,
+  participantConnected: (participant: RemoteParticipant) => void,
+  participantDisconnected: (participant: RemoteParticipant) => void,
+  trackPublished: (publication: RemoteTrackPublication, participant: RemoteParticipant) => void,
+  trackSubscribed: (
+    track: RemoteTrack,
+    publication: RemoteTrackPublication,
+    participant: RemoteParticipant
+  ) => void,
+  trackSubscriptionFailed: (trackSid: string, participant: RemoteParticipant) => void,
+  trackUnpublished: (publication: RemoteTrackPublication, participant: RemoteParticipant) => void,
+  trackUnsubscribed: (
+    track: RemoteTrack,
+    publication: RemoteTrackPublication,
+    participant: RemoteParticipant,
+  ) => void,
+  trackMuted: (publication: TrackPublication, participant: Participant) => void,
+  trackUnmuted: (publication: TrackPublication, participant: Participant) => void,
+  localTrackPublished: (publication: LocalTrackPublication, participant: LocalParticipant) => void,
+  localTrackUnpublished: (
+    publication: LocalTrackPublication,
+    participant: LocalParticipant
+  ) => void,
+  /**
+   * @deprecated use [[participantMetadataChanged]] instead
+  */
+  metadataChanged: (
+    metadata: string | undefined,
+    participant?: RemoteParticipant | LocalParticipant
+  ) => void,
+  participantMetadataChanged: (
+    metadata: string | undefined,
+    participant: RemoteParticipant | LocalParticipant
+  ) => void,
+  activeSpeakersChanged: (speakers: Array<Participant>) => void,
+  roomMetadataChanged: (metadata: string) => void,
+  dataReceived: (
+    payload: Uint8Array,
+    participant?: RemoteParticipant,
+    kind?: DataPacket_Kind
+  ) => void,
+  connectionQualityChanged: (quality: ConnectionQuality, participant: Participant) => void,
+  mediaDevicesError: (error: Error) => void,
+  trackStreamStateChanged: (
+    publication: RemoteTrackPublication,
+    streamState: Track.StreamState,
+    participant: RemoteParticipant,
+  ) => void,
+  trackSubscriptionPermissionChanged: (
+    publication: RemoteTrackPublication,
+    status: TrackPublication.SubscriptionStatus,
+    participant: RemoteParticipant,
+  ) => void,
+  audioPlaybackChanged: (playing: boolean) => void,
+};

package/src/room/events.ts

@@ -7,6 +7,7 @@
  * room.on(RoomEvent.TrackPublished, (track, publication, participant) => {})
  * ```
  */
+
 export enum RoomEvent {
   /**
    * When the connection to the server has been interrupted and it's attempting
@@ -25,6 +26,13 @@ export enum RoomEvent {
    */
   Disconnected = 'disconnected',
 
+  /**
+   * Whenever the connection state of the room changes
+   *
+   * args: ([[RoomState]])
+   */
+  StateChanged = 'stateChanged',
+
   /**
    * When input or output devices on the machine have changed.
    */
@@ -146,7 +154,7 @@ export enum RoomEvent {
    * args: (prevMetadata: string, [[Participant]])
    *
    */
-  ParticipantMetadataChanged = 'participantMetaDataChanged',
+  ParticipantMetadataChanged = 'participantMetadataChanged',
 
   /**
    * Room metadata is a simple way for app-specific state to be pushed to
@@ -366,6 +374,7 @@ export enum ParticipantEvent {
 
 /** @internal */
 export enum EngineEvent {
+  TransportsCreated = 'transportsCreated',
   Connected = 'connected',
   Disconnected = 'disconnected',
   Resuming = 'resuming',

package/src/room/participant/Participant.ts

@@ -1,8 +1,12 @@
 import { EventEmitter } from 'events';
-import { ConnectionQuality as ProtoQuality, ParticipantInfo } from '../../proto/livekit_models';
+import type TypedEmitter from 'typed-emitter';
+import { ConnectionQuality as ProtoQuality, DataPacket_Kind, ParticipantInfo } from '../../proto/livekit_models';
 import { ParticipantEvent, TrackEvent } from '../events';
+import LocalTrackPublication from '../track/LocalTrackPublication';
+import RemoteTrackPublication from '../track/RemoteTrackPublication';
 import { Track } from '../track/Track';
 import { TrackPublication } from '../track/TrackPublication';
+import { RemoteTrack } from '../track/types';
 
 export enum ConnectionQuality {
   Excellent = 'excellent',
@@ -24,7 +28,9 @@ function qualityFromProto(q: ProtoQuality): ConnectionQuality {
   }
 }
 
-export default class Participant extends EventEmitter {
+export default class Participant extends (
+  EventEmitter as new () => TypedEmitter<ParticipantEventCallbacks>
+) {
   protected participantInfo?: ParticipantInfo;
 
   audioTracks: Map<string, TrackPublication>;
@@ -158,8 +164,8 @@ export default class Participant extends EventEmitter {
     this.metadata = md;
 
     if (changed) {
-      this.emit(ParticipantEvent.MetadataChanged, prevMetadata, this);
-      this.emit(ParticipantEvent.ParticipantMetadataChanged, prevMetadata, this);
+      this.emit(ParticipantEvent.MetadataChanged, prevMetadata);
+      this.emit(ParticipantEvent.ParticipantMetadataChanged, prevMetadata);
     }
   }
 
@@ -212,3 +218,32 @@ export default class Participant extends EventEmitter {
     }
   }
 }
+
+export type ParticipantEventCallbacks = {
+  trackPublished: (publication: RemoteTrackPublication) => void,
+  trackSubscribed: (track: RemoteTrack, publication: RemoteTrackPublication) => void,
+  trackSubscriptionFailed: (trackSid: string) => void,
+  trackUnpublished: (publication: RemoteTrackPublication) => void,
+  trackUnsubscribed: (track: RemoteTrack, publication: RemoteTrackPublication) => void,
+  trackMuted: (publication: TrackPublication) => void,
+  trackUnmuted: (publication: TrackPublication) => void,
+  localTrackPublished: (publication: LocalTrackPublication) => void,
+  localTrackUnpublished: (publication: LocalTrackPublication) => void,
+  /**
+   * @deprecated use [[participantMetadataChanged]] instead
+   */
+  metadataChanged: (prevMetadata: string | undefined, participant?: any) => void,
+  participantMetadataChanged: (prevMetadata: string | undefined, participant?: any) => void,
+  dataReceived: (payload: Uint8Array, kind: DataPacket_Kind) => void,
+  isSpeakingChanged: (speaking: boolean) => void,
+  connectionQualityChanged: (connectionQuality: ConnectionQuality) => void,
+  trackStreamStateChanged: (
+    publication: RemoteTrackPublication,
+    streamState: Track.StreamState
+  ) => void,
+  trackSubscriptionPermissionChanged: (
+    publication: RemoteTrackPublication,
+    status: TrackPublication.SubscriptionStatus
+  ) => void,
+  mediaDevicesError: (error: Error) => void,
+};

package/src/room/participant/RemoteParticipant.ts

@@ -10,9 +10,8 @@ import RemoteAudioTrack from '../track/RemoteAudioTrack';
 import RemoteTrackPublication from '../track/RemoteTrackPublication';
 import RemoteVideoTrack from '../track/RemoteVideoTrack';
 import { Track } from '../track/Track';
-import { TrackPublication } from '../track/TrackPublication';
 import { RemoteTrack } from '../track/types';
-import Participant from './Participant';
+import Participant, { ParticipantEventCallbacks } from './Participant';
 
 export default class RemoteParticipant extends Participant {
   audioTracks: Map<string, RemoteTrackPublication>;
@@ -42,7 +41,7 @@ export default class RemoteParticipant extends Participant {
     this.videoTracks = new Map();
   }
 
-  protected addTrackPublication(publication: TrackPublication) {
+  protected addTrackPublication(publication: RemoteTrackPublication) {
     super.addTrackPublication(publication);
 
     // register action events
@@ -234,7 +233,10 @@ export default class RemoteParticipant extends Participant {
   }
 
   /** @internal */
-  emit(event: string | symbol, ...args: any[]): boolean {
+  emit<E extends keyof ParticipantEventCallbacks>(
+    event: E,
+    ...args: Parameters<ParticipantEventCallbacks[E]>
+  ): boolean {
     log.trace('participant event', this.sid, event, ...args);
     return super.emit(event, ...args);
   }

package/src/room/track/RemoteVideoTrack.ts

@@ -195,11 +195,9 @@ export default class RemoteVideoTrack extends RemoteTrack {
     let maxWidth = 0;
     let maxHeight = 0;
     for (const info of this.elementInfos) {
-      const currentElementWidth = info.element.clientWidth * (window.devicePixelRatio ?? 1);
-      const currentElementHeight = info.element.clientHeight * (window.devicePixelRatio ?? 1);
-      if (currentElementWidth + currentElementHeight > maxWidth + maxHeight) {
-        maxWidth = currentElementWidth;
-        maxHeight = currentElementHeight;
+      if (info.element.clientWidth + info.element.clientHeight > maxWidth + maxHeight) {
+        maxWidth = info.element.clientWidth;
+        maxHeight = info.element.clientHeight;
       }
     }
 

package/src/room/track/Track.ts

@@ -1,4 +1,5 @@
 import { EventEmitter } from 'events';
+import type TypedEventEmitter from 'typed-emitter';
 import { TrackSource, TrackType } from '../../proto/livekit_models';
 import { StreamState as ProtoStreamState } from '../../proto/livekit_rtc';
 import { TrackEvent } from '../events';
@@ -8,7 +9,7 @@ import { isFireFox, isSafari } from '../utils';
 // Safari tracks which audio elements have been "blessed" by the user.
 const recycledElements: Array<HTMLAudioElement> = [];
 
-export class Track extends EventEmitter {
+export class Track extends (EventEmitter as new () => TypedEventEmitter<TrackEventCallbacks>) {
   kind: Track.Kind;
 
   mediaStreamTrack: MediaStreamTrack;
@@ -307,3 +308,16 @@ export namespace Track {
     }
   }
 }
+
+export type TrackEventCallbacks = {
+  message: () => void,
+  muted: (track?: any) => void,
+  unmuted: (track?: any) => void,
+  ended: (track?: any) => void,
+  updateSettings: () => void,
+  updateSubscription: () => void,
+  audioPlaybackStarted: () => void,
+  audioPlaybackFailed: (error: Error) => void,
+  visibilityChanged: (visible: boolean, track?: any) => void,
+  videoDimensionsChanged: (dimensions: Track.Dimensions, track?: any) => void,
+};

package/src/room/track/types.ts

@@ -1,7 +1,7 @@
-import LocalAudioTrack from './LocalAudioTrack';
-import LocalVideoTrack from './LocalVideoTrack';
-import RemoteAudioTrack from './RemoteAudioTrack';
-import RemoteVideoTrack from './RemoteVideoTrack';
+import type LocalAudioTrack from './LocalAudioTrack';
+import type LocalVideoTrack from './LocalVideoTrack';
+import type RemoteAudioTrack from './RemoteAudioTrack';
+import type RemoteVideoTrack from './RemoteVideoTrack';
 
 export type RemoteTrack = RemoteAudioTrack | RemoteVideoTrack;
 export type AudioTrack = RemoteAudioTrack | LocalAudioTrack;

package/src/version.ts

@@ -1,2 +1,2 @@
-export const version = '0.16.5';
+export const version = '0.16.6';
 export const protocolVersion = 6;