@videosdk.live/react-sdk 0.1.12 → 0.1.16

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.js CHANGED
@@ -5,7 +5,7 @@ var React__default = _interopDefault(React);
5
5
  var EventEmitter = _interopDefault(require('events'));
6
6
  var jsSdk = require('@videosdk.live/js-sdk');
7
7
 
8
- var eventPrifix = 'zn-meeting-react-sdk';
8
+ var eventPrifix = 'videosdk-live-react-sdk';
9
9
  var events = {
10
10
  'participant-joined': eventPrifix + "-participant-joined",
11
11
  'participant-left': eventPrifix + "-participant-left",
@@ -25,7 +25,11 @@ var events = {
25
25
  'video-seeked': eventPrifix + "-video-seeked",
26
26
  'webcam-requested': eventPrifix + "-webcam-requested",
27
27
  'mic-requested': eventPrifix + "-mic-requested",
28
- 'pin-state-changed': eventPrifix + "-pin-state-changed"
28
+ 'pin-state-changed': eventPrifix + "-pin-state-changed",
29
+ 'connection-open': eventPrifix + "-connection-open",
30
+ 'connection-close': eventPrifix + "-connection-close",
31
+ 'switch-meeting': eventPrifix + "-switch-meeting",
32
+ error: eventPrifix + "-error"
29
33
  };
30
34
  var eventEmitter = new EventEmitter();
31
35
  eventEmitter.setMaxListeners(9999);
@@ -70,7 +74,15 @@ var useMeeting = function useMeeting(_temp) {
70
74
  _ref$onMicRequested = _ref.onMicRequested,
71
75
  onMicRequested = _ref$onMicRequested === void 0 ? function () {} : _ref$onMicRequested,
72
76
  _ref$onPinStateChange = _ref.onPinStateChanged,
73
- onPinStateChanged = _ref$onPinStateChange === void 0 ? function () {} : _ref$onPinStateChange;
77
+ onPinStateChanged = _ref$onPinStateChange === void 0 ? function () {} : _ref$onPinStateChange,
78
+ _ref$onConnectionOpen = _ref.onConnectionOpen,
79
+ onConnectionOpen = _ref$onConnectionOpen === void 0 ? function () {} : _ref$onConnectionOpen,
80
+ _ref$onConnetionClose = _ref.onConnetionClose,
81
+ onConnetionClose = _ref$onConnetionClose === void 0 ? function () {} : _ref$onConnetionClose,
82
+ _ref$onSwitchMeeting = _ref.onSwitchMeeting,
83
+ onSwitchMeeting = _ref$onSwitchMeeting === void 0 ? function () {} : _ref$onSwitchMeeting,
84
+ _ref$onError = _ref.onError,
85
+ onError = _ref$onError === void 0 ? function () {} : _ref$onError;
74
86
 
75
87
  React.useEffect(function () {
76
88
  eventEmitter.on(events['participant-joined'], onParticipantJoined);
@@ -92,6 +104,10 @@ var useMeeting = function useMeeting(_temp) {
92
104
  eventEmitter.on(events['webcam-requested'], onWebcamRequested);
93
105
  eventEmitter.on(events['mic-requested'], onMicRequested);
94
106
  eventEmitter.on(events['pin-state-changed'], onPinStateChanged);
107
+ eventEmitter.on(events['connection-open'], onConnectionOpen);
108
+ eventEmitter.on(events['connection-close'], onConnetionClose);
109
+ eventEmitter.on(events['switch-meeting'], onSwitchMeeting);
110
+ eventEmitter.on(events['error'], onError);
95
111
  return function () {
96
112
  eventEmitter.off(events['participant-joined'], onParticipantJoined);
97
113
  eventEmitter.off(events['participant-left'], onParticipantLeft);
@@ -112,6 +128,10 @@ var useMeeting = function useMeeting(_temp) {
112
128
  eventEmitter.off(events['webcam-requested'], onWebcamRequested);
113
129
  eventEmitter.off(events['mic-requested'], onMicRequested);
114
130
  eventEmitter.off(events['pin-state-changed'], onPinStateChanged);
131
+ eventEmitter.off(events['connection-open'], onConnectionOpen);
132
+ eventEmitter.off(events['connection-close'], onConnetionClose);
133
+ eventEmitter.off(events['switch-meeting'], onSwitchMeeting);
134
+ eventEmitter.off(events['error'], onError);
115
135
  };
116
136
  }, []);
117
137
  return React.useContext(MeetingProviderContex);
@@ -155,7 +175,15 @@ var MeetingConsumer = function MeetingConsumer(_ref2) {
155
175
  _ref2$onMicRequested = _ref2.onMicRequested,
156
176
  onMicRequested = _ref2$onMicRequested === void 0 ? function () {} : _ref2$onMicRequested,
157
177
  _ref2$onPinStateChang = _ref2.onPinStateChanged,
158
- onPinStateChanged = _ref2$onPinStateChang === void 0 ? function () {} : _ref2$onPinStateChang;
178
+ onPinStateChanged = _ref2$onPinStateChang === void 0 ? function () {} : _ref2$onPinStateChang,
179
+ _ref2$onConnectionOpe = _ref2.onConnectionOpen,
180
+ onConnectionOpen = _ref2$onConnectionOpe === void 0 ? function () {} : _ref2$onConnectionOpe,
181
+ _ref2$onConnetionClos = _ref2.onConnetionClose,
182
+ onConnetionClose = _ref2$onConnetionClos === void 0 ? function () {} : _ref2$onConnetionClos,
183
+ _ref2$onSwitchMeeting = _ref2.onSwitchMeeting,
184
+ onSwitchMeeting = _ref2$onSwitchMeeting === void 0 ? function () {} : _ref2$onSwitchMeeting,
185
+ _ref2$onError = _ref2.onError,
186
+ onError = _ref2$onError === void 0 ? function () {} : _ref2$onError;
159
187
  React.useEffect(function () {
160
188
  eventEmitter.on(events['participant-joined'], onParticipantJoined);
161
189
  eventEmitter.on(events['participant-left'], onParticipantLeft);
@@ -176,6 +204,10 @@ var MeetingConsumer = function MeetingConsumer(_ref2) {
176
204
  eventEmitter.on(events['webcam-requested'], onWebcamRequested);
177
205
  eventEmitter.on(events['mic-requested'], onMicRequested);
178
206
  eventEmitter.on(events['pin-state-changed'], onPinStateChanged);
207
+ eventEmitter.on(events['connection-open'], onConnectionOpen);
208
+ eventEmitter.on(events['connection-close'], onConnetionClose);
209
+ eventEmitter.on(events['switch-meeting'], onSwitchMeeting);
210
+ eventEmitter.on(events['error'], onError);
179
211
  return function () {
180
212
  eventEmitter.off(events['participant-joined'], onParticipantJoined);
181
213
  eventEmitter.off(events['participant-left'], onParticipantLeft);
@@ -196,6 +228,10 @@ var MeetingConsumer = function MeetingConsumer(_ref2) {
196
228
  eventEmitter.off(events['webcam-requested'], onWebcamRequested);
197
229
  eventEmitter.off(events['mic-requested'], onMicRequested);
198
230
  eventEmitter.off(events['pin-state-changed'], onPinStateChanged);
231
+ eventEmitter.off(events['connection-open'], onConnectionOpen);
232
+ eventEmitter.off(events['connection-close'], onConnetionClose);
233
+ eventEmitter.off(events['switch-meeting'], onSwitchMeeting);
234
+ eventEmitter.off(events['error'], onError);
199
235
  };
200
236
  }, []);
201
237
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(MeetingProviderContex.Consumer, null, children));
@@ -205,7 +241,8 @@ var MeetingProvider = function MeetingProvider(_ref) {
205
241
  var children = _ref.children,
206
242
  config = _ref.config,
207
243
  token = _ref.token,
208
- joinWithoutUserInteraction = _ref.joinWithoutUserInteraction;
244
+ joinWithoutUserInteraction = _ref.joinWithoutUserInteraction,
245
+ _reinitialiseMeetingOnConfigChange = _ref.reinitialiseMeetingOnConfigChange;
209
246
 
210
247
  var _useState = React.useState(null),
211
248
  meeting = _useState[0],
@@ -259,11 +296,21 @@ var MeetingProvider = function MeetingProvider(_ref) {
259
296
  isLiveStreaming = _useState13[0],
260
297
  setIsLiveStreaming = _useState13[1];
261
298
 
299
+ var _useState14 = React.useState(new Map()),
300
+ connections = _useState14[0],
301
+ setConnections = _useState14[1];
302
+
262
303
  var meetingRef = React.useRef();
263
304
  var localMicOnRef = React.useRef();
264
305
  var localWebcamOnRef = React.useRef();
265
306
  var localScreenShareOnRef = React.useRef();
266
307
  var isRecordingRef = React.useRef();
308
+ var configRef = React.useRef(config);
309
+ var tokenRef = React.useRef(token);
310
+ var joinedOnFirstRender = React.useRef(false);
311
+ var reinitialiseMeetingOnConfigChange = React.useMemo(function () {
312
+ return _reinitialiseMeetingOnConfigChange;
313
+ }, []);
267
314
  React.useEffect(function () {
268
315
  meetingRef.current = meeting;
269
316
  }, [meeting]);
@@ -279,6 +326,12 @@ var MeetingProvider = function MeetingProvider(_ref) {
279
326
  React.useEffect(function () {
280
327
  isRecordingRef.current = isRecording;
281
328
  }, [isRecording]);
329
+ React.useEffect(function () {
330
+ configRef.current = config;
331
+ }, [config]);
332
+ React.useEffect(function () {
333
+ tokenRef.current = token;
334
+ }, [token]);
282
335
 
283
336
  var resetStates = function resetStates() {
284
337
  setMeeting(null);
@@ -294,6 +347,7 @@ var MeetingProvider = function MeetingProvider(_ref) {
294
347
  setIsLiveStreaming(false);
295
348
  setParticipants(new Map());
296
349
  setPinnedParticipants(new Map());
350
+ setConnections(new Map());
297
351
  };
298
352
 
299
353
  var _handle_participant_joined = function _handle_participant_joined(participant) {
@@ -404,6 +458,7 @@ var MeetingProvider = function MeetingProvider(_ref) {
404
458
  };
405
459
 
406
460
  var _handle_meeting_joined = function _handle_meeting_joined(data) {
461
+ joinedOnFirstRender.current = true;
407
462
  setMessages(function (s) {
408
463
  return [].concat(s, data.messages);
409
464
  });
@@ -436,6 +491,11 @@ var MeetingProvider = function MeetingProvider(_ref) {
436
491
  meeting.off('video-seeked', _handle_video_seeked);
437
492
  meeting.off('webcam-requested', _handle_webcam_requested);
438
493
  meeting.off('mic-requested', _handle_mic_requested);
494
+ meeting.off('pin-state-changed', _handle_pin_state_changed);
495
+ meeting.off('connection-open', _handle_connection_open);
496
+ meeting.off('connection-close', _handle_connection_close);
497
+ meeting.off('switch-meeting', _handle_switch_meeting);
498
+ meeting.off('error', _handle_error);
439
499
  }
440
500
 
441
501
  if (typeof (meeting === null || meeting === void 0 ? void 0 : (_meeting$localPartici = meeting.localParticipant) === null || _meeting$localPartici === void 0 ? void 0 : _meeting$localPartici.off) === 'function') {
@@ -468,8 +528,34 @@ var MeetingProvider = function MeetingProvider(_ref) {
468
528
  });
469
529
  };
470
530
 
531
+ var _handle_connection_open = function _handle_connection_open(connection) {
532
+ setConnections(function (s) {
533
+ s.set(connection.id, connection);
534
+ var connectionsToSet = new Map(s);
535
+ return connectionsToSet;
536
+ });
537
+ eventEmitter.emit(events['connection-open'], connection);
538
+ };
539
+
540
+ var _handle_connection_close = function _handle_connection_close(connectionId) {
541
+ setConnections(function (s) {
542
+ s["delete"](connectionId);
543
+ var newConnections = new Map(s);
544
+ return newConnections;
545
+ });
546
+ eventEmitter.emit(events['connection-close'], connectionId);
547
+ };
548
+
549
+ var _handle_error = function _handle_error(data) {
550
+ eventEmitter.emit(events['error'], data);
551
+ };
552
+
553
+ var _handle_switch_meeting = function _handle_switch_meeting(d) {
554
+ eventEmitter.emit(events['switch-meeting'], d);
555
+ };
556
+
471
557
  var join = function join() {
472
- var meeting = jsSdk.ZujoSDK && jsSdk.ZujoSDK.initMeeting(config);
558
+ var meeting = jsSdk.VideoSDK && jsSdk.VideoSDK.initMeeting(configRef.current);
473
559
  setMeeting(meeting);
474
560
  var localParticipant = meeting.localParticipant,
475
561
  participants = meeting.participants;
@@ -495,6 +581,10 @@ var MeetingProvider = function MeetingProvider(_ref) {
495
581
  meeting.on('webcam-requested', _handle_webcam_requested);
496
582
  meeting.on('mic-requested', _handle_mic_requested);
497
583
  meeting.on('pin-state-changed', _handle_pin_state_changed);
584
+ meeting.on('connection-open', _handle_connection_open);
585
+ meeting.on('connection-close', _handle_connection_close);
586
+ meeting.on('switch-meeting', _handle_switch_meeting);
587
+ meeting.on('error', _handle_error);
498
588
  meeting.localParticipant.on('stream-enabled', _handle_localParticipant_stream_enabled);
499
589
  meeting.localParticipant.on('stream-disabled', _handle_localParticipant_stream_disabled);
500
590
  meeting.join();
@@ -516,11 +606,11 @@ var MeetingProvider = function MeetingProvider(_ref) {
516
606
  }
517
607
  };
518
608
 
519
- var startRecording = function startRecording(webhookUrl, awsDirPath) {
609
+ var startRecording = function startRecording(webhookUrl, awsDirPath, config) {
520
610
  var meeting = meetingRef.current;
521
611
 
522
612
  if (meeting) {
523
- meeting.startRecording(webhookUrl, awsDirPath);
613
+ meeting.startRecording(webhookUrl, awsDirPath, config);
524
614
  }
525
615
  };
526
616
 
@@ -737,8 +827,30 @@ var MeetingProvider = function MeetingProvider(_ref) {
737
827
  }
738
828
  };
739
829
 
830
+ var connectTo = function connectTo(_ref6) {
831
+ var meetingId = _ref6.meetingId,
832
+ payload = _ref6.payload;
833
+
834
+ try {
835
+ var _meeting3 = meetingRef.current;
836
+
837
+ var _temp2 = function () {
838
+ if (_meeting3) {
839
+ return Promise.resolve(_meeting3.connectTo({
840
+ meetingId: meetingId,
841
+ payload: payload
842
+ })).then(function () {});
843
+ }
844
+ }();
845
+
846
+ return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {}) : void 0);
847
+ } catch (e) {
848
+ return Promise.reject(e);
849
+ }
850
+ };
851
+
740
852
  var initSDK = function initSDK() {
741
- jsSdk.ZujoSDK.config(token);
853
+ jsSdk.VideoSDK.config(tokenRef.current);
742
854
 
743
855
  if (joinWithoutUserInteraction) {
744
856
  join();
@@ -748,9 +860,16 @@ var MeetingProvider = function MeetingProvider(_ref) {
748
860
  React.useEffect(function () {
749
861
  initSDK();
750
862
  }, []);
863
+ React.useEffect(function () {
864
+ if (reinitialiseMeetingOnConfigChange && joinedOnFirstRender.current) {
865
+ leave();
866
+ initSDK();
867
+ !joinWithoutUserInteraction && join();
868
+ }
869
+ }, [config.meetingId, token, reinitialiseMeetingOnConfigChange]);
751
870
  return /*#__PURE__*/React__default.createElement(MeetingProviderContex.Provider, {
752
871
  value: {
753
- meetingId: config.meetingId,
872
+ meetingId: meeting === null || meeting === void 0 ? void 0 : meeting.id,
754
873
  meeting: meeting,
755
874
  localParticipant: localParticipant,
756
875
  mainParticipant: mainParticipant,
@@ -764,6 +883,7 @@ var MeetingProvider = function MeetingProvider(_ref) {
764
883
  isRecording: isRecording,
765
884
  isLiveStreaming: isLiveStreaming,
766
885
  pinnedParticipants: pinnedParticipants,
886
+ connections: connections,
767
887
  join: join,
768
888
  leave: leave,
769
889
  end: end,
@@ -790,7 +910,8 @@ var MeetingProvider = function MeetingProvider(_ref) {
790
910
  pauseVideo: pauseVideo,
791
911
  seekVideo: seekVideo,
792
912
  startLivestream: startLivestream,
793
- stopLivestream: stopLivestream
913
+ stopLivestream: stopLivestream,
914
+ connectTo: connectTo
794
915
  }
795
916
  }, children);
796
917
  };
@@ -917,6 +1038,10 @@ var useParticipant = function useParticipant(participantId, _temp) {
917
1038
  participant === null || participant === void 0 ? void 0 : participant.unpin(data);
918
1039
  };
919
1040
 
1041
+ var switchTo = function switchTo(data) {
1042
+ return Promise.resolve(participant === null || participant === void 0 ? void 0 : participant.switchTo(data)).then(function () {});
1043
+ };
1044
+
920
1045
  React.useEffect(function () {
921
1046
  var streams = participant === null || participant === void 0 ? void 0 : participant.streams;
922
1047
 
@@ -952,12 +1077,99 @@ var useParticipant = function useParticipant(participantId, _temp) {
952
1077
  enableWebcam: enableWebcam,
953
1078
  disableWebcam: disableWebcam,
954
1079
  pin: pin,
955
- unpin: unpin
1080
+ unpin: unpin,
1081
+ switchTo: switchTo
1082
+ };
1083
+ };
1084
+
1085
+ var useConnection = function useConnection(connectionId, _temp) {
1086
+ var _ref = _temp === void 0 ? {
1087
+ onMeeting: {
1088
+ onParticipantJoined: function onParticipantJoined() {},
1089
+ onParticipantLeft: function onParticipantLeft() {},
1090
+ onChatMessage: function onChatMessage() {}
1091
+ }
1092
+ } : _temp,
1093
+ onMeeting = _ref.onMeeting;
1094
+
1095
+ var onParticipantJoined = onMeeting === null || onMeeting === void 0 ? void 0 : onMeeting.onParticipantJoined;
1096
+ var onParticipantLeft = onMeeting === null || onMeeting === void 0 ? void 0 : onMeeting.onParticipantLeft;
1097
+ var onChatMessage = onMeeting === null || onMeeting === void 0 ? void 0 : onMeeting.onChatMessage;
1098
+ var meeting = useMeeting();
1099
+
1100
+ var _useMemo = React.useMemo(function () {
1101
+ var connection = meeting === null || meeting === void 0 ? void 0 : meeting.connections.get(connectionId);
1102
+
1103
+ if (!connection) {
1104
+ throw new Error('connectionId not found');
1105
+ }
1106
+
1107
+ var connectionParticipants = new Map(connection.meeting.participants);
1108
+ return {
1109
+ connection: connection,
1110
+ connectionParticipants: connectionParticipants
1111
+ };
1112
+ }, [meeting]),
1113
+ connection = _useMemo.connection,
1114
+ connectionParticipants = _useMemo.connectionParticipants;
1115
+
1116
+ var _useState = React.useState(new Map(connectionParticipants)),
1117
+ _connectionParticipants = _useState[0],
1118
+ setConnectionParticipants = _useState[1];
1119
+
1120
+ var _handleParticipantJoined = function _handleParticipantJoined(participant) {
1121
+ setConnectionParticipants(function (s) {
1122
+ s.set(participant.id, participant);
1123
+ var participantsToSet = new Map(s);
1124
+ return participantsToSet;
1125
+ });
1126
+ onParticipantJoined(participant);
1127
+ };
1128
+
1129
+ var _handleParticipantLeft = function _handleParticipantLeft(participantId) {
1130
+ setConnectionParticipants(function (s) {
1131
+ s["delete"](participantId);
1132
+ var newParticipants = new Map(s);
1133
+ return newParticipants;
1134
+ });
1135
+ onParticipantLeft(participantId);
1136
+ };
1137
+
1138
+ var _handleChatMessage = function _handleChatMessage(data) {
1139
+ onChatMessage(data);
1140
+ };
1141
+
1142
+ React.useEffect(function () {
1143
+ connection === null || connection === void 0 ? void 0 : connection.meeting.on('participant-joined', _handleParticipantJoined);
1144
+ connection === null || connection === void 0 ? void 0 : connection.meeting.on('participant-left', _handleParticipantLeft);
1145
+ connection === null || connection === void 0 ? void 0 : connection.meeting.on('chat-message', _handleChatMessage);
1146
+ return function () {
1147
+ connection === null || connection === void 0 ? void 0 : connection.meeting.off('participant-joined', _handleParticipantJoined);
1148
+ connection === null || connection === void 0 ? void 0 : connection.meeting.off('participant-left', _handleParticipantLeft);
1149
+ connection === null || connection === void 0 ? void 0 : connection.meeting.off('chat-message', _handleChatMessage);
1150
+ };
1151
+ }, [connection]);
1152
+ return {
1153
+ connection: {
1154
+ id: connection.id,
1155
+ close: connection.close,
1156
+ payload: connection.payload,
1157
+ meeting: {
1158
+ id: connection.meeting.id,
1159
+ sendChatMessage: connection.meeting.sendChatMessage,
1160
+ end: connection.meeting.end,
1161
+ participants: _connectionParticipants
1162
+ }
1163
+ }
956
1164
  };
957
1165
  };
958
1166
 
1167
+ var Constants = jsSdk.VideoSDK.Constants;
1168
+
1169
+ exports.Constants = Constants;
959
1170
  exports.MeetingConsumer = MeetingConsumer;
960
1171
  exports.MeetingProvider = MeetingProvider;
1172
+ exports.useConnection = useConnection;
961
1173
  exports.useMeeting = useMeeting;
962
1174
  exports.useParticipant = useParticipant;
963
1175
  //# sourceMappingURL=index.js.map