Du kannst nicht mehr als 25 Themen auswählen Themen müssen mit entweder einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.

reducer.js 7.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289
  1. // @flow
  2. import { PARTICIPANT_LEFT } from '../base/participants';
  3. import { ReducerRegistry } from '../base/redux';
  4. import {
  5. REMOVE_STAGE_PARTICIPANT,
  6. SET_STAGE_PARTICIPANTS,
  7. SET_FILMSTRIP_ENABLED,
  8. SET_FILMSTRIP_VISIBLE,
  9. SET_FILMSTRIP_WIDTH,
  10. SET_HORIZONTAL_VIEW_DIMENSIONS,
  11. SET_REMOTE_PARTICIPANTS,
  12. SET_STAGE_FILMSTRIP_DIMENSIONS,
  13. SET_TILE_VIEW_DIMENSIONS,
  14. SET_USER_FILMSTRIP_WIDTH,
  15. SET_USER_IS_RESIZING,
  16. SET_VERTICAL_VIEW_DIMENSIONS,
  17. SET_VISIBLE_REMOTE_PARTICIPANTS,
  18. SET_VOLUME,
  19. SET_MAX_STAGE_PARTICIPANTS,
  20. CLEAR_STAGE_PARTICIPANTS
  21. } from './actionTypes';
  22. const DEFAULT_STATE = {
  23. /**
  24. * The list of participants to be displayed on the stage filmstrip.
  25. */
  26. activeParticipants: [],
  27. /**
  28. * The indicator which determines whether the {@link Filmstrip} is enabled.
  29. *
  30. * @public
  31. * @type {boolean}
  32. */
  33. enabled: true,
  34. /**
  35. * The horizontal view dimensions.
  36. *
  37. * @public
  38. * @type {Object}
  39. */
  40. horizontalViewDimensions: {},
  41. /**
  42. * Whether or not the user is actively resizing the filmstrip.
  43. *
  44. * @public
  45. * @type {boolean}
  46. */
  47. isResizing: false,
  48. /**
  49. * The current max number of participants to be displayed on the stage filmstrip.
  50. *
  51. * @public
  52. * @type {Number}
  53. */
  54. maxStageParticipants: 1,
  55. /**
  56. * The custom audio volume levels per participant.
  57. *
  58. * @type {Object}
  59. */
  60. participantsVolume: {},
  61. /**
  62. * The ordered IDs of the remote participants displayed in the filmstrip.
  63. *
  64. * @public
  65. * @type {Array<string>}
  66. */
  67. remoteParticipants: [],
  68. /**
  69. * The stage filmstrip view dimensions.
  70. *
  71. * @public
  72. * @type {Object}
  73. */
  74. stageFilmstripDimensions: {},
  75. /**
  76. * The tile view dimensions.
  77. *
  78. * @public
  79. * @type {Object}
  80. */
  81. tileViewDimensions: {},
  82. /**
  83. * The vertical view dimensions.
  84. *
  85. * @public
  86. * @type {Object}
  87. */
  88. verticalViewDimensions: {},
  89. /**
  90. * The indicator which determines whether the {@link Filmstrip} is visible.
  91. *
  92. * @public
  93. * @type {boolean}
  94. */
  95. visible: true,
  96. /**
  97. * The end index in the remote participants array that is visible in the filmstrip.
  98. *
  99. * @public
  100. * @type {number}
  101. */
  102. visibleParticipantsEndIndex: 0,
  103. /**
  104. * The start index in the remote participants array that is visible in the filmstrip.
  105. *
  106. * @public
  107. * @type {number}
  108. */
  109. visibleParticipantsStartIndex: 0,
  110. /**
  111. * The visible remote participants in the filmstrip.
  112. *
  113. * @public
  114. * @type {Set<string>}
  115. */
  116. visibleRemoteParticipants: new Set(),
  117. /**
  118. * The width of the resizable filmstrip.
  119. *
  120. * @public
  121. * @type {Object}
  122. */
  123. width: {
  124. /**
  125. * Current width. Affected by: user filmstrip resize,
  126. * window resize, panels open/ close.
  127. */
  128. current: null,
  129. /**
  130. * Width set by user resize. Used as the preferred width.
  131. */
  132. userSet: null
  133. }
  134. };
  135. ReducerRegistry.register(
  136. 'features/filmstrip',
  137. (state = DEFAULT_STATE, action) => {
  138. switch (action.type) {
  139. case SET_FILMSTRIP_ENABLED:
  140. return {
  141. ...state,
  142. enabled: action.enabled
  143. };
  144. case SET_FILMSTRIP_VISIBLE:
  145. return {
  146. ...state,
  147. visible: action.visible
  148. };
  149. case SET_HORIZONTAL_VIEW_DIMENSIONS:
  150. return {
  151. ...state,
  152. horizontalViewDimensions: action.dimensions
  153. };
  154. case SET_REMOTE_PARTICIPANTS: {
  155. state.remoteParticipants = action.participants;
  156. const { visibleParticipantsStartIndex: startIndex, visibleParticipantsEndIndex: endIndex } = state;
  157. state.visibleRemoteParticipants = new Set(state.remoteParticipants.slice(startIndex, endIndex + 1));
  158. return { ...state };
  159. }
  160. case SET_TILE_VIEW_DIMENSIONS:
  161. return {
  162. ...state,
  163. tileViewDimensions: action.dimensions
  164. };
  165. case SET_VERTICAL_VIEW_DIMENSIONS:
  166. return {
  167. ...state,
  168. verticalViewDimensions: action.dimensions
  169. };
  170. case SET_VOLUME:
  171. return {
  172. ...state,
  173. participantsVolume: {
  174. ...state.participantsVolume,
  175. // NOTE: This would fit better in the features/base/participants. But currently we store
  176. // the participants as an array which will make it expensive to search for the volume for
  177. // every participant separately.
  178. [action.participantId]: action.volume
  179. }
  180. };
  181. case SET_VISIBLE_REMOTE_PARTICIPANTS: {
  182. const { endIndex, startIndex } = action;
  183. const { remoteParticipants } = state;
  184. const visibleRemoteParticipants = new Set(remoteParticipants.slice(startIndex, endIndex + 1));
  185. return {
  186. ...state,
  187. visibleParticipantsStartIndex: startIndex,
  188. visibleParticipantsEndIndex: endIndex,
  189. visibleRemoteParticipants
  190. };
  191. }
  192. case PARTICIPANT_LEFT: {
  193. const { id, local } = action.participant;
  194. if (local) {
  195. return state;
  196. }
  197. delete state.participantsVolume[id];
  198. return {
  199. ...state
  200. };
  201. }
  202. case SET_FILMSTRIP_WIDTH: {
  203. return {
  204. ...state,
  205. width: {
  206. ...state.width,
  207. current: action.width
  208. }
  209. };
  210. }
  211. case SET_USER_FILMSTRIP_WIDTH: {
  212. const { width } = action;
  213. return {
  214. ...state,
  215. width: {
  216. current: width,
  217. userSet: width
  218. }
  219. };
  220. }
  221. case SET_USER_IS_RESIZING: {
  222. return {
  223. ...state,
  224. isResizing: action.resizing
  225. };
  226. }
  227. case SET_STAGE_FILMSTRIP_DIMENSIONS: {
  228. return {
  229. ...state,
  230. stageFilmstripDimensions: action.dimensions
  231. };
  232. }
  233. case SET_STAGE_PARTICIPANTS: {
  234. return {
  235. ...state,
  236. activeParticipants: action.queue
  237. };
  238. }
  239. case REMOVE_STAGE_PARTICIPANT: {
  240. return {
  241. ...state,
  242. activeParticipants: state.activeParticipants.filter(p => p.participantId !== action.participantId)
  243. };
  244. }
  245. case SET_MAX_STAGE_PARTICIPANTS: {
  246. return {
  247. ...state,
  248. maxStageParticipants: action.maxParticipants
  249. };
  250. }
  251. case CLEAR_STAGE_PARTICIPANTS: {
  252. return {
  253. ...state,
  254. activeParticipants: []
  255. };
  256. }
  257. }
  258. return state;
  259. });