feat(WebWorker): Add Router Support for WebWorker Apps

Closes angular#3563.

Author: jteplitz

modules/angular2/platform/worker_app.dart

@@ -12,3 +12,5 @@ export 'package:angular2/src/web_workers/shared/service_message_broker.dart'
     show ReceivedMessage, ServiceMessageBroker, ServiceMessageBrokerFactory;
 export 'package:angular2/src/web_workers/shared/serializer.dart' show PRIMITIVE;
 export 'package:angular2/src/web_workers/shared/message_bus.dart';
+export 'package:angular2/src/web_workers/worker/router_providers.dart'
+  show WORKER_APP_ROUTER;

modules/angular2/platform/worker_app.ts

@@ -8,12 +8,13 @@ export {
   ClientMessageBrokerFactory,
   FnArg,
   UiArguments
-} from '../src/web_workers/shared/client_message_broker';
+} from 'angular2/src/web_workers/shared/client_message_broker';
 export {
   ReceivedMessage,
   ServiceMessageBroker,
   ServiceMessageBrokerFactory
-} from '../src/web_workers/shared/service_message_broker';
-export {PRIMITIVE} from '../src/web_workers/shared/serializer';
-export * from '../src/web_workers/shared/message_bus';
+} from 'angular2/src/web_workers/shared/service_message_broker';
+export {PRIMITIVE} from 'angular2/src/web_workers/shared/serializer';
+export * from 'angular2/src/web_workers/shared/message_bus';
 export {AngularEntrypoint} from 'angular2/src/core/angular_entrypoint';
+export {WORKER_APP_ROUTER} from 'angular2/src/web_workers/worker/router_providers';

modules/angular2/platform/worker_render.dart

@@ -18,7 +18,9 @@ export '../src/web_workers/shared/service_message_broker.dart'
 
 export '../src/web_workers/shared/serializer.dart' show PRIMITIVE;
 export '../src/web_workers/shared/message_bus.dart';
+export '../src/web_workers/ui/router_providers.dart' show WORKER_RENDER_ROUTER;
 
 import 'package:angular2/src/platform/worker_render_common.dart';
 
 const WORKER_RENDER_APP = WORKER_RENDER_APPLICATION_COMMON;
+

modules/angular2/platform/worker_render.ts

@@ -24,3 +24,4 @@ import {WORKER_RENDER_APPLICATION} from 'angular2/src/platform/worker_render';
  * @deprecated Use WORKER_RENDER_APPLICATION
  */
 export const WORKER_RENDER_APP = WORKER_RENDER_APPLICATION;
+export {WORKER_RENDER_ROUTER} from 'angular2/src/web_workers/ui/router_providers';

modules/angular2/router.ts

@@ -20,18 +20,12 @@ export {OnActivate, OnDeactivate, OnReuse, CanDeactivate, CanReuse} from './src/
 export {CanActivate} from './src/router/lifecycle_annotations';
 export {Instruction, ComponentInstruction} from './src/router/instruction';
 export {OpaqueToken} from 'angular2/core';
+export {ROUTER_PROVIDERS_COMMON} from 'angular2/src/router/router_providers_common';
+export {ROUTER_PROVIDERS, ROUTER_BINDINGS} from 'angular2/src/router/router_providers';
 
-import {PlatformLocation} from './src/router/platform_location';
-import {LocationStrategy} from './src/router/location_strategy';
-import {PathLocationStrategy} from './src/router/path_location_strategy';
-import {Router, RootRouter} from './src/router/router';
 import {RouterOutlet} from './src/router/router_outlet';
 import {RouterLink} from './src/router/router_link';
-import {RouteRegistry, ROUTER_PRIMARY_COMPONENT} from './src/router/route_registry';
-import {Location} from './src/router/location';
-import {ApplicationRef, provide, OpaqueToken, Provider} from 'angular2/core';
 import {CONST_EXPR} from './src/facade/lang';
-import {BaseException} from 'angular2/src/facade/exceptions';
 
 /**
  * A list of directives. To use the router directives like {@link RouterOutlet} and
@@ -56,63 +50,3 @@ import {BaseException} from 'angular2/src/facade/exceptions';
  * ```
  */
 export const ROUTER_DIRECTIVES: any[] = CONST_EXPR([RouterOutlet, RouterLink]);
