Merge branch 'v2.1.2' into chapter3-v2.4

deeleman · Feb 4, 2017 · f7efa1b · f7efa1b
2 parents 953775c + 0ebcf85
commit f7efa1b
Show file tree

Hide file tree

Showing 10 changed files with 89 additions and 98 deletions.
diff --git a/chapter_03/app/app.module.ts b/chapter_03/app/app.module.ts
@@ -0,0 +1,12 @@
+import { NgModule } from '@angular/core';
+import { BrowserModule  } from '@angular/platform-browser';
+
+import { PomodoroTimerComponent } from './pomodoro-timer.component';
+import { CountdownComponent } from './countdown.component';
+
+@NgModule({
+  imports: [BrowserModule],
+  declarations: [PomodoroTimerComponent, CountdownComponent],
+  bootstrap: [PomodoroTimerComponent],
+})
+export class AppModule { }
diff --git a/chapter_03/pomodoro-timer.ts → chapter_03/app/countdown.component.ts b/chapter_03/pomodoro-timer.ts → chapter_03/app/countdown.component.ts
@@ -1,13 +1,12 @@
-import { Component, EventEmitter, Input, Output, ViewEncapsulation } from '@angular/core';
-import { bootstrap } from '@angular/platform-browser-dynamic';
+import { Component, Input, Output, ViewEncapsulation, EventEmitter } from '@angular/core';
 
 @Component({
   selector: 'countdown',
   template: '<h1>Time left: {{seconds}}</h1>',
   styles: ['h1 { color: #900 }'],
   encapsulation: ViewEncapsulation.Emulated
 })
-class CountdownComponent {
+export class CountdownComponent {
   @Input() seconds: number;
   intervalId: number;
   @Output() complete: EventEmitter<any> = new EventEmitter();
@@ -25,16 +24,3 @@ class CountdownComponent {
     this.progress.emit(this.seconds);
   }
 }
-
-@Component({
-  selector: 'pomodoro-timer',
-  directives: [CountdownComponent],
-  templateUrl: './pomodoro-timer.html'
-})
-class PomodoroTimerComponent {
-  onCountdownCompleted(): void {
-    alert('Time up!');
-  }
-}
-
-bootstrap(PomodoroTimerComponent);
diff --git a/chapter_03/app/main.ts b/chapter_03/app/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+
+import { AppModule } from './app.module';
+
+const platform = platformBrowserDynamic();
+platform.bootstrapModule(AppModule);
diff --git a/chapter_03/pomodoro-timer.html → chapter_03/app/pomodoro-timer.component.html b/chapter_03/pomodoro-timer.html → chapter_03/app/pomodoro-timer.component.html
diff --git a/chapter_03/app/pomodoro-timer.component.ts b/chapter_03/app/pomodoro-timer.component.ts
@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'pomodoro-timer',
+  templateUrl: './pomodoro-timer.html'
+})
+export class PomodoroTimerComponent {
+  onCountdownCompleted(): void {
+    alert('Time up!');
+  }
+}
diff --git a/chapter_03/index.html b/chapter_03/index.html
@@ -2,17 +2,16 @@
 <html>
   <head>
     <meta charset="utf-8">
-    <title>My Angular 2 Pomodoro Tasks</title>
-    <script src="node_modules/es6-shim/es6-shim.min.js"></script>
+    <title>Learning Angular 2</title>
+    <!-- Polyfill for older browsers -->
+    <script src="node_modules/core-js/client/shim.min.js"></script>
     <script src="node_modules/zone.js/dist/zone.js"></script>
     <script src="node_modules/reflect-metadata/Reflect.js"></script>
-    <script src="node_modules/systemjs/dist/system.js"></script>
-    <script src="node_modules/rxjs/bundles/Rx.js"></script>
+    <script src="node_modules/systemjs/dist/system.src.js"></script>
 
     <script src="systemjs.config.js"></script>
     <script>
-      System.import ('built/pomodoro-timer')
-        .then(null, console.error.bind(console));
+      System.import('app').catch(console.error.bind(null));
     </script>
 
     <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
@@ -27,4 +26,4 @@
     </nav>
     <pomodoro-timer></pomodoro-timer>
   </body>
