post-review changes

Author: chalin

public/_includes/_util-fns.jade

@@ -222,8 +222,8 @@ script.
 -   // E.g. of a project relative path is 'app/main.ts'
 -   if (ex.title === null || ex.title === undefined) {
 -     // Title is not given so take it to be ex.filePath.
--     // Is title like styles.1.css? Then drop the '.1' qualifier:
--     var matches = ex.filePath.match(/^(.*)\.\d(\.\w+)$/);
+-     // Title like styles.1.css or foo_1.dart? Then drop the '.1' or '_1' qualifier:
+-     var matches = ex.filePath.match(/^(.*)[\._]\d(\.\w+)$/);
 -     ex.title = matches ? matches[1] + matches[2] : ex.filePath;
 -   }
 -   ex.filePath = getExampleName() + '/' + _docsFor + '/' + ex.filePath;

public/docs/_examples/toh-5/dart/lib/app_component_1.dart

@@ -1,31 +1,40 @@
 // #docplaster
 // #docregion , v2
 import 'package:angular2/core.dart';
+// #enddocregion ,
+// #docregion v2
+import 'package:angular2/router.dart';
+// #docregion
 
 import 'hero_service.dart';
 import 'heroes_component.dart';
 
 // #enddocregion v2
 @Component(
-  selector: 'my-app',
-  template: '''
+    selector: 'my-app',
+    template: '''
       <h1>{{title}}</h1>
       <my-heroes></my-heroes>''',
-  directives: const [HeroesComponent],
-  providers: const [HeroService])
-// #enddocregion
+    directives: const [HeroesComponent],
+    providers: const [HeroService])
+// #enddocregion ,
+class Bogus {}
+
 // #docregion v2
 @Component(
-  selector: 'my-app',
-  // #docregion template-v2
-  template: '''
+    selector: 'my-app',
+    // #docregion template-v2
+    template: '''
       <h1>{{title}}</h1>
       <a [routerLink]="['Heroes']">Heroes</a>
       <router-outlet></router-outlet>''',
-  // #enddocregion template-v2
-  directives: const [HeroesComponent],
-  providers: const [HeroService])
-// #docregion , v2
+    // #enddocregion template-v2
+    directives: const [ROUTER_DIRECTIVES],
+    providers: const [HeroService, ROUTER_PROVIDERS])
+@RouteConfig(const [
+  const Route(path: '/heroes', name: 'Heroes', component: HeroesComponent)
+])
+// #docregion ,
 class AppComponent {
   String title = 'Tour of Heroes';
 }

public/docs/_examples/toh-5/dart/lib/hero_detail_component.dart

@@ -1,10 +1,10 @@
 // #docplaster
 // #docregion , v2
 import 'dart:async';
-// #docregion goBack
+// #docregion dart-html
 import 'dart:html';
+// #enddocregion dart-html
 
-// #enddocregion goBack
 import 'package:angular2/core.dart';
 // #docregion added-imports
 import 'package:angular2/router.dart';
@@ -23,9 +23,9 @@ import 'hero_service.dart';
     styleUrls: const ['hero_detail_component.css']
     // #docregion v2
     )
-// #docregion goBack, implement
+// #docregion implement
 class HeroDetailComponent implements OnInit {
-  // #enddocregion goBack, implement
+  // #enddocregion implement
   Hero hero;
   // #docregion ctor
   final HeroService _heroService;
@@ -41,9 +41,10 @@ class HeroDetailComponent implements OnInit {
     if (id != null) hero = await (_heroService.getHero(id));
   }
   // #enddocregion ngOnInit
-  // #docregion goBack
 
+  // #docregion goBack
   void goBack() {
     window.history.back();
   }
+  // #enddocregion goBack
 }

public/docs/dart/latest/tutorial/toh-pt5.jade

@@ -29,6 +29,7 @@ block intro-file-tree
 block keep-app-running
   :marked
     ### Keep the app compiling and running
+
     Open a terminal/console window.
     Start the Dart compiler, watch for changes, and start our server by entering the command:
 
@@ -71,7 +72,7 @@ block router-config-intro
     The `AppComponent` doesn't have a router yet. We'll use the `@RouteConfig`
     annotation to simultaneously:
 
-    - Assign a router to the component and
+    - Assign a router to the component
     - Configure that router with *routes*
 
 block routerLink
@@ -96,10 +97,9 @@ block redirect-vs-use-as-default
 
 block templateUrl-path-resolution
   :marked
