nav and modal docs wip

This commit is contained in:
Tim Lancina
2015-08-31 08:41:48 -05:00
parent f44dd93ed4
commit c0c4782fd2
7 changed files with 115 additions and 9 deletions

View File

@ -4,10 +4,18 @@ import {Overlay} from '../overlay/overlay';
import {Animation} from '../../animations/animation'; import {Animation} from '../../animations/animation';
import * as util from 'ionic/util'; import * as util from 'ionic/util';
/**
* TODO
*/
@Injectable() @Injectable()
export class Modal extends Overlay { export class Modal extends Overlay {
/**
* TODO
* @param {Type} ComponentType TODO
* @param {Object} [opts={}] TODO
* @returns {TODO} TODO
*/
open(ComponentType: Type, opts={}) { open(ComponentType: Type, opts={}) {
let defaults = { let defaults = {
enterAnimation: 'modal-slide-in', enterAnimation: 'modal-slide-in',
@ -17,6 +25,11 @@ export class Modal extends Overlay {
return this.create(OVERLAY_TYPE, ComponentType, util.extend(defaults, opts)); return this.create(OVERLAY_TYPE, ComponentType, util.extend(defaults, opts));
} }
/**
* TODO
* @param {TODO} handle TODO
* @returns {TODO} TODO
*/
get(handle) { get(handle) {
if (handle) { if (handle) {
return this.getByHandle(handle, OVERLAY_TYPE); return this.getByHandle(handle, OVERLAY_TYPE);

View File

@ -1,14 +1,21 @@
import {extend} from '../../util/util'; import {extend} from '../../util/util';
/**
* TODO
*/
export class NavController { export class NavController {
/**
* TODO
* @param {TODO} nav TODO
*/
constructor(nav) { constructor(nav) {
this._nav = nav; this._nav = nav;
} }
/** /**
* Set the history stack to match the list of component items. * Set the history stack to match the list of component items.
* @param {TODO} items TODO
* @return {TODO} TODO
*/ */
setItems(items) { setItems(items) {
return this._nav.setItems(items); return this._nav.setItems(items);
@ -16,13 +23,15 @@ export class NavController {
/** /**
* Clear the history stack. * Clear the history stack.
* @return {TODO} TODO
*/ */
clear() { clear() {
return this._nav.clear(); return this._nav.clear();
} }
/** /**
* Push an ew component onto the history stack. * Push a new component onto the history stack.
* @return {TODO} TODO
*/ */
push() { push() {
return this._nav.push.apply(this._nav, arguments); return this._nav.push.apply(this._nav, arguments);
@ -30,16 +39,29 @@ export class NavController {
/** /**
* Pop the top most (visible) component off the history stack. * Pop the top most (visible) component off the history stack.
* @return {TODO} TODO
*/ */
pop() { pop() {
return this._nav.pop.apply(this._nav, arguments); return this._nav.pop.apply(this._nav, arguments);
} }
} }
/**
* TODO
*/
export class NavParams { export class NavParams {
/**
* TODO
* @param {TODO} data TODO
*/
constructor(data) { constructor(data) {
this.data = data || {}; this.data = data || {};
} }
/**
* TODO
* @param {TODO} param TODO
*/
get(param) { get(param) {
return this.data[param]; return this.data[param];
} }

View File

@ -1,7 +1,9 @@
import {Directive} from 'angular2/angular2'; import {Directive} from 'angular2/angular2';
import {NavController} from './nav-controller'; import {NavController} from './nav-controller';
/**
* TODO
*/
@Directive({ @Directive({
selector: '[nav-push]', selector: '[nav-push]',
properties: [ properties: [
@ -14,15 +16,22 @@ import {NavController} from './nav-controller';
} }
}) })
export class NavPush { export class NavPush {
/**
* TODO
* @param {NavController} nav TODO
*/
constructor(nav: NavController) { constructor(nav: NavController) {
this.nav = nav; this.nav = nav;
} }
onClick(event) { onClick(event) {
this.nav.push(this.navPush, this.pushData); this.nav.push(this.navPush, this.pushData);
} }
} }
/**
* TODO
*/
@Directive({ @Directive({
selector: '[nav-pop]', selector: '[nav-pop]',
host: { host: {
@ -31,6 +40,10 @@ export class NavPush {
} }
}) })
export class NavPop { export class NavPop {
/**
* TODO
* @param {NavController} nav TODO
*/
constructor(nav: NavController) { constructor(nav: NavController) {
this.nav = nav; this.nav = nav;
} }

View File

@ -8,12 +8,22 @@ import {
import {Nav} from './nav'; import {Nav} from './nav';
/**
* TODO
*/
@Directive({ @Directive({
selector: 'ion-nav' selector: 'ion-nav'
}) })
export class NavRouter extends RouterOutlet { 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, constructor(_elementRef: ElementRef, _loader: DynamicComponentLoader,
_parentRouter: Router, @Attribute('name') nameAttr: string, _parentRouter: Router, @Attribute('name') nameAttr: string,
nav: Nav) { nav: Nav) {
@ -28,6 +38,11 @@ export class NavRouter extends RouterOutlet {
nav.registerRouter(this); nav.registerRouter(this);
} }
/**
* @private
* TODO
* @param {ComponentInstruction} instruction TODO
*/
_activate(instruction: ComponentInstruction): Promise<any> { _activate(instruction: ComponentInstruction): Promise<any> {
var previousInstruction = this._currentInstruction; var previousInstruction = this._currentInstruction;
this._currentInstruction = instruction; this._currentInstruction = instruction;
@ -38,6 +53,11 @@ export class NavRouter extends RouterOutlet {
this.nav.push(componentType, instruction.params); this.nav.push(componentType, instruction.params);
} }
/**
* TODO
* @param {TODO} type TODO
* @param {TODO} viewItem TODO
*/
stateChange(type, viewItem) { stateChange(type, viewItem) {
// stateChange is called by Ionic's ViewController // stateChange is called by Ionic's ViewController
// type could be "push" or "pop" // type could be "push" or "pop"
@ -62,6 +82,11 @@ export class NavRouter extends RouterOutlet {
} }
} }
/**
* TODO
* @param {TODO} componentType TODO
* @returns {TODO} TODO
*/
getPathRecognizerByComponent(componentType) { getPathRecognizerByComponent(componentType) {
// given a componentType, figure out the best PathRecognizer to use // given a componentType, figure out the best PathRecognizer to use
let rules = this._parentRouter.registry._rules; let rules = this._parentRouter.registry._rules;

View File

@ -3,7 +3,9 @@ import {Directive, View, ElementRef, Host, Optional, forwardRef, Injector, NgZon
import {IonicComponent} from '../../config/annotations'; import {IonicComponent} from '../../config/annotations';
import {ViewController} from '../view/view-controller'; import {ViewController} from '../view/view-controller';
/**
* TODO
*/
@IonicComponent({ @IonicComponent({
selector: 'ion-nav', selector: 'ion-nav',
properties: [ properties: [
@ -19,6 +21,13 @@ import {ViewController} from '../view/view-controller';
}) })
export class Nav extends ViewController { export class Nav extends ViewController {
/**
* TODO
* @param {ViewController} hostViewCtrl TODO
* @param {Injector} injector TODO
* @param {ElementRef} elementRef TODO
* @param {NgZone} zone TODO
*/
constructor( constructor(
@Optional() hostViewCtrl: ViewController, @Optional() hostViewCtrl: ViewController,
injector: Injector, injector: Injector,
@ -28,6 +37,9 @@ export class Nav extends ViewController {
super(hostViewCtrl, injector, elementRef, zone); super(hostViewCtrl, injector, elementRef, zone);
} }
/**
* TODO
*/
onIonInit() { onIonInit() {
if (this.root) { if (this.root) {

View File

@ -7,8 +7,14 @@ import {SwipeHandle} from './swipe-handle';
import {IonicComponent} from '../../config/annotations'; import {IonicComponent} from '../../config/annotations';
import {PaneAnchor, PaneContentAnchor, NavBarContainer} from './anchors'; import {PaneAnchor, PaneContentAnchor, NavBarContainer} from './anchors';
/**
* TODO
*/
export class PaneController { export class PaneController {
/**
* TODO
* @param {ViewController} viewCtrl TODO
*/
constructor(viewCtrl: ViewController) { constructor(viewCtrl: ViewController) {
this.panes = []; this.panes = [];
this.viewCtrl = viewCtrl; this.viewCtrl = viewCtrl;
@ -18,6 +24,11 @@ export class PaneController {
]); ]);
} }
/**
* TODO
* @param {TODO} nav TODO
* @param {Function} nav TODO
*/
get(itemStructure, callback) { get(itemStructure, callback) {
// this gets or creates the Pane which similar nav items live in // this gets or creates the Pane which similar nav items live in
// Nav items with just a navbar/content would all use the same Pane // Nav items with just a navbar/content would all use the same Pane

View File

@ -5,6 +5,9 @@ import {Pane} from './pane';
import {Gesture} from 'ionic/gestures/gesture'; import {Gesture} from 'ionic/gestures/gesture';
/**
* TODO
*/
@Directive({ @Directive({
selector: '.swipe-handle', selector: '.swipe-handle',
host: { host: {
@ -12,6 +15,13 @@ import {Gesture} from 'ionic/gestures/gesture';
} }
}) })
export class SwipeHandle { export class SwipeHandle {
/**
* TODO
* @param {ViewController=} viewCtrl TODO
* @param {Pane} pane TODO
* @param {ElementRef} elementRef TODO
* @param {NgZone} ngZone TODO
*/
constructor( constructor(
@Optional() @Inject(forwardRef(() => ViewController)) viewCtrl: ViewController, @Optional() @Inject(forwardRef(() => ViewController)) viewCtrl: ViewController,
@Host() @Inject(forwardRef(() => Pane)) pane: Pane, @Host() @Inject(forwardRef(() => Pane)) pane: Pane,