@videosdk.live/react-sdk 0.1.9 → 0.1.13

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.
@@ -1,8 +1,8 @@
1
1
  import React, { createContext, useEffect, useContext, useState, useRef, useMemo } from 'react';
2
2
  import EventEmitter from 'events';
3
- import { ZujoSDK } from '@videosdk.live/js-sdk';
3
+ import { VideoSDK } from '@videosdk.live/js-sdk';
4
4
 
5
- var eventPrifix = 'zn-meeting-react-sdk';
5
+ var eventPrifix = 'videosdk-live-react-sdk';
6
6
  var events = {
7
7
  'participant-joined': eventPrifix + "-participant-joined",
8
8
  'participant-left': eventPrifix + "-participant-left",
@@ -22,7 +22,10 @@ var events = {
22
22
  'video-seeked': eventPrifix + "-video-seeked",
23
23
  'webcam-requested': eventPrifix + "-webcam-requested",
24
24
  'mic-requested': eventPrifix + "-mic-requested",
25
- 'pin-state-changed': eventPrifix + "-pin-state-changed"
25
+ 'pin-state-changed': eventPrifix + "-pin-state-changed",
26
+ 'connection-open': eventPrifix + "-connection-open",
27
+ 'connection-close': eventPrifix + "-connection-close",
28
+ 'switch-meeting': eventPrifix + "-switch-meeting"
26
29
  };
27
30
  var eventEmitter = new EventEmitter();
28
31
  eventEmitter.setMaxListeners(9999);
@@ -67,7 +70,13 @@ var useMeeting = function useMeeting(_temp) {
67
70
  _ref$onMicRequested = _ref.onMicRequested,
68
71
  onMicRequested = _ref$onMicRequested === void 0 ? function () {} : _ref$onMicRequested,
69
72
  _ref$onPinStateChange = _ref.onPinStateChanged,
70
- onPinStateChanged = _ref$onPinStateChange === void 0 ? function () {} : _ref$onPinStateChange;
73
+ onPinStateChanged = _ref$onPinStateChange === void 0 ? function () {} : _ref$onPinStateChange,
74
+ _ref$onConnectionOpen = _ref.onConnectionOpen,
75
+ onConnectionOpen = _ref$onConnectionOpen === void 0 ? function () {} : _ref$onConnectionOpen,
76
+ _ref$onConnetionClose = _ref.onConnetionClose,
77
+ onConnetionClose = _ref$onConnetionClose === void 0 ? function () {} : _ref$onConnetionClose,
78
+ _ref$onSwitchMeeting = _ref.onSwitchMeeting,
79
+ onSwitchMeeting = _ref$onSwitchMeeting === void 0 ? function () {} : _ref$onSwitchMeeting;
71
80
 
72
81
  useEffect(function () {
73
82
  eventEmitter.on(events['participant-joined'], onParticipantJoined);
@@ -89,6 +98,9 @@ var useMeeting = function useMeeting(_temp) {
89
98
  eventEmitter.on(events['webcam-requested'], onWebcamRequested);
90
99
  eventEmitter.on(events['mic-requested'], onMicRequested);
91
100
  eventEmitter.on(events['pin-state-changed'], onPinStateChanged);
101
+ eventEmitter.on(events['connection-open'], onConnectionOpen);
102
+ eventEmitter.on(events['connection-close'], onConnetionClose);
103
+ eventEmitter.on(events['switch-meeting'], onSwitchMeeting);
92
104
  return function () {
93
105
  eventEmitter.off(events['participant-joined'], onParticipantJoined);
94
106
  eventEmitter.off(events['participant-left'], onParticipantLeft);
@@ -109,6 +121,9 @@ var useMeeting = function useMeeting(_temp) {
109
121
  eventEmitter.off(events['webcam-requested'], onWebcamRequested);
110
122
  eventEmitter.off(events['mic-requested'], onMicRequested);
111
123
  eventEmitter.off(events['pin-state-changed'], onPinStateChanged);
124
+ eventEmitter.off(events['connection-open'], onConnectionOpen);
125
+ eventEmitter.off(events['connection-close'], onConnetionClose);
126
+ eventEmitter.off(events['switch-meeting'], onSwitchMeeting);
112
127
  };
113
128
  }, []);
114
129
  return useContext(MeetingProviderContex);
@@ -152,7 +167,13 @@ var MeetingConsumer = function MeetingConsumer(_ref2) {
152
167
  _ref2$onMicRequested = _ref2.onMicRequested,
153
168
  onMicRequested = _ref2$onMicRequested === void 0 ? function () {} : _ref2$onMicRequested,
154
169
  _ref2$onPinStateChang = _ref2.onPinStateChanged,
155
- onPinStateChanged = _ref2$onPinStateChang === void 0 ? function () {} : _ref2$onPinStateChang;
170
+ onPinStateChanged = _ref2$onPinStateChang === void 0 ? function () {} : _ref2$onPinStateChang,
171
+ _ref2$onConnectionOpe = _ref2.onConnectionOpen,
172
+ onConnectionOpen = _ref2$onConnectionOpe === void 0 ? function () {} : _ref2$onConnectionOpe,
173
+ _ref2$onConnetionClos = _ref2.onConnetionClose,
174
+ onConnetionClose = _ref2$onConnetionClos === void 0 ? function () {} : _ref2$onConnetionClos,
175
+ _ref2$onSwitchMeeting = _ref2.onSwitchMeeting,
176
+ onSwitchMeeting = _ref2$onSwitchMeeting === void 0 ? function () {} : _ref2$onSwitchMeeting;
156
177
  useEffect(function () {
157
178
  eventEmitter.on(events['participant-joined'], onParticipantJoined);
158
179
  eventEmitter.on(events['participant-left'], onParticipantLeft);
@@ -173,6 +194,9 @@ var MeetingConsumer = function MeetingConsumer(_ref2) {
173
194
  eventEmitter.on(events['webcam-requested'], onWebcamRequested);
174
195
  eventEmitter.on(events['mic-requested'], onMicRequested);
175
196
  eventEmitter.on(events['pin-state-changed'], onPinStateChanged);
197
+ eventEmitter.on(events['connection-open'], onConnectionOpen);
198
+ eventEmitter.on(events['connection-close'], onConnetionClose);
199
+ eventEmitter.on(events['switch-meeting'], onSwitchMeeting);
176
200
  return function () {
177
201
  eventEmitter.off(events['participant-joined'], onParticipantJoined);
178
202
  eventEmitter.off(events['participant-left'], onParticipantLeft);
@@ -193,6 +217,9 @@ var MeetingConsumer = function MeetingConsumer(_ref2) {
193
217
  eventEmitter.off(events['webcam-requested'], onWebcamRequested);
194
218
  eventEmitter.off(events['mic-requested'], onMicRequested);
195
219
  eventEmitter.off(events['pin-state-changed'], onPinStateChanged);
220
+ eventEmitter.off(events['connection-open'], onConnectionOpen);
221
+ eventEmitter.off(events['connection-close'], onConnetionClose);
222
+ eventEmitter.off(events['switch-meeting'], onSwitchMeeting);
196
223
  };
197
224
  }, []);
198
225
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(MeetingProviderContex.Consumer, null, children));
@@ -202,7 +229,8 @@ var MeetingProvider = function MeetingProvider(_ref) {
202
229
  var children = _ref.children,
203
230
  config = _ref.config,
204
231
  token = _ref.token,
205
- joinWithoutUserInteraction = _ref.joinWithoutUserInteraction;
232
+ joinWithoutUserInteraction = _ref.joinWithoutUserInteraction,
233
+ _reinitialiseMeetingOnConfigChange = _ref.reinitialiseMeetingOnConfigChange;
206
234
 
207
235
  var _useState = useState(null),
208
236
  meeting = _useState[0],
@@ -256,11 +284,21 @@ var MeetingProvider = function MeetingProvider(_ref) {
256
284
  isLiveStreaming = _useState13[0],
257
285
  setIsLiveStreaming = _useState13[1];
258
286
 
287
+ var _useState14 = useState(new Map()),
288
+ connections = _useState14[0],
289
+ setConnections = _useState14[1];
290
+
259
291
  var meetingRef = useRef();
260
292
  var localMicOnRef = useRef();
261
293
  var localWebcamOnRef = useRef();
262
294
  var localScreenShareOnRef = useRef();
263
295
  var isRecordingRef = useRef();
296
+ var configRef = useRef(config);
297
+ var tokenRef = useRef(token);
298
+ var joinedOnFirstRender = useRef(false);
299
+ var reinitialiseMeetingOnConfigChange = useMemo(function () {
300
+ return _reinitialiseMeetingOnConfigChange;
301
+ }, []);
264
302
  useEffect(function () {
265
303
  meetingRef.current = meeting;
266
304
  }, [meeting]);
@@ -276,6 +314,12 @@ var MeetingProvider = function MeetingProvider(_ref) {
276
314
  useEffect(function () {
277
315
  isRecordingRef.current = isRecording;
278
316
  }, [isRecording]);
317
+ useEffect(function () {
318
+ configRef.current = config;
319
+ }, [config]);
320
+ useEffect(function () {
321
+ tokenRef.current = token;
322
+ }, [token]);
279
323
 
280
324
  var resetStates = function resetStates() {
281
325
  setMeeting(null);
@@ -291,6 +335,7 @@ var MeetingProvider = function MeetingProvider(_ref) {
291
335
  setIsLiveStreaming(false);
292
336
  setParticipants(new Map());
293
337
  setPinnedParticipants(new Map());
338
+ setConnections(new Map());
294
339
  };
295
340
 
296
341
  var _handle_participant_joined = function _handle_participant_joined(participant) {
@@ -401,6 +446,10 @@ var MeetingProvider = function MeetingProvider(_ref) {
401
446
  };
402
447
 
403
448
  var _handle_meeting_joined = function _handle_meeting_joined(data) {
449
+ joinedOnFirstRender.current = true;
450
+ setMessages(function (s) {
451
+ return [].concat(s, data.messages);
452
+ });
404
453
  eventEmitter.emit(events['meeting-joined'], data);
405
454
  };
406
455
 
@@ -430,6 +479,10 @@ var MeetingProvider = function MeetingProvider(_ref) {
430
479
  meeting.off('video-seeked', _handle_video_seeked);
431
480
  meeting.off('webcam-requested', _handle_webcam_requested);
432
481
  meeting.off('mic-requested', _handle_mic_requested);
482
+ meeting.off('pin-state-changed', _handle_pin_state_changed);
483
+ meeting.off('connection-open', _handle_connection_open);
484
+ meeting.off('connection-close', _handle_connection_close);
485
+ meeting.off('switch-meeting', _handle_switch_meeting);
433
486
  }
434
487
 
435
488
  if (typeof (meeting === null || meeting === void 0 ? void 0 : (_meeting$localPartici = meeting.localParticipant) === null || _meeting$localPartici === void 0 ? void 0 : _meeting$localPartici.off) === 'function') {
@@ -462,8 +515,30 @@ var MeetingProvider = function MeetingProvider(_ref) {
462
515
  });
463
516
  };
464
517
 
518
+ var _handle_connection_open = function _handle_connection_open(connection) {
519
+ setConnections(function (s) {
520
+ s.set(connection.id, connection);
521
+ var connectionsToSet = new Map(s);
522
+ return connectionsToSet;
523
+ });
524
+ eventEmitter.emit(events['connection-open'], connection);
525
+ };
526
+
527
+ var _handle_connection_close = function _handle_connection_close(connectionId) {
528
+ setConnections(function (s) {
529
+ s["delete"](connectionId);
530
+ var newConnections = new Map(s);
531
+ return newConnections;
532
+ });
533
+ eventEmitter.emit(events['connection-close'], connectionId);
534
+ };
535
+
536
+ var _handle_switch_meeting = function _handle_switch_meeting(d) {
537
+ eventEmitter.emit(events['switch-meeting'], d);
538
+ };
539
+
465
540
  var join = function join() {
466
- var meeting = ZujoSDK && ZujoSDK.initMeeting(config);
541
+ var meeting = VideoSDK && VideoSDK.initMeeting(configRef.current);
467
542
  setMeeting(meeting);
468
543
  var localParticipant = meeting.localParticipant,
469
544
  participants = meeting.participants;
@@ -489,6 +564,9 @@ var MeetingProvider = function MeetingProvider(_ref) {
489
564
  meeting.on('webcam-requested', _handle_webcam_requested);
490
565
  meeting.on('mic-requested', _handle_mic_requested);
491
566
  meeting.on('pin-state-changed', _handle_pin_state_changed);
567
+ meeting.on('connection-open', _handle_connection_open);
568
+ meeting.on('connection-close', _handle_connection_close);
569
+ meeting.on('switch-meeting', _handle_switch_meeting);
492
570
  meeting.localParticipant.on('stream-enabled', _handle_localParticipant_stream_enabled);
493
571
  meeting.localParticipant.on('stream-disabled', _handle_localParticipant_stream_disabled);
494
572
  meeting.join();
@@ -510,11 +588,11 @@ var MeetingProvider = function MeetingProvider(_ref) {
510
588
  }
511
589
  };
512
590
 
513
- var startRecording = function startRecording(webhookUrl) {
591
+ var startRecording = function startRecording(webhookUrl, awsDirPath) {
514
592
  var meeting = meetingRef.current;
515
593
 
516
594
  if (meeting) {
517
- meeting.startRecording(webhookUrl);
595
+ meeting.startRecording(webhookUrl, awsDirPath);
518
596
  }
519
597
  };
520
598
 
@@ -731,8 +809,30 @@ var MeetingProvider = function MeetingProvider(_ref) {
731
809
  }
732
810
  };
733
811
 
812
+ var connectTo = function connectTo(_ref6) {
813
+ var meetingId = _ref6.meetingId,
814
+ payload = _ref6.payload;
815
+
816
+ try {
817
+ var _meeting3 = meetingRef.current;
818
+
819
+ var _temp2 = function () {
820
+ if (_meeting3) {
821
+ return Promise.resolve(_meeting3.connectTo({
822
+ meetingId: meetingId,
823
+ payload: payload
824
+ })).then(function () {});
825
+ }
826
+ }();
827
+
828
+ return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {}) : void 0);
829
+ } catch (e) {
830
+ return Promise.reject(e);
831
+ }
832
+ };
833
+
734
834
  var initSDK = function initSDK() {
735
- ZujoSDK.config(token);
835
+ VideoSDK.config(tokenRef.current);
736
836
 
737
837
  if (joinWithoutUserInteraction) {
738
838
  join();
@@ -742,9 +842,16 @@ var MeetingProvider = function MeetingProvider(_ref) {
742
842
  useEffect(function () {
743
843
  initSDK();
744
844
  }, []);
845
+ useEffect(function () {
846
+ if (reinitialiseMeetingOnConfigChange && joinedOnFirstRender.current) {
847
+ leave();
848
+ initSDK();
849
+ !joinWithoutUserInteraction && join();
850
+ }
851
+ }, [config.meetingId, token, reinitialiseMeetingOnConfigChange]);
745
852
  return /*#__PURE__*/React.createElement(MeetingProviderContex.Provider, {
746
853
  value: {
747
- meetingId: config.meetingId,
854
+ meetingId: meeting === null || meeting === void 0 ? void 0 : meeting.id,
748
855
  meeting: meeting,
749
856
  localParticipant: localParticipant,
750
857
  mainParticipant: mainParticipant,
@@ -758,6 +865,7 @@ var MeetingProvider = function MeetingProvider(_ref) {
758
865
  isRecording: isRecording,
759
866
  isLiveStreaming: isLiveStreaming,
760
867
  pinnedParticipants: pinnedParticipants,
868
+ connections: connections,
761
869
  join: join,
762
870
  leave: leave,
763
871
  end: end,
@@ -784,7 +892,8 @@ var MeetingProvider = function MeetingProvider(_ref) {
784
892
  pauseVideo: pauseVideo,
785
893
  seekVideo: seekVideo,
786
894
  startLivestream: startLivestream,
787
- stopLivestream: stopLivestream
895
+ stopLivestream: stopLivestream,
896
+ connectTo: connectTo
788
897
  }
789
898
  }, children);
790
899
  };
@@ -911,6 +1020,10 @@ var useParticipant = function useParticipant(participantId, _temp) {
911
1020
  participant === null || participant === void 0 ? void 0 : participant.unpin(data);
912
1021
  };
913
1022
 
1023
+ var switchTo = function switchTo(data) {
1024
+ return Promise.resolve(participant === null || participant === void 0 ? void 0 : participant.switchTo(data)).then(function () {});
1025
+ };
1026
+
914
1027
  useEffect(function () {
915
1028
  var streams = participant === null || participant === void 0 ? void 0 : participant.streams;
916
1029
 
@@ -946,9 +1059,92 @@ var useParticipant = function useParticipant(participantId, _temp) {
946
1059
  enableWebcam: enableWebcam,
947
1060
  disableWebcam: disableWebcam,
948
1061
  pin: pin,
949
- unpin: unpin
1062
+ unpin: unpin,
1063
+ switchTo: switchTo
1064
+ };
1065
+ };
1066
+
1067
+ var useConnection = function useConnection(connectionId, _temp) {
1068
+ var _ref = _temp === void 0 ? {
1069
+ onMeeting: {
1070
+ onParticipantJoined: function onParticipantJoined() {},
1071
+ onParticipantLeft: function onParticipantLeft() {},
1072
+ onChatMessage: function onChatMessage() {}
1073
+ }
1074
+ } : _temp,
1075
+ onMeeting = _ref.onMeeting;
1076
+
1077
+ var onParticipantJoined = onMeeting === null || onMeeting === void 0 ? void 0 : onMeeting.onParticipantJoined;
1078
+ var onParticipantLeft = onMeeting === null || onMeeting === void 0 ? void 0 : onMeeting.onParticipantLeft;
1079
+ var onChatMessage = onMeeting === null || onMeeting === void 0 ? void 0 : onMeeting.onChatMessage;
1080
+ var meeting = useMeeting();
1081
+
1082
+ var _useMemo = useMemo(function () {
1083
+ var connection = meeting === null || meeting === void 0 ? void 0 : meeting.connections.get(connectionId);
1084
+
1085
+ if (!connection) {
1086
+ throw new Error('connectionId not found');
1087
+ }
1088
+
1089
+ var connectionParticipants = new Map(connection.meeting.participants);
1090
+ return {
1091
+ connection: connection,
1092
+ connectionParticipants: connectionParticipants
1093
+ };
1094
+ }, [meeting]),
1095
+ connection = _useMemo.connection,
1096
+ connectionParticipants = _useMemo.connectionParticipants;
1097
+
1098
+ var _useState = useState(new Map(connectionParticipants)),
1099
+ _connectionParticipants = _useState[0],
1100
+ setConnectionParticipants = _useState[1];
1101
+
1102
+ var _handleParticipantJoined = function _handleParticipantJoined(participant) {
1103
+ setConnectionParticipants(function (s) {
1104
+ s.set(participant.id, participant);
1105
+ var participantsToSet = new Map(s);
1106
+ return participantsToSet;
1107
+ });
1108
+ onParticipantJoined(participant);
1109
+ };
1110
+
1111
+ var _handleParticipantLeft = function _handleParticipantLeft(participantId) {
1112
+ setConnectionParticipants(function (s) {
1113
+ s["delete"](participantId);
1114
+ var newParticipants = new Map(s);
1115
+ return newParticipants;
1116
+ });
1117
+ onParticipantLeft(participantId);
1118
+ };
1119
+
1120
+ var _handleChatMessage = function _handleChatMessage(data) {
1121
+ onChatMessage(data);
1122
+ };
1123
+
1124
+ useEffect(function () {
1125
+ connection === null || connection === void 0 ? void 0 : connection.meeting.on('participant-joined', _handleParticipantJoined);
1126
+ connection === null || connection === void 0 ? void 0 : connection.meeting.on('participant-left', _handleParticipantLeft);
1127
+ connection === null || connection === void 0 ? void 0 : connection.meeting.on('chat-message', _handleChatMessage);
1128
+ return function () {
1129
+ connection === null || connection === void 0 ? void 0 : connection.meeting.off('participant-joined', _handleParticipantJoined);
1130
+ connection === null || connection === void 0 ? void 0 : connection.meeting.off('participant-left', _handleParticipantLeft);
1131
+ connection === null || connection === void 0 ? void 0 : connection.meeting.off('chat-message', _handleChatMessage);
1132
+ };
1133
+ }, [connection]);
1134
+ return {
1135
+ connection: {
1136
+ id: connection.id,
1137
+ close: connection.close,
1138
+ payload: connection.payload,
1139
+ meeting: {
1140
+ id: connection.meeting.id,
1141
+ sendChatMessage: connection.meeting.sendChatMessage,
1142
+ end: connection.meeting.end,
1143
+ participants: _connectionParticipants
1144
+ }
1145
+ }
950
1146
  };
951
1147
  };
952
1148
 
953
- export { MeetingConsumer, MeetingProvider, useMeeting, useParticipant };
1149
+ export { MeetingConsumer, MeetingProvider, useConnection, useMeeting, useParticipant };
954
1150
  //# sourceMappingURL=index.modern.js.map