Skip to content

Action bar directives #104

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Mar 10, 2016
Merged

Action bar directives #104

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
fbe053d
Action bar directives
vakrilov Feb 24, 2016
20f3eee
Cleanup and fix tests
vakrilov Mar 10, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
89 changes: 89 additions & 0 deletions ng-sample/.vscode/launch.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
{
"version": "0.2.0",
"configurations": [
{
"name": "Launch on iOS Device",
"type": "nativescript",
"platform": "ios",
"request": "launch",
"appRoot": ".",
"sourceMaps": true,
"diagnosticLogging": true,
"stopOnEntry": true,
"emulator": false
},
{
"name": "Attach on iOS Device",
"type": "nativescript",
"platform": "ios",
"request": "attach",
"appRoot": ".",
"sourceMaps": true,
"diagnosticLogging": true,
"emulator": false
},
{
"name": "Launch on iOS Emulator",
"type": "nativescript",
"platform": "ios",
"request": "launch",
"appRoot": ".",
"sourceMaps": true,
"diagnosticLogging": true,
"stopOnEntry": true,
"emulator": true
},
{
"name": "Attach on iOS Emulator",
"type": "nativescript",
"platform": "ios",
"request": "attach",
"appRoot": ".",
"sourceMaps": true,
"diagnosticLogging": true,
"emulator": true
},
{
"name": "Launch on Android Device",
"type": "nativescript",
"platform": "android",
"request": "launch",
"appRoot": ".",
"sourceMaps": true,
"diagnosticLogging": true,
"stopOnEntry": true,
"emulator": false
},
{
"name": "Launch on Android Emulator",
"type": "nativescript",
"platform": "android",
"request": "launch",
"appRoot": ".",
"sourceMaps": true,
"diagnosticLogging": true,
"stopOnEntry": true,
"emulator": true
},
{
"name": "Attach on Android Device",
"type": "nativescript",
"platform": "android",
"request": "attach",
"appRoot": ".",
"sourceMaps": false,
"diagnosticLogging": true,
"emulator": false
},
{
"name": "Attach on Android Emulator",
"type": "nativescript",
"platform": "android",
"request": "attach",
"appRoot": ".",
"sourceMaps": false,
"diagnosticLogging": true,
"emulator": true
}
]
}
11 changes: 11 additions & 0 deletions ng-sample/.vscode/settings.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
// Place your settings in this file to overwrite default and user settings.
{
"files.exclude": {
"**/*.js": {
"when": "$(basename).ts"
},
"**/*.js.map": {},
"platforms/**": {},
"hooks/**": {}
}
}
19 changes: 13 additions & 6 deletions ng-sample/app/app.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,9 @@ import { NS_ROUTER_PROVIDERS, routerTraceCategory } from "./nativescript-angular
import { rendererTraceCategory } from "./nativescript-angular/renderer";

import trace = require("trace");
trace.setCategories(routerTraceCategory + ", " + rendererTraceCategory);
// trace.setCategories(routerTraceCategory + ", " + rendererTraceCategory);
// trace.setCategories(rendererTraceCategory);
// trace.setCategories(routerTraceCategory);
trace.enable();

import {RendererTest} from './examples/renderer-test';
Expand All @@ -20,11 +22,16 @@ import {ListTest} from './examples/list/list-test';
import {ListTestAsync} from "./examples/list/list-test-async";
import {ImageTest} from "./examples/image/image-test";
import {NavigationTest} from "./examples/navigation/navigation-test";
import {ActionBarTest} from "./examples/action-bar/action-bar-test";


//nativeScriptBootstrap(RendererTest);
//nativeScriptBootstrap(Benchmark);
//nativeScriptBootstrap(ListTest);
nativeScriptBootstrap(ListTestAsync);
// nativeScriptBootstrap(RendererTest);
// nativeScriptBootstrap(Benchmark);
// nativeScriptBootstrap(ListTest);
// nativeScriptBootstrap(ListTestAsync);
// nativeScriptBootstrap(Benchmark);
// nativeScriptBootstrap(ListTest);
// nativeScriptBootstrap(ListTestAsync);
// nativeScriptBootstrap(ImageTest);
//nativeScriptBootstrap(NavigationTest, [NS_ROUTER_PROVIDERS]);
// nativeScriptBootstrap(NavigationTest, [NS_ROUTER_PROVIDERS]);
nativeScriptBootstrap(ActionBarTest, [NS_ROUTER_PROVIDERS], { startPageActionBarHidden: false });
92 changes: 92 additions & 0 deletions ng-sample/app/examples/action-bar/action-bar-test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@
import {Component} from 'angular2/core';
import {RouteConfig} from 'angular2/router';
import { Page} from "ui/page";
import {NS_ROUTER_DIRECTIVES, NS_ROUTER_PROVIDERS} from "../../nativescript-angular/router/ns-router";
import {NS_DIRECTIVES} from "../../nativescript-angular/directives/ns-directives";

