docs(changelog): add changelog for 4.0.0-beta.7

Previously, the `integration/` tests were failing, because `concurrently "foo"`
does not inherit the `PATH` env var ([more info][1]).

This commit fixes it, by setting the `PATH` env var explicitly:
`concurrently "PATH=$PATH foo"`.

This commit also includes some minor refactoring of the `integration/` tests scripts:

- Move build-related operations to `ci-lite/build.sh` (for consistency).
- Use `yarn run ...` instead of `npm run ...` inside package.json scripts.
- Use global `yarn` (since we are already using it for `aio/`).
- Fix some `travis_fold` statements.

[1]: https://github.com/kimmobrunfeldt/concurrently/issues/61#issuecomment-252081610

.github/ISSUE_TEMPLATE.md

@@ -1,3 +1,7 @@
+<!--
+IF YOU DON'T FILL OUT THE FOLLOWING INFORMATION WE MIGHT CLOSE YOUR ISSUE WITHOUT INVESTIGATING
+-->
+
 **I'm submitting a ...**  (check one with "x")
 ```
 [ ] bug report => search github for a similar issue or PR before submitting
@@ -5,14 +9,18 @@
 [ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question
 ```
 
-**Current behavior** 
+**Current behavior**
 <!-- Describe how the bug manifests. -->
 
 **Expected behavior**
 <!-- Describe what the behavior would be without the bug. -->
 
-**Reproduction of the problem**
-<!-- If the current behavior is a bug or you can illustrate your feature request better with an example, please provide the steps to reproduce and if possible a minimal demo of the problem via https://plnkr.co or similar (you can use this template as a starting point: http://plnkr.co/edit/tpl:AvJOMERrnz94ekVua0u5). -->
+**Minimal reproduction of the problem with instructions**
+<!--
+If the current behavior is a bug or you can illustrate your feature request better with an example, 
+please provide the *STEPS TO REPRODUCE* and if possible a *MINIMAL DEMO* of the problem via
+https://plnkr.co or similar (you can use this template as a starting point: http://plnkr.co/edit/tpl:AvJOMERrnz94ekVua0u5).
+-->
 
 **What is the motivation / use case for changing the behavior?**
 <!-- Describe the motivation or the concrete use case -->
@@ -20,12 +28,12 @@
 **Please tell us about your environment:**
 <!-- Operating system, IDE, package manager, HTTP server, ... -->
 
-* **Angular version:** 2.0.0-rc.X
+* **Angular version:** 2.0.X
 <!-- Check whether this is still an issue in the most recent Angular version -->
 
-* **Browser:** [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ] 
+* **Browser:** [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]
 <!-- All browsers where this could be reproduced -->
  
 * **Language:** [all | TypeScript X.X | ES6/7 | ES5]
- 
+
 * **Node (for AoT issues):** `node --version` =   

.gitignore

@@ -3,6 +3,7 @@
 /dist/
 node_modules
 bower_components
+angular.io/dist
 
 # Include when developing application packages.
 pubspec.lock
@@ -25,3 +26,7 @@ npm-debug.log
 
 # rollup-test output
 /modules/rollup-test/dist/
+
+# angular.io
+/angular.io/node_modules/
+/angular.io/dist/

.nvmrc

@@ -1 +1 @@
-6.6.0
+6.9.5

.pullapprove.yml

@@ -0,0 +1,244 @@
+# Configuration for pullapprove.com
+#
+# Approval access and primary role is determined by info in the project ownership spreadsheet:
+# https://docs.google.com/spreadsheets/d/1-HIlzfbPYGsPr9KuYMe6bLfc4LXzPjpoALqtYRYTZB0/edit?pli=1#gid=0&vpid=A5
+#
+# === GitHub username to Full name map ===
+#
+# alexeagle - Alex Eagle
+# alxhub - Alex Rickabaugh
+# chuckjaz - Chuck Jazdzewski
+# gkalpak - George Kalpakas
+# IgorMinar - Igor Minar
+# kara - Kara Erickson
+# matsko - Matias Niemelä
+# mhevery - Misko Hevery
+# petebacondarwin - Pete Bacon Darwin
+# pkozlowski-opensource - Pawel Kozlowski
+# robwormald - Rob Wormald
+# tbosch - Tobias Bosch
+# vicb - Victor Berchet
+# vikerman - Vikram Subramanian
+
+version: 2
+
+group_defaults:
+  required: 1
+  reset_on_reopened:
+    enabled: true
+  approve_by_comment:
+    enabled: false
+
+groups:
+  root:
+    conditions:
+      files:
+        include:
+          - "*"
+        exclude:
+          - "angular.io/*"
+          - "integration/*"
+          - "modules/*"
+          - "tools/*"
+    users:
+      - IgorMinar
+      - mhevery
+
+  public-api:
+    conditions:
+      files:
+        include:
+          - "tools/public_api_guard/*"
+    users:
+      - IgorMinar
+      - mhevery
+
+  build-and-ci:
+    conditions:
+      files:
+        include:
+          - "*.yml"
+          - "*.json"
+          - "*.lock"
+          - "tools/*"
+        exclude:
+          - "tools/@angular/tsc-wrapped/*"
+          - "tools/public_api_guard/*"
+    users:
+      - IgorMinar #primary
+      - mhevery
+
+  integration:
+    conditions:
+      files:
+        - "integration/*"
+    users:
+      - alexeagle
+      - mhevery
+      - tbosch
+      - vicb
+      - IgorMinar #fallback
+
+
+  core:
+    conditions:
+      files:
+        - "modules/@angular/core/*"
+    users:
+      - tbosch #primary
+      - mhevery
+      - vicb
+      - IgorMinar #fallback
+
+  compiler/animations:
+    conditions:
+      files:
+        - "modules/@angular/compiler/src/animation/*"
+    users:
+      - matsko #primary
+      - tbosch
+      - IgorMinar #fallback
+      - mhevery #fallback
+
+  compiler/i18n:
+    conditions:
+      files:
+        - "modules/@angular/compiler/src/i18n/*"
+    users:
+      - vicb #primary
+      - tbosch
+      - IgorMinar #fallback
+      - mhevery #fallback
+
+  compiler:
+    conditions:
+      files:
+        - "modules/@angular/compiler/*"
+    users:
+      - tbosch #primary
+      - mhevery
+      - IgorMinar #fallback
+
+  compiler-cli:
+    conditions:
+      files:
+        - "tools/@angular/tsc-wrapped/*"
+        - "modules/@angular/compiler-cli/*"
+    users:
+      - alexeagle
+      - chuckjaz
+      - tbosch
+      - IgorMinar #fallback
+      - mhevery #fallback
+
+  common:
+    conditions:
+      files:
+        - "modules/@angular/common/*"
+    users:
+      - pkozlowski-opensource #primary
+      - vicb
+      - IgorMinar #fallback
+      - mhevery #fallback
+
+  forms:
+    conditions:
+      files:
+        - "modules/@angular/forms/*"
+    users:
+      - kara #primary
+      # needs secondary
+      - IgorMinar #fallback
+      - mhevery #fallback
+
+  http:
+    conditions:
+      files:
+        - "modules/@angular/http/*"
+    users:
+      - vikerman #primary
+      - alxhub
+      - IgorMinar #fallback
+      - mhevery #fallback
+
+  language-service:
+    conditions:
+      files:
+        - "modules/@angular/language-service/*"
+    users:
+      - chuckjaz #primary
+      # needs secondary
+      - IgorMinar #fallback
+      - mhevery #fallback
+
+  router:
+    conditions:
+      files:
+        - "modules/@angular/router/*"
+    users:
+      - vicb #primary
+      # needs secondary
+      - IgorMinar #fallback
+      - mhevery #fallback
+
+  upgrade:
+    conditions:
+      files:
+        - "modules/@angular/upgrade/*"
+    users:
+      - petebacondarwin #primary
+      - gkalpak
+      - IgorMinar #fallback
+      - mhevery #fallback
+
+  platform-browser:
+    conditions:
+      files:
+        - "modules/@angular/platform-browser/*"
+    users:
+      - tbosch #primary
+      - vicb
+      - IgorMinar #fallback
+      - mhevery #fallback
+
+  platform-server:
+    conditions:
+      files:
+        - "modules/@angular/platform-server/*"
+    users:
+      - vikerman #primary
+      - alxhub
+      - IgorMinar #fallback
+      - mhevery #fallback
+
+  platform-webworker:
+    conditions:
+      files:
+        - "modules/@angular/platform-webworker/*"
+    users:
+      - vicb #primary
+      # needs secondary
+      - IgorMinar #fallback
+      - mhevery #fallback
+
+
+
+  benchpress:
+    conditions:
+      files:
+        - "modules/@angular/benchpress/*"
+    users:
+      - tbosch #primary
+      # needs secondary
+      - IgorMinar #fallback
+      - mhevery #fallback
+
+  angular.io:
+    conditions:
+      files:
+        - "angular.io/*"
+    users:
+      - IgorMinar
+      - robwormald
+      - petebacondarwin
+      - mhevery #fallback

.travis.yml

@@ -1,7 +1,11 @@
 language: node_js
 sudo: false
 node_js:
-  - '6.6.0'
+  - '6.9.5'
+
+git:
+  # Increased from default (50) to ensure last release tag is in this range
+  depth: 150
 
 addons:
 #  firefox: "38.0"
@@ -17,23 +21,31 @@ branches:
     - g3_v2_0
 
 cache:
+  yarn: true
   directories:
      - ./node_modules
      - ./.chrome/chromium
+     - ./angular.io/node_modules
 
 env:
   global:
     # GITHUB_TOKEN_ANGULAR
     # This is needed for the e2e Travis matrix task to publish packages to github for continuous packages delivery.
     - secure: "fq/U7VDMWO8O8SnAQkdbkoSe2X92PVqg4d044HmRYVmcf6YbO48+xeGJ8yOk0pCBwl3ISO4Q2ot0x546kxfiYBuHkZetlngZxZCtQiFT9kyId8ZKcYdXaIW9OVdw3Gh3tQyUwDucfkVhqcs52D6NZjyE2aWZ4/d1V4kWRO/LMgo="
+    # FIREBASE_TOKEN
+    # This is needed for publishing builds to the "aio-staging" firebase site.
+    # TODO(i): the token was generated using the iminar@google account, we should switch to a shared/role-base account.
+    - secure: "MPx3UM77o5IlhT75PKHL0FXoB5tSXDc3vnCXCd1sRy4XUTZ9vjcV6nNuyqEf+SOw659bGbC1FI4mACGx1Q+z7MQDR85b1mcA9uSgHDkh+IR82CnCVdaX9d1RXafdJIArahxfmorbiiPPLyPIKggo7ituRm+2c+iraoCkE/pXxYg="
   matrix:
     # Order: a slower build first, so that we don't occupy an idle travis worker waiting for others to complete.
-   - CI_MODE=js
-   - CI_MODE=e2e
-   - CI_MODE=saucelabs_required
-   - CI_MODE=browserstack_required
-   - CI_MODE=saucelabs_optional
-   - CI_MODE=browserstack_optional
+    - CI_MODE=e2e EXPERIMENTAL_ES2015_DISTRO=1
+    - CI_MODE=js
+    - CI_MODE=saucelabs_required
+    - CI_MODE=browserstack_required
+    - CI_MODE=saucelabs_optional
+    - CI_MODE=browserstack_optional
+    - CI_MODE=docs_test
+    - CI_MODE=aio
 
 matrix:
   fast_finish: true
@@ -47,5 +59,8 @@ install:
 script:
   - ./scripts/ci-lite/build.sh && ./scripts/ci-lite/test.sh
 
+after_success:
+  - ./scripts/ci-lite/deploy_aio_staging.sh
+
 after_script:
   - ./scripts/ci-lite/cleanup.sh

COMMITTER.md

