diff options
| author | Andrej Mihajlov <and@mullvad.net> | 2017-10-14 12:44:47 +0200 |
|---|---|---|
| committer | Andrej Mihajlov <and@mullvad.net> | 2017-10-19 14:16:38 +0200 |
| commit | e056d7da3cb325e88ebb9aeeb5c14d9feb8610db (patch) | |
| tree | 66c2126da27bbea4f06c30702f9804e6af4c6248 | |
| parent | 730f20e141d1dafb9f89151f7039ec363be0a712 (diff) | |
| download | mullvadvpn-e056d7da3cb325e88ebb9aeeb5c14d9feb8610db.tar.xz mullvadvpn-e056d7da3cb325e88ebb9aeeb5c14d9feb8610db.zip | |
Refactor transitions.js moving transitionRules up
| -rw-r--r-- | app/transitions.js | 100 |
1 files changed, 51 insertions, 49 deletions
diff --git a/app/transitions.js b/app/transitions.js index 5bdc76471c..bde6b62428 100644 --- a/app/transitions.js +++ b/app/transitions.js @@ -18,12 +18,48 @@ type TransitionMap = { }; /** + * Transition descriptors + */ +const transitions: TransitionMap = { + slide: { + forward: { + name: 'slide-up-transition', + duration: 450 + }, + backward: { + name: 'slide-down-transition', + duration: 450 + } + }, + push: { + forward: { + name: 'push-transition', + duration: 450 + }, + backward: { + name: 'pop-transition', + duration: 450 + } + } +}; + +/** + * Transition rules + * (null) is used to indicate any route. + */ +const transitionRules = [ + r('/settings', '/settings/account', transitions.push), + r(null, '/settings', transitions.slide), + r(null, '/select-location', transitions.slide) +]; + +/** * Calculate CSSTransitionGroup props. * * @param {string} [fromRoute] - source route * @param {string} toRoute - target route */ -export const getTransitionProps = (fromRoute: ?string, toRoute: string): CSSTransitionGroupProps => { +export function getTransitionProps(fromRoute: ?string, toRoute: string): CSSTransitionGroupProps { // ignore initial transition and transition between the same routes if(!fromRoute || fromRoute === toRoute) { return noTransitionProps(); @@ -37,13 +73,13 @@ export const getTransitionProps = (fromRoute: ?string, toRoute: string): CSSTran } return noTransitionProps(); -}; +} /** * Integrate TransitionDescriptor into CSSTransitionGroupProps * @param {TransitionDescriptor} descriptor */ -const toCSSTransitionGroupProps = (descriptor: TransitionDescriptor): CSSTransitionGroupProps => { +function toCSSTransitionGroupProps(descriptor: TransitionDescriptor): CSSTransitionGroupProps { const {name, duration} = descriptor; return { transitionName: name, @@ -52,58 +88,24 @@ const toCSSTransitionGroupProps = (descriptor: TransitionDescriptor): CSSTransit transitionEnter: true, transitionLeave: true }; -}; +} /** * Returns default props with animations disabled */ -const noTransitionProps = (): CSSTransitionGroupProps => ({ - transitionName: '', - transitionEnterTimeout: 0, - transitionLeaveTimeout: 0, - transitionEnter: false, - transitionLeave: false -}); - -/** - * Transition descriptors - */ -const transitions: TransitionMap = { - slide: { - forward: { - name: 'slide-up-transition', - duration: 450 - }, - backward: { - name: 'slide-down-transition', - duration: 450 - } - }, - push: { - forward: { - name: 'push-transition', - duration: 450 - }, - backward: { - name: 'pop-transition', - duration: 450 - } - } -}; +function noTransitionProps(): CSSTransitionGroupProps { + return { + transitionName: '', + transitionEnterTimeout: 0, + transitionLeaveTimeout: 0, + transitionEnter: false, + transitionLeave: false + }; +} /** * Shortcut to create TransitionRule */ -const r = (from: ?string, to: string, fork: TransitionFork): TransitionRule => { +function r(from: ?string, to: string, fork: TransitionFork): TransitionRule { return new TransitionRule(from, to, fork); -}; - -/** - * Transition rules - * (null) is used to indicate any route. - */ -const transitionRules = [ - r('/settings', '/settings/account', transitions.push), - r(null, '/settings', transitions.slide), - r(null, '/select-location', transitions.slide) -];
\ No newline at end of file +} |
