Skip to content

Commit 418f22a

Browse files
NathanWalkerNathanWalker
committed
chore: cleanup
1 parent 3c3d88e commit 418f22a

13 files changed

+123
-74
lines changed

‎e2e/animation-examples/app/main.ts

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,16 @@
1-
import { platformNativeScriptDynamic, NativeScriptDebug } from "@nativescript/angular";
2-
import { Trace, GridLayout, GridUnitType, ItemSpec, VerticalAlignment } from "@nativescript/core";
1+
import { platformNativeScriptDynamic, NativeScriptDebug, AppLaunchView } from "@nativescript/angular";
2+
import { Trace, GridLayout, GridUnitType, ItemSpec, Application } from "@nativescript/core";
33

44
import { AppModule } from "./app.module";
55

66
Trace.setCategories(NativeScriptDebug.animationsTraceCategory);
77
Trace.enable();
88

9-
class LaunchAnimation extends GridLayout {
9+
class LaunchAnimation extends GridLayout implements AppLaunchView {
1010
circle: GridLayout;
1111
animatedContainer: GridLayout;
1212
finished = false;
13+
resolve: () => void;
1314

1415
constructor() {
1516
super();
@@ -70,7 +71,10 @@ class LaunchAnimation extends GridLayout {
7071
}
7172

7273
cleanup() {
73-
this.finished = true;
74+
return new Promise(resolve => {
75+
this.resolve = resolve;
76+
this.finished = true;
77+
})
7478
}
7579

7680
fadeOut() {
@@ -80,9 +84,13 @@ class LaunchAnimation extends GridLayout {
8084
duration: 400,
8185
})
8286
.then(() => {
83-
this._removeView(this.animatedContainer);
87+
// done with animation, can safely remove to reveal bootstrapped app
88+
(<any>this).removeChild(this.animatedContainer);
8489
this.animatedContainer = null;
8590
this.circle = null;
91+
if (this.resolve) {
92+
this.resolve();
93+
}
8694
});
8795
}
8896
}

‎nativescript-angular/app-host-view.ts

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,14 @@
1-
import { ContentView, View, ProxyViewContainer, GridLayout } from '@nativescript/core';
1+
import { ContentView, View, ProxyViewContainer, GridLayout, Color } from '@nativescript/core';
22

33
export class AppHostView extends ContentView {
44
private _ngAppRoot: View;
55
private _content: View;
66

7+
constructor(backgroundColor: Color) {
8+
super();
9+
this.backgroundColor = backgroundColor;
10+
}
11+
712
get ngAppRoot(): View {
813
return this._ngAppRoot;
914
}
@@ -31,6 +36,7 @@ export class AppHostView extends ContentView {
3136

3237
if (this._content instanceof ProxyViewContainer) {
3338
const grid = new GridLayout();
39+
grid.backgroundColor = this.backgroundColor;
3440
grid.addChild(this._content);
3541
this.ngAppRoot = grid;
3642
}

‎nativescript-angular/directives/platform-filters.ts

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,14 @@
11
import { Component, Inject } from '@angular/core';
2-
import { IDevice, platformNames } from '@nativescript/core';
3-
import { DEVICE } from '../platform-providers';
2+
import { isIOS, isAndroid } from '@nativescript/core';
43

54
@Component({
65
selector: 'android',
76
template: `<ng-content *ngIf="show"></ng-content>`,
87
})
98
export class AndroidFilterComponent {
109
public show: boolean;
11-
constructor(@Inject(DEVICE) device: IDevice) {
12-
this.show = device.os === platformNames.android;
10+
constructor() {
11+
this.show = isAndroid;
1312
}
1413
}
1514

@@ -19,7 +18,7 @@ export class AndroidFilterComponent {
1918
})
2019
export class IosFilterComponent {
2120
public show: boolean;
22-
constructor(@Inject(DEVICE) device: IDevice) {
23-
this.show = device.os === platformNames.ios;
21+
constructor() {
22+
this.show = isIOS;
2423
}
2524
}

‎nativescript-angular/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@nativescript/angular",
3-
"version": "10.0.0-rc.5",
3+
"version": "10.0.0-rc.6",
44
"description": "An Angular renderer that lets you build mobile apps with NativeScript.",
55
"homepage": "https://www.nativescript.org/",
66
"bugs": "https://github.com/NativeScript/nativescript-angular/issues",

‎nativescript-angular/platform-common.ts

Lines changed: 57 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Application, TextView, Color, View, Frame, GridLayout, LaunchEventData, ApplicationEventData, profile, profilingUptime } from '@nativescript/core';
1+
import { Application, TextView, Color, View, Frame, GridLayout, LaunchEventData, ApplicationEventData, profile, profilingUptime, Page, LayoutBase } from '@nativescript/core';
22
// import './dom-adapter';
33
// import 'nativescript-intl';
44

@@ -7,6 +7,7 @@ import { DOCUMENT } from '@angular/common';
77

88
import { NativeScriptDebug } from './trace';
99
import { defaultPageFactoryProvider, setRootPage, PageFactory, PAGE_FACTORY, getRootPage } from './platform-providers';
10+
import { AppHostView } from './app-host-view';
1011

1112
export const onBeforeLivesync = new EventEmitter<NgModuleRef<any>>();
1213
export const onAfterLivesync = new EventEmitter<{
@@ -43,9 +44,12 @@ export interface HmrOptions {
4344
}
4445
// tslint:enable:max-line-length
4546

46-
export interface AppLaunchView extends View {
47+
export interface AppLaunchView extends LayoutBase {
48+
// called when the animation is to begin
4749
startAnimation?: () => void;
48-
cleanup?: () => void;
50+
// called when bootstrap is complete and cleanup can begin
51+
// should resolve when animation is completely finished
52+
cleanup?: () => Promise<any>;
4953
}
5054

5155
export interface AppOptions {
@@ -167,35 +171,51 @@ export class NativeScriptPlatformRef extends PlatformRef {
167171
NativeScriptDebug.bootstrapLog('Application launch event fired');
168172
}
169173

174+
let tempAppHostView: AppHostView;
175+
let usingCustomLaunchView = false;
170176
if (this.appOptions && this.appOptions.launchView) {
171177
launchView = this.appOptions.launchView;
178+
usingCustomLaunchView = true;
179+
rootContent = launchView;
180+
setRootPage(<any>rootContent);
172181
} else {
173-
launchView = new GridLayout();
174-
// Custom launch view color
175-
// Useful when using async app intializers to avoid flash of undesirable color
176-
launchView.backgroundColor = new Color(this.appOptions && this.appOptions.backgroundColor ? this.appOptions.backgroundColor : '#fff');
182+
// Create a temp page for root of the renderer
183+
tempAppHostView = new AppHostView(new Color(this.appOptions && this.appOptions.backgroundColor ? this.appOptions.backgroundColor : '#fff'));
184+
setRootPage(<any>tempAppHostView);
177185
}
178186

179-
setRootPage(<any>launchView);
180-
args.root = launchView;
181-
182-
const bootstrap = () => {
183-
this._bootstrapper().then(
187+
let bootstrapPromiseCompleted = false;
188+
const bootstrap = () => {
189+
this._bootstrapper().then(
184190
(moduleRef) => {
191+
bootstrapPromiseCompleted = true;
185192
if (NativeScriptDebug.isLogEnabled()) {
186193
NativeScriptDebug.bootstrapLog(`Angular bootstrap bootstrap done. uptime: ${profilingUptime()}`);
187-
NativeScriptDebug.bootstrapLog(`Angular bootstrap bootstrap done.`);
188194
}
189195

190-
rootContent = launchView;
191196
if (launchView && launchView.cleanup) {
192197
// cleanup any custom launch views
193-
launchView.cleanup();
198+
launchView.cleanup().then(() => {
199+
// swap launchView with actual booted view
200+
// todo: experiment in Angular 11 with a setup like this
201+
// Application.resetRootView({
202+
// create: () => {
203+
// // const { page, frame } = this.createFrameAndPage(false);
204+
// // frame._addView(launchView.getChildAt(0));
205+
// const rootView = launchView.getChildAt(0);
206+
// // launchView.parent._removeView(launchView);
207+
// return rootView;//launchView.getChildAt(0);//page;
208+
// },
209+
// });
210+
});
211+
} else {
212+
rootContent = tempAppHostView.content;
194213
}
195214

196215
lastBootstrappedModule = new WeakRef(moduleRef);
197216
},
198217
(err) => {
218+
bootstrapPromiseCompleted = true;
199219
const errorMessage = err.message + '\n\n' + err.stack;
200220
if (NativeScriptDebug.isLogEnabled()) {
201221
NativeScriptDebug.bootstrapLogError('ERROR BOOTSTRAPPING ANGULAR');
@@ -214,20 +234,28 @@ export class NativeScriptPlatformRef extends PlatformRef {
214234
if (NativeScriptDebug.isLogEnabled()) {
215235
NativeScriptDebug.bootstrapLog('bootstrapAction called, draining micro tasks queue finished! Root: ' + rootContent);
216236
}
217-
};
218-
219-
if (this.appOptions && this.appOptions.launchView) {
220-
// Since custom LaunchView could engage with animations, Launch Angular app on next tick
221-
setTimeout(() => {
222-
if (this.appOptions.launchView.startAnimation) {
223-
// ensure launch animation is executed after launchView added to view stack
224-
this.appOptions.launchView.startAnimation();
225-
}
226-
bootstrap();
227-
});
228-
} else {
229-
bootstrap();
230-
}
237+
};
238+
239+
if (usingCustomLaunchView) {
240+
// Since custom LaunchView could engage with animations, Launch Angular app on next tick
241+
setTimeout(() => {
242+
if (this.appOptions.launchView.startAnimation) {
243+
// ensure launch animation is executed after launchView added to view stack
244+
this.appOptions.launchView.startAnimation();
245+
}
246+
bootstrap();
247+
});
248+
} else {
249+
bootstrap();
250+
}
251+
if (!bootstrapPromiseCompleted && !usingCustomLaunchView) {
252+
const errorMessage = "Bootstrap promise didn't resolve";
253+
if (NativeScriptDebug.isLogEnabled()) {
254+
NativeScriptDebug.bootstrapLogError(errorMessage);
255+
}
256+
rootContent = this.createErrorUI(errorMessage);
257+
}
258+
args.root = rootContent;
231259
});
232260
const exitCallback = profile('@nativescript/angular/platform-common.exitCallback', (args: ApplicationEventData) => {
233261
const androidActivity = args.android;

‎nativescript-angular/platform-providers.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { InjectionToken, Injectable, OnDestroy } from '@angular/core';
33
import { Frame, View, Page, IDevice, Device } from '@nativescript/core';
44

55
export const APP_ROOT_VIEW = new InjectionToken<View>('NativeScriptAppRootView');
6-
export const DEVICE = new InjectionToken<IDevice>('NativeScriptPlatformDevice');
6+
export const DeviceToken = new InjectionToken<IDevice>('NativeScriptPlatformDeviceToken');
77

88
export type PageFactory = (options: PageFactoryOptions) => Page;
99
export interface PageFactoryOptions {
@@ -32,12 +32,12 @@ export function getRootPage(): Page {
3232
// Use an exported function to make the AoT compiler happy.
3333
export function getDefaultPage(): Page {
3434
const rootPage = getRootPage();
35-
// if (rootPage instanceof Page) {
36-
// return rootPage;
37-
// }
38-
if (rootPage) {
35+
if (rootPage instanceof Page) {
3936
return rootPage;
4037
}
38+
// if (rootPage) {
39+
// return rootPage;
40+
// }
4141

4242
const frame = Frame.topmost();
4343
if (frame && frame.currentPage) {
@@ -61,4 +61,4 @@ export function getDefaultDevice(): IDevice {
6161
return Device;
6262
}
6363

64-
export const defaultDeviceProvider = { provide: DEVICE, useFactory: getDefaultDevice };
64+
export const defaultDeviceProvider = { provide: DeviceToken, useFactory: getDefaultDevice };

‎nativescript-angular/renderer-emulated.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import { Inject, Injectable, RendererFactory2, Optional, NgZone, RendererType2 } from "@angular/core";
2-
import { View, getViewById, IDevice, Application, profile } from '@nativescript/core';
3-
import { APP_ROOT_VIEW, DEVICE, getRootPage } from './platform-providers';
1+
import { Inject, Injectable, RendererFactory2, Optional, NgZone, RendererType2 } from '@angular/core';
2+
import { View, getViewById, Application, profile } from '@nativescript/core';
3+
import { APP_ROOT_VIEW, getRootPage } from './platform-providers';
44
import { ViewUtil } from './view-util';
55
import { NgView, InvisibleNode } from './element-registry';
66
import { NativeScriptDebug } from './trace';
@@ -13,9 +13,9 @@ export const COMPONENT_VARIABLE = '%COMP%';
1313
export const HOST_ATTR = `_nghost-${COMPONENT_VARIABLE}`;
1414
export const CONTENT_ATTR = `_ngcontent-${COMPONENT_VARIABLE}`;
1515

16-
const replaceNgAttribute = function(input: string, componentId: string): string {
16+
const replaceNgAttribute = function (input: string, componentId: string): string {
1717
return input.replace(COMPONENT_REGEX, componentId);
18-
}
18+
};
1919

2020
const addScopedStyleToCss = profile(`"renderer".addScopedStyleToCss`, function addScopedStyleToCss(style: string): void {
2121
Application.addCss(style, true);
@@ -60,4 +60,4 @@ export class EmulatedRenderer extends NativeScriptRenderer {
6060
.map((s) => replaceNgAttribute(s, componentId))
6161
.forEach(addScopedStyleToCss);
6262
}
63-
}
63+
}

‎nativescript-angular/renderer-factory.ts

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import { Inject, Injectable, RendererFactory2, Optional, NgZone, RendererType2, ViewEncapsulation } from "@angular/core";
2-
import { View, getViewById, IDevice, Application, profile } from '@nativescript/core';
3-
import { APP_ROOT_VIEW, DEVICE, getRootPage } from './platform-providers';
1+
import { Inject, Injectable, RendererFactory2, Optional, NgZone, RendererType2, ViewEncapsulation } from '@angular/core';
2+
import { View, getViewById, Application, profile, Device } from '@nativescript/core';
3+
import { APP_ROOT_VIEW, getRootPage } from './platform-providers';
44
import { ViewUtil } from './view-util';
55
import { NgView, InvisibleNode } from './element-registry';
66
import { NativeScriptDebug } from './trace';
@@ -13,13 +13,13 @@ const addStyleToCss = profile('"renderer".addStyleToCss', function addStyleToCss
1313

1414
@Injectable()
1515
export class NativeScriptRendererFactory implements RendererFactory2 {
16-
private componentRenderers = new Map<string, NativeScriptRenderer>();
17-
private viewUtil: ViewUtil;
18-
private defaultRenderer: NativeScriptRenderer;
19-
private rootNgView: NgView;
16+
componentRenderers = new Map<string, NativeScriptRenderer>();
17+
viewUtil: ViewUtil;
18+
defaultRenderer: NativeScriptRenderer;
19+
rootNgView: NgView;
2020

21-
constructor(@Optional() @Inject(APP_ROOT_VIEW) rootView: View, @Inject(DEVICE) device: IDevice, private zone: NgZone) {
22-
this.viewUtil = new ViewUtil(device);
21+
constructor(@Optional() @Inject(APP_ROOT_VIEW) rootView: View, private zone: NgZone) {
22+
this.viewUtil = new ViewUtil(Device);
2323
this.setRootNgView(rootView);
2424
this.defaultRenderer = new NativeScriptRenderer(this.rootNgView, zone, this.viewUtil);
2525
}
@@ -68,4 +68,4 @@ export class NativeScriptRendererFactory implements RendererFactory2 {
6868
this.viewUtil.removeChild(this.rootNgView, this.rootNgView.firstChild);
6969
}
7070
}
71-
}
71+
}

‎nativescript-angular/renderer.ts

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
11
import { Inject, Injectable, Optional, NgZone, Renderer2, RendererFactory2, RendererType2, RendererStyleFlags2, ViewEncapsulation } from '@angular/core';
22

3-
import { View, getViewById, IDevice, Application, profile } from '@nativescript/core';
3+
import { View, getViewById, profile } from '@nativescript/core';
44

5-
import { APP_ROOT_VIEW, DEVICE, getRootPage } from './platform-providers';
65
import { ViewUtil } from './view-util';
76
import { NgView, InvisibleNode } from './element-registry';
87
import { NativeScriptDebug } from './trace';

0 commit comments

Comments
 (0)