Replace router outlet override with @CanActivate check

client/app.ts

@@ -8,11 +8,10 @@ import MenuCmp from './components/menu';
 import HeaderCmp from './components/header';
 import FooterCmp from './components/footer';
 import SubDetailCmp from './components/sub-detail';
-import LoggedInRouterOutlet from './logged-in-router-outlet';
 
 @Component({
   selector: 'sb-app',
-  directives: [ROUTER_DIRECTIVES, LoggedInRouterOutlet, HeaderCmp, FooterCmp],
+  directives: [ROUTER_DIRECTIVES, HeaderCmp, FooterCmp],
   template: `
     <sb-header></sb-header>
     <router-outlet></router-outlet>

client/bootstrap.ts

@@ -5,6 +5,7 @@ import {provide} from 'angular2/core';
 import {HTTP_PROVIDERS, BrowserXhr} from 'angular2/http';
 import {ROUTER_PROVIDERS} from 'angular2/router';
 import App from './app';
+import Context from './context';
 import BrowserXhrWithCredentials from './services/browser-xhr-with-credentials';
 import AuthenticationService from './services/authentication';
 import SubsService from './services/subs';
@@ -16,4 +17,5 @@ bootstrap(App, [
   provide(AuthenticationService, {useClass: AuthenticationService}),
   provide(SubsService, {useClass: SubsService}),
   provide(BrowserXhr, {useClass: BrowserXhrWithCredentials})
-]).catch((err: any) => console.log(err));
+]).then((app: any) => { Context.injector = app.injector; })
+  .catch((err: any) => console.log(err));

client/components/home.ts

@@ -1,7 +1,9 @@
 import {Component} from 'angular2/core';
 import {ROUTER_DIRECTIVES} from 'angular2/router';
 import AuthenticationService from '../services/authentication';
+import Auth from './util/auth';
 
+@Auth
 @Component({
   selector: 'sb-home',
   directives: [ROUTER_DIRECTIVES],

client/components/logout.ts

@@ -1,7 +1,9 @@
 import {Component} from 'angular2/core';
 import {Router, ROUTER_DIRECTIVES} from 'angular2/router';
 import AuthenticationService from '../services/authentication';
+import Auth from './util/auth';
 
+@Auth
 @Component({
   selector: 'sb-logout',
   directives: [ROUTER_DIRECTIVES],

client/components/menu.ts

@@ -1,6 +1,8 @@
 import {Component} from 'angular2/core';
 import SubListCmp from './util/sub-list';
+import Auth from './util/auth';
 
+@Auth
 @Component({
   selector: 'sb-menu',
   directives: [SubListCmp],

client/components/sub-detail.ts

@@ -3,7 +3,9 @@ import {RouteParams, ROUTER_DIRECTIVES} from 'angular2/router';
 import SubPriceCmp from './util/sub-price';
 import SubsService from '../services/subs';
 import Sub from '../models/sub';
+import Auth from './util/auth';
 
+@Auth
 @Component({
   selector: 'sb-subdetail',
   directives: [SubPriceCmp, ROUTER_DIRECTIVES],

client/components/util/auth.ts

@@ -0,0 +1,14 @@
+import {Router, CanActivate} from 'angular2/router';
+import AuthenticationService from '../../services/authentication';
+import Context from '../../context';
+
+export default function (constr: Function): any {
+  return CanActivate(() => {
+    if (Context.injector.get(AuthenticationService).authenticated) {
+      return true;
+    } else {
+      Context.injector.get(Router).navigate(['Login']);
+      return false;
+    }
+  })(constr);
+}

client/context.ts

@@ -0,0 +1,13 @@
+import {Injector} from 'angular2/core';
+
+export default class Context {
+  private static _injector: Injector;
+
+  static get injector (): Injector {
+    return this._injector;
+  }
+
+  static set injector (value: Injector) {
+    this._injector = value;
+  }
+}