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 2.8KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. // @flow
  2. import { MiddlewareRegistry } from '../base/redux';
  3. import {
  4. CLEAR_TOOLBOX_TIMEOUT,
  5. SET_TOOLBOX_TIMEOUT,
  6. SET_FULL_SCREEN
  7. } from './actionTypes';
  8. declare var APP: Object;
  9. /**
  10. * Middleware which intercepts Toolbox actions to handle changes to the
  11. * visibility timeout of the Toolbox.
  12. *
  13. * @param {Store} store - The redux store.
  14. * @returns {Function}
  15. */
  16. MiddlewareRegistry.register(store => next => action => {
  17. switch (action.type) {
  18. case CLEAR_TOOLBOX_TIMEOUT: {
  19. const { timeoutID } = store.getState()['features/toolbox'];
  20. clearTimeout(timeoutID);
  21. break;
  22. }
  23. case SET_FULL_SCREEN:
  24. return _setFullScreen(next, action);
  25. case SET_TOOLBOX_TIMEOUT: {
  26. const { timeoutID } = store.getState()['features/toolbox'];
  27. const { handler, timeoutMS } = action;
  28. clearTimeout(timeoutID);
  29. action.timeoutID = setTimeout(handler, timeoutMS);
  30. break;
  31. }
  32. }
  33. return next(action);
  34. });
  35. type DocumentElement = {
  36. +requestFullscreen?: Function,
  37. +mozRequestFullScreen?: Function,
  38. +webkitRequestFullscreen?: Function
  39. }
  40. /**
  41. * Makes an external request to enter or exit full screen mode.
  42. *
  43. * @param {Dispatch} next - The redux dispatch function to dispatch the
  44. * specified action to the specified store.
  45. * @param {Action} action - The redux action SET_FULL_SCREEN which is being
  46. * dispatched in the specified store.
  47. * @private
  48. * @returns {Object} The value returned by {@code next(action)}.
  49. */
  50. function _setFullScreen(next, action) {
  51. if (typeof APP === 'object') {
  52. const { fullScreen } = action;
  53. if (fullScreen) {
  54. const documentElement: DocumentElement
  55. = document.documentElement || {};
  56. if (typeof documentElement.requestFullscreen === 'function') {
  57. documentElement.requestFullscreen();
  58. } else if (
  59. typeof documentElement.mozRequestFullScreen === 'function') {
  60. documentElement.mozRequestFullScreen();
  61. } else if (
  62. typeof documentElement.webkitRequestFullscreen === 'function') {
  63. documentElement.webkitRequestFullscreen();
  64. }
  65. } else {
  66. /* eslint-disable no-lonely-if */
  67. // $FlowFixMe
  68. if (typeof document.exitFullscreen === 'function') {
  69. document.exitFullscreen();
  70. // $FlowFixMe
  71. } else if (typeof document.mozCancelFullScreen === 'function') {
  72. document.mozCancelFullScreen();
  73. // $FlowFixMe
  74. } else if (typeof document.webkitExitFullscreen === 'function') {
  75. document.webkitExitFullscreen();
  76. }
  77. /* eslint-enable no-loney-if */
  78. }
  79. }
  80. return next(action);
  81. }