Use a dimensions detecting root component. The Dimensions module does not measure the app's view size, but the Window, which may not be the same, for example on iOS when PiP is used. Also refactor the aspect ratio wrap component since it can be taken directly from the store. Last, remove the use of DimensionsDetector on LargeVideo and TileView since they occupy the full-screen anyway. Fixes PiP mode on iOS.
32 lines
741 B
JavaScript
32 lines
741 B
JavaScript
// @flow
|
|
|
|
import { MiddlewareRegistry } from '../../base/redux';
|
|
|
|
import { CLIENT_RESIZED } from './actionTypes';
|
|
import { setAspectRatio, setReducedUI } from './actions';
|
|
|
|
|
|
/**
|
|
* Middleware that handles widnow dimension changes and updates the aspect ratio and
|
|
* reduced UI modes accordingly.
|
|
*
|
|
* @param {Store} store - The redux store.
|
|
* @returns {Function}
|
|
*/
|
|
MiddlewareRegistry.register(({ dispatch }) => next => action => {
|
|
const result = next(action);
|
|
|
|
switch (action.type) {
|
|
case CLIENT_RESIZED: {
|
|
const { clientWidth: width, clientHeight: height } = action;
|
|
|
|
dispatch(setAspectRatio(width, height));
|
|
dispatch(setReducedUI(width, height));
|
|
break;
|
|
}
|
|
|
|
}
|
|
|
|
return result;
|
|
});
|