84 lines
1.8 KiB
JavaScript
84 lines
1.8 KiB
JavaScript
|
// @flow
|
||
|
|
|
||
|
|
import { Dimensions } from 'react-native';
|
||
|
|
|
||
|
|
import { APP_WILL_MOUNT, APP_WILL_UNMOUNT } from '../../base/app';
|
||
|
|
import { MiddlewareRegistry } from '../../base/redux';
|
||
|
|
|
||
|
|
import { setAspectRatio, setReducedUI } from './actions';
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Dimensions change handler.
|
||
|
|
*/
|
||
|
|
let handler;
|
||
|
|
|
||
|
|
/**
|
||
|
|
* 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(store => next => action => {
|
||
|
|
const result = next(action);
|
||
|
|
|
||
|
|
switch (action.type) {
|
||
|
|
case APP_WILL_UNMOUNT: {
|
||
|
|
_appWillUnmount();
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
case APP_WILL_MOUNT:
|
||
|
|
_appWillMount(store);
|
||
|
|
break;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
return result;
|
||
|
|
});
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Notifies this feature that the action {@link APP_WILL_MOUNT} is being
|
||
|
|
* dispatched within a specific redux {@code store}.
|
||
|
|
*
|
||
|
|
* @param {Store} store - The redux store in which the specified {@code action}
|
||
|
|
* is being dispatched.
|
||
|
|
* @private
|
||
|
|
* @returns {void}
|
||
|
|
*/
|
||
|
|
function _appWillMount(store) {
|
||
|
|
handler = dim => {
|
||
|
|
_onDimensionsChange(dim, store);
|
||
|
|
};
|
||
|
|
|
||
|
|
Dimensions.addEventListener('change', handler);
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Notifies this feature that the action {@link APP_WILL_UNMOUNT} is being
|
||
|
|
* dispatched within a specific redux {@code store}.
|
||
|
|
*
|
||
|
|
* @private
|
||
|
|
* @returns {void}
|
||
|
|
*/
|
||
|
|
function _appWillUnmount() {
|
||
|
|
Dimensions.removeEventListener('change', handler);
|
||
|
|
|
||
|
|
handler = undefined;
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Handles window dimension changes.
|
||
|
|
*
|
||
|
|
* @param {Object} dimensions - The new dimensions.
|
||
|
|
* @param {Store} store - The redux store.
|
||
|
|
* @private
|
||
|
|
* @returns {void}
|
||
|
|
*/
|
||
|
|
function _onDimensionsChange(dimensions, store) {
|
||
|
|
const { width, height } = dimensions.window;
|
||
|
|
const { dispatch } = store;
|
||
|
|
|
||
|
|
dispatch(setAspectRatio(width, height));
|
||
|
|
dispatch(setReducedUI(width, height));
|
||
|
|
}
|