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

Updated nav test for changes

Browse Source
This commit is contained in:
Max Lynch
2015-06-18 16:39:12 -05:00
parent 2b2622b63b
commit 6edbbbd0f5
1 changed files with 238 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

255
ionic/components/nav/test/basic/index.js
View File

@ -1,30 +1,251 @@
import {bootstrap, onInit, QueryList} from 'angular2/angular2'
import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations';
import {bootstrap, QueryList} from 'angular2/angular2'
import {Component, Directive, onInit} from 'angular2/src/core/annotations_impl/annotations';
import {View} from 'angular2/src/core/annotations_impl/view';
import {Nav} from 'ionic/components/nav/nav';
import {FirstPage} from './pages/first-page';
import {Router} from 'ionic/routing/router';
import {Nav, NavPush, NavPop, NavParams, Routable, Router, NavController, NavbarTemplate, Navbar, NavPush, Content} from 'ionic/ionic';
@Component({
selector: 'ion-app',
selector: 'ion-view',
lifecycle: [onInit]
})
@View({
template: `
<ion-nav #nav [initial]="initial"></ion-nav>
`,
directives: [Nav]
template: '' +
'<ion-navbar *navbar>' +
'<ion-title>First Page: {{ val }}</ion-title>' +
'<ion-nav-items primary>' +
'<button class="button">P1</button>' +
'</ion-nav-items>' +
'<ion-nav-items secondary>' +
'<button class="button">S1</button>' +
'<button class="button">S2</button>' +
'</ion-nav-items>' +
'</ion-navbar>' +
'<ion-content class="padding">' +
'<p>First Page: {{ val }}</p>' +
'<p><button class="button" (click)="push()">Push (Go to 2nd)</button></p>' +
'<p><button class="button" [push-data]="pushData" [nav-push]="pushPage">Push w/ nav-push (Go to 2nd)</button></p>' +
'<icon class="ion-ios-arrow-back"></icon>' +
'<f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>' +
'<f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>' +
'</ion-content>',
directives: [NavbarTemplate, Navbar, NavPush, Content]
})
class IonicApp {
constructor() {
console.log('IonicApp Start');
export default class FirstPage {
constructor(
nav: NavController
) {
this.initial = FirstPage;
// TODO: Shouldn't have to do this
Router.setNavController(nav);
this.nav = nav;
this.val = Math.round(Math.random() * 8999) + 1000;
this.pushPage = SecondPage;
this.pushData = {
id: 420
}
}
onInit() {
}
viewLoaded() {
this.router = FirstPage.router.invoke(this);
console.log('viewLoaded first page');
}
viewWillEnter() {
console.log('viewWillEnter first page');
}
viewDidEnter() {
console.log('viewDidEnter first page');
}
viewWillLeave() {
console.log('viewWillLeave first page');
}
viewDidLeave() {
console.log('viewDidLeave first page');
}
viewWillCache() {
console.log('viewWillCache first page');
}
viewDidCache() {
console.log('viewDidCache first page');
}
viewWillUnload() {
console.log('viewWillUnload first page');
}
viewDidUnload() {
console.log('viewDidUnload first page');
}
push() {
this.nav.push(SecondPage, { id: 8675309, myData: [1,2,3,4] }, { animation: 'ios' });
}
}
export function main() {
bootstrap(IonicApp);
new Routable(FirstPage, {
url: '/first-page'
})
@Component({selector: 'ion-view'})
@View({
template: `
<ion-navbar *navbar><ion-title>Second Page Header</ion-title></ion-navbar>
<ion-content class="padding">
<p>
<button class="button" (click)="pop()">Pop (Go back to 1st)</button>
</p>
<p>
<button class="button" nav-pop>Pop with NavPop (Go back to 1st)</button>
</p>
<p>
<button class="button" (click)="push()">Push (Go to 3rd)</button>
</p>
<p>
Random: {{ val }}
</p>
<div class="green"><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f></div>
</ion-content>
`,
directives: [NavbarTemplate, NavPop, Navbar, Content]
})
export class SecondPage {
constructor(
nav: NavController,
params: NavParams
) {
// TODO: Shouldn't have to do this
Router.setNavController(nav);
this.nav = nav;
this.params = params;
this.val = Math.round(Math.random() * 8999) + 1000;
console.log('Second page params:', params);
}
pop() {
this.nav.pop();
}
push() {
this.nav.push(ThirdPage);
}
viewLoaded() {
console.log('viewLoaded second page');
this.router = SecondPage.router.invoke(this);
}
viewWillEnter() {
console.log('viewWillEnter second page');
}
viewDidEnter() {
console.log('viewDidEnter second page');
}
viewWillLeave() {
console.log('viewWillLeave second page');
}
viewDidLeave() {
console.log('viewDidLeave second page');
}
viewWillCache() {
console.log('viewWillCache second page');
}
viewDidCache() {
console.log('viewDidCache second page');
}
viewWillUnload() {
console.log('viewWillUnload second page');
}
viewDidUnload() {
console.log('viewDidUnload second page');
}
}
new Routable(SecondPage, {
url: '/second-page'
})
@Component({selector: 'ion-view'})
@View({
template: `
<ion-navbar *navbar><ion-title>Third Page Header</ion-title></ion-navbar>
<ion-content class="padding">
<p>
<button class="button" (click)="pop()">Pop (Go back to 2nd)</button>
</p>
<div class="yellow"><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f></div>
</ion-content>
`,
directives: [NavbarTemplate, Navbar, Content]
})
export class ThirdPage {
constructor(
nav: NavController
) {
this.nav = nav
}
pop() {
this.nav.pop()
}
viewLoaded() {
console.log('viewLoaded third page');
}
viewWillEnter() {
console.log('viewWillEnter third page');
}
viewDidEnter() {
console.log('viewDidEnter third page');
}
viewWillLeave() {
console.log('viewWillLeave third page');
}
viewDidLeave() {
console.log('viewDidLeave third page');
}
viewWillCache() {
console.log('viewWillCache third page');
}
viewDidCache() {
console.log('viewDidCache third page');
}
viewWillUnload() {
console.log('viewWillUnload third page');
}
viewDidUnload() {
console.log('viewDidUnload third page');
}
}