-    The given path must resolve to the named [asset][] within the
-    application's package. Assests from other packages can also be accessed
-    by providing a full package reference, such as
-    `'package:some_other_package/dashboard_component.html'`.
+    The value of `templateUrl` can be an [asset][] in this package or another
+    package. To use an asset in another package, use a full package reference,
+    such as `'package:some_other_package/dashboard_component.html'`.
 
     [asset]: https://www.dartlang.org/tools/pub/glossary#asset
 
@@ -118,6 +118,12 @@ block extract-id
   :marked
     Notice how we extract the `id` by calling the `RouteParams.get` method.
 
+block dart-html
+  :marked
+    We'll also need to import `dart:html` to gain access to `window`.
+
+  +makeExcerpt('lib/hero_detail_component.dart', 'dart-html', '')
+
 block heroes-component-cleanup
   :marked
     Because the template for `HeroesComponent` no longer uses `HeroDetailComponent`

public/docs/ts/_cache/tutorial/toh-pt5.jade

@@ -135,9 +135,9 @@ block keep-app-running
   * Create the file <span ngio-ex>app/app.component.ts</span>.
   * Define an <span if-docs="ts">exported</span> `AppComponent` class.
   * Add an `@Component` !{_decorator} above the class with a `my-app` selector.
-  * Move from `HeroesComponent` to `AppComponent` the
-    * `title` class property, and
-    * `@Component` template `<h1>` element containing a `title` binding.
+  * Move the following from `HeroesComponent` to `AppComponent`:
+    * `title` class property
+    * `@Component` template `<h1>` element, which contains a binding to  `title`
   * Add a `<my-heroes>` element to the app template just below the heading so we still see the heroes.
   * Add `HeroesComponent` to the `!{_declsVsDirectives}` !{_array} of `!{_AppModuleVsAppComp}` so Angular recognizes the `<my-heroes>` tags.
   * Add `HeroService` to the  `providers` !{_array} of `!{_AppModuleVsAppComp}` because we'll need it in every other view.
@@ -315,7 +315,7 @@ block routerLink
 
   Go back to `!{_appRoutingTsVsAppComp}` and teach it to navigate to the dashboard.
 
-  Import `DashboardComponent` and 
+  Import the dashboard component and 
   add the following route definition to the `!{_RoutesVsAtRouteConfig}` !{_array} of definitions.
 
 - var _file = _docsFor == 'dart' ? 'lib/app_component.dart' : 'app/app.routing.ts'
