refactor(structure): allow content to scroll under headers/footers

This commit is contained in:
Adam Bradley
2016-06-16 11:28:02 -05:00
parent 64af0c8ba0
commit d13fa4e2cf
57 changed files with 1390 additions and 956 deletions

View File

@ -2,7 +2,8 @@ import {Component, ComponentResolver, ElementRef, HostListener, Renderer, ViewCh
import {addSelector} from '../../config/bootstrap';
import {Animation} from '../../animations/animation';
import {Transition, TransitionOptions} from '../../transitions/transition';
import {PageTransition} from '../../transitions/page-transition';
import {TransitionOptions} from '../../transitions/transition';
import {Config} from '../../config/config';
import {NavParams} from '../nav/nav-params';
import {Platform} from '../../platform/platform';
@ -244,9 +245,9 @@ export interface PopoverOptions {
/**
* Animations for popover
*/
class PopoverTransition extends Transition {
constructor(opts: TransitionOptions) {
super(opts);
class PopoverTransition extends PageTransition {
constructor(enteringView: ViewController, leavingView: ViewController, opts: TransitionOptions) {
super(enteringView, leavingView, opts);
}
mdPositionView(nativeEle: HTMLElement, ev: any) {
@ -392,16 +393,16 @@ class PopoverTransition extends Transition {
}
class PopoverPopIn extends PopoverTransition {
constructor(private enteringView: ViewController, private leavingView: ViewController, private opts: TransitionOptions) {
super(opts);
constructor(enteringView: ViewController, leavingView: ViewController, private opts: TransitionOptions) {
super(enteringView, leavingView, opts);
let ele = enteringView.pageRef().nativeElement;
let backdrop = new Animation(ele.querySelector('ion-backdrop'));
let wrapper = new Animation(ele.querySelector('.popover-wrapper'));
wrapper.fromTo('opacity', '0.01', '1');
backdrop.fromTo('opacity', '0.01', '0.08');
wrapper.fromTo('opacity', 0.01, 1);
backdrop.fromTo('opacity', 0.01, 0.08);
this
.easing('ease')
@ -417,19 +418,19 @@ class PopoverPopIn extends PopoverTransition {
});
}
}
Transition.register('popover-pop-in', PopoverPopIn);
PageTransition.register('popover-pop-in', PopoverPopIn);
class PopoverPopOut extends PopoverTransition {
constructor(private enteringView: ViewController, private leavingView: ViewController, private opts: TransitionOptions) {
super(opts);
constructor(enteringView: ViewController, leavingView: ViewController, private opts: TransitionOptions) {
super(enteringView, leavingView, opts);
let ele = leavingView.pageRef().nativeElement;
let backdrop = new Animation(ele.querySelector('ion-backdrop'));
let wrapper = new Animation(ele.querySelector('.popover-wrapper'));
wrapper.fromTo('opacity', '1', '0');
backdrop.fromTo('opacity', '0.08', '0');
wrapper.fromTo('opacity', 0.99, 0);
backdrop.fromTo('opacity', 0.08, 0);
this
.easing('ease')
@ -438,20 +439,20 @@ class PopoverPopOut extends PopoverTransition {
.add(wrapper);
}
}
Transition.register('popover-pop-out', PopoverPopOut);
PageTransition.register('popover-pop-out', PopoverPopOut);
class PopoverMdPopIn extends PopoverTransition {
constructor(private enteringView: ViewController, private leavingView: ViewController, private opts: TransitionOptions) {
super(opts);
constructor(enteringView: ViewController, leavingView: ViewController, private opts: TransitionOptions) {
super(enteringView, leavingView, opts);
let ele = enteringView.pageRef().nativeElement;
let content = new Animation(ele.querySelector('.popover-content'));
let viewport = new Animation(ele.querySelector('.popover-viewport'));
content.fromTo('scale', '0.001', '1');
viewport.fromTo('opacity', '0', '1');
content.fromTo('scale', 0.001, 1);
viewport.fromTo('opacity', 0.01, 1);
this
.easing('cubic-bezier(0.36,0.66,0.04,1)')
@ -467,26 +468,26 @@ class PopoverMdPopIn extends PopoverTransition {
});
}
}
Transition.register('popover-md-pop-in', PopoverMdPopIn);
PageTransition.register('popover-md-pop-in', PopoverMdPopIn);
class PopoverMdPopOut extends PopoverTransition {
constructor(private enteringView: ViewController, private leavingView: ViewController, private opts: TransitionOptions) {
super(opts);
constructor(enteringView: ViewController, leavingView: ViewController, private opts: TransitionOptions) {
super(enteringView, leavingView, opts);
let ele = leavingView.pageRef().nativeElement;
let wrapper = new Animation(ele.querySelector('.popover-wrapper'));
wrapper.fromTo('opacity', '1', '0');
wrapper.fromTo('opacity', 0.99, 0);
this
.easing('ease')
.duration(500)
.fadeIn()
.fromTo('opacity', 0.01, 1)
.add(wrapper);
}
}
Transition.register('popover-md-pop-out', PopoverMdPopOut);
PageTransition.register('popover-md-pop-out', PopoverMdPopOut);
let popoverIds = -1;