Front end of the Slack clone application.

picker-transitions.js 1.1KB

1234567891011121314151617181920212223242526
  1. import { Animation } from '../../animations/animation';
  2. import { Transition } from '../../transitions/transition';
  3. /**
  4. * Animations for pickers
  5. */
  6. export class PickerSlideIn extends Transition {
  7. init() {
  8. let ele = this.enteringView.pageRef().nativeElement;
  9. let backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
  10. let wrapper = new Animation(this.plt, ele.querySelector('.picker-wrapper'));
  11. backdrop.fromTo('opacity', 0.01, 0.26);
  12. wrapper.fromTo('translateY', '100%', '0%');
  13. this.easing('cubic-bezier(.36,.66,.04,1)').duration(400).add(backdrop).add(wrapper);
  14. }
  15. }
  16. export class PickerSlideOut extends Transition {
  17. init() {
  18. let ele = this.leavingView.pageRef().nativeElement;
  19. let backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
  20. let wrapper = new Animation(this.plt, ele.querySelector('.picker-wrapper'));
  21. backdrop.fromTo('opacity', 0.26, 0);
  22. wrapper.fromTo('translateY', '0%', '100%');
  23. this.easing('cubic-bezier(.36,.66,.04,1)').duration(450).add(backdrop).add(wrapper);
  24. }
  25. }
  26. //# sourceMappingURL=picker-transitions.js.map