@@ -1,4 +1,4 @@
-# Pushing changes into the Angular 2 tree
+# Pushing changes into the Angular tree
 
 Please see [Using git with Angular repositories](https://docs.google.com/document/d/1h8nijFSaa1jG_UE8v4WP7glh5qOUXnYtAtJh_gwOQHI/edit)
 for details about how we maintain a linear commit history, and the rules for committing.
@@ -6,29 +6,16 @@ for details about how we maintain a linear commit history, and the rules for com
 As a contributor, just read the instructions in [CONTRIBUTING.md](CONTRIBUTING.md) and send a pull request.
 Someone with committer access will do the rest.
 
-## The `PR: merge` label and `presubmit-*` branches
+# Change approvals
 
-We have automated the process for merging pull requests into master. Our goal is to minimize the disruption for
-Angular committers and also prevent breakages on master.
+Change approvals in our monorepo are managed via [pullapprove.com](https://about.pullapprove.com/) and are configured via the `.pullapprove.yaml` file.
 
-When a PR has `pr_state: LGTM` and is ready to merge, you should add the `pr_action: merge` label.
-Currently (late 2015), we need to ensure that each PR will cleanly merge into the Google-internal version control,
-so the caretaker reviews the changes manually.
 
-After this review, the caretaker adds `zomg_admin: do_merge` which is restricted to admins only. 
-A robot running as [mary-poppins](https://github.com/mary-poppins)
-is notified that the label was added by an authorized person,
-and will create a new branch in the angular project, using the convention `presubmit-{username}-pr-{number}`.
+# Merging
 
-(Note: if the automation fails, committers can instead push the commits to a branch following this naming scheme.)
+Once a change has all the approvals either the last approver or the PR author (if PR author has the project collaborator status) should mark the PR with "PR: merge" label.
+This signals to the caretaker that the PR should be merged.
 
-When a Travis build succeeds for a presubmit branch named following the convention,
-Travis will re-base the commits, merge to master, and close the PR automatically.
+# Who is the Caretaker?
 
-Finally, after merge `mary-poppins` removes the presubmit branch.
-
-## Administration
-
-The list of users who can trigger a merge by adding the `zomg_admin: do_merge` label is stored in our appengine app datastore.
-Edit the contents of the [CoreTeamMember Table](
-https://console.developers.google.com/project/angular2-automation/datastore/query?queryType=KindQuery&namespace=&kind=CoreTeamMember)
+See [this explanation](https://twitter.com/IgorMinar/status/799365744806854656).

CONTRIBUTING.md

@@ -1,6 +1,6 @@
-# Contributing to Angular 2
+# Contributing to Angular
 
-We would love for you to contribute to Angular 2 and help make it even better than it is
+We would love for you to contribute to Angular and help make it even better than it is
 today! As a contributor, here are the guidelines we would like you to follow:
 
  - [Code of Conduct](#coc)
@@ -17,19 +17,27 @@ Help us keep Angular open and inclusive. Please read and follow our [Code of Con
 
 ## <a name="question"></a> Got a Question or Problem?
 
-If you have questions about how to *use* Angular, please direct them to the [Google Group][angular-group]
-discussion list or [StackOverflow][stackoverflow]. Please note that Angular 2 is still in early developer preview, and the core team's capacity to answer usage questions is limited. We are also available on [Gitter][gitter].
+Please, do not open issues for the general support questions as we want to keep GitHub issues for bug reports and feature requests. You've got much better chances of getting your question answered on [StackOverflow](https://stackoverflow.com/questions/tagged/angular) where the questions should be tagged with tag `angular`.
 
-## <a name="issue"></a> Found an Issue?
+StackOverflow is a much better place to ask questions since:
+
+- there are thousands of people willing to help on StackOverflow
+- questions and answers stay available for public viewing so your question / answer might help someone else
+- StackOverflow's voting system assures that the best answers are prominently visible.
+
+To save your and our time we will be systematically closing all the issues that are requests for general support and redirecting people to StackOverflow.
+
+If you would like to chat about the question in real-time, you can reach out via [our gitter channel][gitter].
+
+## <a name="issue"></a> Found a Bug?
 If you find a bug in the source code, you can help us by
 [submitting an issue](#submit-issue) to our [GitHub Repository][github]. Even better, you can
 [submit a Pull Request](#submit-pr) with a fix.
 
-## <a name="feature"></a> Want a Feature?
-You can *request* a new feature by [submitting an issue](#submit-issue) to our [GitHub
-Repository][github]. If you would like to *implement* a new feature, please submit an issue with
-a proposal for your work first, to be sure that we can use it. Angular 2 is in developer preview
-and we are not ready to accept major contributions ahead of the full release.
+## <a name="feature"></a> Missing a Feature?
+You can *request* a new feature by [submitting an issue](#submit-issue) to our GitHub
+Repository. If you would like to *implement* a new feature, please submit an issue with
+a proposal for your work first, to be sure that we can use it.
 Please consider what kind of change it is:
 
 * For a **Major Feature**, first open an issue and outline your proposal so that it can be
@@ -40,24 +48,22 @@ and help you to craft the change so that it is successfully accepted into the pr
 ## <a name="submit"></a> Submission Guidelines
 
 ### <a name="submit-issue"></a> Submitting an Issue
-Before you submit an issue, search the archive, maybe your question was already answered.
 
-If your issue appears to be a bug, and hasn't been reported, open a new issue.
-Help us to maximize the effort we can spend fixing issues and adding new
-features, by not reporting duplicate issues.  Providing the following information will increase the
-chances of your issue being dealt with quickly:
+Before you submit an issue, please search the issue tracker, maybe an issue for your problem already exists and the discussion might inform you of workarounds readily available.
 
-* **Overview of the Issue** - if an error is being thrown a non-minified stack trace helps
-* **Angular Version** - what version of Angular is affected (e.g. 2.0.0-alpha.53)
-* **Motivation for or Use Case** - explain what are you trying to do and why the current behavior is a bug for you
-* **Browsers and Operating System** - is this a problem with all browsers?
-* **Reproduce the Error** - provide a live example (using [Plunker][plunker],
-  [JSFiddle][jsfiddle] or [Runnable][runnable]) or a unambiguous set of steps
-* **Related Issues** - has a similar issue been reported before?
-* **Suggest a Fix** - if you can't fix the bug yourself, perhaps you can point to what might be
-  causing the problem (line of code or commit)
+We want to fix all the issues as soon as possible, but before fixing a bug we need to reproduce and confirm it. In order to reproduce bugs we will systematically ask you to provide a minimal reproduction scenario using http://plnkr.co. Having a live, reproducible scenario gives us wealth of important information without going back & forth to you with additional questions like:
 
-You can file new issues by providing the above information [here](https://github.com/angular/angular/issues/new).
+- version of Angular used
+- 3rd-party libraries and their versions
+- and most importantly - a use-case that fails
+
+A minimal reproduce scenario using http://plnkr.co/ allows us to quickly confirm a bug (or point out coding problem) as well as confirm that we are fixing the right problem. If plunker is not a suitable way to demonstrate the problem (for example for issues related to our npm packaging), please create a standalone git repository demonstrating the problem.
+
+We will be insisting on a minimal reproduce scenario in order to save maintainers time and ultimately be able to fix more bugs. Interestingly, from our experience users often find coding problems themselves while preparing a minimal plunk. We understand that sometimes it might be hard to extract essentials bits of code from a larger code-base but we really need to isolate the problem before we can fix it.
+
+Unfortunately we are not able to investigate / fix bugs without a minimal reproduction, so if we don't hear back from you we are going to close an issue that don't have enough info to be reproduced.
+
+You can file new issues by filling out our [new issue form](https://github.com/angular/angular/issues/new).
 
 
 ### <a name="submit-pr"></a> Submitting a Pull Request (PR)
@@ -95,7 +101,7 @@ Before you submit your Pull Request (PR) consider the following guidelines:
 * In GitHub, send a pull request to `angular:master`.
 * If we suggest changes then:
   * Make the required updates.
-  * Re-run the Angular 2 test suites to ensure tests are still passing.
+  * Re-run the Angular test suites to ensure tests are still passing.
   * Rebase your branch and force push to your GitHub repository (this will update your Pull Request):
 
     ```shell
@@ -185,21 +191,44 @@ If the commit reverts a previous commit, it should begin with `revert: `, follow
 ### Type
 Must be one of the following:
 
-* **feat**: A new feature
-* **fix**: A bug fix
-* **docs**: Documentation only changes
-* **style**: Changes that do not affect the meaning of the code (white-space, formatting, missing
-  semi-colons, etc)
-* **refactor**: A code change that neither fixes a bug nor adds a feature
-* **perf**: A code change that improves performance
-* **test**: Adding missing tests or correcting existing tests
 * **build**: Changes that affect the build system or external dependencies (example scopes: gulp, broccoli, npm)
 * **ci**: Changes to our CI configuration files and scripts (example scopes: Travis, Circle, BrowserStack, SauceLabs)
-* **chore**: Other changes that don't modify `src` or `test` files
+* **docs**: Documentation only changes
+* **feat**: A new feature
+* **fix**: A bug fix
+* **perf**: A code change that improves performance
+* **refactor**: A code change that neither fixes a bug nor adds a feature
+* **style**: Changes that do not affect the meaning of the code (white-space, formatting, missing
+  semi-colons, etc)
+* **test**: Adding missing tests or correcting existing tests
 
 ### Scope
-The scope could be anything specifying place of the commit change. For example
-`Compiler`, `ElementInjector`, etc.
+The scope should be the name of the npm package affected (as perceived by person reading changelog generated from commit messages.
+
+The following is the list of supported scopes:
+
+* **common**
+* **compiler**
+* **compiler-cli**
+* **core**
+* **forms**
+* **http**
+* **language-service**
+* **platform-browser**
+* **platform-browser-dynamic**
+* **platform-server**
+* **platform-webworker**
+* **platform-webworker-dynamic**
+* **router**
+* **upgrade**
+* **tsc-wrapped**
+
+There is currently few exception to the "use package name" rule:
+
+* **packaging**: used for changes that change the npm package layout in all of our packages, e.g. public path changes, package.json changes done to all packages, d.ts file/format changes, changes to bundles, etc.
+* **changelog**: used for updating the release notes in CHANGELOG.md
+* **aio**: used for angular.io changes within the /angular.io directory of the repo
+* none/empty string: useful for `style`, `test` and `refactor` changes that are done across all packages (e.g. `style: add missing semicolons`)
 
 ### Subject
 The subject contains succinct description of the change:
@@ -238,7 +267,7 @@ changes to be accepted, the CLA must be signed. It's a quick process, we promise
 [github]: https://github.com/angular/angular
 [gitter]: https://gitter.im/angular/angular
 [individual-cla]: http://code.google.com/legal/individual-cla-v1.0.html
-[js-style-guide]: https://google.github.io/styleguide/javascriptguide.xml
+[js-style-guide]: https://google.github.io/styleguide/jsguide.html
 [jsfiddle]: http://jsfiddle.net
 [plunker]: http://plnkr.co/edit
 [runnable]: http://runnable.com

DEVELOPER.md

@@ -1,6 +1,6 @@
-# Building and Testing Angular 2 for JS
+# Building and Testing Angular
 
-This document describes how to set up your development environment to build and test Angular 2 JS version. 
+This document describes how to set up your development environment to build and test Angular.
 It also explains the basic mechanics of using `git`, `node`, and `npm`.
 
 * [Prerequisite Software](#prerequisite-software)
@@ -71,9 +71,24 @@ particular `gulp` and `protractor` commands. If you prefer, you can drop this pa
 Since global installs can become stale, and required versions can vary by project, we avoid their
 use in these instructions.
 
-*Option 2*: defining a bash alias like `alias nbin='PATH=$(npm bin):$PATH'` as detailed in this
+*Option 2*: globally installing the package `npm-run` by running `npm install -g npm-run`
+(you might need to prefix this command with `sudo`). You will then be able to run locally installed
+package scripts by invoking: e.g., `npm-run gulp build`
+(see [npm-run project page](https://github.com/timoxley/npm-run) for more details).
+
+
+*Option 3*: defining a bash alias like `alias nbin='PATH=$(npm bin):$PATH'` as detailed in this
 [Stackoverflow answer](http://stackoverflow.com/questions/9679932/how-to-use-package-installed-locally-in-node-modules/15157360#15157360) and used like this: e.g., `nbin gulp build`.
 
+## Installing Bower Modules
+
+Now run `bower` to install additional dependencies:
+
+```shell
+# Install other Angular project dependencies (bower.json)
+bower install
+```
+
 ## Windows only
 
 In order to create the right symlinks, run **as administrator**:
@@ -114,7 +129,7 @@ You should execute the 3 test suites before submitting a PR to github.
 All the tests are executed on our Continuous Integration infrastructure and a PR could only be merged once the tests pass.
 
 - CircleCI fails if your code is not formatted properly,
-- Travis CI fails if any of the test suite describe above fails.
+- Travis CI fails if any of the test suites described above fails.
 
 ## Update the public API tests
 
@@ -124,9 +139,10 @@ If you happen to modify the public API of Angular, API golden files must be upda
 $ gulp public-api:update
 ```
 
-Note: The command `./test.sh tools` fails when the API doesn't match the golden files.
+Note: The command `gulp public-api:enforce` fails when the API doesn't match the golden files. Make sure to rebuild
+the project before trying to verify after an API change.
 
-## Formatting your source code
+## <a name="clang-format"></a> Formatting your source code
 
 Angular uses [clang-format](http://clang.llvm.org/docs/ClangFormat.html) to format the source code. If the source code
 is not properly formatted, the CI will fail and the PR can not be merged.
@@ -137,4 +153,38 @@ You can automatically format your code by running:
 $ gulp format
 ```
 
+## Linting/verifying your source code
 
+You can check that your code is properly formatted and adheres to coding style by running:
+
+``` shell
+$ gulp lint
+```
+
+## Publishing snapshot builds
+
+When the `master` branch successfully builds on Travis, it automatically publishes build artifacts
+to repositories in the Angular org, eg. the `@angular/core` package is published to
+http://github.com/angular/core-builds.
+The ES2015 version of Angular is published to a different branch in these repos, for example
+http://github.com/angular/core-builds#master-es2015
+
+You may find that your un-merged change needs some validation from external participants.
+Rather than requiring them to pull your Pull Request and build Angular locally, you can
+publish the `*-builds` snapshots just like our Travis build does.
+
+First time, you need to create the github repositories:
+
+``` shell
+$ export TOKEN=[get one from https://github.com/settings/tokens]
+$ CREATE_REPOS=1 ./scripts/publish/publish-build-artifacts.sh [github username]
+```
+
+For subsequent snapshots, just run
+
+``` shell
+$ ./scripts/publish/publish-build-artifacts.sh [github username]
+```
+
+The script will publish the build snapshot to a branch with the same name as your current branch,
+and create it if it doesn't exist.

LICENSE

@@ -1,6 +1,6 @@
 The MIT License
 
-Copyright (c) 2014-2016 Google, Inc. http://angular.io
+Copyright (c) 2014-2017 Google, Inc. http://angular.io
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

NAMING.md

@@ -1,7 +1,7 @@
-Naming Conventions in Angular2
+Naming Conventions in Angular
 ---
 
-In general Angular2 should follow TypeScript naming conventions.
+In general Angular should follow TypeScript naming conventions.
 See: https://github.com/Microsoft/TypeScript/wiki/Coding-guidelines
 
 

README.md

@@ -4,18 +4,14 @@
 [![Issue Stats](http://issuestats.com/github/angular/angular/badge/pr?style=flat)](http://issuestats.com/github/angular/angular)
 [![Issue Stats](http://issuestats.com/github/angular/angular/badge/issue?style=flat)](http://issuestats.com/github/angular/angular)
 [![npm version](https://badge.fury.io/js/%40angular%2Fcore.svg)](https://badge.fury.io/js/%40angular%2Fcore)
-[![Downloads](http://img.shields.io/npm/dm/angular2.svg)](https://npmjs.org/package/angular2)
 
-[![Sauce Test Status](https://saucelabs.com/browser-matrix/angular2-ci.svg)](https://saucelabs.com/u/angular2-ci)  
+[![Sauce Test Status](https://saucelabs.com/browser-matrix/angular2-ci.svg)](https://saucelabs.com/u/angular2-ci)
 *Safari (7+), iOS (7+), Edge (14) and IE mobile (11) are tested on [BrowserStack][browserstack].*
 
 Angular
 =========
 
-Angular is a development platform for building mobile and desktop web applications. This is the
-repository for [Angular 2][ng2] Typescript/JavaScript (JS).
- 
-Angular2 for [Dart][dart] can be found at [dart-lang/angular2][ng2dart].
+Angular is a development platform for building mobile and desktop web applications using Typescript/JavaScript (JS) and other languages.
 
 
 ## Quickstart
@@ -30,9 +26,5 @@ guidelines for [contributing][contributing] and then check out one of our issues
 
 [browserstack]: https://www.browserstack.com/
 [contributing]: http://github.com/angular/angular/blob/master/CONTRIBUTING.md
-[dart]: http://www.dartlang.org
 [quickstart]: https://angular.io/docs/ts/latest/quickstart.html
-[ng2]: http://angular.io
-[ngDart]: http://angulardart.org
-[ngJS]: http://angularjs.org
-[ng2dart]: https://github.com/dart-lang/angular2
+[ng]: http://angular.io

SAVED_REPLIES.md

@@ -0,0 +1,62 @@
+# Saved Responses for Angular's Issue Tracker
+
+The following are canned responses that the Angular team should use to close issues on our issue tracker that fall into the listed resolution categories.
+
+Since GitHub currently doesn't allow us to have a repository-wide or organization-wide list of [saved replies](https://help.github.com/articles/working-with-saved-replies/), these replies need to be maintained by individual team members. Since the responses can be modified in the future, all responses are versioned to simplify the process of keeping the responses up to date.
+
+
+## Angular: Already Fixed (v1)
+```
+Thanks for reporting this issue. Luckily it has already been fixed in one of the recent releases. Please update to the most recent version to resolve the problem.
+
+If after upgrade the problem still exists in your application please open a new issue and provide a plunker reproducing the problem and describing the difference between the expected and current behavior. You can use this plunker template: http://plnkr.co/edit/tpl:AvJOMERrnz94ekVua0u5?p=catalogue
+```
+
+## Angular: Don't Understand (v1)
+```
+I'm sorry but we don't understand the problem you are reporting.
+
+If the problem still exists please open a new issue and provide a plunker reproducing the problem and describing the difference between the expected and current behavior. You can use this plunker template: http://plnkr.co/edit/tpl:AvJOMERrnz94ekVua0u5?p=catalogue
+```
+
+
+## Angular: Duplicate (v1)
+```
+Thanks for reporting this issue. However this issue is a duplicate of an existing issue #<ISSUE_NUMBER>. Please subscribe to that issue for future updates.
+```
+
+
+## Angular: Insufficient Information Provided (v1)
+```
+Thanks for reporting this issue. However, you didn't provide sufficient information for us to understand and reproduce the problem. Please check out [our submission guidelines](https://github.com/angular/angular/blob/master/CONTRIBUTING.md#-submitting-an-issue) to understand why we can't act on issues that are lacking important information.
+
+If the problem still persists, please file a new issue and ensure you provide all of the required information when filling out the issue template.
+```
+
+## Angular: Issue Outside of Angular (v1)
+```
+I'm sorry but this issue is not caused by Angular. Please contact the author(s) of project <PROJECT NAME> or file issue on their issue tracker.
+```
+
+
+## Angular: Non-reproducible (v1)
+```
+I'm sorry but we can't reproduce the problem following the instructions you provided.
+
+If the problem still exists please open a new issue following [our submission guidelines](https://github.com/angular/angular/blob/master/CONTRIBUTING.md#-submitting-an-issue).
+```
+
+## Angular: Obsolete (v1)
+```
+Thanks for reporting this issue. This issue is now obsolete due to changes in the recent releases. Please update to the most recent Angular version.
+
+If the problem still persists, please file a new issue and ensure you provide the version of Angular affected and include the steps to reproduce the problem when filling out the issue template.
+```
+
+
+## Angular: Support Request (v1)
+```
+Hello, we reviewed this issue and determined that it doesn't fall into the bug report or feature request category. This issue tracker is not suitable for support requests, please repost your issue on [StackOverflow](http://stackoverflow.com/) using tag `angular`.
+
+If you are wondering why we don't resolve support issues via the issue tracker, please [check out this explanation](https://github.com/angular/angular/blob/master/CONTRIBUTING.md#-got-a-question-or-problem).
+```

TOOLS.md

@@ -1,4 +1,4 @@
-# Developer Tools for Angular 2
+# Developer Tools for Angular
 
 Here you will find a collection of tools and tips for keeping your application
 perform well and contain fewer bugs.

TRIAGE_AND_LABELS.md

@@ -1,7 +1,7 @@
-# Triage Process and Github Labels for Angular 2
+# Triage Process and Github Labels for Angular
 
 This document describes how the Angular team uses labels and milestones 
-to triage issues on github. The basic idea of the new process is that 
+to triage issues on github. The basic idea of the process is that
 caretaker only assigns a component and type (bug, feature) label. The 
 owner of the component than is in full control of how the issues should 
 be triaged further.
@@ -17,26 +17,27 @@ with it.
 
 * `comp: animations`: `@matsko`
 * `comp: benchpress`: `@tbosch`
-* `comp: build/ci`: `@IgorMinar` -- All build and CI scripts 
+* `comp: build & ci`: `@IgorMinar` -- All build and CI scripts 
 * `comp: common`: `@mhevery`  -- This includes core components / pipes.
-* `comp: core/compiler`: `@tbosch` -- Because core and compiler are very 
+* `comp: core & compiler`: `@tbosch` -- Because core and compiler are very 
   intertwined, we will be treating them as one.
 * `comp: forms`: `@kara`
 * `comp: http`: `@jeffbcross`
 * `comp: i18n`: `@vicb`
+* `comp: language service`: `@chuckjaz`
 * `comp: metadata-extractor`: `@chuckjaz`
-* `comp: router`: `@vsavkin`
+* `comp: router`: `@vicb`
 * `comp: testing`: `@juliemr`
 * `comp: upgrade`: `@mhevery`
 * `comp: web-worker`: `@vicb`
-* `comp: zone`: `@mhevery`
+* `comp: zones`: `@mhevery`
 
 There are few components which are cross-cutting. They don't have
 a clear location in the source tree. We will treat them as a component
 even thought no specific source tree is associated with them.
 
-* `comp: documentation`: `@naomiblack`
-* `comp: packaging`: `@mhevery`
+* `comp: docs`: `@naomiblack`
+* `comp: packaging`: `@IgorMinar`
 * `comp: performance`: `@tbosch`
 * `comp: security`: `@IgorMinar`
 
@@ -53,11 +54,11 @@ What kind of problem is this?
 
 ## Caretaker Triage Process
 
-It is the caretaker's responsibility to assign `comp:  *` and `type: *`
-to each new issue as they come in. The reason why we limit the 
-responsibility of the caretaker to these two labels is that it is 
-unlikely that without domain knowledge the caretaker could add any 
-additional labels of value.
+It is the caretaker's responsibility to assign `comp:  *` to each new
+issue as they come in. The reason why we limit the responsibility of the
+caretaker to this one label is that it is likely that without domain
+knowledge the caretaker could mislabel issues or lack knowledge of
+duplicate issues.
 
 
 ## Component's owner Triage Process
@@ -68,11 +69,37 @@ process for their component.
 It will be up to the component owner to determine the order in which the
 issues within the component will be resolved.
 
+Several owners have adopted the issue categorization based on
+[user pain](http://www.lostgarden.com/2008/05/improving-bug-triage-with-user-pain.html)
+used by AngularJS. In this system every issue is assigned frequency and
+severity based on which the total user pain score is calculated.
+
+Following is the definition of various frequency and severity levels:
+
+1. `freq(score): *` – How often does this issue come up? How many developers does this affect?
+    * low (1) - obscure issue affecting a handful of developers
+    * moderate (2) - impacts auxiliary usage patterns, only small number of applications are affected
+    * high (3) - impacts primary usage patterns, affecting most Angular apps
+    * critical (4) - impacts all Angular apps
+1. `severity(score): *` - How bad is the issue?
+    * inconvenience (1) - causes ugly/boilerplate code in apps
+    * confusing (2) - unexpected or inconsistent behavior; hard-to-debug
+    * broken expected use (3) - it's hard or impossible for a developer using Angular to accomplish something that Angular should be able to do
+    * memory leak (4)
+    * regression (5) - functionality that used to work no longer works in a new release due to an unintentional change
+    * security issue (6)
+
+
+These criteria are then used to calculate a "user pain" score as follows:
+
+`pain = severity × frequency`
+
+
 ### Assigning Issues to Milestones
 
 Any issue that is being worked on must have:
 
-* An `assignee`: The person doing the work.
+* An `Assignee`: The person doing the work.
 * A `Milestone`: When we expect to complete this work.
 
 We aim to only have at most three milestones open at a time:

angular.io/.firebaserc

@@ -0,0 +1,5 @@
+{
+  "projects": {
+    "staging": "aio-staging"
+  }
+}

angular.io/README.md

@@ -0,0 +1,31 @@
+# Site
+
+This project was generated with [angular-cli](https://github.com/angular/angular-cli) version 1.0.0-beta.26.
+
+## Development server
+Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
+
+## Code scaffolding
+
+Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive/pipe/service/class/module`.
+
+## Build
+
+Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.
+
+## Running unit tests
+
+Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
+
+## Running end-to-end tests
+
+Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
+Before running the tests make sure you are serving the app via `ng serve`.
+
+## Deploying to GitHub Pages
+
+Run `ng github-pages:deploy` to deploy to GitHub Pages.
+
+## Further help
+
+To get more help on the `angular-cli` use `ng help` or go check out the [Angular-CLI README](https://github.com/angular/angular-cli/blob/master/README.md).

angular.io/angular-cli.json

@@ -0,0 +1,59 @@
+{
+  "project": {
+    "version": "1.0.0-beta.26",
+    "name": "site"
+  },
+  "apps": [
+    {
+      "root": "src",
+      "outDir": "dist",
+      "assets": [
+        "assets",
+        "favicon.ico"
+      ],
+      "index": "index.html",
+      "main": "main.ts",
+      "polyfills": "polyfills.ts",
+      "test": "test.ts",
+      "tsconfig": "tsconfig.json",
+      "prefix": "aio",
+      "styles": [
+        "styles.scss"
+      ],
+      "scripts": [
+
+      ],
+      "environments": {
+        "source": "environments/environment.ts",
+        "dev": "environments/environment.ts",
+        "prod": "environments/environment.prod.ts"
+      }
+    }
+  ],
+  "e2e": {
+    "protractor": {
+      "config": "./protractor.conf.js"
+    }
+  },
+  "test": {
+    "karma": {
+      "config": "./karma.conf.js"
+    }
+  },
+  "defaults": {
+    "styleExt": "css",
+    "prefixInterfaces": false,
+    "inline": {
+      "style": false,
+      "template": false
+    },
+    "spec": {
+      "class": false,
+      "component": true,
+      "directive": true,
+      "module": false,
+      "pipe": true,
+      "service": true
+    }
+  }
+}

angular.io/database.rules.json

@@ -0,0 +1,6 @@
+{
+  "rules": {
+    ".read": "auth != null",
+    ".write": "auth != null"
+  }
+}

angular.io/e2e/app.e2e-spec.ts

@@ -0,0 +1,36 @@
+import { SitePage } from './app.po';
+
+describe('site App', function() {
+  let page: SitePage;
+
+  beforeAll(done => {
+    // Hack:  CI has been failing on first test so
+    // buying time by giving the browser a wake-up call.
+    // Todo:  Find and fix the root cause for flakes.
+    new SitePage().navigateTo().then(done);
+  });
+
+  beforeEach(() => {
+    page = new SitePage();
+  });
+
+  it('should show features text after clicking "Features"', () => {
+    page.navigateTo()
+      .then(() => {
+        return page.featureLink.click();
+      })
+      .then(() => {
+        expect(page.getDocViewerText()).toContain('Progressive web apps');
+      });
+  });
+
+  it('should convert code-example in pipe.html', () => {
+    page.navigateTo()
+      .then(() => {
+        return page.datePipeLink.click();
+      })
+      .then(() => {
+        expect(page.codeExample.count()).toBeGreaterThan(0, 'should have code-example content');
+      });
+  });
+});

angular.io/e2e/app.po.ts

@@ -0,0 +1,19 @@
+import { browser, element, by } from 'protractor';
+
+export class SitePage {
+
+  links = element.all(by.css('md-toolbar a'));
+  datePipeLink = element(by.css('md-toolbar a[aioNavLink="docs/api/common/date-pipe"]'));
+  docViewer = element(by.css('aio-doc-viewer'));
+  codeExample = element.all(by.css('aio-doc-viewer code-example > pre > code'));
+  featureLink = element(by.css('md-toolbar a[aioNavLink="features"]'));
+
+  navigateTo() {
+    return browser.get('/');
+  }
+
+  getDocViewerText() {
+    return this.docViewer.getText();
+  }
+
+}

angular.io/e2e/tsconfig.json

@@ -0,0 +1,16 @@
+{
+  "compileOnSave": false,
+  "compilerOptions": {
+    "declaration": false,
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "module": "commonjs",
+    "moduleResolution": "node",
+    "outDir": "../dist/out-tsc-e2e",
+    "sourceMap": true,
+    "target": "es5",
+    "typeRoots": [
+      "../node_modules/@types"
+    ]
+  }
+}

angular.io/firebase.json

@@ -0,0 +1,14 @@
+{
+  "database": {
+    "rules": "database.rules.json"
+  },
+  "hosting": {
+    "public": "dist",
+    "rewrites": [
+      {
+        "source": "**",
+        "destination": "/index.html"
+      }
+    ]
+  }
+}

angular.io/karma.conf.js

@@ -0,0 +1,42 @@
+// Karma configuration file, see link for more information
+// https://karma-runner.github.io/0.13/config/configuration-file.html
+module.exports = function (config) {
+  config.set({
+    basePath: '',
+    frameworks: ['jasmine', '@angular/cli'],
+    plugins: [
+      require('karma-jasmine'),
+      require('karma-chrome-launcher'),
+      require('karma-remap-istanbul'),
+      require('@angular/cli/plugins/karma')
+    ],
+    files: [
+      { pattern: './src/test.ts', watched: false }
+    ],
+    preprocessors: {
+      './src/test.ts': ['@angular/cli']
+    },
+    mime: {
+      'text/x-typescript': ['ts','tsx']
+    },
+    remapIstanbulReporter: {
+      reports: {
+        html: 'coverage',
+        lcovonly: './coverage/coverage.lcov'
+      }
+    },
+    angularCli: {
+      config: './angular-cli.json',
+      environment: 'dev'
+    },
+    reporters: config.angularCli && config.angularCli.codeCoverage
+              ? ['progress', 'karma-remap-istanbul']
+              : ['progress'],
+    port: 9876,
+    colors: true,
+    logLevel: config.LOG_INFO,
+    autoWatch: true,
+    browsers: ['Chrome'],
+    singleRun: false
+  });
+};

angular.io/package.json

@@ -0,0 +1,56 @@
+{
+  "name": "angular.io",
+  "version": "0.0.0",
+  "main": "index.js",
+  "repository": "git@github.com:angular/angular.git",
+  "author": "Angular",
+  "license": "MIT",
+  "angular-cli": {},
+  "scripts": {
+    "ng": "ng",
+    "start": "ng serve",
+    "build": "ng build",
+    "lint": "tslint \"src/**/*.ts\" --project src/tsconfig.json --type-check && tslint \"e2e/**/*.ts\" --project e2e/tsconfig.json --type-check",
+    "test": "ng test",
+    "pree2e": "webdriver-manager update --standalone false --gecko false",
+    "e2e": "protractor",
+    "deploy-staging": "firebase use staging --token \"$FIREBASE_TOKEN\" && yarn run ~~deploy",
+    "pre~~deploy": "ng build --prod",
+    "~~deploy": "firebase deploy --message \"Commit: $TRAVIS_COMMIT\" --non-interactive --token \"$FIREBASE_TOKEN\""
+  },
+  "private": true,
+  "dependencies": {
+    "@angular/cli": "^1.0.0-beta.29",
+    "@angular/common": "^2.3.1",
+    "@angular/compiler": "^2.3.1",
+    "@angular/core": "^2.3.1",
+    "@angular/forms": "^2.3.1",
+    "@angular/http": "^2.3.1",
+    "@angular/material": "^2.0.0-beta.1",
+    "@angular/platform-browser": "^2.3.1",
+    "@angular/platform-browser-dynamic": "^2.3.1",
+    "@angular/router": "^3.3.1",
+    "core-js": "^2.4.1",
+    "rxjs": "^5.0.1",
+    "ts-helpers": "^1.1.1",
+    "zone.js": "^0.7.2"
+  },
+  "devDependencies": {
+    "@angular/compiler-cli": "^2.3.1",
+    "@types/jasmine": "2.5.38",
+    "@types/node": "^6.0.42",
+    "codelyzer": "~2.0.0-beta.1",
+    "firebase-tools": "^3.2.1",
+    "jasmine-core": "2.5.2",
+    "jasmine-spec-reporter": "2.5.0",
+    "karma": "1.2.0",
+    "karma-chrome-launcher": "^2.0.0",
+    "karma-cli": "^1.0.1",
+    "karma-jasmine": "^1.0.2",
+    "karma-remap-istanbul": "^0.2.1",
+    "protractor": "~4.0.13",
+    "ts-node": "1.2.1",
+    "tslint": "^4.3.0",
+    "typescript": "2.0.10"
+  }
+}

angular.io/protractor.conf.js

@@ -0,0 +1,36 @@
+// Protractor configuration file, see link for more information
+// https://github.com/angular/protractor/blob/master/lib/config.ts
+
+/*global jasmine */
+var SpecReporter = require('jasmine-spec-reporter');
+
+exports.config = {
+  allScriptsTimeout: 11000,
+  getPageTimeout: 30000,
+  specs: [
+    './e2e/**/*.e2e-spec.ts'
+  ],
+  capabilities: {
+    browserName: 'chrome',
+    chromeOptions: {
+      binary: process.env.CHROME_BIN
+    }
+  },
+  directConnect: true,
+  baseUrl: 'http://localhost:4200/',
+  framework: 'jasmine',
+  jasmineNodeOpts: {
+    showColors: true,
+    defaultTimeoutInterval: 30000,
+    print: function() {}
+  },
+  useAllAngular2AppRoots: true,
+  beforeLaunch: function() {
+    require('ts-node').register({
+      project: 'e2e'
+    });
+  },
+  onPrepare: function() {
+    jasmine.getEnv().addReporter(new SpecReporter());
+  }
+};

angular.io/src/app/app.component.html

@@ -0,0 +1,11 @@
+<md-toolbar color="primary" class="app-toolbar">
+    <span>Angular</span>
+    <span><a class="nav-link" aioNavLink="home"> Home </a></span>
+    <span><a class="nav-link" aioNavLink="news"> News</a></span>
+    <span><a class="nav-link" aioNavLink="features"> Features</a></span>
+    <span><a class="nav-link" aioNavLink="docs/api/common/date-pipe"> DatePipe</a></span>
+    <span class="fill-remaining-space"></span>
+</md-toolbar>
+<section class="app-content">
+  <aio-doc-viewer [doc]="navEngine.currentDoc"></aio-doc-viewer>
+</section>

angular.io/src/app/app.component.scss

@@ -0,0 +1,8 @@
+.fill-remaining-space {
+  flex: 1 1 auto;
+}
+.nav-link {
+  margin-right: 10px;
+  margin-left: 20px;
+  cursor: pointer;
+}

angular.io/src/app/app.component.spec.ts

@@ -0,0 +1,29 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { AppComponent } from './app.component';
+import { AppModule } from './app.module';
+
+import { NavEngine } from './nav-engine/nav-engine.service';
+
+describe('AppComponent', () => {
+  let component: AppComponent;
+  let fixture: ComponentFixture<AppComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [ AppModule ],
+      providers: [
+        { provide: NavEngine, useValue: { currentDoc: undefined } }
+      ]
+    });
+    TestBed.compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AppComponent);
+    component = fixture.componentInstance;
+  });
+
+  it('should create', () => {
+    expect(component).toBeDefined();
+  });
+});

angular.io/src/app/app.component.ts

@@ -0,0 +1,12 @@
+import { Component } from '@angular/core';
+
+import { NavEngine } from './nav-engine/nav-engine.service';
+
+@Component({
+  selector: 'aio-shell',
+  templateUrl: './app.component.html',
+  styleUrls:  ['./app.component.scss']
+})
+export class AppComponent {
+  constructor(public navEngine: NavEngine) {}
+}

angular.io/src/app/app.module.ts

@@ -0,0 +1,35 @@
+import { BrowserModule } from '@angular/platform-browser';
+import { NgModule } from '@angular/core';
+import { HttpModule } from '@angular/http';
+import { MdToolbarModule } from '@angular/material/toolbar';
+import { MdButtonModule} from '@angular/material/button';
+
+import { AppComponent } from './app.component';
+import { DocViewerComponent } from './doc-viewer/doc-viewer.component';
+import { embeddedComponents, EmbeddedComponents } from './embedded';
+import { Logger } from './logger.service';
+import { navDirectives, navProviders } from './nav-engine';
+
+@NgModule({
+  imports: [
+    BrowserModule,
+    HttpModule,
+    MdToolbarModule.forRoot(),
+    MdButtonModule.forRoot()
+  ],
+  declarations: [
+    AppComponent,
+    embeddedComponents,
+    DocViewerComponent,
+    navDirectives,
+  ],
+  providers: [
+    EmbeddedComponents,
+    Logger,
+    navProviders
+  ],
+  entryComponents: [ embeddedComponents ],
+  bootstrap: [AppComponent]
+})
+export class AppModule {
+}

angular.io/src/app/doc-viewer/doc-viewer.component.spec.ts

@@ -0,0 +1,308 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+import { Component, DebugElement } from '@angular/core';
+
+import { ComponentFactoryResolver, ElementRef, Injector, NgModule, OnInit, ViewChild } from '@angular/core';
+
+import { Doc, DocMetadata } from '../nav-engine';
+import { DocViewerComponent } from '../doc-viewer/doc-viewer.component';
+
+import { embeddedComponents, EmbeddedComponents } from '../embedded';
+
+
+/// Embedded Test Components ///
+
+///// FooComponent /////
+
+@Component({
+  selector: 'aio-foo',
+  template: `Foo Component`
+})
+class FooComponent {
+
+}
+
+///// BarComponent /////
+
+@Component({
+  selector: 'aio-bar',
+  template: `
+    <hr>
+    <h2>Bar Component</h2>
+    <p #barContent></p>
+    <hr>
+  `
+})
+class BarComponent implements OnInit {
+
+  @ViewChild('barContent') barContentRef: ElementRef;
+
+  constructor(public elementRef: ElementRef) { }
+
+  // Project content in ngOnInit just like CodeExampleComponent
+  ngOnInit() {
+    // Security: this is a test component; never deployed
+    this.barContentRef.nativeElement.innerHTML = this.elementRef.nativeElement.aioBarContent;
+  }
+}
+
+///// BazComponent /////
+
+@Component({
+  selector: 'aio-baz',
+  template: `
+    <div>++++++++++++++</div>
+    <h2>Baz Component</h2>
+    <p #bazContent></p>
+    <div>++++++++++++++</div>
+  `
+})
+class BazComponent implements OnInit {
+
+  @ViewChild('bazContent') bazContentRef: ElementRef;
+
+  constructor(public elementRef: ElementRef) { }
+
+  // Project content in ngOnInit just like CodeExampleComponent
+  ngOnInit() {
+    // Security: this is a test component; never deployed
+    this.bazContentRef.nativeElement.innerHTML = this.elementRef.nativeElement.aioBazContent;
+  }
+}
+///// Test Module //////
+
+const embeddedTestComponents = [FooComponent, BarComponent, BazComponent, ...embeddedComponents];
+
+@NgModule({
+  entryComponents: embeddedTestComponents
+})
+class TestModule { }
+
+//// Test Component //////
+
+@Component({
+  selector: 'aio-test',
+  template: `
+    <aio-doc-viewer>Test Component</aio-doc-viewer>
+  `
+})
+class TestComponent {
+  private currentDoc: Doc;
+
+  @ViewChild(DocViewerComponent) docViewer: DocViewerComponent;
+
+  setDoc(doc: Doc) {
+    if (this.docViewer) {
+      this.docViewer.doc = doc;
+    }
+  }
+}
+
+//////// Tests //////////////
+
+describe('DocViewerComponent', () => {
+  const mockDocMetadata: DocMetadata = { id: 'mock', title: 'Mock Doc', url: '' };
+  let component: TestComponent;
+  let docViewerDE: DebugElement;
+  let docViewerEl: HTMLElement;
+  let fixture: ComponentFixture<TestComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [ TestModule ],
+      declarations: [
+        TestComponent,
+        DocViewerComponent,
+        embeddedTestComponents
+      ],
+      providers: [
+        {provide: EmbeddedComponents, useValue: {components: embeddedTestComponents}}
+      ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(TestComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+    docViewerDE = fixture.debugElement.children[0];
+    docViewerEl = docViewerDE.nativeElement;
+  });
+
+  it('should create a DocViewer', () => {
+    expect(component.docViewer).toBeTruthy();
+  });
+
+  it(('should display nothing when set DocViewer.doc to doc w/o content'), () => {
+    component.docViewer.doc = { metadata: mockDocMetadata, content: '' };
+    expect(docViewerEl.innerHTML).toBe('');
+  });
+
+  it(('should display simple static content doc'), () => {
+    const content = '<p>Howdy, doc viewer</p>';
+    component.docViewer.doc = { metadata: mockDocMetadata, content };
+    expect(docViewerEl.innerHTML).toEqual(content);
+  });
+
+  it(('should display nothing after reset static content doc'), () => {
+    const content = '<p>Howdy, doc viewer</p>';
+    component.docViewer.doc = { metadata: mockDocMetadata, content };
+    fixture.detectChanges();
+    component.docViewer.doc = { metadata: mockDocMetadata, content: '' };
+    expect(docViewerEl.innerHTML).toEqual('');
+  });
+
+  it(('should apply FooComponent'), () => {
+    const content = `
+      <p>Above Foo</p>
+      <p><aio-foo></aio-foo></p>
+      <p>Below Foo</p>
+    `;
+    component.docViewer.doc = { metadata: mockDocMetadata, content };
+    const fooHtml = docViewerEl.querySelector('aio-foo').innerHTML;
+    expect(fooHtml).toContain('Foo Component');
+  });
+
+  it(('should apply multiple FooComponents'), () => {
+    const content = `
+      <p>Above Foo</p>
+      <p><aio-foo></aio-foo></p>
+      <div style="margin-left: 2em;">
+        Holds a
+        <aio-foo>Ignored text</aio-foo>
+      </div>
+      <p>Below Foo</p>
+    `;
+    component.docViewer.doc = { metadata: mockDocMetadata, content };
+    const foos = docViewerEl.querySelectorAll('aio-foo');
+    expect(foos.length).toBe(2);
+  });
+
+  it(('should apply BarComponent'), () => {
+    const content = `
+      <p>Above Bar</p>
+      <aio-bar></aio-bar>
+      <p>Below Bar</p>
+    `;
+    component.docViewer.doc = { metadata: mockDocMetadata, content };
+    const barHtml = docViewerEl.querySelector('aio-bar').innerHTML;
+    expect(barHtml).toContain('Bar Component');
+  });
+
+  it(('should project bar content into BarComponent'), () => {
+    const content = `
+      <p>Above Bar</p>
+      <aio-bar>###bar content###</aio-bar>
+      <p>Below Bar</p>
+    `;
+    component.docViewer.doc = { metadata: mockDocMetadata, content };
+
+    // necessary to trigger projection within ngOnInit
+    fixture.detectChanges();
+
+    const barHtml = docViewerEl.querySelector('aio-bar').innerHTML;
+    expect(barHtml).toContain('###bar content###');
+  });
+
+
+  it(('should include Foo and Bar'), () => {
+    const content = `
+      <p>Top</p>
+      <p><aio-foo>ignored</aio-foo></p>
+      <aio-bar>###bar content###</aio-bar>
+      <p><aio-foo></aio-foo></p>
+      <p>Bottom</p>
+    `;
+    component.docViewer.doc = { metadata: mockDocMetadata, content };
+
+    // necessary to trigger Bar's projection within ngOnInit
+    fixture.detectChanges();
+
+    const foos = docViewerEl.querySelectorAll('aio-foo');
+    expect(foos.length).toBe(2, 'should have 2 foos');
+
+    const barHtml = docViewerEl.querySelector('aio-bar').innerHTML;
+    expect(barHtml).toContain('###bar content###', 'should have bar with projected content');
+  });
+
+  it(('should not include Bar within Foo'), () => {
+    const content = `
+      <p>Top</p>
+      <div>
+        <aio-foo>
+          <aio-bar>###bar content###</aio-bar>
+        </aio-foo>
+      </div>
+      <p><aio-foo></aio-foo><p>
+      <p>Bottom</p>
+    `;
+    component.docViewer.doc = { metadata: mockDocMetadata, content };
+
+    // necessary to trigger Bar's projection within ngOnInit
+    fixture.detectChanges();
+
+    const foos = docViewerEl.querySelectorAll('aio-foo');
+    expect(foos.length).toBe(2, 'should have 2 foos');
+
+    const bars = docViewerEl.querySelectorAll('aio-bar');
+    expect(bars.length).toBe(0, 'did not expect Bar inside Foo');
+  });
+
+  // because FooComponents are processed before BazComponents
+  it(('should include Foo within Bar'), () => {
+    const content = `
+      <p>Top</p>
+      <aio-bar>
+        <div style="margin-left: 2em">
+          Inner <aio-foo></aio-foo>
+        </div>
+      </aio-bar>
+      <p><aio-foo></aio-foo></p>
+      <p>Bottom</p>
+    `;
+    component.docViewer.doc = { metadata: mockDocMetadata, content };
+
+    // necessary to trigger Bar's projection within ngOnInit
+    fixture.detectChanges();
+
+    const foos = docViewerEl.querySelectorAll('aio-foo');
+    expect(foos.length).toBe(2, 'should have 2 foos');
+
+    const bars = docViewerEl.querySelectorAll('aio-bar');
+    expect(bars.length).toBe(1, 'should have a bar');
+    expect(bars[0].innerHTML).toContain('Bar Component', 'should have bar template content');
+  });
+
+  // The <aio-baz> tag and its inner content is copied
+  // But the BazComponent is not created and therefore its template content is not displayed
+  // because BarComponents are processed before BazComponents
+  // and no chance for first Baz inside Bar to be processed by builder.
+  it(('should NOT include Bar within Baz'), () => {
+    const content = `
+      <p>Top</p>
+      <aio-bar>
+        <div style="margin-left: 2em">
+          Inner <aio-baz>---baz stuff---</aio-baz>
+        </div>
+      </aio-bar>
+      <p><aio-baz>---More baz--</aio-baz></p>
+      <p>Bottom</p>
+    `;
+    component.docViewer.doc = { metadata: mockDocMetadata, content };
+
+    // necessary to trigger Bar's projection within ngOnInit
+    fixture.detectChanges();
+    const bazs = docViewerEl.querySelectorAll('aio-baz');
+
+    // Both baz tags are there ...
+    expect(bazs.length).toBe(2, 'should have 2 bazs');
+
+    expect(bazs[0].innerHTML).not.toContain('Baz Component',
+      'did not expect 1st Baz template content');
+
+    expect(bazs[1].innerHTML).toContain('Baz Component',
+      'expected 2nd Baz template content');
+
+  });
+});

angular.io/src/app/doc-viewer/doc-viewer.component.ts

@@ -0,0 +1,130 @@
+import {
+  Component, ComponentFactory, ComponentFactoryResolver, ComponentRef,
+  DoCheck, ElementRef, Injector, Input, OnDestroy, ViewEncapsulation
+} from '@angular/core';
+
+import { Doc, DocMetadata } from '../nav-engine';
+import { EmbeddedComponents } from '../embedded';
+
+interface EmbeddedComponentFactory {
+  contentPropertyName: string;
+  factory: ComponentFactory<any>;
+}
+
+// Initialization prevents flicker once pre-rendering is on
+const initialDocViewerElement = document.querySelector('aio-doc-viewer');
+const initialDocViewerContent = initialDocViewerElement ? initialDocViewerElement.innerHTML : '';
+
+@Component({
+  selector: 'aio-doc-viewer',
+  template: ''
+  // TODO(robwormald): shadow DOM and emulated don't work here (?!)
+  // encapsulation: ViewEncapsulation.Native
+})
+export class DocViewerComponent implements DoCheck, OnDestroy {
+
+  private displayedDoc: DisplayedDoc;
+  private embeddedComponentFactories: Map<string, EmbeddedComponentFactory> = new Map();
+  private hostElement: HTMLElement;
+
+  constructor(
+    componentFactoryResolver: ComponentFactoryResolver,
+    elementRef: ElementRef,
+    embeddedComponents: EmbeddedComponents,
+    private injector: Injector,
+    ) {
+    this.hostElement = elementRef.nativeElement;
+    // Security: the initialDocViewerContent comes from the prerendered DOM and is considered to be secure
+    this.hostElement.innerHTML = initialDocViewerContent;
+
+    for (const component of embeddedComponents.components) {
+      const factory = componentFactoryResolver.resolveComponentFactory(component);
+      const selector = factory.selector;
+      const contentPropertyName = this.selectorToContentPropertyName(selector);
+      this.embeddedComponentFactories.set(selector, { contentPropertyName, factory });
+    }
+  }
+
+  @Input()
+  set doc(newDoc: Doc) {
+    this.ngOnDestroy();
+    if (newDoc) {
+      window.scrollTo(0, 0);
+      this.build(newDoc);
+    }
+  }
+
+  /**
+   * Add doc content to host element and build it out with embedded components
+   */
+  private build(doc: Doc) {
+
+    const displayedDoc = this.displayedDoc = new DisplayedDoc(doc);
+
+    // security: the doc.content is always authored by the documentation team
+    // and is considered to be safe
+    this.hostElement.innerHTML = doc.content || '';
+
+    if (!doc.content) { return; }
+
+    // TODO(i): why can't I use for-of? why doesn't typescript like Map#value() iterators?
+    this.embeddedComponentFactories.forEach(({ contentPropertyName, factory }, selector) => {
+      const embeddedComponentElements = this.hostElement.querySelectorAll(selector);
+
+      // cast due to https://github.com/Microsoft/TypeScript/issues/4947
+      for (const element of embeddedComponentElements as any as HTMLElement[]){
+        // hack: preserve the current element content because the factory will empty it out
+        // security: the source of this innerHTML is always authored by the documentation team
+        // and is considered to be safe
+        element[contentPropertyName] = element.innerHTML;
+        displayedDoc.addEmbeddedComponent(factory.create(this.injector, [], element));
+      }
+    });
+  }
+
+  ngDoCheck() {
+    if (this.displayedDoc) { this.displayedDoc.detectChanges(); }
+  }
+
+  ngOnDestroy() {
+    // destroy components otherwise there will be memory leaks
+    if (this.displayedDoc) {
+      this.displayedDoc.destroy();
+      this.displayedDoc = undefined;
+    }
+  }
+
+  /**
+   * Compute the component content property name by converting the selector to camelCase and appending
+   * 'Content', e.g. live-example => liveExampleContent
+   */
+  private selectorToContentPropertyName(selector: string) {
+    return selector.replace(/-(.)/g, (match, $1) => $1.toUpperCase()) + 'Content';
+  }
+}
+
+class DisplayedDoc {
+
+  metadata: DocMetadata;
+
+  private embeddedComponents: ComponentRef<any>[] = [];
+
+  constructor(doc: Doc) {
+    // ignore doc.content ... don't need to keep it around
+    this.metadata = doc.metadata;
+  }
+
+  addEmbeddedComponent(component: ComponentRef<any>) {
+    this.embeddedComponents.push(component);
+  }
+
+  detectChanges() {
+    this.embeddedComponents.forEach(comp => comp.changeDetectorRef.detectChanges());
+  }
+
+  destroy() {
+    // destroy components otherwise there will be memory leaks
+    this.embeddedComponents.forEach(comp => comp.destroy());
+    this.embeddedComponents.length = 0;
+  }
+}

angular.io/src/app/embedded/code-example.component.spec.ts

@@ -0,0 +1,28 @@
+/* tslint:disable:no-unused-variable */
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+import { DebugElement } from '@angular/core';
+
+import { CodeExampleComponent } from './code-example.component';
+
+describe('CodeExampleComponent', () => {
+  let component: CodeExampleComponent;
+  let fixture: ComponentFixture<CodeExampleComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ CodeExampleComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(CodeExampleComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

angular.io/src/app/embedded/code-example.component.ts

@@ -0,0 +1,73 @@
+/* tslint:disable component-selector */
+
+import { Component, OnInit, ElementRef, ViewChild, AfterViewInit } from '@angular/core';
+
+// TODO(i): add clipboard copy functionality
+
+/**
+ * Angular.io Code Example
+ *
+ * Pretty renders a code block, primarily used in the docs and API reference. Can be used within an Angular app, or
+ * independently, provided that it is dynamically generated by the component resolver.
+ *
+ * Usage:
+ *   <code-example [language]="..." [escape]="..." [format]="..." [showcase]="..." [animated]="...">
+ *     console.log('Hello World')
+ *   </code-example>
+ */
+@Component({
+  selector: 'code-example',
+  template: '<pre class="{{classes}}"><code class="{{animatedClasses}}" #codeContainer></code></pre>'
+})
+export class CodeExampleComponent implements OnInit, AfterViewInit {
+
+  @ViewChild('codeContainer') codeContainerRef: ElementRef;
+
+  language: string; // could be javascript, dart, typescript
+  // TODO(i): escape doesn't seem to be currently supported in the original code
+  escape: string; // could be 'html'
+  format: string; // some css class
+  showcase: string; // a string with the value 'true'
+  animated = false;
+
+  // TODO(i): could we use @HostBinding instead or does the CSS have to be scoped to <pre> and <code>
+  classes: string;
+  animatedClasses: string;
+
+
+  constructor(private elementRef: ElementRef) {
+    // TODO(i): @Input should be supported for host elements and should just do a one off initialization of properties
+    //          from the host element => talk to Tobias
+    ['language', 'escape', 'format', 'showcase', 'animated'].forEach(inputName => {
+      if (!this[inputName]) {
+        this[inputName] = this.elementRef.nativeElement.getAttribute(inputName);
+      }
+    });
+  }
+
+
+  ngOnInit() {
+    const showcaseClass = this.showcase === 'true' ? ' is-showcase' : '';
+    this.classes = `
+      prettyprint
+      ${this.format ? this.format : ''}
+      ${this.language ? 'lang-' + this.language : '' }
+      ${showcaseClass ? showcaseClass : ''}
+    `.trim();
+
+    this.animatedClasses = `${this.animated ? 'animated fadeIn' : ''}`;
+
+    // Security: the codeExampleContent is the original innerHTML of the host element provided by
+    //           docs authors and as such its considered to be safe for innerHTML purposes
+    this.codeContainerRef.nativeElement.innerHTML = this.elementRef.nativeElement.codeExampleContent;
+  }
+
+
+  ngAfterViewInit() {
+    // TODO(i): import prettify.js from this file so that we don't need to preload it via index.html
+    // whenever a code example is used, use syntax highlighting.
+    // if(prettyPrint) {
+    //   prettyPrint();
+    // }
+  }
+}

angular.io/src/app/embedded/index.ts

@@ -0,0 +1,11 @@
+import { CodeExampleComponent } from './code-example.component';
+
+/** Components that can be embedded in docs such as CodeExampleComponent, LiveExampleComponent,... */
+export const embeddedComponents = [
+  CodeExampleComponent
+];
+
+/** Injectable class w/ property returning components that can be embedded in docs */
+export class EmbeddedComponents {
+  components = embeddedComponents;
+}

angular.io/src/app/logger.service.ts

@@ -0,0 +1,17 @@
+import { Injectable } from '@angular/core';
+
+@Injectable()
+export class Logger {
+
+  log(value: any, ...rest) {
+    console.log(value, ...rest);
+  }
+
+  error(value: any, ...rest) {
+    console.error(value, ...rest);
+  }
+
+  warn(value: any, ...rest) {
+    console.warn(value, ...rest);
+  }
+}

angular.io/src/app/nav-engine/doc-fetching.service.spec.ts

@@ -0,0 +1,2 @@
+import { DocFetchingService } from './doc-fetching.service';
+// Write tests when/if this service is retained.

angular.io/src/app/nav-engine/doc-fetching.service.ts

@@ -0,0 +1,45 @@
+import { Http, Response } from '@angular/http';
+import { Injectable } from '@angular/core';
+
+import { Observable } from 'rxjs/Observable';
+import { of } from 'rxjs/observable/of';
+import 'rxjs/add/operator/catch';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/map';
+
+import { Logger } from '../logger.service';
+
+@Injectable()
+export class DocFetchingService {
+
+  constructor(private http: Http, private logger: Logger) { }
+
+  /**
+   * Fetch document from server.
+   * NB: pass 404 response to caller as empty string content
+   * Other errors and non-OK status responses are thrown errors.
+   * TODO: add timeout and retry for lost connection
+   */
+  getFile(url: string): Observable<string> {
+
+    if (!url) {
+      const emsg = 'getFile: no URL';
+      this.logger.error(emsg);
+      throw new Error(emsg);
+    }
+
+    this.logger.log('fetching document file at ', url);
+
+    return this.http.get(url)
+      .map(res => res.text())
+      .do(content => this.logger.log('fetched document file at ', url) )
+      .catch((error: Response) => {
+        if (error.status === 404) {
+          this.logger.error(`Document file not found at '$(url)'`);
+          return of('');
+        } else {
+          throw error;
+        }
+      });
+  }
+}

angular.io/src/app/nav-engine/doc.model.ts

@@ -0,0 +1,10 @@
+export interface DocMetadata {
+  id: string;    // 'home'
+  title: string; // 'Home'
+  url: string;   // 'assets/documents/home.html'
+}
+
+export interface Doc {
+  metadata: DocMetadata;
+  content: string;
+}

angular.io/src/app/nav-engine/doc.service.spec.ts

@@ -0,0 +1,74 @@
+import { fakeAsync, tick } from '@angular/core/testing';
+
+import { DocService } from './doc.service';
+import { Doc, DocMetadata } from './doc.model';
+import { DocFetchingService } from './doc-fetching.service';
+import { SiteMapService } from './sitemap.service';
+
+import { Observable } from 'rxjs/Observable';
+import { of } from 'rxjs/observable/of';
+import 'rxjs/add/operator/catch';
+import 'rxjs/add/operator/delay';
+
+describe('DocService', () => {
+  let docFetchingService: DocFetchingService;
+  let getFileSpy: jasmine.Spy;
+  let loggerSpy: any;
+  let siteMapService: SiteMapService;
+  let docService: DocService;
+
+  beforeEach(() => {
+
+    this.content = 'fake file contents';
+    this.metadata = {
+      id: 'fake',
+      title: 'All about the fake',
+      url: 'assets/documents/fake.html'
+    };
+
+    loggerSpy = jasmine.createSpyObj('logger', ['log', 'warn', 'error']);
+    siteMapService = new SiteMapService();
+    spyOn(siteMapService, 'getDocMetadata').and
+      .callFake((id: string) => of(this.metadata).delay(0));
+
+    docFetchingService = new DocFetchingService(null, loggerSpy);
+    getFileSpy = spyOn(docFetchingService, 'getFile').and
+      .callFake((url: string) => of(this.content).delay(0));
+
+    docService = new DocService(docFetchingService, loggerSpy, siteMapService);
+  });
+
+  it('should return fake doc for fake id', fakeAsync(() => {
+    docService.getDoc('fake').subscribe(doc =>
+      expect(doc.content).toBe(this.content)
+    );
+    tick();
+  }));
+
+  it('should retrieve file once for first file request', fakeAsync(() => {
+    docService.getDoc('fake').subscribe();
+    expect(getFileSpy.calls.count()).toBe(0, 'no call before tick');
+    tick();
+    expect(getFileSpy.calls.count()).toBe(1, 'one call after tick');
+  }));
+
+  it('should retrieve file from cache the second time', fakeAsync(() => {
+    docService.getDoc('fake').subscribe();
+    tick();
+    expect(getFileSpy.calls.count()).toBe(1, 'one call after 1st request');
+
+    docService.getDoc('fake').subscribe();
+    tick();
+    expect(getFileSpy.calls.count()).toBe(1, 'still only one call after 2nd request');
+  }));
+
+  it('should pass along file error through its getDoc observable result', fakeAsync(() => {
+    const err = 'deliberate file error';
+    getFileSpy.and.throwError(err);
+    docService.getDoc('fake').subscribe(
+      doc => expect(false).toBe(true, 'should have failed'),
+      error => expect(error.message).toBe(err)
+    );
+    tick();
+  }));
+});

angular.io/src/app/nav-engine/doc.service.ts

@@ -0,0 +1,60 @@
+import { Injectable } from '@angular/core';
+
+import { Observable } from 'rxjs/Observable';
+import { of } from 'rxjs/observable/of';
+import 'rxjs/add/operator/map';
+import 'rxjs/add/operator/switchMap';
+
+import { Doc, DocMetadata } from './doc.model';
+import { DocFetchingService } from './doc-fetching.service';
+import { Logger } from '../logger.service';
+
+import { SiteMapService } from './sitemap.service';
+
+interface DocCache {
+  [index: string]: Doc;
+}
+
+@Injectable()
+export class DocService {
+  private cache: DocCache = {};
+
+  constructor(
+    private fileService: DocFetchingService,
+    private logger: Logger,
+    private siteMapService: SiteMapService
+    ) { }
+
+  /**
+   * Get document for documentId, from cache if found else server.
+   * Pass server errors along to caller
+   * Caller should interpret empty string content as "404 - file not found"
+   */
+  getDoc(documentId: string): Observable<Doc> {
+    let doc = this.cache[documentId];
+    if (doc) {
+      this.logger.log('returned cached content for ', doc.metadata);
+      return of(cloneDoc(doc));
+    }
+
+    return this.siteMapService
+      .getDocMetadata(documentId)
+      .switchMap(metadata => {
+
+        return this.fileService.getFile(metadata.url)
+          .map(content => {
+            this.logger.log('fetched content for', metadata);
+            doc = { metadata, content };
+            this.cache[metadata.id] = doc;
+            return cloneDoc(doc);
+          });
+      });
+  }
+}
+
+function cloneDoc(doc: Doc) {
+  return {
+    metadata: Object.assign({}, doc.metadata),
+    content: doc.content
+  };
+}

angular.io/src/app/nav-engine/index.ts

@@ -0,0 +1,18 @@
+import { DocService } from './doc.service';
+import { DocFetchingService } from './doc-fetching.service';
+import { NavEngine } from './nav-engine.service';
+import { NavLinkDirective } from './nav-link.directive';
+import { SiteMapService } from './sitemap.service';
+
+export { Doc, DocMetadata } from './doc.model';
+
+export const navDirectives = [
+  NavLinkDirective
+];
+
+export const navProviders = [
+  DocService,
+  DocFetchingService,
+  NavEngine,
+  SiteMapService,
+];

angular.io/src/app/nav-engine/nav-engine.service.spec.ts

@@ -0,0 +1,46 @@
+import { fakeAsync, tick} from '@angular/core/testing';
+
+import { Observable } from 'rxjs/Observable';
+import { of } from 'rxjs/observable/of';
+import 'rxjs/add/operator/delay';
+
+import { DocService } from './doc.service';
+import { Doc, DocMetadata } from './doc.model';
+
+import { NavEngine } from './nav-engine.service';
+
+const fakeDoc: Doc = {
+  metadata: {
+    id: 'fake',
+    title: 'All about the fake',
+    url: 'assets/documents/fake.html'
+  },
+  content: 'fake content'
+};
+
+describe('NavEngine', () => {
+
+  let navEngine: NavEngine;
+
+  beforeEach(() => {
+    this.fakeDoc = {
+      metadata: {
+        id: 'fake',
+        title: 'All about the fake',
+        url: 'assets/documents/fake.html'
+      },
+      content: 'fake content'
+    };
+
+    const docService: any = jasmine.createSpyObj('docService', ['getDoc']);
+    docService.getDoc.and.callFake((id: string) => of(this.fakeDoc).delay(0));
+
+    navEngine = new NavEngine(docService);
+  });
+
+  it('should set currentDoc to fake doc when navigate to fake id', fakeAsync(() => {
+    navEngine.navigate('fake');
+    tick();
+    expect(navEngine.currentDoc.content).toBe(this.fakeDoc.content);
+  }));
+});

angular.io/src/app/nav-engine/nav-engine.service.ts

@@ -0,0 +1,25 @@
+import { Injectable } from '@angular/core';
+
+import { Doc } from './doc.model';
+import { DocService } from './doc.service';
+
+@Injectable()
+export class NavEngine {
+
+  /** Document result of most recent `navigate` call */
+  currentDoc: Doc;
+  constructor(private docService: DocService) {}
+
+  /**
+   * Navigate sets `currentDoc` to the document for `documentId`.
+   * TODO: handle 'Document not found', signaled by empty string content
+   * TODO: handle document retrieval error
+   */
+  navigate(documentId: string) {
+    this.docService.getDoc(documentId).subscribe(
+      doc => this.currentDoc = doc
+    );
+  }
+}
+
+

angular.io/src/app/nav-engine/nav-link.directive.ts

@@ -0,0 +1,19 @@
+import { Directive, HostListener, Input } from '@angular/core';
+import { NavEngine } from './nav-engine.service';
+
+@Directive({
+  selector: '[aioNavLink]'
+})
+export class NavLinkDirective {
+
+  @Input()
+  aioNavLink: string;
+
+  constructor(private navEngine: NavEngine) { }
+
+  @HostListener('click', ['$event'])
+  onClick($event) {
+    this.navEngine.navigate(this.aioNavLink);
+    return false;
+  }
+}

angular.io/src/app/nav-engine/sitemap.service.spec.ts

@@ -0,0 +1,32 @@
+import { fakeAsync, tick } from '@angular/core/testing';
+import { DocMetadata } from './doc.model';
+import { SiteMapService } from './sitemap.service';
+
+describe('SiteMapService', () => {
+  let siteMapService: SiteMapService;
+
+  beforeEach(() => {
+    siteMapService = new SiteMapService();
+  });
+
+  it('should get News metadata', fakeAsync(() => {
+    siteMapService.getDocMetadata('news').subscribe(
+      metadata => expect(metadata.url).toBe('assets/documents/news.html')
+    );
+    tick();
+  }));
+
+  it('should calculate expected doc url for unknown id', fakeAsync(() => {
+    siteMapService.getDocMetadata('fizbuz').subscribe(
+      metadata => expect(metadata.url).toBe('assets/documents/fizbuz.html')
+    );
+    tick();
+  }));
+
+  it('should calculate expected index doc url for unknown id ending in /', fakeAsync(() => {
+    siteMapService.getDocMetadata('fizbuz/').subscribe(
+      metadata => expect(metadata.url).toBe('assets/documents/fizbuz/index.html')
+    );
+    tick();
+  }));
+});

angular.io/src/app/nav-engine/sitemap.service.ts

@@ -0,0 +1,38 @@
+import { Injectable } from '@angular/core';
+
+import { Observable } from 'rxjs/Observable';
+import { of } from 'rxjs/observable/of';
+import { BehaviorSubject } from 'rxjs/BehaviorSubject';
+import 'rxjs/add/operator/map';
+
+import { DocMetadata } from './doc.model';
+
+const siteMap: DocMetadata[] = [
+  { 'title': 'Home', 'url': 'assets/documents/home.html', id: 'home'},
+  { 'title': 'Features', 'url': 'assets/documents/features.html', id: 'features'},
+  { 'title': 'News', 'url': 'assets/documents/news.html', id: 'news'}
+];
+
+@Injectable()
+export class SiteMapService {
+  private siteMap = new BehaviorSubject(siteMap);
+
+  getDocMetadata(id: string) {
+    const missing = () => this.getMissingMetadata(id);
+    return this.siteMap
+      .map(map =>
+        map.find(d => d.id === id) || missing());
+  }
+
+  // Alternative way to calculate metadata. Will it be used?
+  private getMissingMetadata(id: string) {
+
+    const filename = id.startsWith('/') ? id.substring(1) : id; // strip leading '/'
+
+    return {
+      id,
+      title: id,
+      url: `assets/documents/${filename}${filename.endsWith('/') ? 'index' : ''}.html`
+    } as DocMetadata;
+  }
+}

angular.io/src/assets/documents/docs/api/common/date-pipe.html

@@ -0,0 +1,239 @@
+<header class="hero background-sky"><h1 class="hero-title is-standard-case">DatePipe</h1><span
+    class="badge is-stable">Stable</span>
+  <div class="clear"></div>
+  <h2 class="hero-subtitle">Pipe</h2></header>
+<article class="l-content-small grid-fluid docs-content">
+  <div layout="row" layout-xs="column" class="row-margin">
+    <div flex="20" flex-xs="100"><h2 class="h2-api-docs">What it does</h2></div>
+    <div flex="80" flex-xs="100"><p>Formats a date according to locale rules.</p>
+    </div>
+  </div>
+  <div layout="row" layout-xs="column" class="row-margin">
+    <div flex="20" flex-xs="100"><h2 class="h2-api-docs">How to use</h2></div>
+    <div flex="80" flex-xs="100"><p><code>date_expression | date[:format]</code></p>
+    </div>
+  </div>
+  <div layout="row" layout-xs="column" class="row-margin">
+    <div flex="20" flex-xs="100"><h2 class="h2-api-docs">NgModule</h2></div>
+    <div flex="80" flex-xs="100" class="code-links">CommonModule
+
+    </div>
+  </div>
+  <div layout="row" layout-xs="column" class="row-margin">
+    <div flex="20" flex-xs="100"><h2 class="h2-api-docs">Description</h2></div>
+    <div flex="80" flex-xs="100" class="code-links"><p>Where:</p>
+      <ul>
+        <li><code>expression</code> is a date object or a number (milliseconds since UTC epoch) or
+          an ISO string
+          (<a href="https://www.w3.org/TR/NOTE-datetime">https://www.w3.org/TR/NOTE-datetime</a>).
+        </li>
+        <li><code>format</code> indicates which date/time components to include. The format can be
+          predifined as
+          shown below or custom as shown in the table.
+          <ul>
+            <li><code>&#39;medium&#39;</code>: equivalent to <code>&#39;yMMMdjms&#39;</code> (e.g.
+              <code>Sep 3, 2010, 12:05:08 PM</code> for <code>en-US</code>)
+            </li>
+            <li><code>&#39;short&#39;</code>: equivalent to <code>&#39;yMdjm&#39;</code> (e.g.
+              <code>9/3/2010, 12:05 PM</code> for <code>en-US</code>)
+            </li>
+            <li><code>&#39;fullDate&#39;</code>: equivalent to <code>&#39;yMMMMEEEEd&#39;</code>
+              (e.g. <code>Friday, September 3, 2010</code> for <code>en-US</code>)
+            </li>
+            <li><code>&#39;longDate&#39;</code>: equivalent to <code>&#39;yMMMMd&#39;</code> (e.g.
+              <code>September 3, 2010</code> for <code>en-US</code>)
+            </li>
+            <li><code>&#39;mediumDate&#39;</code>: equivalent to <code>&#39;yMMMd&#39;</code> (e.g.
+              <code>Sep 3, 2010</code> for <code>en-US</code>)
+            </li>
+            <li><code>&#39;shortDate&#39;</code>: equivalent to <code>&#39;yMd&#39;</code> (e.g.
+              <code>9/3/2010</code> for <code>en-US</code>)
+            </li>
+            <li><code>&#39;mediumTime&#39;</code>: equivalent to <code>&#39;jms&#39;</code> (e.g.
+              <code>12:05:08 PM</code> for <code>en-US</code>)
+            </li>
+            <li><code>&#39;shortTime&#39;</code>: equivalent to <code>&#39;jm&#39;</code> (e.g.
+              <code>12:05 PM</code> for <code>en-US</code>)
+            </li>
+          </ul>
+        </li>
+      </ul>
+      <table>
+        <thead>
+        <tr>
+          <th>Component</th>
+          <th style="text-align:center">Symbol</th>
+          <th>Narrow</th>
+          <th>Short Form</th>
+          <th>Long Form</th>
+          <th>Numeric</th>
+          <th>2-digit</th>
+        </tr>
+        </thead>
+        <tbody>
+        <tr>
+          <td>era</td>
+          <td style="text-align:center">G</td>
+          <td>G (A)</td>
+          <td>GGG (AD)</td>
+          <td>GGGG (Anno Domini)</td>
+          <td>-</td>
+          <td>-</td>
+        </tr>
+        <tr>
+          <td>year</td>
+          <td style="text-align:center">y</td>
+          <td>-</td>
+          <td>-</td>
+          <td>-</td>
+          <td>y (2015)</td>
+          <td>yy (15)</td>
+        </tr>
+        <tr>
+          <td>month</td>
+          <td style="text-align:center">M</td>
+          <td>L (S)</td>
+          <td>MMM (Sep)</td>
+          <td>MMMM (September)</td>
+          <td>M (9)</td>
+          <td>MM (09)</td>
+        </tr>
+        <tr>
+          <td>day</td>
+          <td style="text-align:center">d</td>
+          <td>-</td>
+          <td>-</td>
+          <td>-</td>
+          <td>d (3)</td>
+          <td>dd (03)</td>
+        </tr>
+        <tr>
+          <td>weekday</td>
+          <td style="text-align:center">E</td>
+          <td>E (S)</td>
+          <td>EEE (Sun)</td>
+          <td>EEEE (Sunday)</td>
+          <td>-</td>
+          <td>-</td>
+        </tr>
+        <tr>
+          <td>hour</td>
+          <td style="text-align:center">j</td>
+          <td>-</td>
+          <td>-</td>
+          <td>-</td>
+          <td>j (13)</td>
+          <td>jj (13)</td>
+        </tr>
+        <tr>
+          <td>hour12</td>
+          <td style="text-align:center">h</td>
+          <td>-</td>
+          <td>-</td>
+          <td>-</td>
+          <td>h (1 PM)</td>
+          <td>hh (01 PM)</td>
+        </tr>
+        <tr>
+          <td>hour24</td>
+          <td style="text-align:center">H</td>
+          <td>-</td>
+          <td>-</td>
+          <td>-</td>
+          <td>H (13)</td>
+          <td>HH (13)</td>
+        </tr>
+        <tr>
+          <td>minute</td>
+          <td style="text-align:center">m</td>
+          <td>-</td>
+          <td>-</td>
+          <td>-</td>
+          <td>m (5)</td>
+          <td>mm (05)</td>
+        </tr>
+        <tr>
+          <td>second</td>
+          <td style="text-align:center">s</td>
+          <td>-</td>
+          <td>-</td>
+          <td>-</td>
+          <td>s (9)</td>
+          <td>ss (09)</td>
+        </tr>
+        <tr>
+          <td>timezone</td>
+          <td style="text-align:center">z</td>
+          <td>-</td>
+          <td>-</td>
+          <td>z (Pacific Standard Time)</td>
+          <td>-</td>
+          <td>-</td>
+        </tr>
+        <tr>
+          <td>timezone</td>
+          <td style="text-align:center">Z</td>
+          <td>-</td>
+          <td>Z (GMT-8:00)</td>
+          <td>-</td>
+          <td>-</td>
+          <td>-</td>
+        </tr>
+        <tr>
+          <td>timezone</td>
+          <td style="text-align:center">a</td>
+          <td>-</td>
+          <td>a (PM)</td>
+          <td>-</td>
+          <td>-</td>
+          <td>-</td>
+        </tr>
+        </tbody>
+      </table>
+      <p>In javascript, only the components specified will be respected (not the ordering,
+        punctuations, ...) and details of the formatting will be dependent on the locale.</p>
+      <p>Timezone of the formatted text will be the local system timezone of the end-user&#39;s
+        machine.</p>
+      <p>WARNINGS:</p>
+      <ul>
+        <li>this pipe is marked as pure hence it will not be re-evaluated when the input is mutated.
+          Instead users should treat the date as an immutable object and change the reference when
+          the
+          pipe needs to re-run (this is to avoid reformatting the date on every change detection run
+          which would be an expensive operation).
+        </li>
+        <li>this pipe uses the Internationalization API. Therefore it is only reliable in Chrome and
+          Opera
+          browsers.
+        </li>
+      </ul>
+      <h3 id="examples">Examples</h3>
+      <p>Assuming <code>dateObj</code> is (year: 2015, month: 6, day: 15, hour: 21, minute: 43,
+        second: 11)
+        in the <em>local</em> time and locale is &#39;en-US&#39;:</p>
+      <code-example format="linenums" language="js">{{ dateObj | date }} // output is &#039;Jun 15,
+        2015&#039;
+        {{ dateObj | date:&#039;medium&#039; }} // output is &#039;Jun 15, 2015, 9:43:11 PM&#039;
+        {{ dateObj | date:&#039;shortTime&#039; }} // output is &#039;9:43 PM&#039;
+        {{ dateObj | date:&#039;mmss&#039; }} // output is &#039;43:11&#039;
+      </code-example>
+      <div class="code-example">
+        <code-example language="ts" format="linenums">@Component({
+          selector: &#39;date-pipe&#39;,
+          template: `&lt;div&gt;
+          &lt;p&gt;Today is {{today | date}}&lt;/p&gt;
+          &lt;p&gt;Or if you prefer, {{today | date:&#39;fullDate&#39;}}&lt;/p&gt;
+          &lt;p&gt;The time is {{today | date:&#39;jmZ&#39;}}&lt;/p&gt;
+          &lt;/div&gt;`
+          })
+          export class DatePipeComponent {
+          today: number = Date.now();
+          }
+        </code-example>
+      </div>
+    </div>
+  </div>
+  <p class="location-badge">exported from <a href="index.html">@angular/common/index</a>
+    defined in <a
+        href="https://github.com/angular/angular/tree/2.2.0-beta.1/modules/@angular/common/src/pipes/date_pipe.ts#L12-L116">@angular/common/src/pipes/date_pipe.ts</a>
+  </p></article>

angular.io/src/assets/documents/docs/api/index.html

@@ -0,0 +1,7 @@
+<br><br>
+TODO: api index doc
+<br><br>
+In the meantime visit our awesome <a href="docs/api/common/date-pipe">DatePipe API page</a>.
+<br><br>
+<br><br>
+<br><br>

angular.io/src/assets/documents/docs/guide/overview.html

@@ -0,0 +1 @@
+TODO: guide overview doc

angular.io/src/assets/documents/docs/index.html

@@ -0,0 +1,7 @@
+<br><br>
+TODO: docs index doc
+<br><br>
+<a href="docs/api/">API index page</a>
+<br><br>
+<br><br>
+<br><br>

angular.io/src/assets/documents/events.html

@@ -0,0 +1,38 @@
+<header class="hero background-sky"><h1 class="hero-title ">Events</h1>
+  <div class="clear"></div>
+  <h2 class="hero-subtitle">Where we'll be presenting</h2>
+</header>
+<article class="l-content ">
+  <table class="is-full-width">
+    <thead>
+    <tr>
+      <th>Event</th>
+      <th>Location</th>
+      <th>Date</th>
+    </tr>
+    </thead>
+    <tbody><!-- Devoxx Belgium -->
+    <tr>
+      <th><a target="_blank" href="https://www.devoxx.be/">Devoxx Belgium</a></th>
+      <td>Antwerp, Belgium</td>
+      <td>Nov. 7-11, 2016</td>
+    </tr><!-- DEVIntersection -->
+    <tr>
+      <th><a target="_blank" href="https://www.devintersectioneurope.com/">DEVintersection
+        Europe</a></th>
+      <td>Amsterdam, Netherlands</td>
+      <td>Nov 14-16, 2016</td>
+    </tr><!-- dotJS -->
+    <tr>
+      <th><a target="_blank" href="http://www.dotjs.io/">dotJS</a></th>
+      <td>Paris, France</td>
+      <td>Dec. 5, 2016</td>
+    </tr><!-- NG-BE -->
+    <tr>
+      <th><a target="_blank" href="https://ng-be.org/">NG-BE</a></th>
+      <td>Ghent, Belgium</td>
+      <td>Dec. 9, 2016</td>
+    </tr>
+    </tbody>
+  </table>
+</article>

angular.io/src/assets/documents/features.html

@@ -0,0 +1,64 @@
+<header class="hero background-sky"><h1 class="hero-title ">Features &amp; Benefits</h1>
+  <div class="clear"></div>
+</header>
+<article class="l-content ">
+  <div>
+    <div><h2 class="text-headline">Cross Platform</h2>
+      <div class="feature-row">
+        <div class="feature"><h3>Progressive web apps</h3>
+          <p class="text-body">Use modern web platform capabilities to deliver app-like experiences.
+            High performance, offline, and zero-step installation.</p></div>
+        <div class="feature"><h3>Native</h3>
+          <p class="text-body">Build native mobile apps with strategies from Ionic Framework,
+            NativeScript, and React Native.</p></div>
+        <div class="feature"><h3>Desktop</h3>
+          <p class="text-body">Create desktop-installed apps across Mac, Windows, and Linux using
+            the same Angular methods you've learned for the web plus the ability to access native OS
+            APIs.</p></div>
+      </div>
+      <h2 class="text-headline">Speed and Performance</h2>
+      <div class="feature-row">
+        <div class="feature"><h3>Code generation</h3>
+          <p class="text-body">Angular turns your templates into code that's highly optimized for
+            today's JavaScript virtual machines, giving you all the benefits of hand-written code
+            with the productivity of a framework.</p></div>
+        <div class="feature"><h3>Universal</h3>
+          <p class="text-body">Serve the first view of your application on node.js, .NET, PHP, and
+            other servers for near-instant rendering in just HTML and CSS. Also paves the way for
+            sites that optimize for SEO.</p></div>
+        <div class="feature"><h3>Code splitting</h3>
+          <p class="text-body">Angular apps load quickly with the new Component Router, which
+            delivers automatic code-splitting so users only load code required to render the view
+            they request.</p></div>
+      </div>
+      <h2 class="text-headline">Productivity</h2>
+      <div class="feature-row">
+        <div class="feature"><h3>Templates</h3>
+          <p class="text-body">Quickly create UI views with simple and powerful template syntax.</p>
+        </div>
+        <div class="feature"><h3>Angular CLI</h3>
+          <p class="text-body">Command line tools: start building fast, add components and tests,
+            then instantly deploy.</p></div>
+        <div class="feature"><h3>IDEs</h3>
+          <p class="text-body">Get intelligent code completion, instant errors, and other feedback
+            in popular editors and IDEs.</p></div>
+      </div>
+      <h2 class="text-headline">Full Development Story</h2>
+      <div class="feature-row">
+        <div class="feature"><h3>Testing</h3>
+          <p class="text-body">With Karma for unit tests, you can know if you've broken things every
+            time you save. And Protractor makes your scenario tests run faster and in a stable
+            manner.</p></div>
+        <div class="feature"><h3>Animation</h3>
+          <p class="text-body">Create high-performance, complex choreographies and animation
+            timelines with very little code through Angular's intuitive API.</p></div>
+        <div class="feature"><h3>Accessibility</h3>
+          <p class="text-body">Create accessible applications with ARIA-enabled components,
+            developer guides, and built-in a11y test infrastructure.</p></div>
+      </div>
+    </div>
+  </div>
+  <div class="cta-bar"><a href="/docs/ts/latest/quickstart.html" md-button="md-button"
+                          class="button button-large button-shield md-raised md-primary">Get
+    Started</a></div>
+</article>

angular.io/src/assets/documents/home.html

@@ -0,0 +1,72 @@
+<header class="background-sky l-relative">
+  <div class="hero background-superhero-paper is-large"><img
+      src="assets/images/logos/angular2/angular.svg" class="hero-logo"/>
+    <h1 class="text-headline">One framework.<br>Mobile &amp; desktop.</h1><a
+        href="/docs/ts/latest/quickstart.html" md-button="md-button"
+        class="hero-cta md-raised button button-large button-plain">Get Started</a></div>
+  <announcement-bar class="announcement-bar">
+    <div class="announcement-bar-slide cleafix is-visible"><img
+        src="assets/images/logos/anglebrackets/devintersection.png" width="64"/>
+      <p>Join us for <strong>DEVintersection Amsterdam</strong> Nov 14-16!</p><a
+          href="https://www.devintersectioneurope.com/#!/" target="_blank" class="button md-button">Register
+        now</a></div>
+  </announcement-bar>
+</header>
+<article class="l-content ">
+  <div class="home-rows"><!-- Group 1-->
+    <div layout="row" layout-xs="column" class="home-row">
+      <div class="promo-img-container promo-1">
+        <div><img src="assets/images/home/responsive-framework.svg"></div>
+      </div>
+      <div class="text-container">
+        <div class="text-block promo-1-desc l-pad-top-2"><h3 class="text-headline">Develop Across
+          All Platforms</h3>
+          <p class="text-body">Learn one way to build applications with Angular and reuse your code
+            and abilities to build apps for any deployment target. For web, mobile web, native
+            mobile and native desktop.
+          </p></div>
+      </div>
+    </div><!-- Group 2-->
+    <div layout="row" layout-xs="column" class="home-row">
+      <div class="text-container">
+        <div class="text-block"><h3 class="text-headline">Speed & Performance</h3>
+          <p class="text-body">Achieve the maximum speed possible on the Web Platform today, and
+            take it further, via Web Workers and server-side rendering.</p>
+          <p class="text-body">Angular puts you in control over scalability. Meet huge data
+            requirements by building data models on RxJS, Immutable.js or another push-model.</p>
+        </div>
+      </div>
+      <div class="promo-img-container promo-2">
+        <div><img src="assets/images/home/speed-performance.svg"></div>
+      </div>
+    </div><!-- Group 3-->
+    <div layout="row" layout-xs="column" class="home-row">
+      <div class="promo-img-container promo-3">
+        <div><img src="assets/images/home/joyful-development.png"></div>
+      </div>
+      <div class="text-container">
+        <div class="text-block promo-3-desc"><h3 class="text-headline">Incredible Tooling</h3>
+          <p class="text-body">Build features quickly with simple, declarative templates. Extend the
+            template language with your own components and use a wide array of existing components.
+            Get immediate Angular-specific help and feedback with nearly every IDE and editor. All
+            this comes together so you can focus on building amazing apps rather than trying to make
+            the code work.
+          </p></div>
+      </div>
+    </div><!-- Group 4-->
+    <div layout="row" layout-xs="column" class="home-row">
+      <div class="text-container">
+        <div class="text-block l-pad-top-2"><h3 class="text-headline">Loved by Millions</h3>
+          <p class="text-body">From prototype through global deployment, Angular delivers the
+            productivity and scalable infrastructure that supports Google's largest
+            applications.</p></div>
+      </div>
+      <div class="promo-img-container promo-4">
+        <div><img src="assets/images/home/loved-by-millions.png"></div>
+      </div>
+    </div>
+    <div class="cta-bar"><a href="/docs/ts/latest/quickstart.html" md-button="md-button"
+                            class="button button-large button-shield md-raised md-primary">Get
+      Started</a></div>
+  </div>
+</article>

angular.io/src/assets/documents/news.html

@@ -0,0 +1,115 @@
+<header class="hero background-sky"><h1 class="hero-title ">News</h1>
+  <div class="clear"></div>
+</header>
+<article class="l-content ">
+  <div class="grid-fluid l-space-bottom-2">
+    <div class="c12 text-center"><h3 class="text-headline text-uppercase"> Core Team</h3></div>
+    <div class="clear"></div>
+  </div>
+  <div class="grid-fluid">
+    <div class="c6">
+      <div class="article-card">
+        <div class="date">Oct 12, 2016</div>
+        <div class="title"><a target="_blank"
+                              href="http://angularjs.blogspot.com/2016/10/angular-210-now-available.html">Angular
+          2.1.0 Now Available</a></div>
+        <p>Angular version 2.1.0 - incremental-metamorphosis - is a minor release following our
+          announced adoption of Semantic Versioning...</p>
+        <div class="author"><img src="assets/images/bios/stephenfluin.jpg">
+          <div class="posted">Posted by <b>Stephen Fluin</b></div>
+        </div>
+      </div>
+    </div>
+    <div class="c6">
+      <div class="article-card">
+        <div class="date">Oct 7, 2016</div>
+        <div class="title"><a target="_blank"
+                              href="http://angularjs.blogspot.com/2016/10/versioning-and-releasing-angular.html">Versioning
+          and Releasing Angular</a></div>
+        <p>In order for the ecosystem around Angular to thrive, developers need stability from the
+          Angular framework so that reusable components and libraries, tools and learned practices
+          don’t go obsolete unexpectedly...</p>
+        <div class="author"><img src="assets/images/bios/igor-minar.jpg">
+          <div class="posted">Posted by <b>Igor Minar</b></div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="grid-fluid l-space-bottom-2 l-space-top-4">
+    <div class="c12 text-center"><h3 class="text-headline text-uppercase"> Developer Community</h3>
+    </div>
+    <div class="clear"></div>
+  </div>
+  <div class="grid-fluid">
+    <div class="c6">
+      <div class="article-card">
+        <div class="date">Oct 30, 2016</div>
+        <div class="title"><a target="_blank"
+                              href="https://www.thepolyglotdeveloper.com/2016/10/use-pre-populated-sqlite-database-nativescript-angular-2/">Use
+          A Pre-Populated SQLite Database With NativeScript And Angular 2</a></div>
+        <p>I figured it would be a good idea to demonstrate how to ship a NativeScript Angular 2
+          application with a pre-filled SQLite database rather than populating it on-the-fly....</p>
+        <div class="author"><img src="assets/images/bios/shield-bio-placeholder.png">
+          <div class="posted">Posted by <b>Nic Raboy</b></div>
+        </div>
+      </div>
+    </div>
+    <div class="c6">
+      <div class="article-card">
+        <div class="date">Oct 13, 2016</div>
+        <div class="title"><a target="_blank"
+                              href="http://blog.thoughtram.io/angular/2016/10/13/two-way-data-binding-in-angular-2.html">Two-way
+          Data Binding in Angular 2</a></div>
+        <p>If there was one feature in Angular that made us go “Wow”, then it was probably its
+          two-way data binding system. Changes in the application state have been automagically
+          reflected into the view...</p>
+        <div class="author"><img src="assets/images/bios/angular-gde-bio-placeholder.png">
+          <div class="posted">Posted by <b>Pascal Precht</b></div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="grid-fluid">
+    <div class="c6">
+      <div class="article-card">
+        <div class="date">Oct 10, 2016</div>
+        <div class="title"><a target="_blank"
+                              href="http://www.creativebloq.com/how-to/build-a-material-design-app-with-angular-2">Build
+          a Material Design app with Angular 2</a></div>
+        <p>This walkthrough reveals how to create a DialogComponent and to-do app with Angular
+          Material and the Angular CLI...</p>
+        <div class="author"><img src="assets/images/bios/shield-bio-placeholder.png">
+          <div class="posted">Posted by <b>Daniel Zen</b></div>
+        </div>
+      </div>
+    </div>
+    <div class="c6">
+      <div class="article-card">
+        <div class="date">Sept 30, 2016</div>
+        <div class="title"><a target="_blank"
+                              href="http://www.simb.co/angular-cli-using-docker/?platform=hootsuite">Using
+          Angular CLI to create Angular 2 applications in Docker</a></div>
+        <p>Angular CLI is a great tool for developing Angular 2 applications. I thought it would be
+          fun to do a quick demo...</p>
+        <div class="author"><img src="assets/images/bios/shield-bio-placeholder.png">
+          <div class="posted">Posted by <b>Simeon Bateman</b></div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="grid-fluid l-space-bottom-2 l-space-top-4">
+    <div class="c12 text-center"><h3 class="text-headline text-uppercase">Twitter</h3></div>
+    <div class="clear"></div>
+    <div class="grid-fluid">
+      <div class="c3"><p></p></div>
+      <div class="c6">
+        <div class="article-card">
+          <div class="title"><a href="http://twitter.com/angularjs" data-show-count="false"
+                                class="twitter-follow-button">Follow @angularjs</a></div>
+          <p><a class="twitter-timeline" data-chrome="nofooter noborders noheader"
+                href="http://twitter.com/angularjs" data-widget-id="700150278465523713"></a></p>
+        </div>
+      </div>
+    </div>
+  </div>
+</article>