-
-/**
- * A list of {@link Provider}s. To use the router, you must add this to your application.
- *
- * ### Example ([live demo](http://plnkr.co/edit/iRUP8B5OUbxCWQ3AcIDm))
- *
- * ```
- * import {Component} from 'angular2/core';
- * import {
- *   ROUTER_DIRECTIVES,
- *   ROUTER_PROVIDERS,
- *   RouteConfig
- * } from 'angular2/router';
- *
- * @Component({directives: [ROUTER_DIRECTIVES]})
- * @RouteConfig([
- *  {...},
- * ])
- * class AppCmp {
- *   // ...
- * }
- *
- * bootstrap(AppCmp, [ROUTER_PROVIDERS]);
- * ```
- */
-export const ROUTER_PROVIDERS: any[] = CONST_EXPR([
-  RouteRegistry,
-  CONST_EXPR(new Provider(LocationStrategy, {useClass: PathLocationStrategy})),
-  PlatformLocation,
-  Location,
-  CONST_EXPR(new Provider(
-      Router,
-      {
-        useFactory: routerFactory,
-        deps: CONST_EXPR([RouteRegistry, Location, ROUTER_PRIMARY_COMPONENT, ApplicationRef])
-      })),
-  CONST_EXPR(new Provider(
-      ROUTER_PRIMARY_COMPONENT,
-      {useFactory: routerPrimaryComponentFactory, deps: CONST_EXPR([ApplicationRef])}))
-]);
-
-/**
- * Use {@link ROUTER_PROVIDERS} instead.
- *
- * @deprecated
- */
-export const ROUTER_BINDINGS = ROUTER_PROVIDERS;
-
-function routerFactory(registry, location, primaryComponent, appRef) {
-  var rootRouter = new RootRouter(registry, location, primaryComponent);
-  appRef.registerDisposeListener(() => rootRouter.dispose());
-  return rootRouter;
-}
-
-function routerPrimaryComponentFactory(app) {
-  if (app.componentTypes.length == 0) {
-    throw new BaseException("Bootstrap at least one component before injecting Router.");
-  }
-  return app.componentTypes[0];
-}

modules/angular2/src/platform/worker_render_common.ts

@@ -36,6 +36,7 @@ import {BrowserDomAdapter} from './browser/browser_adapter';
 import {wtfInit} from 'angular2/src/core/profile/wtf_init';
 import {MessageBasedRenderer} from 'angular2/src/web_workers/ui/renderer';
 import {MessageBasedXHRImpl} from 'angular2/src/web_workers/ui/xhr_impl';
+import {BrowserPlatformLocation} from 'angular2/src/router/browser_platform_location';
 import {
   ServiceMessageBrokerFactory,
   ServiceMessageBrokerFactory_
@@ -59,6 +60,13 @@ export const WORKER_RENDER_PLATFORM: Array<any /*Type | Provider | any[]*/> = CO
   new Provider(PLATFORM_INITIALIZER, {useValue: initWebWorkerRenderPlatform, multi: true})
 ]);
 
