We started on the way to responsive UI and its design with aspect ratio and keeping the filmstrip on the short side of the app's visible rectangle. Shortly, we're going to introduce reduced UI for Picture-in-Picture. And that's where we'll need another dimensions-based detector akin to the aspect ratio detector. While the AspectRatioDetector, the up-and-coming ReducedUIDetector, and their base DimensionsDetector are definitely separate abstractions and implementations not mixed for the purposes of easy extensibility and maintenance, the three of them are our building blocks on top of which we'll build our responsive UI.
23 lines
560 B
JavaScript
23 lines
560 B
JavaScript
import { ReducerRegistry, set } from '../redux';
|
|
|
|
import { SET_ASPECT_RATIO } from './actionTypes';
|
|
import { ASPECT_RATIO_NARROW } from './constants';
|
|
|
|
/**
|
|
* The initial redux state of the feature base/responsive-ui.
|
|
*/
|
|
const _INITIAL_STATE = {
|
|
aspectRatio: ASPECT_RATIO_NARROW
|
|
};
|
|
|
|
ReducerRegistry.register(
|
|
'features/base/responsive-ui',
|
|
(state = _INITIAL_STATE, action) => {
|
|
switch (action.type) {
|
|
case SET_ASPECT_RATIO:
|
|
return set(state, 'aspectRatio', action.aspectRatio);
|
|
}
|
|
|
|
return state;
|
|
});
|