Merge pull request NativeScript#557 from NativeScript/cssFile-option

Respect AppOptions cssFile property

Author: Alexander Vakrilov

nativescript-angular/platform-common.ts

@@ -6,16 +6,16 @@ import "./polyfills/array";
 import "./polyfills/console";
 
 import {
-  Type,
-  Injector,
-  CompilerOptions,
-  PlatformRef,
-  NgModuleFactory,
-  NgModuleRef,
-  EventEmitter,
-  Provider,
-  Sanitizer,
-  OpaqueToken,
+    Type,
+    Injector,
+    CompilerOptions,
+    PlatformRef,
+    NgModuleFactory,
+    NgModuleRef,
+    EventEmitter,
+    Provider,
+    Sanitizer,
+    OpaqueToken,
 } from "@angular/core";
 
 // Work around a TS bug requiring an import of OpaqueToken without using it
@@ -42,158 +42,164 @@ let lastBootstrappedModule: WeakRef<NgModuleRef<any>>;
 type BootstrapperAction = () => Promise<NgModuleRef<any>>;
 
 export interface AppOptions {
-  bootInExistingPage: boolean;
-  cssFile?: string;
-  startPageActionBarHidden?: boolean;
+    bootInExistingPage?: boolean;
+    cssFile?: string;
+    startPageActionBarHidden?: boolean;
 }
 
 export type PlatformFactory = (extraProviders?: Provider[]) => PlatformRef;
 
 export class NativeScriptSanitizer extends Sanitizer {
-  sanitize(_context: any, value: string): string {
-    return value;
-  }
+    sanitize(_context: any, value: string): string {
+        return value;
+    }
 }
 
 export const COMMON_PROVIDERS = [
-  defaultPageFactoryProvider,
-  { provide: Sanitizer, useClass: NativeScriptSanitizer },
+    defaultPageFactoryProvider,
+    { provide: Sanitizer, useClass: NativeScriptSanitizer },
 ];
 
 export class NativeScriptPlatformRef extends PlatformRef {
-  private _bootstrapper: BootstrapperAction;
+    private _bootstrapper: BootstrapperAction;
 
-  constructor(private platform: PlatformRef, private appOptions?: AppOptions) {
-    super();
-  }
+    constructor(private platform: PlatformRef, private appOptions?: AppOptions) {
+        super();
+    }
 
-  bootstrapModuleFactory<M>(moduleFactory: NgModuleFactory<M>): Promise<NgModuleRef<M>> {
-    this._bootstrapper = () => this.platform.bootstrapModuleFactory(moduleFactory);
+    bootstrapModuleFactory<M>(moduleFactory: NgModuleFactory<M>): Promise<NgModuleRef<M>> {
+        this._bootstrapper = () => this.platform.bootstrapModuleFactory(moduleFactory);
 
-    this.bootstrapApp();
+        this.bootstrapApp();
 
-    return null; // Make the compiler happy
-  }
+        return null; // Make the compiler happy
+    }
 
-  bootstrapModule<M>(
-      moduleType: Type<M>,
-      compilerOptions: CompilerOptions | CompilerOptions[] = []
-  ): Promise<NgModuleRef<M>> {
-    this._bootstrapper = () => this.platform.bootstrapModule(moduleType, compilerOptions);
+    bootstrapModule<M>(
+        moduleType: Type<M>,
+        compilerOptions: CompilerOptions | CompilerOptions[] = []
+    ): Promise<NgModuleRef<M>> {
+        this._bootstrapper = () => this.platform.bootstrapModule(moduleType, compilerOptions);
 
-    this.bootstrapApp();
+        this.bootstrapApp();
 
-    return null; // Make the compiler happy
-  }
+        return null; // Make the compiler happy
+    }
 
-  private bootstrapApp() {
-    global.__onLiveSyncCore = () => this.livesyncModule();
+    private bootstrapApp() {
+        global.__onLiveSyncCore = () => this.livesyncModule();
 
-    const mainPageEntry = this.createNavigationEntry(this._bootstrapper);
+        const mainPageEntry = this.createNavigationEntry(this._bootstrapper);
 
-    application.start(mainPageEntry);
-  }
+        if (this.appOptions && typeof this.appOptions.cssFile === "string") {
+            // TODO: All exported filed in ES6 modules should be read-only
+            // Change the case when tns-core-modules become ES6 compatible and there is a legal way to set cssFile
+            (<any>application).cssFile = this.appOptions.cssFile;
+        }
 
-  livesyncModule(): void {
-    rendererLog("ANGULAR LiveSync Started");
+        application.start(mainPageEntry);
+    }
 
-    onBeforeLivesync.next(lastBootstrappedModule ? lastBootstrappedModule.get() : null);
+    livesyncModule(): void {
+        rendererLog("ANGULAR LiveSync Started");
 
-    const mainPageEntry = this.createNavigationEntry(
-      this._bootstrapper,
-      compRef => onAfterLivesync.next(compRef),
-      error => onAfterLivesync.error(error),
-      true
-    );
-    mainPageEntry.animated = false;
-    mainPageEntry.clearHistory = true;
+        onBeforeLivesync.next(lastBootstrappedModule ? lastBootstrappedModule.get() : null);
 
-    const frame = topmost();
-    if (frame) {
-      if (frame.currentPage && frame.currentPage.modal) {
-        frame.currentPage.modal.closeModal();
-      }
-      frame.navigate(mainPageEntry);
-    }
-  }
-
-  onDestroy(callback: () => void): void {
-    this.platform.onDestroy(callback);
-  }
-
-  get injector(): Injector {
-    return this.platform.injector;
-  };
-
-  destroy(): void {
-    this.platform.destroy();
-  }
-
-  get destroyed(): boolean {
-    return this.platform.destroyed;
-  }
-
-  private createNavigationEntry(
-    bootstrapAction: BootstrapperAction,
-    resolve?: (comp: NgModuleRef<any>) => void,
-    reject?: (e: Error) => void,
-    isLivesync: boolean = false,
-    isReboot: boolean = false): NavigationEntry {
-
-    const pageFactory: PageFactory = this.platform.injector.get(PAGE_FACTORY);
-
-    const navEntry: NavigationEntry = {
-      create: (): Page => {
-        let page = pageFactory({ isBootstrap: true, isLivesync });
-        if (this.appOptions) {
-          page.actionBarHidden = this.appOptions.startPageActionBarHidden;
+        const mainPageEntry = this.createNavigationEntry(
+            this._bootstrapper,
+            compRef => onAfterLivesync.next(compRef),
+            error => onAfterLivesync.error(error),
+            true
+        );
+        mainPageEntry.animated = false;
+        mainPageEntry.clearHistory = true;
+
+        const frame = topmost();
+        if (frame) {
+            if (frame.currentPage && frame.currentPage.modal) {
+                frame.currentPage.modal.closeModal();
+            }
+            frame.navigate(mainPageEntry);
         }
+    }
+
+    onDestroy(callback: () => void): void {
+        this.platform.onDestroy(callback);
+    }
+
+    get injector(): Injector {
+        return this.platform.injector;
+    };
 
-        let onLoadedHandler = function () {
-          page.off("loaded", onLoadedHandler);
-          // profiling.stop("application-start");
-          rendererLog("Page loaded");
+    destroy(): void {
+        this.platform.destroy();
+    }
 
-          // profiling.start("ng-bootstrap");
-          rendererLog("BOOTSTRAPPING...");
-          bootstrapAction().then((moduleRef) => {
-            // profiling.stop("ng-bootstrap");
-            rendererLog("ANGULAR BOOTSTRAP DONE.");
-            lastBootstrappedModule = new WeakRef(moduleRef);
+    get destroyed(): boolean {
+        return this.platform.destroyed;
+    }
 
-            if (resolve) {
-              resolve(moduleRef);
-            }
-            return moduleRef;
-          }, (err) => {
-            rendererError("ERROR BOOTSTRAPPING ANGULAR");
-            let errorMessage = err.message + "\n\n" + err.stack;
-            rendererError(errorMessage);
-
-            let view = new TextView();
-            view.text = errorMessage;
-            page.content = view;
-
-            if (reject) {
-              reject(err);
+    private createNavigationEntry(
+        bootstrapAction: BootstrapperAction,
+        resolve?: (comp: NgModuleRef<any>) => void,
+        reject?: (e: Error) => void,
+        isLivesync: boolean = false,
+        isReboot: boolean = false): NavigationEntry {
+
+        const pageFactory: PageFactory = this.platform.injector.get(PAGE_FACTORY);
+
+        const navEntry: NavigationEntry = {
+            create: (): Page => {
+                let page = pageFactory({ isBootstrap: true, isLivesync });
+                if (this.appOptions) {
+                    page.actionBarHidden = this.appOptions.startPageActionBarHidden;
+                }
+
+                let onLoadedHandler = function () {
+                    page.off("loaded", onLoadedHandler);
+                    // profiling.stop("application-start");
+                    rendererLog("Page loaded");
+
+                    // profiling.start("ng-bootstrap");
+                    rendererLog("BOOTSTRAPPING...");
+                    bootstrapAction().then((moduleRef) => {
+                        // profiling.stop("ng-bootstrap");
+                        rendererLog("ANGULAR BOOTSTRAP DONE.");
+                        lastBootstrappedModule = new WeakRef(moduleRef);
+
+                        if (resolve) {
+                            resolve(moduleRef);
+                        }
+                        return moduleRef;
+                    }, (err) => {
+                        rendererError("ERROR BOOTSTRAPPING ANGULAR");
+                        let errorMessage = err.message + "\n\n" + err.stack;
+                        rendererError(errorMessage);
+
+                        let view = new TextView();
+                        view.text = errorMessage;
+                        page.content = view;
+
+                        if (reject) {
+                            reject(err);
+                        }
+                    });
+                };
+
+                page.on("loaded", onLoadedHandler);
+
+                return page;
             }
-          });
         };
 
-        page.on("loaded", onLoadedHandler);
-
-        return page;
-      }
-    };
+        if (isReboot) {
+            navEntry.animated = false;
+            navEntry.clearHistory = true;
+        }
 
-    if (isReboot) {
-      navEntry.animated = false;
-      navEntry.clearHistory = true;
+        return navEntry;
     }
 
-    return navEntry;
-  }
-
-  liveSyncApp() {
-  }
+    liveSyncApp() {
+    }
 }