@stream-io/video-client 0.4.5 → 0.4.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.es.js CHANGED
@@ -4,7 +4,7 @@ import { ServiceType, stackIntercept } from '@protobuf-ts/runtime-rpc';
4
4
  import axios, { AxiosHeaders } from 'axios';
5
5
  export { AxiosError } from 'axios';
6
6
  import { TwirpFetchTransport } from '@protobuf-ts/twirp-transport';
7
- import { ReplaySubject, combineLatest, BehaviorSubject, map as map$1, shareReplay, distinctUntilChanged, takeWhile, distinctUntilKeyChanged, filter, pairwise, merge, Observable, debounceTime, concatMap, from, of, tap, debounce, timer } from 'rxjs';
7
+ import { ReplaySubject, combineLatest, BehaviorSubject, map as map$1, shareReplay, distinctUntilChanged, takeWhile, distinctUntilKeyChanged, merge, from, Observable, debounceTime, concatMap, pairwise, of, filter, tap, debounce, timer } from 'rxjs';
8
8
  import * as SDP from 'sdp-transform';
9
9
  import { UAParser } from 'ua-parser-js';
10
10
  import WebSocket from 'isomorphic-ws';
@@ -9981,8 +9981,7 @@ const getDevices = (constraints, kind) => {
9981
9981
  /**
9982
9982
  * [Tells if the browser supports audio output change on 'audio' elements](https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/setSinkId).
9983
9983
  *
9984
- * @angular It's recommended to use the [`DeviceManagerService`](./DeviceManagerService.md) for a higher level API, use this low-level method only if the `DeviceManagerService` doesn't suit your requirements.
9985
- */
9984
+ * */
9986
9985
  const checkIfAudioOutputChangeSupported = () => {
9987
9986
  if (typeof document === 'undefined')
9988
9987
  return false;
@@ -10142,90 +10141,10 @@ const getScreenShareStream = async (options) => {
10142
10141
  throw e;
10143
10142
  }
10144
10143
  };
10145
- const watchForDisconnectedDevice = (kind, deviceId$) => {
10146
- let devices$;
10147
- switch (kind) {
10148
- case 'audioinput':
10149
- devices$ = getAudioDevices();
10150
- break;
10151
- case 'videoinput':
10152
- devices$ = getVideoDevices();
10153
- break;
10154
- case 'audiooutput':
10155
- devices$ = getAudioOutputDevices();
10156
- break;
10157
- }
10158
- return combineLatest([devices$, deviceId$]).pipe(filter(([devices, deviceId]) => !!deviceId && !devices.find((d) => d.deviceId === deviceId)), map$1(() => true));
10159
- };
10160
- /**
10161
- * Notifies the subscriber if a given 'audioinput' device is disconnected
10162
- *
10163
- * @angular It's recommended to use the [`DeviceManagerService`](./DeviceManagerService.md) for a higher level API, use this low-level method only if the `DeviceManagerService` doesn't suit your requirements.
10164
- * @param deviceId$ an Observable that specifies which device to watch for
10165
- * @returns
10166
- */
10167
- const watchForDisconnectedAudioDevice = (deviceId$) => {
10168
- return watchForDisconnectedDevice('audioinput', deviceId$);
10169
- };
10170
- /**
10171
- * Notifies the subscriber if a given 'videoinput' device is disconnected
10172
- *
10173
- * @angular It's recommended to use the [`DeviceManagerService`](./DeviceManagerService.md) for a higher level API, use this low-level method only if the `DeviceManagerService` doesn't suit your requirements.
10174
- * @param deviceId$ an Observable that specifies which device to watch for
10175
- * @returns
10176
- */
10177
- const watchForDisconnectedVideoDevice = (deviceId$) => {
10178
- return watchForDisconnectedDevice('videoinput', deviceId$);
10179
- };
10180
- /**
10181
- * Notifies the subscriber if a given 'audiooutput' device is disconnected
10182
- *
10183
- * @angular It's recommended to use the [`DeviceManagerService`](./DeviceManagerService.md) for a higher level API, use this low-level method only if the `DeviceManagerService` doesn't suit your requirements.
10184
- * @param deviceId$ an Observable that specifies which device to watch for
10185
- * @returns
10186
- */
10187
- const watchForDisconnectedAudioOutputDevice = (deviceId$) => {
10188
- return watchForDisconnectedDevice('audiooutput', deviceId$);
10189
- };
10190
- const watchForAddedDefaultDevice = (kind) => {
10191
- let devices$;
10192
- switch (kind) {
10193
- case 'audioinput':
10194
- devices$ = getAudioDevices();
10195
- break;
10196
- case 'videoinput':
10197
- devices$ = getVideoDevices();
10198
- break;
10199
- case 'audiooutput':
10200
- devices$ = getAudioOutputDevices();
10201
- break;
10202
- default:
10203
- throw new Error('Unknown MediaDeviceKind', kind);
10204
- }
10205
- return devices$.pipe(pairwise(), filter(([prev, current]) => {
10206
- const prevDefault = prev.find((device) => device.deviceId === 'default');
10207
- const currentDefault = current.find((device) => device.deviceId === 'default');
10208
- return !!(current.length > prev.length &&
10209
- prevDefault &&
10210
- currentDefault &&
10211
- prevDefault.groupId !== currentDefault.groupId);
10212
- }), map$1(() => true));
10213
- };
10214
- /**
10215
- * Notifies the subscriber about newly added default audio input device.
10216
- * @returns Observable<boolean>
10217
- */
10218
- const watchForAddedDefaultAudioDevice = () => watchForAddedDefaultDevice('audioinput');
10219
- /**
10220
- * Notifies the subscriber about newly added default audio output device.
10221
- * @returns Observable<boolean>
10222
- */
10223
- const watchForAddedDefaultAudioOutputDevice = () => watchForAddedDefaultDevice('audiooutput');
10224
- /**
10225
- * Notifies the subscriber about newly added default video input device.
10226
- * @returns Observable<boolean>
10227
- */
10228
- const watchForAddedDefaultVideoDevice = () => watchForAddedDefaultDevice('videoinput');
10144
+ const deviceIds$ = typeof navigator !== 'undefined' &&
10145
+ typeof navigator.mediaDevices !== 'undefined'
10146
+ ? memoizedObservable(() => merge(from(navigator.mediaDevices.enumerateDevices()), getDeviceChangeObserver()).pipe(shareReplay(1)))()
10147
+ : undefined;
10229
10148
  /**
10230
10149
  * Deactivates MediaStream (stops and removes tracks) to be later garbage collected
10231
10150
  *
@@ -10251,7 +10170,17 @@ class InputMediaDeviceManager {
10251
10170
  this.call = call;
10252
10171
  this.state = state;
10253
10172
  this.trackType = trackType;
10173
+ this.subscriptions = [];
10174
+ this.isTrackStoppedDueToTrackEnd = false;
10175
+ this.removeSubscriptions = () => {
10176
+ this.subscriptions.forEach((s) => s.unsubscribe());
10177
+ };
10254
10178
  this.logger = getLogger([`${TrackType[trackType].toLowerCase()} manager`]);
10179
+ if (deviceIds$ &&
10180
+ !isReactNative() &&
10181
+ (this.trackType === TrackType.AUDIO || this.trackType === TrackType.VIDEO)) {
10182
+ this.handleDisconnectedOrReplacedDevices();
10183
+ }
10255
10184
  }
10256
10185
  /**
10257
10186
  * Lists the available audio/video devices
@@ -10329,11 +10258,10 @@ class InputMediaDeviceManager {
10329
10258
  this.state.setDefaultConstraints(constraints);
10330
10259
  }
10331
10260
  /**
10332
- * Select device
10261
+ * Selects a device.
10333
10262
  *
10334
10263
  * Note: this method is not supported in React Native
10335
- *
10336
- * @param deviceId
10264
+ * @param deviceId the device id to select.
10337
10265
  */
10338
10266
  async select(deviceId) {
10339
10267
  if (isReactNative()) {
@@ -10411,9 +10339,6 @@ class InputMediaDeviceManager {
10411
10339
  this.unmuteTracks();
10412
10340
  }
10413
10341
  else {
10414
- if (this.state.mediaStream) {
10415
- this.stopTracks();
10416
- }
10417
10342
  const defaultConstraints = this.state.defaultConstraints;
10418
10343
  const constraints = {
10419
10344
  ...defaultConstraints,
@@ -10426,13 +10351,93 @@ class InputMediaDeviceManager {
10426
10351
  }
10427
10352
  if (this.state.mediaStream !== stream) {
10428
10353
  this.state.setMediaStream(stream);
10354
+ this.getTracks().forEach((track) => {
10355
+ track.addEventListener('ended', async () => {
10356
+ if (this.enablePromise) {
10357
+ await this.enablePromise;
10358
+ }
10359
+ if (this.disablePromise) {
10360
+ await this.disablePromise;
10361
+ }
10362
+ if (this.state.status === 'enabled') {
10363
+ this.isTrackStoppedDueToTrackEnd = true;
10364
+ setTimeout(() => {
10365
+ this.isTrackStoppedDueToTrackEnd = false;
10366
+ }, 2000);
10367
+ await this.disable();
10368
+ }
10369
+ });
10370
+ });
10371
+ }
10372
+ }
10373
+ get mediaDeviceKind() {
10374
+ if (this.trackType === TrackType.AUDIO) {
10375
+ return 'audioinput';
10429
10376
  }
10377
+ if (this.trackType === TrackType.VIDEO) {
10378
+ return 'videoinput';
10379
+ }
10380
+ return '';
10381
+ }
10382
+ handleDisconnectedOrReplacedDevices() {
10383
+ this.subscriptions.push(combineLatest([
10384
+ deviceIds$.pipe(pairwise()),
10385
+ this.state.selectedDevice$,
10386
+ ]).subscribe(async ([[prevDevices, currentDevices], deviceId]) => {
10387
+ if (!deviceId) {
10388
+ return;
10389
+ }
10390
+ if (this.enablePromise) {
10391
+ await this.enablePromise;
10392
+ }
10393
+ if (this.disablePromise) {
10394
+ await this.disablePromise;
10395
+ }
10396
+ let isDeviceDisconnected = false;
10397
+ let isDeviceReplaced = false;
10398
+ const currentDevice = this.findDeviceInList(currentDevices, deviceId);
10399
+ const prevDevice = this.findDeviceInList(prevDevices, deviceId);
10400
+ if (!currentDevice && prevDevice) {
10401
+ isDeviceDisconnected = true;
10402
+ }
10403
+ else if (currentDevice &&
10404
+ prevDevice &&
10405
+ currentDevice.deviceId === prevDevice.deviceId &&
10406
+ currentDevice.groupId !== prevDevice.groupId) {
10407
+ isDeviceReplaced = true;
10408
+ }
10409
+ if (isDeviceDisconnected) {
10410
+ await this.disable();
10411
+ this.select(undefined);
10412
+ }
10413
+ if (isDeviceReplaced) {
10414
+ if (this.isTrackStoppedDueToTrackEnd &&
10415
+ this.state.status === 'disabled') {
10416
+ await this.enable();
10417
+ this.isTrackStoppedDueToTrackEnd = false;
10418
+ }
10419
+ else {
10420
+ await this.applySettingsToStream();
10421
+ }
10422
+ }
10423
+ }));
10424
+ }
10425
+ findDeviceInList(devices, deviceId) {
10426
+ return devices.find((d) => d.deviceId === deviceId && d.kind === this.mediaDeviceKind);
10430
10427
  }
10431
10428
  }
10432
10429
 
10433
10430
  class InputMediaDeviceManagerState {
10434
- constructor(disableMode = 'stop-tracks') {
10431
+ /**
10432
+ * Constructs new InputMediaDeviceManagerState instance.
10433
+ *
10434
+ * @param disableMode the disable mode to use.
10435
+ * @param permissionName the permission name to use for querying.
10436
+ * `undefined` means no permission is required.
10437
+ */
10438
+ constructor(disableMode = 'stop-tracks', permissionName = undefined) {
10435
10439
  this.disableMode = disableMode;
10440
+ this.permissionName = permissionName;
10436
10441
  this.statusSubject = new BehaviorSubject(undefined);
10437
10442
  this.mediaStreamSubject = new BehaviorSubject(undefined);
10438
10443
  this.selectedDeviceSubject = new BehaviorSubject(undefined);
@@ -10456,6 +10461,33 @@ class InputMediaDeviceManagerState {
10456
10461
  * The default constraints for the device.
10457
10462
  */
10458
10463
  this.defaultConstraints$ = this.defaultConstraintsSubject.asObservable();
10464
+ /**
10465
+ * An observable that will emit `true` if browser/system permission
10466
+ * is granted, `false` otherwise.
10467
+ */
10468
+ this.hasBrowserPermission$ = new Observable((subscriber) => {
10469
+ const notifyGranted = () => subscriber.next(true);
10470
+ if (isReactNative() || !this.permissionName)
10471
+ return notifyGranted();
10472
+ let permissionState;
10473
+ const notify = () => subscriber.next(permissionState.state === 'granted');
10474
+ navigator.permissions
10475
+ .query({ name: this.permissionName })
10476
+ .then((permissionStatus) => {
10477
+ permissionState = permissionStatus;
10478
+ permissionState.addEventListener('change', notify);
10479
+ notify();
10480
+ })
10481
+ .catch(() => {
10482
+ // permission doesn't exist or can't be queried -> assume it's granted
10483
+ // an example would be Firefox,
10484
+ // where neither camera microphone permission can be queried
10485
+ notifyGranted();
10486
+ });
10487
+ return () => {
10488
+ permissionState?.removeEventListener('change', notify);
10489
+ };
10490
+ }).pipe(shareReplay(1));
10459
10491
  /**
10460
10492
  * Gets the current value of an observable, or undefined if the observable has
10461
10493
  * not emitted a value yet.
@@ -10537,7 +10569,10 @@ class InputMediaDeviceManagerState {
10537
10569
 
10538
10570
  class CameraManagerState extends InputMediaDeviceManagerState {
10539
10571
  constructor() {
10540
- super('stop-tracks');
10572
+ super('stop-tracks',
10573
+ // `camera` is not in the W3C standard yet,
10574
+ // but it's supported by Chrome and Safari.
10575
+ 'camera');
10541
10576
  this.directionSubject = new BehaviorSubject(undefined);
10542
10577
  this.direction$ = this.directionSubject
10543
10578
  .asObservable()
@@ -10667,7 +10702,10 @@ class CameraManager extends InputMediaDeviceManager {
10667
10702
 
10668
10703
  class MicrophoneManagerState extends InputMediaDeviceManagerState {
10669
10704
  constructor() {
10670
- super('disable-tracks');
10705
+ super('disable-tracks',
10706
+ // `microphone` is not in the W3C standard yet,
10707
+ // but it's supported by Chrome and Safari.
10708
+ 'microphone');
10671
10709
  this.speakingWhileMutedSubject = new BehaviorSubject(false);
10672
10710
  this.speakingWhileMuted$ = this.speakingWhileMutedSubject
10673
10711
  .asObservable()
@@ -10994,6 +11032,21 @@ class SpeakerState {
10994
11032
  class SpeakerManager {
10995
11033
  constructor() {
10996
11034
  this.state = new SpeakerState();
11035
+ this.subscriptions = [];
11036
+ this.removeSubscriptions = () => {
11037
+ this.subscriptions.forEach((s) => s.unsubscribe());
11038
+ };
11039
+ if (deviceIds$ && !isReactNative()) {
11040
+ this.subscriptions.push(combineLatest([deviceIds$, this.state.selectedDevice$]).subscribe(([devices, deviceId]) => {
11041
+ if (!deviceId) {
11042
+ return;
11043
+ }
11044
+ const device = devices.find((d) => d.deviceId === deviceId && d.kind === 'audiooutput');
11045
+ if (!device) {
11046
+ this.select('');
11047
+ }
11048
+ }));
11049
+ }
10997
11050
  }
10998
11051
  /**
10999
11052
  * Lists the available audio output devices
@@ -11111,6 +11164,10 @@ class Call {
11111
11164
  this.leaveCallHooks.forEach((hook) => hook());
11112
11165
  this.clientStore.unregisterCall(this);
11113
11166
  this.state.setCallingState(CallingState.LEFT);
11167
+ this.camera.removeSubscriptions();
11168
+ this.microphone.removeSubscriptions();
11169
+ this.screenShare.removeSubscriptions();
11170
+ this.speaker.removeSubscriptions();
11114
11171
  };
11115
11172
  /**
11116
11173
  * Loads the information about the call.
@@ -11484,7 +11541,7 @@ class Call {
11484
11541
  await this.initMic({ setStatus: true });
11485
11542
  }
11486
11543
  catch (error) {
11487
- this.logger('warn', 'Camera and/or mic init failed during join call');
11544
+ this.logger('warn', 'Camera and/or mic init failed during join call', error);
11488
11545
  }
11489
11546
  // 3. once we have the "joinResponse", and possibly reconciled the local state
11490
11547
  // we schedule a fast subscription update for all remote participants
@@ -13957,7 +14014,7 @@ class StreamClient {
13957
14014
  });
13958
14015
  };
13959
14016
  this.getUserAgent = () => {
13960
- const version = "0.4.5" ;
14017
+ const version = "0.4.7" ;
13961
14018
  return (this.userAgent ||
13962
14019
  `stream-video-javascript-client-${this.node ? 'node' : 'browser'}-${version}`);
13963
14020
  };
@@ -14492,5 +14549,5 @@ class StreamVideoServerClient extends StreamVideoClient {
14492
14549
  }
14493
14550
  }
14494
14551
 
14495
- export { AudioSettingsDefaultDeviceEnum, AudioSettingsRequestDefaultDeviceEnum, browsers as Browsers, Call, CallState, CallType, CallTypes, CallingState, CameraManager, CameraManagerState, CreateDeviceRequestPushProviderEnum, DebounceType, DynascaleManager, ErrorFromResponse, InputMediaDeviceManager, InputMediaDeviceManagerState, LayoutSettingsNameEnum, LayoutSettingsRequestNameEnum, MicrophoneManager, MicrophoneManagerState, OwnCapability, RecordSettingsRequestModeEnum, RecordSettingsRequestQualityEnum, rxUtils as RxUtils, ScreenShareManager, ScreenShareState, events as SfuEvents, models as SfuModels, SpeakerManager, SpeakerState, StreamSfuClient, StreamVideoClient, StreamVideoReadOnlyStateStore, StreamVideoServerClient, StreamVideoWriteableStateStore, TranscriptionSettingsModeEnum, TranscriptionSettingsRequestModeEnum, VideoSettingsCameraFacingEnum, VideoSettingsRequestCameraFacingEnum, ViewportTracker, VisibilityState, checkIfAudioOutputChangeSupported, combineComparators, conditional, createSoundDetector, defaultSortPreset, descending, disposeOfMediaStream, dominantSpeaker, getAudioDevices, getAudioOutputDevices, getAudioStream, getClientDetails, getDeviceInfo, getLogger, getOSInfo, getScreenShareStream, getSdkInfo, getVideoDevices, getVideoStream, livestreamOrAudioRoomSortPreset, logLevels, logToConsole, name, noopComparator, paginatedLayoutSortPreset, pinned, publishingAudio, publishingVideo, reactionType, role, screenSharing, setDeviceInfo, setLogLevel, setLogger, setOSInfo, setSdkInfo, speakerLayoutSortPreset, speaking, watchForAddedDefaultAudioDevice, watchForAddedDefaultAudioOutputDevice, watchForAddedDefaultVideoDevice, watchForDisconnectedAudioDevice, watchForDisconnectedAudioOutputDevice, watchForDisconnectedVideoDevice };
14552
+ export { AudioSettingsDefaultDeviceEnum, AudioSettingsRequestDefaultDeviceEnum, browsers as Browsers, Call, CallState, CallType, CallTypes, CallingState, CameraManager, CameraManagerState, CreateDeviceRequestPushProviderEnum, DebounceType, DynascaleManager, ErrorFromResponse, InputMediaDeviceManager, InputMediaDeviceManagerState, LayoutSettingsNameEnum, LayoutSettingsRequestNameEnum, MicrophoneManager, MicrophoneManagerState, OwnCapability, RecordSettingsRequestModeEnum, RecordSettingsRequestQualityEnum, rxUtils as RxUtils, ScreenShareManager, ScreenShareState, events as SfuEvents, models as SfuModels, SpeakerManager, SpeakerState, StreamSfuClient, StreamVideoClient, StreamVideoReadOnlyStateStore, StreamVideoServerClient, StreamVideoWriteableStateStore, TranscriptionSettingsModeEnum, TranscriptionSettingsRequestModeEnum, VideoSettingsCameraFacingEnum, VideoSettingsRequestCameraFacingEnum, ViewportTracker, VisibilityState, checkIfAudioOutputChangeSupported, combineComparators, conditional, createSoundDetector, defaultSortPreset, descending, deviceIds$, disposeOfMediaStream, dominantSpeaker, getAudioDevices, getAudioOutputDevices, getAudioStream, getClientDetails, getDeviceInfo, getLogger, getOSInfo, getScreenShareStream, getSdkInfo, getVideoDevices, getVideoStream, livestreamOrAudioRoomSortPreset, logLevels, logToConsole, name, noopComparator, paginatedLayoutSortPreset, pinned, publishingAudio, publishingVideo, reactionType, role, screenSharing, setDeviceInfo, setLogLevel, setLogger, setOSInfo, setSdkInfo, speakerLayoutSortPreset, speaking };
14496
14553
  //# sourceMappingURL=index.es.js.map