@@ -346,6 +346,8 @@ block redirect-vs-use-as-default
       Learn about the *redirects* in the [Routing](../guide/router.html#!#redirect) chapter.
 
 :marked
+  #### Add navigation to the template
+
   Finally, add a dashboard navigation link to the template, just above the *Heroes* link.
 
 - var _vers = _docsFor == 'dart' ? '' : '.1'
@@ -517,15 +519,15 @@ block route-params
     in the `ActivatedRoute` service and use the `HeroService` to fetch the hero with that `id`.
 
 :marked
-  Add requisite imports first:
+  First, add the requisite imports:
 
 - var _vers = _docsFor == 'dart' ? '' : '.1'
 +makeExcerpt('app/hero-detail.component' + _vers + '.ts', 'added-imports', '')
 
 - var _ActivatedRoute = _docsFor == 'dart' ? 'RouteParams' : 'ActivatedRoute'
 :marked
   Let's have the `!{_ActivatedRoute}` service and the `HeroService` injected
-  into the constructor with their values saved in private fields:
+  into the constructor, saving their values in private fields:
 
 +makeExcerpt('app/hero-detail.component.ts (constructor)', 'ctor')
 
@@ -571,9 +573,12 @@ block extract-id
 
   The user could click one of the two links in the `AppComponent`. Or click the browser's back button.
   We'll add a third option, a `goBack` method that navigates backward one step in the browser's history stack.
-
+  
 +makeExcerpt('app/hero-detail.component.ts', 'goBack')
 
+block dart-html
+  //- N/A
+
 - var _CanDeactivateGuard = _docsFor == 'dart' ? '<em>routerCanDeactivate</em> hook' : '<em>CanDeactivate</em> guard'
 - var _CanDeactivateGuardUri = _docsFor == 'dart' ? 'angular2.router/CanDeactivate-class' : 'router/index/CanDeactivate-interface'
 .l-sub-section
@@ -590,7 +595,8 @@ block extract-id
 
 :marked
   Modifing the template to add this button spurs us to take one more 
-  incremental improvement and migrate the template to its own file:
+  incremental improvement and migrate the template to its own file,
+  called <span ngio-ex>hero-detail.component.html</span>:
 
 +makeExcerpt('app/hero-detail.component.html')
 
@@ -601,10 +607,6 @@ block extract-id
 
 :marked
   Refresh the browser and see the results.
-  Here's the (nearly) finished `HeroDetailComponent` but without the `@Input` !{_decorator} on `hero`
-  &mdash; we'll be cleaning that out soon:
-
-+makeExcerpt('app/hero-detail.component.ts', 'v2')
 
 .l-main-section
 :marked
@@ -891,7 +893,7 @@ block file-tree-end
       .file index.html
       .file package.json
       .file styles.css
-      .file systemjs.config.json
+      .file systemjs.config.js
       .file tsconfig.json
       .file typings.json
 

public/docs/ts/latest/tutorial/toh-pt5.jade

@@ -135,9 +135,9 @@ block keep-app-running
   * Create the file <span ngio-ex>app/app.component.ts</span>.
   * Define an <span if-docs="ts">exported</span> `AppComponent` class.
   * Add an `@Component` !{_decorator} above the class with a `my-app` selector.
-  * Move from `HeroesComponent` to `AppComponent` the
-    * `title` class property, and
-    * `@Component` template `<h1>` element containing a `title` binding.
+  * Move the following from `HeroesComponent` to `AppComponent`:
+    * `title` class property
+    * `@Component` template `<h1>` element, which contains a binding to  `title`
   * Add a `<my-heroes>` element to the app template just below the heading so we still see the heroes.
   * Add `HeroesComponent` to the `!{_declsVsDirectives}` !{_array} of `!{_AppModuleVsAppComp}` so Angular recognizes the `<my-heroes>` tags.
   * Add `HeroService` to the  `providers` !{_array} of `!{_AppModuleVsAppComp}` because we'll need it in every other view.
@@ -315,7 +315,7 @@ block routerLink
 
   Go back to `!{_appRoutingTsVsAppComp}` and teach it to navigate to the dashboard.
 
-  Import `DashboardComponent` and 
+  Import the dashboard component and 
   add the following route definition to the `!{_RoutesVsAtRouteConfig}` !{_array} of definitions.
 
 - var _file = _docsFor == 'dart' ? 'lib/app_component.dart' : 'app/app.routing.ts'
@@ -346,6 +346,8 @@ block redirect-vs-use-as-default
       Learn about the *redirects* in the [Routing](../guide/router.html#!#redirect) chapter.
 
 :marked
+  #### Add navigation to the template
+
   Finally, add a dashboard navigation link to the template, just above the *Heroes* link.
 
 - var _vers = _docsFor == 'dart' ? '' : '.1'
@@ -517,15 +519,15 @@ block route-params
     in the `ActivatedRoute` service and use the `HeroService` to fetch the hero with that `id`.
 
 :marked
-  Add requisite imports first:
+  First, add the requisite imports:
 
 - var _vers = _docsFor == 'dart' ? '' : '.1'
 +makeExcerpt('app/hero-detail.component' + _vers + '.ts', 'added-imports', '')
 
 - var _ActivatedRoute = _docsFor == 'dart' ? 'RouteParams' : 'ActivatedRoute'
 :marked
   Let's have the `!{_ActivatedRoute}` service and the `HeroService` injected
-  into the constructor with their values saved in private fields:
+  into the constructor, saving their values in private fields:
 
 +makeExcerpt('app/hero-detail.component.ts (constructor)', 'ctor')
 
@@ -571,9 +573,12 @@ block extract-id
 
   The user could click one of the two links in the `AppComponent`. Or click the browser's back button.
   We'll add a third option, a `goBack` method that navigates backward one step in the browser's history stack.
-
+  
 +makeExcerpt('app/hero-detail.component.ts', 'goBack')
 
+block dart-html
+  //- N/A
+
 - var _CanDeactivateGuard = _docsFor == 'dart' ? '<em>routerCanDeactivate</em> hook' : '<em>CanDeactivate</em> guard'
 - var _CanDeactivateGuardUri = _docsFor == 'dart' ? 'angular2.router/CanDeactivate-class' : 'router/index/CanDeactivate-interface'
 .l-sub-section
@@ -590,7 +595,8 @@ block extract-id
 
 :marked
   Modifing the template to add this button spurs us to take one more 
-  incremental improvement and migrate the template to its own file:
+  incremental improvement and migrate the template to its own file,
+  called <span ngio-ex>hero-detail.component.html</span>:
 
 +makeExcerpt('app/hero-detail.component.html')
 
@@ -601,10 +607,6 @@ block extract-id
 
 :marked
   Refresh the browser and see the results.
-  Here's the (nearly) finished `HeroDetailComponent` but without the `@Input` !{_decorator} on `hero`
-  &mdash; we'll be cleaning that out soon:
-
-+makeExcerpt('app/hero-detail.component.ts', 'v2')
 
 .l-main-section
 :marked