ionic-framework
Version:
An advanced HTML5 mobile app framework built on Angular2
59 lines (58 loc) • 2.65 kB
JavaScript
var __extends = (this && this.__extends) || function (d, b) {
for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
var animation_1 = require('../animations/animation');
var transition_1 = require('./transition');
var TRANSLATEY = 'translateY';
var OFF_BOTTOM = '40px';
var CENTER = '0px';
var SHOW_BACK_BTN_CSS = 'show-back-button';
var MDTransition = (function (_super) {
__extends(MDTransition, _super);
function MDTransition(enteringView, leavingView, opts) {
_super.call(this, opts);
// what direction is the transition going
var backDirection = (opts.direction === 'back');
// do they have navbars?
var enteringHasNavbar = enteringView.hasNavbar();
var leavingHasNavbar = leavingView && leavingView.hasNavbar();
// entering content item moves in bottom to center
var enteringPage = new animation_1.Animation(enteringView.pageRef());
enteringPage.before.addClass('show-page');
this.add(enteringPage);
if (backDirection) {
this.duration(opts.duration || 200).easing('cubic-bezier(0.47,0,0.745,0.715)');
enteringPage.before.clearStyles([TRANSLATEY]);
}
else {
this.duration(opts.duration || 280).easing('cubic-bezier(0.36,0.66,0.04,1)');
enteringPage
.fromTo(TRANSLATEY, OFF_BOTTOM, CENTER, true)
.fadeIn();
}
if (enteringHasNavbar) {
var enteringNavBar = new animation_1.Animation(enteringView.navbarRef());
enteringNavBar.before.addClass('show-navbar');
this.add(enteringNavBar);
var enteringBackButton = new animation_1.Animation(enteringView.backBtnRef());
this.add(enteringBackButton);
if (enteringView.enableBack()) {
enteringBackButton.before.addClass(SHOW_BACK_BTN_CSS);
}
else {
enteringBackButton.before.removeClass(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)');
var leavingPage = new animation_1.Animation(leavingView.pageRef());
this.add(leavingPage.fromTo(TRANSLATEY, CENTER, OFF_BOTTOM).fadeOut());
}
}
return MDTransition;
})(transition_1.Transition);
transition_1.Transition.register('md-transition', MDTransition);