refactored BoardZ App to use rc1 instead of beta15

src/BoardZ/app/app.ts

@@ -1,6 +1,5 @@
-import {Component, AfterViewInit} from 'angular2/core';
-import {ROUTER_DIRECTIVES, RouteConfig} from 'angular2/router';
-
+import {Component, AfterViewInit} from '@angular/core';
+import {ROUTER_DIRECTIVES, RouteConfig} from '@angular/router-deprecated';
 import {LoginComponent} from './components/login/login';
 import {DashboardComponent} from './components/dashboard/dashboard';
 import {SidebarComponent} from './components/sidebar/sidebar';
@@ -15,20 +14,25 @@ import {SignalRService} from './services/signalrService';
 import {LoginService} from './services/loginService';
 import {NotificationService} from './services/notificationService';
 import {UiNotificationService} from './services/uiNotificationService';
-import {NativeIntegrationService} from "./services/nativeIntegrationService";
+import {NativeIntegrationService} from './services/nativeIntegrationService';
+import {IBoardZAppWindow} from './interfaces/boardzAppWindow';
+
+declare var window: IBoardZAppWindow;
 
 @Component({
+    moduleId: module.id,
     selector: 'boardz-app',
+    directives: [ROUTER_DIRECTIVES, HeaderComponent, SidebarComponent],
     providers: APP_SERVICES,
-    directives: [ROUTER_DIRECTIVES, SidebarComponent, HeaderComponent],
-    templateUrl: 'app/app.html'
+    templateUrl: 'app.html'
 })
