import { Transition,Animation} from 'ionic-angular'

// 模态框弹入动画
export class ModalSlideIn extends Transition {
  init() {
    let ele = this.enteringView.pageRef().nativeElement;
    let backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
    let wrapper = new Animation(this.plt, ele.querySelector('.keyboard-wrapper'));

    wrapper.fromTo('opacity', 1, 1).fromTo('translateY', '100%', '0%');
    if(backdrop) backdrop.fromTo('opacity', 0.01, 0.3);

    this
      .easing('ease-in-out')
      .duration(250)
      .add(backdrop)
      .add(wrapper);
  }
}

// 模态框弹出动画
export class ModalSlideOut extends Transition {
  init() {
    let ele = this.leavingView.pageRef().nativeElement;
    let backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
    let wrapper = new Animation(this.plt, ele.querySelector('.keyboard-wrapper'));

    wrapper.fromTo('translateY', '0%', '100%');
    if(backdrop) backdrop.fromTo('opacity', 0.3, 0);

    this
      .easing('ease-in-out')
      .duration(250)
      .add(backdrop)
      .add(wrapper);
  }
}