diff --git a/ionic/animations/animation.ts b/ionic/animations/animation.ts index ac0df206d2..1a7dc54917 100644 --- a/ionic/animations/animation.ts +++ b/ionic/animations/animation.ts @@ -51,7 +51,7 @@ export class Animation { private _finishes: Array; 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++) { diff --git a/ionic/components/content/content.ts b/ionic/components/content/content.ts index 7ffb3261d2..c4da193c76 100644 --- a/ionic/components/content/content.ts +++ b/ionic/components/content/content.ts @@ -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'; } } diff --git a/ionic/components/menu/menu-gestures.ts b/ionic/components/menu/menu-gestures.ts index e160b2f522..a850071686 100644 --- a/ionic/components/menu/menu-gestures.ts +++ b/ionic/components/menu/menu-gestures.ts @@ -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(); } diff --git a/ionic/components/menu/menu.ts b/ionic/components/menu/menu.ts index 44b3834f34..29b8657d3e 100644 --- a/ionic/components/menu/menu.ts +++ b/ionic/components/menu/menu.ts @@ -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 = 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 = 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(); diff --git a/ionic/components/nav/nav-controller.ts b/ionic/components/nav/nav-controller.ts index aca8e14da1..44b3801e39 100644 --- a/ionic/components/nav/nav-controller.ts +++ b/ionic/components/nav/nav-controller.ts @@ -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); diff --git a/ionic/components/radio/radio.ts b/ionic/components/radio/radio.ts index fd0b452f29..402cfbe7f6 100644 --- a/ionic/components/radio/radio.ts +++ b/ionic/components/radio/radio.ts @@ -43,14 +43,15 @@ import {isDefined} from '../../util/util'; '' }) 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 = 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); } } - } + }); } } diff --git a/ionic/components/scroll/pull-to-refresh.ts b/ionic/components/scroll/pull-to-refresh.ts index fef1b85fb1..d5fa2ecd01 100644 --- a/ionic/components/scroll/pull-to-refresh.ts +++ b/ionic/components/scroll/pull-to-refresh.ts @@ -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));