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

// 模态框弹入动画
export class ModalPopIn 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('.modal-wrapper'));

    wrapper.fromTo('opacity', 0, 1)
      //.fromTo('transform-origin','center center center','center center center')
      //.fromTo('scale', 0.6, 1)
      //.fromTo('scaleX', 0.6, 1)
      //.fromTo('scaleY', 0.6, 1)
      .fromTo('scaleZ', 0.6, 1)
      .fromTo('perspective',0,500)
      //.fromTo('scale3d','0.6,0.6,0.6','1,1,1');
    backdrop.fromTo('opacity', 0.01, 0.6);

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

// 模态框弹出动画
export class ModalPopOut 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('.modal-wrapper'));

    wrapper.fromTo('opacity', 0.99, 0)
      //.fromTo('transform-origin','center center center','center center center')
      //.fromTo('scale', 1, 0.6)
      //.fromTo('scaleX', 1, 0.6)
      //.fromTo('scaleY', 1, 0.6)
      .fromTo('scaleZ', 1, 0.6)
      .fromTo('perspective',500,0)
      //.fromTo('scale3d','0.6,0.6,0.6','1,1,1');
    backdrop.fromTo('opacity', 0.3, 0);

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