+/**
+ * A list of {@link Provider}s. To use the router in a Worker enabled application you must
+ * include these providers when setting up the render thread.
+ */
+export const WORKER_RENDER_ROUTER: Array<any /*Type | Provider | any[]*/> =
+    CONST_EXPR([BrowserPlatformLocation]);
+
 export const WORKER_RENDER_APPLICATION_COMMON: Array<any /*Type | Provider | any[]*/> = CONST_EXPR([
   APPLICATION_COMMON_PROVIDERS,
   WORKER_RENDER_MESSAGING_PROVIDERS,

modules/angular2/src/router/browser_platform_location.ts

@@ -0,0 +1,58 @@
+import {Injectable} from 'angular2/core';
+import {History, Location} from 'angular2/src/facade/browser';
+import {UrlChangeListener} from './platform_location';
+import {PlatformLocation} from './platform_location';
+import {DOM} from 'angular2/src/platform/dom/dom_adapter';
+
+/**
+ * `PlatformLocation` encapsulates all of the direct calls to platform APIs.
+ * This class should not be used directly by an application developer. Instead, use
+ * {@link Location}.
+ */
+@Injectable()
+export class BrowserPlatformLocation extends PlatformLocation {
+  private _location: Location;
+  private _history: History;
+
+  constructor() {
+    super();
+    this._init();
+  }
+
+  // This is moved to its own method so that `MockPlatformLocationStrategy` can overwrite it
+  /** @internal */
+  _init() {
+    this._location = DOM.getLocation();
+    this._history = DOM.getHistory();
+  }
+
+  /** @internal */
+  get location(): Location { return this._location; }
+
+  getBaseHrefFromDOM(): string { return DOM.getBaseHref(); }
+
+  onPopState(fn: UrlChangeListener): void {
+    DOM.getGlobalEventTarget('window').addEventListener('popstate', fn, false);
+  }
+
+  onHashChange(fn: UrlChangeListener): void {
+    DOM.getGlobalEventTarget('window').addEventListener('hashchange', fn, false);
+  }
+
+  get pathname(): string { return this._location.pathname; }
+  get search(): string { return this._location.search; }
+  get hash(): string { return this._location.hash; }
+  set pathname(newPath: string) { this._location.pathname = newPath; }
+
+  pushState(state: any, title: string, url: string): void {
+    this._history.pushState(state, title, url);
+  }
+
+  replaceState(state: any, title: string, url: string): void {
+    this._history.replaceState(state, title, url);
+  }
+
+  forward(): void { this._history.forward(); }
+
+  back(): void { this._history.back(); }
+}

modules/angular2/src/router/hash_location_strategy.ts

@@ -5,7 +5,7 @@ import {
   APP_BASE_HREF,
   normalizeQueryParams
 } from './location_strategy';
-import {EventListener} from 'angular2/src/facade/browser';
+import {UrlChangeListener} from './platform_location';
 import {isPresent} from 'angular2/src/facade/lang';
 import {PlatformLocation} from './platform_location';
 
@@ -58,7 +58,7 @@ export class HashLocationStrategy extends LocationStrategy {
     }
   }
 
-  onPopState(fn: EventListener): void {
+  onPopState(fn: UrlChangeListener): void {
     this._platformLocation.onPopState(fn);
     this._platformLocation.onHashChange(fn);
   }

modules/angular2/src/router/location_strategy.ts

@@ -1,5 +1,6 @@
 import {CONST_EXPR} from 'angular2/src/facade/lang';
 import {OpaqueToken} from 'angular2/core';
+import {UrlChangeListener} from './platform_location';
 
 /**
  * `LocationStrategy` is responsible for representing and reading route state
@@ -24,7 +25,7 @@ export abstract class LocationStrategy {
   abstract replaceState(state: any, title: string, url: string, queryParams: string): void;
   abstract forward(): void;
   abstract back(): void;
-  abstract onPopState(fn: (_: any) => any): void;
+  abstract onPopState(fn: UrlChangeListener): void;
   abstract getBaseHref(): string;
 }
 

modules/angular2/src/router/path_location_strategy.ts

@@ -1,5 +1,4 @@
 import {Injectable, Inject, Optional} from 'angular2/core';
-import {EventListener, History, Location} from 'angular2/src/facade/browser';
 import {isBlank} from 'angular2/src/facade/lang';
 import {BaseException} from 'angular2/src/facade/exceptions';
 import {
@@ -8,7 +7,7 @@ import {
   normalizeQueryParams,
   joinWithSlash
 } from './location_strategy';
-import {PlatformLocation} from './platform_location';
+import {PlatformLocation, UrlChangeListener} from './platform_location';
 
 /**
  * `PathLocationStrategy` is a {@link LocationStrategy} used to configure the
@@ -75,7 +74,7 @@ export class PathLocationStrategy extends LocationStrategy {
     this._baseHref = href;
   }
 
-  onPopState(fn: EventListener): void {
+  onPopState(fn: UrlChangeListener): void {
     this._platformLocation.onPopState(fn);
     this._platformLocation.onHashChange(fn);
   }