javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-20 12:29:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore(): add types to Refresher

Browse Source
This commit is contained in:
Adam Bradley
2016-01-14 21:04:20 -06:00
parent 4a9c3a11a6
commit 02626b9489
7 changed files with 71 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
ionic/animations/animation.ts
View File

@ -51,7 +51,7 @@ export class Animation {
private _finishes: Array<any>;
public isProgress: boolean;
constructor(ele, opts={}) {
constructor(ele?, opts={}) {
this.reset();
this._opts = assign({
@ -524,16 +524,16 @@ export class Animation {
dest._ani = [];
for (let i = 0; i < src._chld.length; i++) {
dest.add( copy(new Animation(null), src._chld[i]) );
dest.add( copy(new Animation(), src._chld[i]) );
}
return dest;
}
return copy(new Animation(null), this);
return copy(new Animation(), this);
}
dispose(removeElement) {
dispose(removeElement?) {
let i;
for (i = 0; i < this._chld.length; i++) {

35
ionic/components/content/content.ts
View File

@ -34,10 +34,11 @@ import {ScrollTo} from '../../animations/scroll-to';
})
export class Content extends Ion {
private _padding: number = 0;
private _scrollEle: HTMLElement;
private _onScroll: any;
private _scrollTo: ScrollTo;
scrollElement: HTMLElement;
/**
* @param {ElementRef} elementRef A reference to the component's DOM element.
* @param {Config} config The config object to change content's default settings.
@ -62,7 +63,7 @@ export class Content extends Ion {
*/
ngOnInit() {
let self = this;
self._scrollEle = self._elementRef.nativeElement.children[0];
self.scrollElement = self._elementRef.nativeElement.children[0];
self._onScroll = function(ev) {
self._app.setScrolling();
@ -70,13 +71,13 @@ export class Content extends Ion {
if (self._config.get('tapPolyfill') === true) {
self._zone.runOutsideAngular(function() {
self._scrollEle.addEventListener('scroll', self._onScroll);
self.scrollElement.addEventListener('scroll', self._onScroll);
});
}
}
ngOnDestroy() {
this._scrollEle.removeEventListener('scroll', this._onScroll);
this.scrollElement.removeEventListener('scroll', this._onScroll);
}
/**
@ -105,24 +106,24 @@ export class Content extends Ion {
* @returns {Function} A function that removes the scroll handler.
*/
addScrollEventListener(handler) {
if (!this._scrollEle) {
if (!this.scrollElement) {
return;
}
// ensure we're not creating duplicates
this._scrollEle.removeEventListener('scroll', handler);
this.scrollElement.removeEventListener('scroll', handler);
this._scrollEle.addEventListener('scroll', handler);
this.scrollElement.addEventListener('scroll', handler);
return () => {
this._scrollEle.removeEventListener('scroll', handler);
this.scrollElement.removeEventListener('scroll', handler);
}
}
onScrollEnd(callback) {
let lastScrollTop = null;
let framesUnchanged = 0;
let _scrollEle = this._scrollEle;
let _scrollEle = this.scrollElement;
function next() {
let currentScrollTop = _scrollEle.scrollTop;
@ -175,15 +176,15 @@ export class Content extends Ion {
* @returns {Function} A function that removes the touchmove handler.
*/
addTouchMoveListener(handler) {
if (!this._scrollEle) { return; }
if (!this.scrollElement) { return; }
// ensure we're not creating duplicates
this._scrollEle.removeEventListener('touchmove', handler);
this.scrollElement.removeEventListener('touchmove', handler);
this._scrollEle.addEventListener('touchmove', handler);
this.scrollElement.addEventListener('touchmove', handler);
return () => {
this._scrollEle.removeEventListener('touchmove', handler);
this.scrollElement.removeEventListener('touchmove', handler);
}
}
@ -221,7 +222,7 @@ export class Content extends Ion {
this._scrollTo.dispose();
}
this._scrollTo = new ScrollTo(this._scrollEle);
this._scrollTo = new ScrollTo(this.scrollElement);
return this._scrollTo.start(x, y, duration, tolerance);
}
@ -256,7 +257,7 @@ export class Content extends Ion {
this._scrollTo.dispose();
}
this._scrollTo = new ScrollTo(this._scrollEle);
this._scrollTo = new ScrollTo(this.scrollElement);
return this._scrollTo.start(0, 0, 300, 0);
}
@ -279,7 +280,7 @@ export class Content extends Ion {
* {Number} dimensions.scrollRight scroll scrollLeft + scrollWidth
*/
getContentDimensions() {
let _scrollEle = this._scrollEle;
let _scrollEle = this.scrollElement;
let parentElement = _scrollEle.parentElement;
return {
@ -311,7 +312,7 @@ export class Content extends Ion {
console.debug('content addScrollPadding', newPadding);
this._padding = newPadding;
this._scrollEle.style.paddingBottom = newPadding + 'px';
this.scrollElement.style.paddingBottom = newPadding + 'px';
}
}

5
ionic/components/menu/menu-gestures.ts
View File

@ -3,8 +3,10 @@ import {SlideEdgeGesture} from '../../gestures/slide-edge-gesture';
import {assign} from '../../util/util';
export class MenuContentGesture extends SlideEdgeGesture {
constructor(menu: Menu, targetEl: Element, options = {}) {
constructor(public menu: Menu, targetEl: Element, options = {}) {
super(targetEl, assign({
direction: (menu.side === 'left' || menu.side === 'right') ? 'x' : 'y',
@ -13,7 +15,6 @@ export class MenuContentGesture extends SlideEdgeGesture {
maxEdgeStart: menu.maxEdgeStart || 75
}, options));
this.menu = menu;
this.listen();
}

36
ionic/components/menu/menu.ts
View File

@ -1,4 +1,4 @@
import {Component, forwardRef, Directive, Host, EventEmitter, ElementRef, NgZone, Input} from 'angular2/core';
import {Component, forwardRef, Directive, Host, EventEmitter, ElementRef, NgZone, Input, Output, Renderer} from 'angular2/core';
import {Ion} from '../ion';
import {IonicApp} from '../app/app';
@ -93,11 +93,6 @@ import {MenuType} from './menu-types';
*/
@Component({
selector: 'ion-menu',
defaultInputs: {
'side': 'left',
'menuType': 'reveal'
},
outputs: ['opening'],
host: {
'role': 'navigation',
'[attr.side]': 'side',
@ -112,7 +107,7 @@ export class Menu extends Ion {
private _gesture: Gesture;
private _targetGesture: Gesture;
private _type: MenuType;
opening: EventEmitter<Menu> = new EventEmitter();
isOpen: boolean = false;
isEnabled: boolean = true;
backdrop: MenuBackdrop;
@ -123,16 +118,19 @@ export class Menu extends Ion {
@Input() side: string;
@Input() type: string;
@Input() maxEdgeStart;
@Output() opening: EventEmitter<any> = new EventEmitter();
constructor(
elementRef: ElementRef,
private _elementRef: ElementRef,
private _config: Config,
private app: IonicApp,
private platform: Platform,
private keyboard: Keyboard,
private zone: NgZone
private _app: IonicApp,
private _platform: Platform,
private _renderer: Renderer,
private _keyboard: Keyboard,
private _zone: NgZone
) {
super(elementRef);
super(_elementRef);
}
/**
@ -150,15 +148,16 @@ export class Menu extends Ion {
if (self.side !== 'left' && self.side !== 'right') {
self.side = 'left';
}
self._renderer.setElementAttribute(self._elementRef, 'side', self.side);
if (!self.id) {
// Auto register
self.id = self.side + 'Menu';
if (self.app.getComponent(self.id)) {
if (self._app.getComponent(self.id)) {
// id already exists, make sure this one is unique
self.id += (++menuIds);
}
self.app.register(self.id, self);
self._app.register(self.id, self);
}
self._initGesture();
@ -180,7 +179,7 @@ export class Menu extends Ion {
* @private
*/
_initGesture() {
this.zone.runOutsideAngular(() => {
this._zone.runOutsideAngular(() => {
switch(this.side) {
case 'right':
this._gesture = new gestures.RightMenuGesture(this);
@ -203,6 +202,7 @@ export class Menu extends Ion {
type = this._config.get('menuType');
}
this.type = type;
this._renderer.setElementAttribute(this._elementRef, 'menuType', type);
}
/**
@ -287,7 +287,7 @@ export class Menu extends Ion {
this.getBackdropElement().classList.add('show-backdrop');
this._prevent();
this.keyboard.close();
this._keyboard.close();
}
}
@ -404,7 +404,7 @@ export class Menu extends Ion {
* @private
*/
ngOnDestroy() {
this.app.unregister(this.id);
this._app.unregister(this.id);
this._gesture && this._gesture.destroy();
this._targetGesture && this._targetGesture.destroy();
this._type && this._type.ngOnDestroy();

2
ionic/components/nav/nav-controller.ts
View File

@ -1000,7 +1000,7 @@ export class NavController extends Ion {
}
let viewContainer = this._viewManager.getViewContainer(location);
let hostViewRef =
let hostViewRef: any =
viewContainer.createHostView(hostProtoViewRef, viewContainer.length, providers);
let pageElementRef = this._viewManager.getHostElement(hostViewRef);
let component = this._viewManager.getComponent(pageElementRef);

12
ionic/components/radio/radio.ts
View File

@ -43,14 +43,15 @@ import {isDefined} from '../../util/util';
'</div>'
})
export class RadioButton {
@Input() value: string = '';
labelId: any;
@Input() checked: any = false;
@Input() disabled: boolean = false;
@Input() id: string;
@Input() value: string = '';
@Output() select: EventEmitter<RadioButton> = new EventEmitter();
labelId: any;
constructor(
private _form: Form,
private _renderer: Renderer,
@ -236,8 +237,7 @@ export class RadioGroup {
this._renderer.setElementAttribute(this._elementRef, 'aria-describedby', header.id);
}
let buttons = this._buttons.toArray();
for (let button of buttons) {
this._buttons.toArray().forEach(button => {
button.select.subscribe(() => {
this.writeValue(button.value);
this.onChange(button.value);
@ -253,7 +253,7 @@ export class RadioGroup {
this._renderer.setElementAttribute(this._elementRef, 'aria-activedescendant', button.id);
}
}
}
});
}
}

29
ionic/components/scroll/pull-to-refresh.ts
View File

@ -82,7 +82,11 @@ import {raf, ready, CSS} from '../../util/dom';
})
export class Refresher {
private ele: HTMLElement;
private _touchMoveListener;
private _touchEndListener;
private _handleScrollListener;
isActive: boolean;
isDragging: boolean = false;
isOverscrolling: boolean = false;
dragOffset: number = 0;
@ -91,6 +95,14 @@ export class Refresher {
activated: boolean = false;
scrollTime: number = 500;
canOverscroll: boolean = false;
startY;
deltaY;
scrollHost;
scrollChild;
showIcon: boolean;
showSpinner: boolean;
isRefreshing: boolean;
isRefreshingTail: boolean;
@Input() pullingIcon: string;
@Input() pullingText: string;
@ -129,12 +141,12 @@ export class Refresher {
})
this.showSpinner = !isDefined(this.refreshingIcon) && this.spinner != 'none';
this.showIcon = isDefined(this.refreshingIcon);
this._touchMoveListener = this._handleTouchMove.bind(this);
this._touchEndListener = this._handleTouchEnd.bind(this);
this._handleScrollListener = this._handleScroll.bind(this);
sc.addEventListener('touchmove', this._touchMoveListener);
sc.addEventListener('touchend', this._touchEndListener);
sc.addEventListener('scroll', this._handleScrollListener);
@ -143,8 +155,7 @@ export class Refresher {
/**
* @private
*/
onDehydrate() {
console.log('DEHYDRATION');
ngOnDestroy() {
let sc = this.content.scrollElement;
sc.removeEventListener('touchmove', this._touchMoveListener);
sc.removeEventListener('touchend', this._touchEndListener);
@ -280,14 +291,14 @@ export class Refresher {
* @param {TODO} duration TODO
* @param {Function} callback TODO
*/
scrollTo(Y, duration, callback) {
scrollTo(Y, duration, callback?) {
// scroll animation loop w/ easing
// credit https://gist.github.com/dezinezync/5487119
var start = Date.now(),
from = this.lastOverscroll;
if (from === Y) {
callback();
callback && callback();
return; /* Prevent scrolling to the Y point if already there */
}
@ -304,7 +315,7 @@ export class Refresher {
// fraction based on the easing method
easedT = easeOutCubic(time);
this.overscroll(parseInt((easedT * (Y - from)) + from, 10));
this.overscroll( Math.round((easedT * (Y - from)) + from) );
if (time < 1) {
raf(scroll.bind(this));
@ -354,7 +365,7 @@ export class Refresher {
}
if (this.isDragging) {
this.nativescroll(this.scrollHost, parseInt(this.deltaY - this.dragOffset, 10) * -1);
this.nativescroll(this.scrollHost, Math.round(this.deltaY - this.dragOffset) * -1);
}
// if we're not at overscroll 0 yet, 0 out
@ -378,8 +389,9 @@ export class Refresher {
}
this.isDragging = true;
// overscroll according to the user's drag so far
this.overscroll(parseInt((this.deltaY - this.dragOffset) / 3, 10));
this.overscroll( Math.round((this.deltaY - this.dragOffset) / 3) );
// Pass an incremental pull amount to the EventEmitter
this.pulling.next(this.lastOverscroll);
@ -388,6 +400,7 @@ export class Refresher {
if (!this.activated && this.lastOverscroll > this.ptrThreshold) {
this.activated = true;
raf(this.activate.bind(this));
} else if (this.activated && this.lastOverscroll < this.ptrThreshold) {
this.activated = false;
raf(this.deactivate.bind(this));