+//noinspection TypeScriptValidateTypes
 @RouteConfig([
-    { path: '/', component: DashboardComponent, name: 'Dashboard', useAsDefault: true },
-    { path: '/login', component: LoginComponent, name: 'Login' },
-    { path: '/notifications', component: NotificationsComponent, name: 'Notifications' },
-    { path: '/games/...', component: GamesComponent, name: 'Games', data: { displayName: 'Games' } },
-    { path: '/radiusSearch', component: RadiusSearchComponent, name: 'RadiusSearch' }
+    { path: '/', name: 'Dashboard', useAsDefault: true, component: DashboardComponent },
+    { path: '/login', name: 'Login', component: LoginComponent },
+    { path: '/notifications', name: 'Notifications', component: NotificationsComponent },
+    { path: '/games/...', name: 'Games', component: GamesComponent, data: { displayName: 'Games' } },
+    { path: '/radiussearch', name: 'RadiusSearch', component: RadiusSearchComponent }
 ])
 export class BoardzAppComponent implements AfterViewInit {
     constructor(private _signalRService: SignalRService,
@@ -59,35 +63,3 @@ export class BoardzAppComponent implements AfterViewInit {
 
 
 
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-interface BoardZAppWindow extends Window {
-    initAdminLTE(): void;
-}
-
-declare var window: BoardZAppWindow;

src/BoardZ/app/components/dashboard/dashboard.ts

@@ -1,14 +1,16 @@
-import {Component, OnInit} from 'angular2/core';
-import {ROUTER_DIRECTIVES} from 'angular2/router';
+import {Component, OnInit} from '@angular/core';
+import {ROUTER_DIRECTIVES} from '@angular/router-deprecated';
 
 import {NeedsAuthentication} from '../../decorators/needsAuthentication';
 import {WidgetComponent} from '../widget/widget';
 import {GamesService} from '../../services/gamesService';
 import {PlayersService} from '../../services/playersService';
 
 @Component({
-    directives: [ROUTER_DIRECTIVES, WidgetComponent],
-    templateUrl: 'app/components/dashboard/dashboard.html'
+    moduleId: module.id,
+    selector: 'dashboard',
+    directives: [WidgetComponent],
+    templateUrl: 'dashboard.html'
 })
 @NeedsAuthentication()
 export class DashboardComponent implements OnInit {
@@ -26,4 +28,4 @@ export class DashboardComponent implements OnInit {
         this._gamesService.getGameCount()
             .subscribe(result => this.gameCount = result.toString());
     }
-}
+}

src/BoardZ/app/components/games/details.ts

@@ -1,6 +1,5 @@
-import {Component, OnInit} from 'angular2/core';
-import {RouteParams, Router} from 'angular2/router';
-
+import {Component, OnInit} from '@angular/core';
+import {Router} from '@angular/router-deprecated';
 import {NeedsAuthentication} from '../../decorators/needsAuthentication';
 import {LocateItComponent} from '../locateIt/locateIt';
 import {PictureItComponent} from '../pictureIt/pictureIt';
@@ -17,34 +16,36 @@ import {Notification} from '../../models/notification';
 import {NotificationType} from '../../models/notificationType';
 
 @Component({
+    moduleId: module.id,
     selector: 'gameDetail',
     directives: [LocateItComponent, PictureItComponent],
-    templateUrl: 'app/components/games/details.html',
-    inputs: ['game']
+    templateUrl: 'details.html'
 })
 @NeedsAuthentication()
-export class GameDetailsComponent implements OnInit {
+export class GameDetailsComponent implements OnInit{
+    ngOnInit(): any {
+        return undefined;
+    }
     private _needsReset: boolean;
     private _pictureUrl: string = "";
     private _coordinates: GeoLocation = null;
     private _sending: boolean;
-
     public active = true;
+
     public model: Game = new Game();
     public originalModel: Game = new Game();
 
     constructor(private _logService: LogService,
                 private _gameService: GamesService,
                 private _router: Router,
-                private _routeParams: RouteParams,
                 private _notificationService: NotificationService,
                 private _playersService: PlayersService,
                 private _signalRService: SignalRService,
                 private _loginService: LoginService) {
     }
 
-    ngOnInit(): void {
-        let id = this._routeParams.get('id');
+    public routerOnActivate(curr: RouteSegment, prev?: RouteSegment, currTree?: RouteTree, prevTree?: RouteTree): void {
+        let id = curr.getParam('id');
 
         if (!id) {
             this.originalModel = this._gameService.deepClone(this.model = new Game());
@@ -68,15 +69,15 @@ export class GameDetailsComponent implements OnInit {
     }
 
     public abort(): void {
-        this._router.navigate(['GameList']);
+        this._router.navigate(['GamesList']);
     }
 
     public reset(): void {
         this._needsReset = false;
-    
+
         // Based on: https://angular.io/docs/ts/latest/guide/forms.html
         this.model = this._gameService.deepClone(this.originalModel);
-    
+
         // workaround to re-initialize the actual form controls states
         this.active = false;
         setTimeout(() => this.active = true, 0);

src/BoardZ/app/components/games/games.ts

@@ -1,18 +1,20 @@
-import {Component} from 'angular2/core';
-import {ROUTER_DIRECTIVES, RouteConfig} from 'angular2/router';
-
+import {Component} from '@angular/core';
+import {ROUTER_DIRECTIVES, RouteConfig} from '@angular/router-deprecated';
+import {NeedsAuthentication} from '../../decorators/needsAuthentication';
 import {GameDetailsComponent} from './details';
 import {GameListComponent} from './list';
 
 @Component({
+    moduleId: module.id,
     selector: 'games',
     directives: [ROUTER_DIRECTIVES],
-    templateUrl: 'app/components/games/games.html'
+    templateUrl: 'games.html'
 })
 @RouteConfig([
-    { path: '/', component: GameListComponent, name: 'GameList', useAsDefault: true, data: { displayName: 'Game overview' } },
+    { path: '/', component: GameListComponent, name: 'GamesList', useAsDefault: true, data: { displayName: 'Game overview' } },
     { path: '/create', component: GameDetailsComponent, name: 'CreateGame', data: { displayName: 'Create a new game' } },
     { path: '/details/:id', component: GameDetailsComponent, name: 'GameDetails', data: { displayName: 'Game details' } }
 ])
+@NeedsAuthentication()
 export class GamesComponent {
 }

src/BoardZ/app/components/games/list.html

@@ -19,7 +19,7 @@ <h3 class="box-title">All Games</h3>
                             <th>Description</th>
 
                         </tr>
-                        <tr *ngFor="#game of games" (click)="openGameDetails(game)" class="respond-click">
+                        <tr *ngFor=" let game of games" (click)="openGameDetails(game)" class="respond-click">
                             <td>{{game.name}}</td>
                             <td>{{game.description}}</td>
                         </tr>

src/BoardZ/app/components/games/list.ts

@@ -1,17 +1,17 @@
-import {Component, OnInit} from 'angular2/core';
-import {Router, ROUTER_DIRECTIVES} from 'angular2/router';
-
-import {NeedsAuthentication} from '../../decorators/needsAuthentication';
+import {Component, OnInit} from '@angular/core';
+import {Router, ROUTER_DIRECTIVES} from '@angular/router-deprecated';
 import {Game} from '../../models/game';
 import {GamesService} from '../../services/gamesService';
 import {NotificationService} from '../../services/notificationService';
-
+import {NeedsAuthentication} from '../../decorators/needsAuthentication';
+@NeedsAuthentication()
 @Component({
-    selector: 'gamelist',
+    moduleId: module.id,
+    selector: 'game-list',
     directives: [ROUTER_DIRECTIVES],
-    templateUrl: 'app/components/games/list.html'
+    templateUrl: 'list.html'
 })
-@NeedsAuthentication()
+
 export class GameListComponent implements OnInit {
     public games: Game[];
 
@@ -21,11 +21,11 @@ export class GameListComponent implements OnInit {
     }
 
     public openGameDetails(game: Game): void {
-        this._router.navigate(['GameDetails', { id: game.id }]);
+        this._router.navigate(['/games/details/', { id: game.id }]);
     }
 
     public openCreateGame():void{
-        this._router.navigate(['CreateGame']);
+        this._router.navigate(['/games/create']);
     }
 
     ngOnInit() {
@@ -35,4 +35,4 @@ export class GameListComponent implements OnInit {
                 (err) => this._notificationService.notifyError('Error while fetching game data')
             );
     }
-}
+}

src/BoardZ/app/components/header/header.html

@@ -25,7 +25,7 @@
                             <div class="slimScrollDiv"
                                  style="position: relative; overflow: hidden; width: auto; height: 200px;">
                                 <ul class="menu" style="overflow: hidden; width: 100%; height: 200px;">
-                                    <li *ngFor="#notification of notifications">
+                                    <li *ngFor="let notification of notifications">
                                         <a class="respond-click" (click)="dismiss(notification)"><i
                                                 class="fa {{notification.iconCssClass}}"></i> {{notification.message}}</a>
                                     </li>

src/BoardZ/app/components/header/header.ts

@@ -1,16 +1,15 @@
-import {Component, OnInit} from 'angular2/core';
-import {NgClass} from 'angular2/common';
-
+import {Component, OnInit} from '@angular/core';
 import {Notification} from '../../models/notification';
 import {LoginService} from '../../services/loginService';
 import {TokenService} from '../../services/tokenService';
 import {NotificationService} from '../../services/notificationService';
 import {BackButtonDirective} from '../../directives/backButtonDirective';
 
 @Component({
+    moduleId: module.id,
     selector: 'boardz-header',
-    directives: [NgClass, BackButtonDirective],
-    templateUrl: 'app/components/header/header.html'
+    directives: [BackButtonDirective],
+    templateUrl: 'header.html'
 })
 export class HeaderComponent implements OnInit {
     private notifications: Notification[] = [];

src/BoardZ/app/components/locateIt/locateIt.ts

@@ -1,15 +1,16 @@
 ///<reference path="../../../../../typings/main/ambient/leaflet/leaflet.d.ts" />
 
-import {Component, Output, OnInit, EventEmitter} from 'angular2/core';
-import {JsonPipe} from 'angular2/common';
+import {Component, Output, OnInit, EventEmitter} from '@angular/core';
+import {JsonPipe} from '@angular/common';
 
 import {GeoLocation} from '../../models/geoLocation';
 import {GeolocationService} from '../../services/geolocationService';
 
 @Component({
+    moduleId: module.id,
     selector: 'locate-it',
     pipes: [JsonPipe],
-    templateUrl: 'app/components/locateIt/locateIt.html'
+    templateUrl: 'locateIt.html'
 })
 export class LocateItComponent implements OnInit {
     private _hasError: boolean = false;

src/BoardZ/app/components/login/login.ts

@@ -1,13 +1,15 @@
-import {Component} from 'angular2/core';
-import {Router} from 'angular2/router';
+import {Component} from '@angular/core';
+import {Router} from '@angular/router-deprecated';
 
 import {LoginService} from '../../services/loginService';
 import {LogService} from '../../services/logService';
 import {NotificationService} from '../../services/notificationService';
 import {SignalRService} from '../../services/signalrService';
 
 @Component({
-    templateUrl: 'app/components/login/login.html'
+    moduleId: module.id,
+    selector: 'login',
+    templateUrl: 'login.html'
 })
 export class LoginComponent {
     private _userName: string;

src/BoardZ/app/components/notifications/notifications.ts

@@ -1,10 +1,11 @@
-import {Component} from 'angular2/core';
+import {Component} from '@angular/core';
 
 import {NotificationService} from '../../services/notificationService';
 
 @Component({
+    moduleId: module.id,
     selector: 'notifications',
-    templateUrl: 'app/components/notifications/notifications.html'
+    templateUrl: 'notifications.html'
 })
 export class NotificationsComponent {
     constructor(public notificationService: NotificationService) {

src/BoardZ/app/components/pictureIt/pictureIt.ts

@@ -1,10 +1,11 @@
-import {Component, Output, EventEmitter} from 'angular2/core';
+import {Component, Output, EventEmitter} from '@angular/core';
 
 import {CameraService} from '../../services/cameraService';
 
 @Component({
+    moduleId: module.id,
     selector: 'picture-it',
-    templateUrl: 'app/components/pictureIt/pictureIt.html'
+    templateUrl: 'pictureIt.html'
 })
 export class PictureItComponent {
     @Output('onPictureTaken')

src/BoardZ/app/components/radiusSearch/radiusSearch.html

@@ -22,7 +22,7 @@ <h3>Find players around you</h3>
 </div>
 
 <div class="row big-space">
-    <div class="col-xs-12 col-md-6" *ngFor="#p of _players">
+    <div class="col-xs-12 col-md-6" *ngFor="let p of _players">
         <div class="box box-success box-solid">
             <div class="box-header with-border">
                 <h3 class="box-title">{{p.player.name}}</h3>
@@ -37,4 +37,4 @@ <h3 class="box-title">{{p.player.name}}</h3>
             </div>
         </div>
     </div>
-</div>
+</div>