-</html>
+</html>
diff --git a/chapter_03/package.json b/chapter_03/package.json
@@ -10,37 +10,32 @@
     "url": "git://github.com/deeleman/learning-angular2.git"
   },
   "scripts": {
-    "preinstall": "rm -rf ./built",
-    "postinstall": "npm run typings install",
-    "tsc": "tsc",
-    "tsc:w": "tsc -w",
+    "start": "tsc && concurrently \"tsc -w\" \"lite-server\" ",
     "lite": "lite-server",
-    "prestart": "tsc",
-    "start": "concurrently \"npm run tsc:w\" \"npm run lite\" ",
-    "typings": "typings"
+    "tsc": "tsc",
+    "tsc:w": "tsc -w"
   },
   "dependencies": {
-    "@angular/common":  "2.0.0-rc.1",
-    "@angular/compiler":  "2.0.0-rc.1",
-    "@angular/core":  "2.0.0-rc.1",
-    "@angular/http":  "2.0.0-rc.1",
-    "@angular/platform-browser":  "2.0.0-rc.1",
-    "@angular/platform-browser-dynamic":  "2.0.0-rc.1",
-    "@angular/router":  "2.0.0-rc.1",
-    "@angular/router-deprecated":  "2.0.0-rc.1",
-
-    "bootstrap": "^3.3.6",
+    "@angular/common": "~2.4.0",
+    "@angular/compiler": "~2.4.0",
+    "@angular/core": "~2.4.0",
+    "@angular/forms": "~2.4.0",
+    "@angular/http": "~2.4.0",
+    "@angular/platform-browser": "~2.4.0",
+    "@angular/platform-browser-dynamic": "~2.4.0",
+    "@angular/router": "~3.4.0",
 
-    "systemjs": "0.19.26",
-    "es6-shim": "^0.35.0",
-    "reflect-metadata": "0.1.2",
-    "rxjs": "5.0.0-beta.6",
-    "zone.js": "0.6.12"
+    "systemjs": "0.19.40",
+    "core-js": "^2.4.1",
+    "rxjs": "5.0.1",
+    "zone.js": "^0.7.4",
+    "bootstrap": "^3.3.7"
   },
   "devDependencies": {
-    "concurrently": "^2.0.0",
-    "lite-server": "^2.1.0",
-    "typescript": "1.8.10",
-    "typings": "0.8.1"
+    "@types/core-js": "^0.9.34",
+    "@types/node": "^6.0.45",
+    "concurrently": "^3.1.0",
+    "lite-server": "^2.2.2",
+    "typescript": "^2.0.10"
   }
 }
diff --git a/chapter_03/systemjs.config.js b/chapter_03/systemjs.config.js
@@ -1,36 +1,27 @@
 (function (global) {
-
-  var pathMappings = {
-    '@angular': 'node_modules/@angular',
-    'rxjs': 'node_modules/rxjs',
-  };
-
-  var packages = [
-    '@angular/common',
-    '@angular/compiler',
-    '@angular/core',
-    '@angular/http',
-    '@angular/platform-browser',
-    '@angular/platform-browser-dynamic',
-    '@angular/router',
-    '@angular/router-deprecated',
-    '@angular/testing',
-    'rxjs',
-    'built',
-  ];
-
-  var packagesConfig = {};
-
-  packages.forEach(function(packageName) {
-    packagesConfig[packageName] = {
-      main: 'index.js',
-      defaultExtension: 'js'
-    };
-  });
-
   System.config({
-    map: pathMappings,
-    packages: packagesConfig,
-  });
+    map: {
+      app: 'app',
+
+      '@angular/core': 'node_modules/@angular/core/bundles/core.umd.js',
+      '@angular/common': 'node_modules/@angular/common/bundles/common.umd.js',
+      '@angular/compiler': 'node_modules/@angular/compiler/bundles/compiler.umd.js',
+      '@angular/platform-browser': 'node_modules/@angular/platform-browser/bundles/platform-browser.umd.js',
+      '@angular/platform-browser-dynamic': 'node_modules/@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
+      '@angular/http': 'node_modules/@angular/http/bundles/http.umd.js',
+      '@angular/router': 'node_modules/@angular/router/bundles/router.umd.js',
+      '@angular/forms': 'node_modules/@angular/forms/bundles/forms.umd.js',
 
+      'rxjs': 'node_modules/rxjs'
+    },
+    packages: {
+      app: {
+        main: './main.js',
+        defaultExtension: 'js'
+      },
+      rxjs: {
+        defaultExtension: 'js'
+      }
+    }
+  });
 })(this);
diff --git a/chapter_03/tsconfig.json b/chapter_03/tsconfig.json
@@ -1,18 +1,14 @@
 {
   "compilerOptions": {
-    "experimentalDecorators": true,
-    "emitDecoratorMetadata": true,
-    "moduleResolution": "node",
     "target": "es5",
-    "module": "system",
+    "module": "commonjs",
+    "moduleResolution": "node",
+    "sourceMap": true,
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "removeComments": false,
     "noImplicitAny": false,
     "outDir": "built",
-    "rootDir": ".",
-    "sourceMap": false
-  },
-  "exclude": [
-    "node_modules",
-    "typings/main",
-    "typings/main.d.ts"
-  ]
+    "rootDir": "."
+  }
 }
diff --git a/chapter_03/typings.json b/chapter_03/typings.json