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

demo(splitView): splitView demo

Browse Source
This commit is contained in:
Andrew
2015-04-13 07:47:41 -06:00
parent db08406d60
commit ff1f1984ec
6 changed files with 55 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
src/components/nav-viewport/nav-viewport.js
View File

@ -1,17 +1,37 @@
import {Component, Template, For, NgElement} from 'angular2/angular2'
import {Component, Template, For, NgElement, bind} from 'angular2/angular2'
import {ComponentConfig} from 'ionic2/config/component-config'
import {NavPane} from 'ionic2/components/nav-pane/nav-pane'
import * as util from 'ionic2/util'
class NavStack {
constructor(navViewport: NavViewport) {
this._viewport = navViewport
}
push(Class, opts = {}) {
return this._viewport.push(Class, opts)
}
pop(opts = {}) {
return this._viewport.pop(Class, opts)
}
popTo(index, opts = {}) {
return this._viewport.popTo(index, opts)
}
size() {
return this._viewport._stack.length
}
}
@Component({
selector: 'ion-nav-viewport',
bind: {
initial: 'initial'
}
},
services: [
NavStack
]
})
@Template({
inline: `
<header class="toolbar-container">
<!-- COLLECTION OF TOOLBARS FOR EACH OF ITS VIEWS WITHIN THIS NAV-VIEWPORT -->
<!-- TOOLBARS FOR EACH VIEW SHOULD HAVE THE SAME CONTEXT AS ITS VIEW -->
@ -20,9 +40,8 @@ import * as util from 'ionic2/util'
<div class="nav-pane-container">
<!-- COLLECTION OF PANES WITHIN THIS NAV-VIEWPORT, EACH PANE AS ONE VIEW -->
<!-- EACH VIEW HAS A TOOLBAR WHICH NEEDS TO HAVE THE SAME CONTEXT -->
<section class="nav-pane" *for="#item of getRawNavStack()" [item]="item"></section>
<section class="nav-pane" *for="#item of _ngForLoopArray" [item]="item"></section>
</div>
`,
directives: [NavPane, For]
})
@ -32,7 +51,8 @@ export class NavViewport {
) {
this.domElement = element.domElement
this.domElement.classList.add('nav-viewport')
// stack is our sane stack of items. This is synchronous and says an item
// this is our sane stack of items. This is synchronous and says an item
// is removed even if it's still animating out.
this._stack = []
@ -41,10 +61,6 @@ export class NavViewport {
this._ngForLoopArray = []
}
getRawNavStack() {
return this._ngForLoopArray
}
containsClass(Class) {
for (let i = 0; i < this._stack.length; i++) {
if (this._stack[i].Class === Class) {