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.web.js 2.4KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. // @flow
  2. import { getNearestReceiverVideoQualityLevel, setMaxReceiverVideoQuality } from '../base/conference';
  3. import { MiddlewareRegistry } from '../base/redux';
  4. import { CLIENT_RESIZED } from '../base/responsive-ui';
  5. import Filmstrip from '../../../modules/UI/videolayout/Filmstrip';
  6. import {
  7. getCurrentLayout,
  8. LAYOUTS,
  9. shouldDisplayTileView
  10. } from '../video-layout';
  11. import { setHorizontalViewDimensions, setTileViewDimensions } from './actions';
  12. import { SET_HORIZONTAL_VIEW_DIMENSIONS, SET_TILE_VIEW_DIMENSIONS } from './actionTypes';
  13. /**
  14. * The middleware of the feature Filmstrip.
  15. */
  16. MiddlewareRegistry.register(store => next => action => {
  17. const result = next(action);
  18. switch (action.type) {
  19. case CLIENT_RESIZED: {
  20. const state = store.getState();
  21. const layout = getCurrentLayout(state);
  22. switch (layout) {
  23. case LAYOUTS.TILE_VIEW: {
  24. const { gridDimensions } = state['features/filmstrip'].tileViewDimensions;
  25. const { clientHeight, clientWidth } = state['features/base/responsive-ui'];
  26. store.dispatch(setTileViewDimensions(gridDimensions, {
  27. clientHeight,
  28. clientWidth
  29. }));
  30. break;
  31. }
  32. case LAYOUTS.HORIZONTAL_FILMSTRIP_VIEW:
  33. store.dispatch(setHorizontalViewDimensions(state['features/base/responsive-ui'].clientHeight));
  34. break;
  35. }
  36. break;
  37. }
  38. case SET_TILE_VIEW_DIMENSIONS: {
  39. const state = store.getState();
  40. if (shouldDisplayTileView(state)) {
  41. const { width, height } = state['features/filmstrip'].tileViewDimensions.thumbnailSize;
  42. const qualityLevel = getNearestReceiverVideoQualityLevel(height);
  43. store.dispatch(setMaxReceiverVideoQuality(qualityLevel));
  44. // Once the thumbnails are reactified this should be moved there too.
  45. Filmstrip.resizeThumbnailsForTileView(width, height, true);
  46. }
  47. break;
  48. }
  49. case SET_HORIZONTAL_VIEW_DIMENSIONS: {
  50. const state = store.getState();
  51. if (getCurrentLayout(state) === LAYOUTS.HORIZONTAL_FILMSTRIP_VIEW) {
  52. const { horizontalViewDimensions = {} } = state['features/filmstrip'];
  53. // Once the thumbnails are reactified this should be moved there too.
  54. Filmstrip.resizeThumbnailsForHorizontalView(horizontalViewDimensions, true);
  55. }
  56. break;
  57. }
  58. }
  59. return result;
  60. });