@Component({
selector: "first",
directives: [NS_ROUTER_DIRECTIVES, NS_DIRECTIVES],
template: `
<ActionBar title="Custom Title">
<ActionItem *ngIf="show" text="action" (tap)="onTap()"></ActionItem>
</ActionBar>

<StackLayout verticalAlignment="center">
<Button [text]="show ? 'hide' : 'show'" (tap)="show = !show"></Button>
<Button text="Start" [nsRouterLink]="['/Second']"></Button>
</StackLayout>
`,
})
class FirstComponent {
public show: boolean = true;
onTap() {
console.log("FirstComponent.Tapped!");
}
}


@Component({
selector: "nested-componenet",
directives: [NS_ROUTER_DIRECTIVES, NS_DIRECTIVES],
template: `

<ActionBarExtension>
<ActionItem *ngIf="show" (tap)="onTap()">
<Button text="CUSTOM"></Button>
</ActionItem>
</ActionBarExtension>

<StackLayout verticalAlignment="center">
<Button [text]="show ? 'hide' : 'show'" (tap)="show = !show"></Button>
</StackLayout>
`,
})
class NestedComponent {
public show: boolean = true;

onTap() {
console.log("NestedComponent.Tapped!");
}
}

@Component({
selector: "second",
directives: [NS_ROUTER_DIRECTIVES, NS_DIRECTIVES, NestedComponent],
template: `
<ActionBar title="Second Page Title">
<NavigationButton text="First" android.systemIcon="ic_menu_back"></NavigationButton>
<ActionItem text="TapMe" (tap)="onTap()"></ActionItem>
</ActionBar>

<StackLayout verticalAlignment="center">
<Label text="Second Page is Here" class="title"></Label>
<nested-componenet></nested-componenet>
</StackLayout>
`,
})
class SecondComponent {
onTap() {
console.log("SecondComponent.Tapped!");
}
}



@Component({
selector: 'action-bar-test',
directives: [NS_ROUTER_DIRECTIVES],
template: `
<GridLayout>
<page-router-outlet></page-router-outlet>
</GridLayout>
`
})
@RouteConfig([
{ path: '/', component: FirstComponent, as: 'First' },
{ path: '/second', component: SecondComponent, as: 'Second' },
])
export class ActionBarTest {
}


5 changes: 5 additions & 0 deletions src/nativescript-angular/application.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,10 @@
import { Type, ApplicationRef, Provider } from 'angular2/core';

export interface AppOptions {
cssFile?: string;
startPageActionBarHidden?: boolean;
}

export type BindingArray = Array<Type | Provider | Array<any>>;
export function bootstrap(appComponentType: any, componentInjectableBindings?: BindingArray): Promise<ApplicationRef>;
export function nativeScriptBootstrap(appComponentType: any, customProviders?: BindingArray, appOptions?: any): void;
22 changes: 15 additions & 7 deletions src/nativescript-angular/application.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,8 +43,13 @@ import {defaultPageProvider} from "./platform-providers";

let _platform = null;

export interface AppOptions {
cssFile?: string;
startPageActionBarHidden?: boolean;
}

export function bootstrap(appComponentType: any,
customProviders: ProviderArray = null) : Promise<ComponentRef> {
customProviders: ProviderArray = null): Promise<ComponentRef> {
NativeScriptDomAdapter.makeCurrent();

let platformProviders: ProviderArray = [
Expand Down Expand Up @@ -72,21 +77,24 @@ export function bootstrap(appComponentType: any,
if (isPresent(customProviders)) {
appProviders.push(customProviders);
}

if (!_platform) {
_platform = platform(platformProviders);
}
return _platform.application(appProviders).bootstrap(appComponentType);
}

export function nativeScriptBootstrap(appComponentType: any, customProviders?: ProviderArray, appOptions?: any) {
export function nativeScriptBootstrap(appComponentType: any, customProviders?: ProviderArray, appOptions?: AppOptions) {
if (appOptions && appOptions.cssFile) {
application.cssFile = appOptions.cssFile;
}
application.start({
create: (): Page => {
let page = new Page();

if (appOptions) {
page.actionBarHidden = appOptions.startPageActionBarHidden;
}

let onLoadedHandler = function(args) {
page.off('loaded', onLoadedHandler);
//profiling.stop('application-start');
Expand All @@ -97,7 +105,7 @@ export function nativeScriptBootstrap(appComponentType: any, customProviders?: P
bootstrap(appComponentType, customProviders).then((appRef) => {
//profiling.stop('ng-bootstrap');
console.log('ANGULAR BOOTSTRAP DONE.');
}, (err) =>{
}, (err) => {
console.log('ERROR BOOTSTRAPPING ANGULAR');
let errorMessage = err.message + "\n\n" + err.stack;
console.log(errorMessage);
Expand All @@ -107,9 +115,9 @@ export function nativeScriptBootstrap(appComponentType: any, customProviders?: P
page.content = view;
});
}

page.on('loaded', onLoadedHandler);

return page;
}
});
Expand Down
Loading