You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

middleware.js 6.3KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186
  1. // @flow
  2. import { CONFERENCE_LEFT, getCurrentConference } from '../base/conference';
  3. import {
  4. PARTICIPANT_LEFT,
  5. getLocalParticipant,
  6. participantJoined,
  7. participantLeft,
  8. pinParticipant
  9. } from '../base/participants';
  10. import { MiddlewareRegistry, StateListenerRegistry } from '../base/redux';
  11. import { TOGGLE_SHARED_VIDEO, SET_SHARED_VIDEO_STATUS } from './actionTypes';
  12. import { setSharedVideoStatus, showEnterVideoLinkPrompt } from './actions';
  13. import { YOUTUBE_PARTICIPANT_NAME } from './constants';
  14. const SHARED_VIDEO = 'shared-video';
  15. /**
  16. * Middleware that captures actions related to YouTube video sharing and updates
  17. * components not hooked into redux.
  18. *
  19. * @param {Store} store - The redux store.
  20. * @returns {Function}
  21. */
  22. MiddlewareRegistry.register(store => next => action => {
  23. const { dispatch, getState } = store;
  24. const state = getState();
  25. const conference = getCurrentConference(state);
  26. const localParticipantId = getLocalParticipant(state)?.id;
  27. const { videoId, status, ownerId, time } = action;
  28. const { ownerId: stateOwnerId, videoId: stateVideoId } = state['features/youtube-player'];
  29. switch (action.type) {
  30. case TOGGLE_SHARED_VIDEO:
  31. _toggleSharedVideo(store, next, action);
  32. break;
  33. case CONFERENCE_LEFT:
  34. dispatch(setSharedVideoStatus('', 'stop', 0, ''));
  35. break;
  36. case PARTICIPANT_LEFT:
  37. if (action.participant.id === stateOwnerId) {
  38. dispatch(setSharedVideoStatus('', 'stop', 0, ''));
  39. dispatch(participantLeft(stateVideoId, conference));
  40. }
  41. break;
  42. case SET_SHARED_VIDEO_STATUS:
  43. if (localParticipantId === ownerId) {
  44. sendShareVideoCommand(videoId, status, conference, localParticipantId, time);
  45. }
  46. break;
  47. }
  48. return next(action);
  49. });
  50. /**
  51. * Set up state change listener to perform maintenance tasks when the conference
  52. * is left or failed, e.g. clear messages or close the chat modal if it's left
  53. * open.
  54. */
  55. StateListenerRegistry.register(
  56. state => getCurrentConference(state),
  57. (conference, store, previousConference) => {
  58. if (conference && conference !== previousConference) {
  59. conference.addCommandListener(SHARED_VIDEO,
  60. ({ value, attributes }) => {
  61. const { dispatch, getState } = store;
  62. const { from } = attributes;
  63. const localParticipantId = getLocalParticipant(getState()).id;
  64. const status = attributes.state;
  65. if ([ 'playing', 'pause', 'start' ].includes(status)) {
  66. handleSharingVideoStatus(store, value, attributes, conference);
  67. } else if (status === 'stop') {
  68. dispatch(participantLeft(value, conference));
  69. if (localParticipantId !== from) {
  70. dispatch(setSharedVideoStatus(value, 'stop', 0, from));
  71. }
  72. }
  73. }
  74. );
  75. }
  76. });
  77. /**
  78. * Handles the playing, pause and start statuses for the shared video.
  79. * Dispatches participantJoined event and, if necessary, pins it.
  80. * Sets the SharedVideoStatus if the event was triggered by the local user.
  81. *
  82. * @param {Store} store - The redux store.
  83. * @param {string} videoId - The YoutubeId of the video to the shared.
  84. * @param {Object} attributes - The attributes received from the share video command.
  85. * @param {JitsiConference} conference - The current conference.
  86. * @returns {void}
  87. */
  88. function handleSharingVideoStatus(store, videoId, { state, time, from }, conference) {
  89. const { dispatch, getState } = store;
  90. const localParticipantId = getLocalParticipant(getState()).id;
  91. const oldStatus = getState()['features/youtube-player']?.status;
  92. if (state === 'start' || ![ 'playing', 'pause', 'start' ].includes(oldStatus)) {
  93. dispatch(participantJoined({
  94. conference,
  95. id: videoId,
  96. isFakeParticipant: true,
  97. avatarURL: `https://img.youtube.com/vi/${videoId}/0.jpg`,
  98. name: YOUTUBE_PARTICIPANT_NAME
  99. }));
  100. dispatch(pinParticipant(videoId));
  101. }
  102. if (localParticipantId !== from) {
  103. dispatch(setSharedVideoStatus(videoId, state, time, from));
  104. }
  105. }
  106. /**
  107. * Dispatches shared video status.
  108. *
  109. * @param {Store} store - The redux store.
  110. * @param {Dispatch} next - The redux {@code dispatch} function to dispatch the
  111. * specified {@code action} in the specified {@code store}.
  112. * @param {Action} action - The redux action which is
  113. * being dispatched in the specified {@code store}.
  114. * @returns {Function}
  115. */
  116. function _toggleSharedVideo(store, next, action) {
  117. const { dispatch, getState } = store;
  118. const state = getState();
  119. const { videoId, ownerId, status } = state['features/youtube-player'];
  120. const localParticipant = getLocalParticipant(state);
  121. if (status === 'playing' || status === 'start' || status === 'pause') {
  122. if (ownerId === localParticipant.id) {
  123. dispatch(setSharedVideoStatus(videoId, 'stop', 0, localParticipant.id));
  124. }
  125. } else {
  126. dispatch(showEnterVideoLinkPrompt(id => _onVideoLinkEntered(store, id)));
  127. }
  128. return next(action);
  129. }
  130. /**
  131. * Sends SHARED_VIDEO start command.
  132. *
  133. * @param {Store} store - The redux store.
  134. * @param {string} id - The youtube id of the video to be shared.
  135. * @returns {void}
  136. */
  137. function _onVideoLinkEntered(store, id) {
  138. const { dispatch, getState } = store;
  139. const conference = getCurrentConference(getState());
  140. if (conference) {
  141. const localParticipant = getLocalParticipant(getState());
  142. dispatch(setSharedVideoStatus(id, 'start', 0, localParticipant.id));
  143. }
  144. }
  145. /* eslint-disable max-params */
  146. /**
  147. * Sends SHARED_VIDEO command.
  148. *
  149. * @param {string} id - The youtube id of the video.
  150. * @param {string} status - The status of the shared video.
  151. * @param {JitsiConference} conference - The current conference.
  152. * @param {string} localParticipantId - The id of the local participant.
  153. * @param {string} time - The seek position of the video.
  154. * @returns {void}
  155. */
  156. function sendShareVideoCommand(id, status, conference, localParticipantId, time) {
  157. conference.sendCommandOnce(SHARED_VIDEO, {
  158. value: id,
  159. attributes: {
  160. from: localParticipantId,
  161. state: status,
  162. time
  163. }
  164. });
  165. }