| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051 |
- import { Animation } from '../animations/animation';
- import { isPresent } from '../util/util';
- import { PageTransition } from './page-transition';
- const TRANSLATEY = 'translateY';
- const OFF_BOTTOM = '40px';
- const CENTER = '0px';
- const SHOW_BACK_BTN_CSS = 'show-back-button';
- export class MDTransition extends PageTransition {
- init() {
- super.init();
- const plt = this.plt;
- const enteringView = this.enteringView;
- const leavingView = this.leavingView;
- const opts = this.opts;
- // what direction is the transition going
- const backDirection = (opts.direction === 'back');
- if (enteringView) {
- if (backDirection) {
- this.duration(isPresent(opts.duration) ? opts.duration : 200).easing('cubic-bezier(0.47,0,0.745,0.715)');
- }
- else {
- this.duration(isPresent(opts.duration) ? opts.duration : 280).easing('cubic-bezier(0.36,0.66,0.04,1)');
- this.enteringPage
- .fromTo(TRANSLATEY, OFF_BOTTOM, CENTER, true)
- .fromTo('opacity', 0.01, 1, true);
- }
- if (enteringView.hasNavbar()) {
- const enteringPageEle = enteringView.pageRef().nativeElement;
- const enteringNavbarEle = enteringPageEle.querySelector('ion-navbar');
- const enteringNavBar = new Animation(plt, enteringNavbarEle);
- this.add(enteringNavBar);
- const enteringBackButton = new Animation(plt, enteringNavbarEle.querySelector('.back-button'));
- this.add(enteringBackButton);
- if (enteringView.enableBack()) {
- enteringBackButton.beforeAddClass(SHOW_BACK_BTN_CSS);
- }
- else {
- enteringBackButton.beforeRemoveClass(SHOW_BACK_BTN_CSS);
- }
- }
- }
- // setup leaving view
- if (leavingView && backDirection) {
- // leaving content
- this.duration(opts.duration || 200).easing('cubic-bezier(0.47,0,0.745,0.715)');
- const leavingPage = new Animation(plt, leavingView.pageRef());
- this.add(leavingPage.fromTo(TRANSLATEY, CENTER, OFF_BOTTOM).fromTo('opacity', 1, 0));
- }
- }
- }
- //# sourceMappingURL=transition-md.js.map
|