diff --git a/ionic/animations/animation.ts b/ionic/animations/animation.ts index 8f622baf8d..4e6aa8d98f 100644 --- a/ionic/animations/animation.ts +++ b/ionic/animations/animation.ts @@ -1,3 +1,4 @@ +import {ViewController} from '../components/nav/view-controller'; import {CSS, rafFrames} from '../util/dom'; import {assign} from '../util/util'; @@ -564,7 +565,7 @@ export class Animation { return new AnimationClass(element); } - static createTransition(enteringView, leavingView, opts = {}) { + static createTransition(enteringView: ViewController, leavingView: ViewController, opts: any = {}) { let TransitionClass = AnimationRegistry[opts.animation]; if (!TransitionClass) { // didn't find a transition animation, default to ios-transition @@ -574,7 +575,7 @@ export class Animation { return new TransitionClass(enteringView, leavingView, opts); } - static register(name, AnimationClass) { + static register(name: string, AnimationClass) { AnimationRegistry[name] = AnimationClass; } @@ -601,7 +602,8 @@ class Animate { // and correct API methods under the hood, so really doesn't matter if (!fromEffect) { - return console.error(ele.tagName, 'animation fromEffect required, toEffect:', toEffect); + console.error(ele.tagName, 'animation fromEffect required, toEffect:', toEffect); + return; } this.toEffect = parseEffect(toEffect); @@ -609,7 +611,8 @@ class Animate { this.shouldAnimate = (duration > 32); if (!this.shouldAnimate) { - return inlineStyle(ele, this.toEffect); + inlineStyle(ele, this.toEffect); + return; } this.ele = ele; @@ -635,7 +638,7 @@ class Animate { this.effects.push( convertProperties(this.toEffect) ); } - play(done) { + play(done?: Function) { const self = this; if (self.ani) { @@ -761,7 +764,7 @@ function parseEffect(inputEffect) { } function convertProperties(inputEffect) { - let outputEffect = {}; + let outputEffect: any = {}; let transforms = []; let value, property; diff --git a/ionic/components/checkbox/checkbox.ts b/ionic/components/checkbox/checkbox.ts index 935d343ccf..8f796e1de6 100644 --- a/ionic/components/checkbox/checkbox.ts +++ b/ionic/components/checkbox/checkbox.ts @@ -27,7 +27,7 @@ import {Form} from '../../util/form'; 'role': 'checkbox', 'class': 'item', 'tappable': '', - 'tabindex': 0, + 'tabindex': '0', '[attr.aria-disabled]': 'disabled' }, template: @@ -41,8 +41,9 @@ import {Form} from '../../util/form'; '' }) export class Checkbox { + private _checked: boolean; + private labelId: string; @Input() value: string = ''; - @Input() public checked: any = false; @Input() disabled: boolean = false; @Input() id: string; @@ -84,9 +85,10 @@ export class Checkbox { return !!this._checked; } + @Input() set checked(val) { this._checked = !!val; - this._renderer.setElementAttribute(this._elementRef, 'aria-checked', this._checked); + this._renderer.setElementAttribute(this._elementRef, 'aria-checked', this._checked.toString()); this.onChange(this._checked); } diff --git a/ionic/components/content/content.ts b/ionic/components/content/content.ts index 69e3774ea7..a1848f261e 100644 --- a/ionic/components/content/content.ts +++ b/ionic/components/content/content.ts @@ -1,6 +1,5 @@ import {Component, ElementRef, Optional, NgZone} from 'angular2/core'; -import {Ion} from '../ion'; import {IonicApp} from '../app/app'; import {Config} from '../../config/config'; import {raf} from '../../util/dom'; @@ -32,24 +31,26 @@ import {ScrollTo} from '../../animations/scroll-to'; '' + '' }) -export class Content extends Ion { +export class Content { + private _padding: number = 0; + private _scrollEle: HTMLElement; + private _onScroll: any; + private _scrollTo: ScrollTo; + /** * @param {ElementRef} elementRef A reference to the component's DOM element. * @param {Config} config The config object to change content's default settings. */ constructor( - elementRef: ElementRef, + private _elementRef: ElementRef, private _config: Config, - @Optional() viewCtrl: ViewController, private _app: IonicApp, - private _zone: NgZone + private _zone: NgZone, + @Optional() viewCtrl: ViewController ) { - super(elementRef); - this.scrollPadding = 0; - if (viewCtrl) { viewCtrl.setContent(this); - viewCtrl.setContentRef(elementRef); + viewCtrl.setContentRef(_elementRef); } } @@ -58,21 +59,21 @@ export class Content extends Ion { */ ngOnInit() { let self = this; - self.scrollElement = self.getNativeElement().children[0]; + self._scrollEle = self._elementRef.nativeElement.children[0]; - self._scroll = function(ev) { + self._onScroll = function(ev) { self._app.setScrolling(); }; if (self._config.get('tapPolyfill') === true) { self._zone.runOutsideAngular(function() { - self.scrollElement.addEventListener('scroll', self._scroll); + self._scrollEle.addEventListener('scroll', self._onScroll); }); } } ngOnDestroy() { - this.scrollElement.removeEventListener('scroll', this._scroll); + this._scrollEle.removeEventListener('scroll', this._onScroll); } /** @@ -101,25 +102,27 @@ export class Content extends Ion { * @returns {Function} A function that removes the scroll handler. */ addScrollEventListener(handler) { - if (!this.scrollElement) { return; } + if (!this._scrollEle) { + return; + } // ensure we're not creating duplicates - this.scrollElement.removeEventListener('scroll', handler); + this._scrollEle.removeEventListener('scroll', handler); - this.scrollElement.addEventListener('scroll', handler); + this._scrollEle.addEventListener('scroll', handler); return () => { - this.scrollElement.removeEventListener('scroll', handler); + this._scrollEle.removeEventListener('scroll', handler); } } onScrollEnd(callback) { let lastScrollTop = null; let framesUnchanged = 0; - let scrollElement = this.scrollElement; + let _scrollEle = this._scrollEle; function next() { - let currentScrollTop = scrollElement.scrollTop; + let currentScrollTop = _scrollEle.scrollTop; if (lastScrollTop !== null) { if (Math.round(lastScrollTop) === Math.round(currentScrollTop)) { @@ -169,15 +172,15 @@ export class Content extends Ion { * @returns {Function} A function that removes the touchmove handler. */ addTouchMoveListener(handler) { - if (!this.scrollElement) { return; } + if (!this._scrollEle) { return; } // ensure we're not creating duplicates - this.scrollElement.removeEventListener('touchmove', handler); + this._scrollEle.removeEventListener('touchmove', handler); - this.scrollElement.addEventListener('touchmove', handler); + this._scrollEle.addEventListener('touchmove', handler); return () => { - this.scrollElement.removeEventListener('touchmove', handler); + this._scrollEle.removeEventListener('touchmove', handler); } } @@ -215,7 +218,7 @@ export class Content extends Ion { this._scrollTo.dispose(); } - this._scrollTo = new ScrollTo(this.scrollElement); + this._scrollTo = new ScrollTo(this._scrollEle); return this._scrollTo.start(x, y, duration, tolerance); } @@ -250,7 +253,7 @@ export class Content extends Ion { this._scrollTo.dispose(); } - this._scrollTo = new ScrollTo(this.scrollElement); + this._scrollTo = new ScrollTo(this._scrollEle); return this._scrollTo.start(0, 0, 300, 0); } @@ -273,8 +276,8 @@ export class Content extends Ion { * {Number} dimensions.scrollRight scroll scrollLeft + scrollWidth */ getDimensions() { - let scrollElement = this.scrollElement; - let parentElement = scrollElement.parentElement; + let _scrollEle = this._scrollEle; + let parentElement = _scrollEle.parentElement; return { contentHeight: parentElement.offsetHeight, @@ -285,13 +288,13 @@ export class Content extends Ion { contentLeft: parentElement.offsetLeft, contentRight: parentElement.offsetLeft + parentElement.offsetWidth, - scrollHeight: scrollElement.scrollHeight, - scrollTop: scrollElement.scrollTop, - scrollBottom: scrollElement.scrollTop + scrollElement.scrollHeight, + scrollHeight: _scrollEle.scrollHeight, + scrollTop: _scrollEle.scrollTop, + scrollBottom: _scrollEle.scrollTop + _scrollEle.scrollHeight, - scrollWidth: scrollElement.scrollWidth, - scrollLeft: scrollElement.scrollLeft, - scrollRight: scrollElement.scrollLeft + scrollElement.scrollWidth, + scrollWidth: _scrollEle.scrollWidth, + scrollLeft: _scrollEle.scrollLeft, + scrollRight: _scrollEle.scrollLeft + _scrollEle.scrollWidth, } } @@ -300,12 +303,12 @@ export class Content extends Ion { * Adds padding to the bottom of the scroll element when the keyboard is open * so content below the keyboard can be scrolled into view. */ - addScrollPadding(newScrollPadding) { - if (newScrollPadding > this.scrollPadding) { - console.debug('addScrollPadding', newScrollPadding); + add_padding(newPadding) { + if (newPadding > this._padding) { + console.debug('add_padding', newPadding); - this.scrollPadding = newScrollPadding; - this.scrollElement.style.paddingBottom = newScrollPadding + 'px'; + this._padding = newPadding; + this._scrollEle.style.paddingBottom = newPadding + 'px'; } } diff --git a/ionic/components/nav/nav-controller.ts b/ionic/components/nav/nav-controller.ts index 82f610c77b..bac033ad60 100644 --- a/ionic/components/nav/nav-controller.ts +++ b/ionic/components/nav/nav-controller.ts @@ -108,7 +108,7 @@ export class NavController extends Ion { private _sbThreshold: any; public sbGesture: any; private initZIndex: number = 10; - private id: number; + public id: number; private _ids: number = -1; public providers: ResolvedProvider[]; public router: any; @@ -317,10 +317,10 @@ export class NavController extends Ion { * @param {Object} [opts={}] Any options you want to use pass to transtion * @returns {Promise} Returns a promise, which resolves when the transition has completed */ - present(enteringView: ViewController, opts = {}): Promise { + present(enteringView: ViewController, opts: any = {}): Promise { let nav = this.rootNav; - if (nav._tabs) { + if (nav['_tabs']) { // TODO: must have until this goes in // https://github.com/angular/angular/issues/5481 console.error('A parent is required for ActionSheet/Alert/Modal'); @@ -382,7 +382,7 @@ export class NavController extends Ion { * @param {Object} [opts={}] Any options you want to use pass to transtion * @returns {Promise} Returns a promise when the transition is completed */ - pop(opts = {}): Promise { + pop(opts: any = {}): Promise { if (!opts.animateFirst && !this.canGoBack()) { return Promise.reject('pop cannot go back'); } @@ -433,7 +433,7 @@ export class NavController extends Ion { * @param view {ViewController} to pop to * @param {Object} [opts={}] Any options you want to use pass to transtion */ - popTo(viewCtrl: ViewController, opts = {}): Promise { + popTo(viewCtrl: ViewController, opts: any = {}): Promise { // Get the target index of the view to pop to let viewIndex = this._views.indexOf(viewCtrl); let targetIndex = viewIndex + 1; @@ -656,8 +656,8 @@ export class NavController extends Ion { * @param {Object} [opts={}] Any options you want to use pass * @returns {Promise} Returns a promise when the pages are set */ - setPages(componentTypes: Array, opts = {}): Promise { - if (!componentTypes || !componentTypes.length) { + setPages(components: Array<{componentType: Type, params?: any}>, opts: any = {}): Promise { + if (!components || !components.length) { return Promise.resolve(); } @@ -684,22 +684,18 @@ export class NavController extends Ion { } } - let componentObj = null; - let componentType = null; - let viewCtrl = null; + let componentType: Type = null; + let viewCtrl: ViewController = null; // create the ViewControllers that go before the new active ViewController // in the stack, but the previous views shouldn't render yet if (components.length > 1) { - let newBeforeItems = components.slice(0, components.length - 1); - for (let j = 0; j < newBeforeItems.length; j++) { - componentObj = newBeforeItems[j]; + let newBeforeComponents: Array<{componentType: Type, params?: any}> = components.slice(0, components.length - 1); + for (let j = 0; j < newBeforeComponents.length; j++) { + componentType = newBeforeComponents[j].componentType; - if (componentObj) { - // could be an object with a componentType property, or it is a componentType - componentType = componentObj.componentType || componentObj; - - viewCtrl = new ViewController(componentType, componentObj.params); + if (componentType) { + viewCtrl = new ViewController(componentType, newBeforeComponents[j].params); viewCtrl.setNav(this); viewCtrl.state = CACHED_STATE; viewCtrl.shouldDestroy = false; @@ -711,13 +707,10 @@ export class NavController extends Ion { } } - // get the component that will become the active item - // it'll be the last one in the given components array - componentObj = components[ components.length - 1 ]; - componentType = componentObj.componentType || componentObj; - // transition the leaving and entering - return this.push(componentType, componentObj.params, opts); + return this.push(components[ components.length - 1 ].componentType, + components[ components.length - 1 ].params, + opts); } /** @@ -727,11 +720,8 @@ export class NavController extends Ion { * @param {Object} [opts={}] Any options you want to use pass to transtion * @returns {Promise} Returns a promise when done */ - setRoot(componentType: ViewController, params: any = {}, opts: any = {}): Promise { - return this.setPages([{ - componentType, - params - }], opts); + setRoot(componentType: Type, params: any = {}, opts: any = {}): Promise { + return this.setPages([ { componentType, params } ], opts); } /** @@ -1015,7 +1005,7 @@ export class NavController extends Ion { let component = this._viewManager.getComponent(pageElementRef); // auto-add page css className created from component JS class name - let cssClassName = pascalCaseToDashCase(viewCtrl.componentType.name); + let cssClassName = pascalCaseToDashCase(viewCtrl.componentType['name']); this._renderer.setElementClass(pageElementRef, cssClassName, true); viewCtrl.addDestroy(() => { @@ -1187,7 +1177,7 @@ export class NavController extends Ion { leavingView.state = STAGED_LEAVING_STATE; // init the swipe back transition animation - this._sbTrans = Transition.create(this, opts); + this._sbTrans = Animation.createTransition(enteringView, leavingView, opts); this._sbTrans.easing('linear').progressStart(); }); @@ -1341,33 +1331,7 @@ export class NavController extends Ion { /** * @private */ - navbarViewContainer(nbContainer) { - if (nbContainer) { - this._nbContainer = nbContainer; - } - if (this._nbContainer) { - return this._nbContainer; - } - if (this.parent) { - return this.parent.navbarViewContainer(); - } - } - - /** - * @private - * @returns {TODO} TODO - */ - anchorElementRef() { - if (arguments.length) { - this._anchorER = arguments[0]; - } - return this._anchorER; - } - - /** - * @private - */ - _add(viewCtrl) { + _add(viewCtrl: ViewController) { this._incId(viewCtrl); this._views.push(viewCtrl); } @@ -1375,7 +1339,7 @@ export class NavController extends Ion { /** * @private */ - _incId(viewCtrl) { + _incId(viewCtrl: ViewController) { viewCtrl.id = this.id + '-' + (++this._ids); } @@ -1389,7 +1353,7 @@ export class NavController extends Ion { /** * @private */ - _getStagedEntering() { + _getStagedEntering(): ViewController { for (let i = 0, ii = this._views.length; i < ii; i++) { if (this._views[i].state === STAGED_ENTERING_STATE) { return this._views[i]; @@ -1401,7 +1365,7 @@ export class NavController extends Ion { /** * @private */ - _getStagedLeaving() { + _getStagedLeaving(): ViewController { for (let i = 0, ii = this._views.length; i < ii; i++) { if (this._views[i].state === STAGED_LEAVING_STATE) { return this._views[i]; @@ -1427,7 +1391,7 @@ export class NavController extends Ion { * @param {Index} The index of the page you want to get * @returns {Component} Returns the component that matches the index given */ - getByIndex(index): ViewController { + getByIndex(index: number): ViewController { if (index < this._views.length && index > -1) { return this._views[index]; } @@ -1439,7 +1403,7 @@ export class NavController extends Ion { * @param {TODO} view TODO * @returns {TODO} TODO */ - getPrevious(viewCtrl): ViewController { + getPrevious(viewCtrl: ViewController): ViewController { if (viewCtrl) { let viewIndex = this._views.indexOf(viewCtrl); diff --git a/ionic/components/nav/nav-push.ts b/ionic/components/nav/nav-push.ts index 57b3730935..527e14046c 100644 --- a/ionic/components/nav/nav-push.ts +++ b/ionic/components/nav/nav-push.ts @@ -1,4 +1,4 @@ -import {Directive, Optional} from 'angular2/core'; +import {Directive, Optional, Input} from 'angular2/core'; import {NavController} from './nav-controller'; import {NavRegistry} from './nav-registry'; @@ -44,24 +44,20 @@ import {NavRegistry} from './nav-registry'; */ @Directive({ selector: '[navPush]', - inputs: [ - 'instruction: navPush', - 'params: navParams' - ], host: { '(click)': 'onClick()', 'role': 'link' } }) export class NavPush { - /** - * TODO - * @param {NavController} nav TODO - */ - constructor(@Optional() nav: NavController, registry: NavRegistry) { - this.nav = nav; - this.registry = registry; - if (!nav) { + @Input() navPush; + @Input() navParams; + + constructor( + @Optional() private _nav: NavController, + private registry: NavRegistry + ) { + if (!_nav) { console.error('nav-push must be within a NavController'); } } @@ -72,22 +68,23 @@ export class NavPush { onClick() { let destination, params; - if (this.instruction instanceof Array) { - if (this.instruction.length > 2) { + if (this.navPush instanceof Array) { + if (this.navPush.length > 2) { throw 'Too many [navPush] arguments, expects [View, { params }]' } - destination = this.instruction[0]; - params = this.instruction[1] || this.params; + destination = this.navPush[0]; + params = this.navPush[1] || this.navParams; + } else { - destination = this.instruction; - params = this.params; + destination = this.navPush; + params = this.navParams; } if (typeof destination === "string") { destination = this.registry.get(destination); } - this.nav && this.nav.push(destination, params); + this._nav && this._nav.push(destination, params); } } @@ -122,9 +119,8 @@ export class NavPop { * TODO * @param {NavController} nav TODO */ - constructor(@Optional() nav: NavController) { - this.nav = nav; - if (!nav) { + constructor(@Optional() private _nav: NavController) { + if (!_nav) { console.error('nav-pop must be within a NavController'); } } @@ -132,6 +128,6 @@ export class NavPop { * @private */ onClick() { - this.nav && this.nav.pop(); + this._nav && this._nav.pop(); } } diff --git a/ionic/components/nav/nav-router.ts b/ionic/components/nav/nav-router.ts index 0e6b1dad34..4db3590c15 100644 --- a/ionic/components/nav/nav-router.ts +++ b/ionic/components/nav/nav-router.ts @@ -15,27 +15,21 @@ import {Nav} from './nav'; selector: 'ion-nav' }) export class NavRouter extends RouterOutlet { - - /** - * TODO - * @param {ElementRef} _elementRef TODO - * @param {DynamicComponentLoader} _loader TODO - * @param {Router} _parentRouter TODO - * @param {string} nameAttr Value of the element's 'name' attribute - * @param {Nav} nav TODO - */ - constructor(_elementRef: ElementRef, _loader: DynamicComponentLoader, - _parentRouter: Router, @Attribute('name') nameAttr: string, - nav: Nav) { + private _activeViewId; + + constructor( + _elementRef: ElementRef, + _loader: DynamicComponentLoader, + _parentRouter: Router, + @Attribute('name') nameAttr: string, + private _nav: Nav + ) { super(_elementRef, _loader, _parentRouter, nameAttr); - // Nav is Ionic's NavController, which we injected into this class - this.nav = nav; - // register this router with Ionic's NavController // Ionic's NavController will call this NavRouter's "stateChange" // method when the NavController has...changed its state - nav.registerRouter(this); + _nav.registerRouter(this); } /** @@ -50,13 +44,13 @@ export class NavRouter extends RouterOutlet { var childRouter = this._parentRouter.childRouter(componentType); // prevent double navigations to the same view - var lastView = this.nav.last(); - if (this.nav.isTransitioning() || lastView && lastView.componentType === componentType && lastView.params.data === nextInstruction.params) { + var lastView = this._nav.last(); + if (this._nav.isTransitioning() || lastView && lastView.componentType === componentType && lastView.params.data === nextInstruction.params) { return Promise.resolve(); } // tell the NavController which componentType, and it's params, to navigate to - return this.nav.push(componentType, nextInstruction.params); + return this._nav.push(componentType, nextInstruction.params); } reuse(nextInstruction: ComponentInstruction) { diff --git a/ionic/components/nav/nav.ts b/ionic/components/nav/nav.ts index 054f62df1e..2ee0c999c6 100644 --- a/ionic/components/nav/nav.ts +++ b/ionic/components/nav/nav.ts @@ -1,4 +1,4 @@ -import {ChangeDetectorRef, Component, Directive, ElementRef, Host, Input, Optional, forwardRef, Inject, NgZone, Compiler, AppViewManager, Renderer, ViewContainerRef} from 'angular2/core'; +import {Component, Directive, ElementRef, Host, Input, Optional, forwardRef, Inject, NgZone, Compiler, AppViewManager, Renderer, ViewContainerRef, Type} from 'angular2/core'; import {IonicApp} from '../app/app'; import {Config} from '../../config/config'; @@ -104,7 +104,8 @@ import {ViewController} from './view-controller'; template: '' }) export class Nav extends NavController { - @Input() root: any; + @Input() root: Type; + @Input() swipeBackEnabled: any; constructor( @Optional() hostNavCtrl: NavController, @@ -116,10 +117,9 @@ export class Nav extends NavController { compiler: Compiler, viewManager: AppViewManager, zone: NgZone, - renderer: Renderer, - cd: ChangeDetectorRef + renderer: Renderer ) { - super(hostNavCtrl, app, config, keyboard, elementRef, 'contents', compiler, viewManager, zone, renderer, cd); + super(hostNavCtrl, app, config, keyboard, elementRef, 'contents', compiler, viewManager, zone, renderer); if (viewCtrl) { // an ion-nav can also act as an ion-page within a parent ion-nav diff --git a/ionic/components/nav/overlay-controller.ts b/ionic/components/nav/overlay-controller.ts deleted file mode 100644 index 2327c344d8..0000000000 --- a/ionic/components/nav/overlay-controller.ts +++ /dev/null @@ -1,57 +0,0 @@ -import {ViewController} from '../view-controller'; -import {Config} from '../../config/config'; -import {IonicApp} from '../app/app'; - - -export class OverlayController extends ViewController { - - constructor(navCtrl, componentType, opts={}) { - super(null, AlertCmp, opts); - - this.data.inputs = this.data.inputs || []; - let buttons = this.data.buttons || []; - this.data.buttons = []; - for (let button of buttons) { - this.addButton(button); - } - - this.enterAnimationKey = 'alertEnter'; - this.leaveAnimationKey = 'alertLeave'; - } - - setTitle(title) { - this.data.title = title; - } - - setSubTitle(subTitle) { - this.data.subTitle = subTitle; - } - - setBody(body) { - this.data.body = body; - } - - addInput(input) { - input.value = isDefined(input.value) ? input.value : ''; - this.data.inputs.push(input); - } - - addButton(button) { - if (typeof button === 'string') { - button = { - text: button - }; - } - this.data.buttons.push(button); - } - - close() { - let index = this._nav.indexOf(this); - this._nav.remove(index, { animateFirst: true }); - } - - onClose(handler) { - this.data.onClose = handler; - } - -} diff --git a/ionic/components/nav/swipe-back.ts b/ionic/components/nav/swipe-back.ts index 3f1b29c15b..9c90494ef1 100644 --- a/ionic/components/nav/swipe-back.ts +++ b/ionic/components/nav/swipe-back.ts @@ -1,29 +1,36 @@ +import {NavController} from './nav-controller'; import {SlideEdgeGesture} from '../../gestures/slide-edge-gesture'; export class SwipeBackGesture extends SlideEdgeGesture { + public edges: Array; + public threshold: string; - constructor(element: Element, opts: Object = {}, navCtrl) { + constructor( + element: HTMLElement, + opts: any = {}, + private _nav: NavController + ) { super(element, opts); + // Can check corners through use of eg 'left top' this.edges = opts.edge.split(' '); this.threshold = opts.threshold; - this.navCtrl = navCtrl; } onSlideStart() { - this.navCtrl.swipeBackStart(); + this._nav.swipeBackStart(); } onSlide(slide, ev) { - this.navCtrl.swipeBackProgress(slide.distance / slide.max); + this._nav.swipeBackProgress(slide.distance / slide.max); } onSlideEnd(slide, ev) { let shouldComplete = (Math.abs(ev.velocityX) > 0.2 || Math.abs(slide.delta) > Math.abs(slide.max) * 0.5); // TODO: calculate a better playback rate depending on velocity and distance - this.navCtrl.swipeBackEnd(shouldComplete, 1); + this._nav.swipeBackEnd(shouldComplete, 1); } } diff --git a/ionic/components/nav/view-controller.ts b/ionic/components/nav/view-controller.ts index 5a2a288e7a..5fe2ffd27e 100644 --- a/ionic/components/nav/view-controller.ts +++ b/ionic/components/nav/view-controller.ts @@ -1,5 +1,6 @@ -import {Output, EventEmitter, Type} from 'angular2/core'; +import {Output, EventEmitter, Type, TemplateRef, ViewContainerRef, ElementRef} from 'angular2/core'; import {NavController, NavParams} from './nav-controller'; +import {Navbar} from '../navbar/navbar'; /** * @name ViewController @@ -24,9 +25,16 @@ export class ViewController { public shouldDestroy: boolean = false; public shouldCache: boolean = false; public viewType: string = ''; + public id: string; private _leavingOpts: any = null; private _onDismiss: Function = null; private _nav: NavController; + private _nbTmpRef: TemplateRef; + private _nbVwRef: ViewContainerRef; + private _pgRef: ElementRef; + private _cntRef: ElementRef; + private _nbDir: Navbar; + private _cntDir: any; @Output() private _emitter: EventEmitter = new EventEmitter(); constructor(public componentType?: Type, public data: any = {}) {} @@ -91,7 +99,7 @@ export class ViewController { * @private */ get name() { - return this.componentType ? this.componentType.name : ''; + return this.componentType ? this.componentType['name'] : ''; } /** @@ -140,14 +148,14 @@ export class ViewController { /** * @private */ - setNavbarTemplateRef(templateRef) { + setNavbarTemplateRef(templateRef: TemplateRef) { this._nbTmpRef = templateRef; } /** * @private */ - getNavbarTemplateRef() { + getNavbarTemplateRef(): TemplateRef { return this._nbTmpRef; } @@ -161,14 +169,14 @@ export class ViewController { /** * @private */ - setNavbarViewRef(viewContainerRef) { + setNavbarViewRef(viewContainerRef: ViewContainerRef) { this._nbVwRef = viewContainerRef; } /** * @private */ - setPageRef(elementRef) { + setPageRef(elementRef: ElementRef) { this._pgRef = elementRef; } @@ -176,14 +184,14 @@ export class ViewController { * @private * @returns {ElementRef} Returns the Page's ElementRef */ - pageRef() { + pageRef(): ElementRef { return this._pgRef; } /** * @private */ - setContentRef(elementRef) { + setContentRef(elementRef: ElementRef) { this._cntRef = elementRef; } @@ -191,7 +199,7 @@ export class ViewController { * @private * @returns {ElementRef} Returns the Page's Content ElementRef */ - contentRef() { + contentRef(): ElementRef { return this._cntRef; } @@ -213,7 +221,7 @@ export class ViewController { /** * @private */ - setNavbar(directive) { + setNavbar(directive: Navbar) { this._nbDir = directive; } @@ -312,7 +320,7 @@ export class ViewController { setBackButtonText(val) { let navbar = this.getNavbar(); if (navbar) { - navbar.bbText = val; + navbar.setBackButtonText(val); } } diff --git a/ionic/components/navbar/navbar.ts b/ionic/components/navbar/navbar.ts index 316e42811f..8a8bbe492c 100644 --- a/ionic/components/navbar/navbar.ts +++ b/ionic/components/navbar/navbar.ts @@ -1,4 +1,4 @@ -import {Component, Directive, Optional, ElementRef, Renderer, TemplateRef, forwardRef, Inject, ViewContainerRef} from 'angular2/core'; +import {Component, Directive, Optional, ElementRef, Renderer, TemplateRef, forwardRef, Inject, ViewContainerRef, Input} from 'angular2/core'; import {Ion} from '../ion'; import {Icon} from '../icon/icon'; @@ -17,19 +17,18 @@ import {NavController} from '../nav/nav-controller'; }) class BackButton extends Ion { constructor( - @Optional() navCtrl: NavController, + @Optional() private _nav: NavController, elementRef: ElementRef, @Optional() @Inject(forwardRef(() => Navbar)) navbar: Navbar ) { super(elementRef); - this.navCtrl = navCtrl; navbar && navbar.setBackButtonRef(elementRef); } goBack(ev) { ev.stopPropagation(); ev.preventDefault(); - this.navCtrl && this.navCtrl.pop(); + this._nav && this._nav.pop(); } } @@ -94,9 +93,9 @@ class ToolbarBackground { template: '
' + '' + '' + @@ -109,28 +108,30 @@ class ToolbarBackground { '[hidden]': '_hidden', 'class': 'toolbar' }, - inputs: [ - 'hideBackButton' - ], directives: [BackButton, BackButtonText, Icon, ToolbarBackground] }) export class Navbar extends ToolbarBase { + private _bbIcon: string; + private _bbText: string; + private _hidden: boolean; + private _bbRef: ElementRef; + private _bbtRef: ElementRef; + private _bgRef: ElementRef; + @Input() hideBackButton: any; constructor( - app: IonicApp, + private _app: IonicApp, @Optional() viewCtrl: ViewController, elementRef: ElementRef, config: Config, - renderer: Renderer + private _renderer: Renderer ) { - super(elementRef, config); - this.app = app; - this.renderer = renderer; + super(elementRef); viewCtrl && viewCtrl.setNavbar(this); - this.bbIcon = config.get('backButtonIcon'); - this.bbText = config.get('backButtonText'); + this._bbIcon = config.get('backButtonIcon'); + this._bbText = config.get('backButtonText'); } /** @@ -143,46 +144,50 @@ export class Navbar extends ToolbarBase { } } - /** - * @private - */ - getBackButtonRef() { - return this.bbRef; + setBackButtonText(text: string) { + this._bbText = text; } /** * @private */ - setBackButtonRef(backButtonElementRef) { - this.bbRef = backButtonElementRef; + getBackButtonRef() { + return this._bbRef; + } + + /** + * @private + */ + setBackButtonRef(backButtonElementRef: ElementRef) { + this._bbRef = backButtonElementRef; } /** * @private */ getBackButtonTextRef() { - return this.bbtRef; + return this._bbtRef; } /** * @private */ - setBackButtonTextRef(backButtonTextElementRef) { - this.bbtRef = backButtonTextElementRef; + setBackButtonTextRef(backButtonTextElementRef: ElementRef) { + this._bbtRef = backButtonTextElementRef; } /** * @private */ - setBackgroundRef(backgrouneElementRef) { - this.bgRef = backgrouneElementRef; + setBackgroundRef(backgrouneElementRef: ElementRef) { + this._bgRef = backgrouneElementRef; } /** * @private */ getBackgroundRef() { - return this.bgRef; + return this._bgRef; } /** @@ -190,7 +195,7 @@ export class Navbar extends ToolbarBase { */ didEnter() { try { - this.app.setTitle(this.getTitleText()); + this._app.setTitle(this.getTitleText()); } catch(e) { console.error(e); } diff --git a/package.json b/package.json index 5edb418887..3498f7c823 100644 --- a/package.json +++ b/package.json @@ -13,7 +13,7 @@ "link": "npm install && gulp src && npm link" }, "dependencies": { - "angular2": "^2.0.0-beta.0", + "angular2": "2.0.0-beta.0", "colors": "^1.1.2", "es6-promise": "^3.0.2", "es6-shim": "0.33.6",