diff --git a/public/docs/_examples/package.json b/public/docs/_examples/package.json
index 095493faf7..7e625af6e6 100644
--- a/public/docs/_examples/package.json
+++ b/public/docs/_examples/package.json
@@ -39,7 +39,7 @@
     "rxjs": "5.0.0-beta.6",
     "zone.js": "^0.6.12",
 
-    "angular2-in-memory-web-api": "0.0.10",
+    "angular2-in-memory-web-api": "0.0.11",
     "bootstrap": "^3.3.6"
   },
   "devDependencies": {
diff --git a/public/docs/_examples/protractor.config.js b/public/docs/_examples/protractor.config.js
index 8ebc21b795..ac6fa66ac4 100644
--- a/public/docs/_examples/protractor.config.js
+++ b/public/docs/_examples/protractor.config.js
@@ -70,6 +70,14 @@ exports.config = {
     global.setProtractorToNg1Mode = function() {
       browser.useAllAngular2AppRoots = false;
       browser.rootEl = 'body';
+      
+      var disableNgAnimate = function() {
+        angular.module('disableNgAnimate', []).run(['$animate', function($animate) {
+          $animate.enabled(false);
+        }]);
+      };
+
+      browser.addMockModule('disableNgAnimate', disableNgAnimate);
     };
   },
 
diff --git a/public/docs/_examples/quickstart/js/package.1.json b/public/docs/_examples/quickstart/js/package.1.json
index 504b6e7413..b9365ca90d 100644
--- a/public/docs/_examples/quickstart/js/package.1.json
+++ b/public/docs/_examples/quickstart/js/package.1.json
@@ -22,7 +22,7 @@
     "rxjs": "5.0.0-beta.6",
     "zone.js": "0.6.12",
 
-    "angular2-in-memory-web-api": "0.0.10",
+    "angular2-in-memory-web-api": "0.0.11",
     "bootstrap": "^3.3.6"
   },
   "devDependencies": {
diff --git a/public/docs/_examples/quickstart/ts/package.1.json b/public/docs/_examples/quickstart/ts/package.1.json
index 6b26bacea1..8798091f8b 100644
--- a/public/docs/_examples/quickstart/ts/package.1.json
+++ b/public/docs/_examples/quickstart/ts/package.1.json
@@ -27,7 +27,7 @@
     "rxjs": "5.0.0-beta.6",
     "zone.js": "^0.6.12",
 
-    "angular2-in-memory-web-api": "0.0.10",
+    "angular2-in-memory-web-api": "0.0.11",
     "bootstrap": "^3.3.6"
   },
   "devDependencies": {
diff --git a/public/docs/_examples/quickstart/ts/systemjs.config.1.js b/public/docs/_examples/quickstart/ts/systemjs.config.1.js
index 6f23f1dade..449e847339 100644
--- a/public/docs/_examples/quickstart/ts/systemjs.config.1.js
+++ b/public/docs/_examples/quickstart/ts/systemjs.config.1.js
@@ -18,7 +18,7 @@
   var packages = {
     'app':                        { main: 'main.js',  defaultExtension: 'js' },
     'rxjs':                       { defaultExtension: 'js' },
-    'angular2-in-memory-web-api': { defaultExtension: 'js' },
+    'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' },
   };
 
   var ngPackageNames = [
@@ -33,10 +33,21 @@
     'upgrade',
   ];
 
-  // Add package entries for angular packages
-  ngPackageNames.forEach(function(pkgName) {
+  // Individual files (~300 requests):
+  function packIndex(pkgName) {
+    packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' };
+  }
+
+  // Bundled (~40 requests):
+  function packUmd(pkgName) {
     packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' };
-  });
+  };
+
+  // Most environments should use UMD; some (Karma) need the individual index files
+  var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
+
+  // Add package entries for angular packages
+  ngPackageNames.forEach(setPackageConfig);
 
   var config = {
     map: map,
diff --git a/public/docs/_examples/style-guide/e2e-spec.js b/public/docs/_examples/style-guide/e2e-spec.js
index 31b6db0136..dcd5f2af20 100644
--- a/public/docs/_examples/style-guide/e2e-spec.js
+++ b/public/docs/_examples/style-guide/e2e-spec.js
@@ -58,6 +58,9 @@ describe('Style Guide', function () {
   it('03-05', function () {
     browser.get('#/03-05');
 
+    var div = element(by.tagName('sg-app > div'));
+    expect(div.getText()).toBe('Actual favorite: Windstorm');
+
     var lis = element.all(by.tagName('sg-app > ul > li'));
     expect(lis.get(0).getText()).toBe('Windstorm');
     expect(lis.get(1).getText()).toBe('Bombasto');
@@ -68,6 +71,9 @@ describe('Style Guide', function () {
   it('03-06', function () {
     browser.get('#/03-06');
 
+    var div = element(by.tagName('sg-app > div'));
+    expect(div.getText()).toBe('Actual favorite: Windstorm');
+
     var lis = element.all(by.tagName('sg-app > ul > li'));
     expect(lis.get(0).getText()).toBe('Windstorm');
     expect(lis.get(1).getText()).toBe('Bombasto');
diff --git a/public/docs/_examples/style-guide/ts/03-05/app/app.component.html b/public/docs/_examples/style-guide/ts/03-05/app/app.component.html
index 3c05329f3f..67fb0d5964 100644
--- a/public/docs/_examples/style-guide/ts/03-05/app/app.component.html
+++ b/public/docs/_examples/style-guide/ts/03-05/app/app.component.html
@@ -1,3 +1,4 @@
+<div>Actual favorite: {{favorite?.name}}</div>
 <ul>
   <li *ngFor="let hero of heroes">
     {{hero.name}}
diff --git a/public/docs/_examples/style-guide/ts/03-05/app/app.component.ts b/public/docs/_examples/style-guide/ts/03-05/app/app.component.ts
index 9cc5ee4ec3..216c1e9109 100644
--- a/public/docs/_examples/style-guide/ts/03-05/app/app.component.ts
+++ b/public/docs/_examples/style-guide/ts/03-05/app/app.component.ts
@@ -11,11 +11,13 @@ import { Hero } from './+heroes/shared/hero.model';
   providers: [HeroService, ExceptionService, SpinnerService, ToastService]
 })
 export class AppComponent implements OnInit {
+  favorite: Hero;
   heroes: Hero[];
 
   constructor(private heroService: HeroService) { }
 
   ngOnInit() {
+    this.heroService.getHero(1).subscribe(hero => this.favorite = hero);
     this.heroService.getHeroes().subscribe(heroes => this.heroes = heroes);
   }
 }
diff --git a/public/docs/_examples/style-guide/ts/03-06/app/app.component.html b/public/docs/_examples/style-guide/ts/03-06/app/app.component.html
index 3c05329f3f..67fb0d5964 100644
--- a/public/docs/_examples/style-guide/ts/03-06/app/app.component.html
+++ b/public/docs/_examples/style-guide/ts/03-06/app/app.component.html
@@ -1,3 +1,4 @@
+<div>Actual favorite: {{favorite?.name}}</div>
 <ul>
   <li *ngFor="let hero of heroes">
     {{hero.name}}
diff --git a/public/docs/_examples/style-guide/ts/03-06/app/app.component.ts b/public/docs/_examples/style-guide/ts/03-06/app/app.component.ts
index 9cc5ee4ec3..216c1e9109 100644
--- a/public/docs/_examples/style-guide/ts/03-06/app/app.component.ts
+++ b/public/docs/_examples/style-guide/ts/03-06/app/app.component.ts
@@ -11,11 +11,13 @@ import { Hero } from './+heroes/shared/hero.model';
   providers: [HeroService, ExceptionService, SpinnerService, ToastService]
 })
 export class AppComponent implements OnInit {
+  favorite: Hero;
   heroes: Hero[];
 
   constructor(private heroService: HeroService) { }
 
   ngOnInit() {
+    this.heroService.getHero(1).subscribe(hero => this.favorite = hero);
     this.heroService.getHeroes().subscribe(heroes => this.heroes = heroes);
   }
 }
diff --git a/public/docs/_examples/style-guide/ts/04-10/app/shared/index.ts b/public/docs/_examples/style-guide/ts/04-10/app/shared/index.ts
index faee6ada96..e4f31e4c62 100644
--- a/public/docs/_examples/style-guide/ts/04-10/app/shared/index.ts
+++ b/public/docs/_examples/style-guide/ts/04-10/app/shared/index.ts
@@ -10,21 +10,3 @@ export * from './nav';
 export * from './spinner';
 export * from './toast';
 // #enddocregion example
-
-import { EntityService } from './entity.service';
-import { ExceptionService } from './exception.service';
-import { FilterService } from './filter-text';
-import { InitCapsPipe } from './init-caps.pipe';
-import { ModalService } from './modal';
-import { SpinnerService } from './spinner';
-import { ToastService } from './toast';
-
-export const BLOCK_PROVIDERS = [
-  EntityService,
-  ExceptionService,
-  FilterService,
-  InitCapsPipe,
-  ModalService,
-  SpinnerService,
-  ToastService
-];
diff --git a/public/docs/_examples/style-guide/ts/app/hero-data.ts b/public/docs/_examples/style-guide/ts/app/hero-data.ts
index 001af65e85..f3e6feb91c 100644
--- a/public/docs/_examples/style-guide/ts/app/hero-data.ts
+++ b/public/docs/_examples/style-guide/ts/app/hero-data.ts
@@ -1,10 +1,10 @@
 export class HeroData {
   createDb() {
     let heroes = [
-      { id: '1', name: 'Windstorm' },
-      { id: '2', name: 'Bombasto' },
-      { id: '3', name: 'Magneta' },
-      { id: '4', name: 'Tornado' }
+      { id: 1, name: 'Windstorm' },
+      { id: 2, name: 'Bombasto' },
+      { id: 3, name: 'Magneta' },
+      { id: 4, name: 'Tornado' }
     ];
     return {heroes};
   }
diff --git a/public/docs/_examples/systemjs.config.js b/public/docs/_examples/systemjs.config.js
index 0cdf7d40bc..e362b122a2 100644
--- a/public/docs/_examples/systemjs.config.js
+++ b/public/docs/_examples/systemjs.config.js
@@ -42,6 +42,7 @@
     packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' };
   };
 
+  // Most environments should use UMD; some (Karma) need the individual index files
   var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
 
   // Add package entries for angular packages
diff --git a/public/docs/_examples/upgrade-adapter/ts/app/1-to-2-providers/app.module.ts b/public/docs/_examples/upgrade-adapter/ts/app/1-to-2-providers/app.module.ts
index feba407bce..a38d87d6f5 100644
--- a/public/docs/_examples/upgrade-adapter/ts/app/1-to-2-providers/app.module.ts
+++ b/public/docs/_examples/upgrade-adapter/ts/app/1-to-2-providers/app.module.ts
@@ -7,7 +7,8 @@ declare var angular:any;
 // #docregion register
 angular.module('heroApp', [])
   .service('heroes', HeroesService)
-  .directive('heroDetail', upgradeAdapter.downgradeNg2Component(HeroDetailComponent));
+  .directive('heroDetail',
+    upgradeAdapter.downgradeNg2Component(HeroDetailComponent));
 
 upgradeAdapter.upgradeNg1Provider('heroes');
 
diff --git a/public/docs/_examples/upgrade-adapter/ts/index-downgrade-io.html b/public/docs/_examples/upgrade-adapter/ts/index-downgrade-io.html
index 86544b0587..744a0ca5c1 100644
--- a/public/docs/_examples/upgrade-adapter/ts/index-downgrade-io.html
+++ b/public/docs/_examples/upgrade-adapter/ts/index-downgrade-io.html
@@ -30,15 +30,15 @@
       <!-- #docregion usecomponent -->
       <div ng-controller="MainController as mainCtrl">
         <hero-detail [hero]="mainCtrl.hero"
-                    (deleted)="mainCtrl.onDelete($event)">
+                     (deleted)="mainCtrl.onDelete($event)">
         </hero-detail>
       </div>
       <!-- #enddocregion usecomponent -->
       <!-- #docregion userepeatedcomponent -->
       <div ng-controller="MainController as mainCtrl">
         <hero-detail [hero]="hero"
-                    (deleted)="mainCtrl.onDelete($event)"
-                    ng-repeat="hero in mainCtrl.heroes">
+                     (deleted)="mainCtrl.onDelete($event)"
+                     ng-repeat="hero in mainCtrl.heroes">
         </hero-detail>
       </div>
       <!-- #enddocregion userepeatedcomponent-->
diff --git a/public/docs/_examples/upgrade-adapter/ts/index-ng-app.html b/public/docs/_examples/upgrade-adapter/ts/index-ng-app.html
index c5fb7483cf..2b793fe949 100644
--- a/public/docs/_examples/upgrade-adapter/ts/index-ng-app.html
+++ b/public/docs/_examples/upgrade-adapter/ts/index-ng-app.html
@@ -7,6 +7,8 @@
   </head>
 
   <body ng-app="heroApp" ng-strict-di>
-    <div id="message" ng-controller="MainCtrl as mainCtrl">{{ mainCtrl.message }}</div>
+    <div id="message" ng-controller="MainCtrl as mainCtrl">
+      {{ mainCtrl.message }}
+    </div>
   </body>
 </html>
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/README.md b/public/docs/_examples/upgrade-phonecat-1-typescript/README.md
new file mode 100644
index 0000000000..dafa67ece9
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/README.md
@@ -0,0 +1,37 @@
+This is the Angular Phonecat application adjusted to fit our boilerplate project
+structure.
+
+The following changes from vanilla Phonecat are applied:
+
+* The TypeScript config file shown in the guide is `tsconfig.ng1.json` instead
+  of the default, because we don't want to enable `noImplicitAny` for migration.
+* Karma config for unit tests is in karma.conf.ng1.js because the boilerplate
+  Karma config is not compatible with the way Angular 1 tests need to be run.
+  The shell script run-unit-tests.sh can be used to run the unit tests.
+* Instead of using Bower, Angular 1 and its dependencies are fetched from a CDN
+  in index.html and karma.conf.ng1.js.
+* E2E tests have been moved to the parent directory, where `gulp run-e2e-tests` can
+  discover and run them along with all the other examples.
+* Angular 1 typings (from DefinitelyTyped) are added to typings-ng1 so that
+  TypeScript can recognize Angular 1 code. (typings.json comes from boilerplate
+  so we can't add them there).
+* Most of the phone JSON and image data removed in the interest of keeping
+  repo weight down. Keeping enough to retain testability of the app.
+
+## Running the app
+
+Start like any example
+
+    npm run start
+
+You'll find the app under the /app path: http://localhost:3002/app/index.html
+
+## Running unit tests
+
+    ./run-unit-tests.sh
+
+## Running E2E tests
+
+Like for any example (at the project root):
+
+    gulp run-e2e-tests --filter=phonecat-1
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/e2e-spec.js b/public/docs/_examples/upgrade-phonecat-1-typescript/e2e-spec.js
new file mode 100644
index 0000000000..d001711436
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/e2e-spec.js
@@ -0,0 +1,104 @@
+'use strict';
+
+// Angular E2E Testing Guide:
+// https://docs.angularjs.org/guide/e2e-testing
+
+describe('PhoneCat Application', function() {
+
+  beforeAll(function() {
+    browser.baseUrl = 'http://localhost:8080/app/';
+    setProtractorToNg1Mode();
+  });
+
+  it('should redirect `index.html` to `index.html#!/phones', function() {
+    browser.get('index.html');
+    expect(browser.getLocationAbsUrl()).toBe('/phones');
+  });
+
+  describe('View: Phone list', function() {
+
+    beforeEach(function() {
+      browser.get('index.html#!/phones');
+    });
+
+    it('should filter the phone list as a user types into the search box', function() {
+      var phoneList = element.all(by.repeater('phone in $ctrl.phones'));
+      var query = element(by.model('$ctrl.query'));
+
+      expect(phoneList.count()).toBe(20);
+
+      query.sendKeys('nexus');
+      expect(phoneList.count()).toBe(1);
+
+      query.clear();
+      query.sendKeys('motorola');
+      expect(phoneList.count()).toBe(8);
+    });
+
+    it('should be possible to control phone order via the drop-down menu', function() {
+      var queryField = element(by.model('$ctrl.query'));
+      var orderSelect = element(by.model('$ctrl.orderProp'));
+      var nameOption = orderSelect.element(by.css('option[value="name"]'));
+      var phoneNameColumn = element.all(by.repeater('phone in $ctrl.phones').column('phone.name'));
+
+      function getNames() {
+        return phoneNameColumn.map(function(elem) {
+          return elem.getText();
+        });
+      }
+
+      queryField.sendKeys('tablet');   // Let's narrow the dataset to make the assertions shorter
+
+      expect(getNames()).toEqual([
+        'Motorola XOOM\u2122 with Wi-Fi',
+        'MOTOROLA XOOM\u2122'
+      ]);
+
+      nameOption.click();
+
+      expect(getNames()).toEqual([
+        'MOTOROLA XOOM\u2122',
+        'Motorola XOOM\u2122 with Wi-Fi'
+      ]);
+    });
+
+    it('should render phone specific links', function() {
+      var query = element(by.model('$ctrl.query'));
+      query.sendKeys('nexus');
+
+      element.all(by.css('.phones li a')).first().click();
+      expect(browser.getLocationAbsUrl()).toBe('/phones/nexus-s');
+    });
+
+  });
+
+  describe('View: Phone detail', function() {
+
+    beforeEach(function() {
+      browser.get('index.html#!/phones/nexus-s');
+    });
+
+    it('should display the `nexus-s` page', function() {
+      expect(element(by.binding('$ctrl.phone.name')).getText()).toBe('Nexus S');
+    });
+
+    it('should display the first phone image as the main phone image', function() {
+      var mainImage = element(by.css('img.phone.selected'));
+
+      expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/);
+    });
+
+    it('should swap the main image when clicking on a thumbnail image', function() {
+      var mainImage = element(by.css('img.phone.selected'));
+      var thumbnails = element.all(by.css('.phone-thumbs img'));
+
+      thumbnails.get(2).click();
+      expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.2.jpg/);
+
+      thumbnails.get(0).click();
+      expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/);
+    });
+
+  });
+
+});
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/app.animations.css b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/app.animations.css
new file mode 100644
index 0000000000..175320b509
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/app.animations.css
@@ -0,0 +1,67 @@
+/* Animate `ngRepeat` in `phoneList` component */
+.phone-list-item.ng-enter,
+.phone-list-item.ng-leave,
+.phone-list-item.ng-move {
+  overflow: hidden;
+  transition: 0.5s linear all;
+}
+
+.phone-list-item.ng-enter,
+.phone-list-item.ng-leave.ng-leave-active,
+.phone-list-item.ng-move {
+  height: 0;
+  margin-bottom: 0;
+  opacity: 0;
+  padding-bottom: 0;
+  padding-top: 0;
+}
+
+.phone-list-item.ng-enter.ng-enter-active,
+.phone-list-item.ng-leave,
+.phone-list-item.ng-move.ng-move-active {
+  height: 120px;
+  margin-bottom: 20px;
+  opacity: 1;
+  padding-bottom: 4px;
+  padding-top: 15px;
+}
+
+/* Animate view transitions with `ngView` */
+.view-container {
+  position: relative;
+}
+
+.view-frame {
+  margin-top: 20px;
+}
+
+.view-frame.ng-enter,
+.view-frame.ng-leave {
+  background: white;
+  left: 0;
+  position: absolute;
+  right: 0;
+  top: 0;
+}
+
+.view-frame.ng-enter {
+  animation: 1s fade-in;
+  z-index: 100;
+}
+
+.view-frame.ng-leave {
+  animation: 1s fade-out;
+  z-index: 99;
+}
+
+@keyframes fade-in {
+  from { opacity: 0; }
+  to   { opacity: 1; }
+}
+
+@keyframes fade-out {
+  from { opacity: 1; }
+  to   { opacity: 0; }
+}
+
+/* Older browsers might need vendor-prefixes for keyframes and animation! */
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/app.animations.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/app.animations.ts
new file mode 100644
index 0000000000..4af94f3d37
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/app.animations.ts
@@ -0,0 +1,43 @@
+'use strict';
+
+angular.
+  module('phonecatApp').
+  animation('.phone', function phoneAnimationFactory() {
+    return {
+      addClass: animateIn,
+      removeClass: animateOut
+    };
+
+    function animateIn(element: JQuery, className: string, done: () => void) {
+      if (className !== 'selected') return;
+
+      element.css({
+        display: 'block',
+        position: 'absolute',
+        top: 500,
+        left: 0
+      }).animate({
+        top: 0
+      }, done);
+
+      return function animateInEnd(wasCanceled: boolean) {
+        if (wasCanceled) element.stop();
+      };
+    }
+
+    function animateOut(element: JQuery, className: string, done: () => void) {
+      if (className !== 'selected') return;
+
+      element.css({
+        position: 'absolute',
+        top: 0,
+        left: 0
+      }).animate({
+        top: -500
+      }, done);
+
+      return function animateOutEnd(wasCanceled: boolean) {
+        if (wasCanceled) element.stop();
+      };
+    }
+  });
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/app.config.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/app.config.ts
new file mode 100644
index 0000000000..57f37b9d1f
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/app.config.ts
@@ -0,0 +1,18 @@
+// #docregion
+angular.
+  module('phonecatApp').
+  config(['$locationProvider' ,'$routeProvider',
+    function config($locationProvider: angular.ILocationProvider,
+                    $routeProvider: angular.route.IRouteProvider) {
+      $locationProvider.hashPrefix('!');
+
+      $routeProvider.
+        when('/phones', {
+          template: '<phone-list></phone-list>'
+        }).
+        when('/phones/:phoneId', {
+          template: '<phone-detail></phone-detail>'
+        }).
+        otherwise('/phones');
+    }
+  ]);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/css/app.css b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/app.css
similarity index 79%
rename from public/docs/_examples/upgrade-phonecat/ts/classes/app/css/app.css
rename to public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/app.css
index 951ea087cc..f4b45b02a5 100644
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/app/css/app.css
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/app.css
@@ -1,99 +1,93 @@
-/* app css stylesheet */
-
 body {
-  padding-top: 20px;
+  padding: 20px;
 }
 
-
-.phone-images {
-  background-color: white;
-  width: 450px;
-  height: 450px;
-  overflow: hidden;
-  position: relative;
-  float: left;
+h1 {
+  border-bottom: 1px solid gray;
+  margin-top: 0;
 }
 
+/* View: Phone list */
 .phones {
   list-style: none;
 }
 
-.thumb {
-  float: left;
-  margin: -0.5em 1em 1.5em 0;
-  padding-bottom: 1em;
-  height: 100px;
-  width: 100px;
-}
-
 .phones li {
   clear: both;
   height: 115px;
   padding-top: 15px;
 }
 
-/** Detail View **/
-img.phone {
+.thumb {
   float: left;
-  margin-right: 3em;
-  margin-bottom: 2em;
-  background-color: white;
-  padding: 2em;
-  height: 400px;
-  width: 400px;
-  display: none;
+  height: 100px;
+  margin: -0.5em 1em 1.5em 0;
+  padding-bottom: 1em;
+  width: 100px;
 }
 
-img.phone:first-child {
+/* View: Phone detail */
+.phone {
+  background-color: white;
+  display: none;
+  float: left;
+  height: 400px;
+  margin-bottom: 2em;
+  margin-right: 3em;
+  padding: 2em;
+  width: 400px;
+}
+
+.phone:first-child {
   display: block;
 }
 
-
-ul.phone-thumbs {
-  margin: 0;
-  list-style: none;
+.phone-images {
+  background-color: white;
+  float: left;
+  height: 450px;
+  overflow: hidden;
+  position: relative;
+  width: 450px;
 }
 
-ul.phone-thumbs li {
+.phone-thumbs {
+  list-style: none;
+  margin: 0;
+}
+
+.phone-thumbs img {
+  height: 100px;
+  padding: 1em;
+  width: 100px;
+}
+
+.phone-thumbs li {
+  background-color: white;
   border: 1px solid black;
+  cursor: pointer;
   display: inline-block;
   margin: 1em;
-  background-color: white;
 }
 
-ul.phone-thumbs img {
-  height: 100px;
-  width: 100px;
-  padding: 1em;
-}
-
-ul.phone-thumbs img:hover {
-  cursor: pointer;
-}
-
-
-ul.specs {
+.specs {
   clear: both;
+  list-style: none;
   margin: 0;
   padding: 0;
-  list-style: none;
 }
 
-ul.specs > li{
+.specs dt {
+  font-weight: bold;
+}
+
+.specs > li {
   display: inline-block;
-  width: 200px;
   vertical-align: top;
+  width: 200px;
 }
 
-ul.specs > li > span{
-  font-weight: bold;
+.specs > li > span {
   font-size: 1.2em;
-}
-
-ul.specs dt {
   font-weight: bold;
 }
-
-h1 {
-  border-bottom: 1px solid gray;
-}
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/app.module.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/app.module.ts
new file mode 100644
index 0000000000..ab6d353eeb
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/app.module.ts
@@ -0,0 +1,10 @@
+'use strict';
+
+// Define the `phonecatApp` module
+angular.module('phonecatApp', [
+  'ngAnimate',
+  'ngRoute',
+  'core',
+  'phoneDetail',
+  'phoneList',
+]);
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/checkmark/checkmark.filter.spec.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/checkmark/checkmark.filter.spec.ts
new file mode 100644
index 0000000000..1b2d77c30c
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/checkmark/checkmark.filter.spec.ts
@@ -0,0 +1,14 @@
+'use strict';
+
+describe('checkmark', () => {
+
+  beforeEach(angular.mock.module('core'));
+
+  it('should convert boolean values to unicode checkmark or cross',
+    inject(function(checkmarkFilter: (v: boolean) => string) {
+      expect(checkmarkFilter(true)).toBe('\u2713');
+      expect(checkmarkFilter(false)).toBe('\u2718');
+    })
+  );
+
+});
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/checkmark/checkmark.filter.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/checkmark/checkmark.filter.ts
new file mode 100644
index 0000000000..b140bd6a84
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/checkmark/checkmark.filter.ts
@@ -0,0 +1,9 @@
+// #docregion
+
+angular.
+  module('core').
+  filter('checkmark', function() {
+    return function(input: boolean) {
+      return input ? '\u2713' : '\u2718';
+    };
+  });
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/core.module.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/core.module.ts
new file mode 100644
index 0000000000..84a91dc7a6
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/core.module.ts
@@ -0,0 +1,4 @@
+'use strict';
+
+// Define the `core` module
+angular.module('core', ['core.phone']);
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/phone/phone.module.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/phone/phone.module.ts
new file mode 100644
index 0000000000..0b6b348899
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/phone/phone.module.ts
@@ -0,0 +1,4 @@
+'use strict';
+
+// Define the `core.phone` module
+angular.module('core.phone', ['ngResource']);
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/phone/phone.service.spec.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/phone/phone.service.spec.ts
new file mode 100644
index 0000000000..3b6962dd59
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/phone/phone.service.spec.ts
@@ -0,0 +1,43 @@
+'use strict';
+
+describe('Phone', () => {
+  let $httpBackend:angular.IHttpBackendService;
+  let Phone:any;
+  let phonesData = [
+    {name: 'Phone X'},
+    {name: 'Phone Y'},
+    {name: 'Phone Z'}
+  ];
+
+  // Add a custom equality tester before each test
+  beforeEach(function() {
+    jasmine.addCustomEqualityTester(angular.equals);
+  });
+
+  // Load the module that contains the `Phone` service before each test
+  beforeEach(angular.mock.module('core.phone'));
+
+  // Instantiate the service and "train" `$httpBackend` before each test
+  beforeEach(inject(function(_$httpBackend_:angular.IHttpBackendService, _Phone_:any) {
+    $httpBackend = _$httpBackend_;
+    $httpBackend.expectGET('phones/phones.json').respond(phonesData);
+
+    Phone = _Phone_;
+  }));
+
+  // Verify that there are no outstanding expectations or requests after each test
+  afterEach(() => {
+    $httpBackend.verifyNoOutstandingExpectation();
+    $httpBackend.verifyNoOutstandingRequest();
+  });
+
+  it('should fetch the phones data from `/phones/phones.json`', () => {
+    var phones = Phone.query();
+
+    expect(phones).toEqual([]);
+
+    $httpBackend.flush();
+    expect(phones).toEqual(phonesData);
+  });
+
+});
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/phone/phone.service.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/phone/phone.service.ts
new file mode 100644
index 0000000000..c6204bc896
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/core/phone/phone.service.ts
@@ -0,0 +1,14 @@
+// #docregion
+angular.
+  module('core.phone').
+  factory('Phone', ['$resource',
+    function($resource: angular.resource.IResourceService) {
+      return $resource('phones/:phoneId.json', {}, {
+        query: {
+          method: 'GET',
+          params: {phoneId: 'phones'},
+          isArray: true
+        }
+      });
+    }
+  ]);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/css/.gitkeep b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/.gitkeep
similarity index 100%
rename from public/docs/_examples/upgrade-phonecat/ts/classes/app/css/.gitkeep
rename to public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/.gitkeep
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/dell-streak-7.0.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/dell-streak-7.0.jpg
new file mode 100644
index 0000000000..7ce0dce4ee
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/dell-streak-7.0.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/dell-streak-7.1.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/dell-streak-7.1.jpg
new file mode 100644
index 0000000000..ed8cad89fb
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/dell-streak-7.1.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/dell-streak-7.2.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/dell-streak-7.2.jpg
new file mode 100644
index 0000000000..c83529e0f9
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/dell-streak-7.2.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/dell-streak-7.3.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/dell-streak-7.3.jpg
new file mode 100644
index 0000000000..cd2c30280d
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/dell-streak-7.3.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/dell-streak-7.4.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/dell-streak-7.4.jpg
new file mode 100644
index 0000000000..b4d8472da8
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/dell-streak-7.4.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-atrix-4g.0.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-atrix-4g.0.jpg
new file mode 100644
index 0000000000..2446159e93
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-atrix-4g.0.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-atrix-4g.1.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-atrix-4g.1.jpg
new file mode 100644
index 0000000000..867f207459
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-atrix-4g.1.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-atrix-4g.2.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-atrix-4g.2.jpg
new file mode 100644
index 0000000000..27d78338c4
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-atrix-4g.2.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-atrix-4g.3.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-atrix-4g.3.jpg
new file mode 100644
index 0000000000..29459a68a4
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-atrix-4g.3.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.0.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.0.jpg
new file mode 100644
index 0000000000..a6c993291e
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.0.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.1.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.1.jpg
new file mode 100644
index 0000000000..400b89e2df
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.1.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.2.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.2.jpg
new file mode 100644
index 0000000000..86b55d28dd
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.2.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.3.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.3.jpg
new file mode 100644
index 0000000000..85ec293ae5
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.3.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.4.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.4.jpg
new file mode 100644
index 0000000000..75ef1464cb
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.4.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.5.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.5.jpg
new file mode 100644
index 0000000000..4d42db4330
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom-with-wi-fi.5.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom.0.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom.0.jpg
new file mode 100644
index 0000000000..bf6954bbd5
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom.0.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom.1.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom.1.jpg
new file mode 100644
index 0000000000..659688a47d
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom.1.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom.2.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom.2.jpg
new file mode 100644
index 0000000000..ce0ff1002e
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/motorola-xoom.2.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/nexus-s.0.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/nexus-s.0.jpg
new file mode 100644
index 0000000000..0952bc79c2
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/nexus-s.0.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/nexus-s.1.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/nexus-s.1.jpg
new file mode 100644
index 0000000000..f33004dd7f
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/nexus-s.1.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/nexus-s.2.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/nexus-s.2.jpg
new file mode 100644
index 0000000000..c5c63621f1
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/nexus-s.2.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/nexus-s.3.jpg b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/nexus-s.3.jpg
new file mode 100644
index 0000000000..e51f75b0ed
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/img/phones/nexus-s.3.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/index.html b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/index.html
new file mode 100644
index 0000000000..82717fb7ee
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/index.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<html lang="en" ng-app="phonecatApp">
+  <head>
+    <meta charset="utf-8">
+    <title>Google Phone Gallery</title>
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
+    <link rel="stylesheet" href="app.css" />
+    <link rel="stylesheet" href="app.animations.css" />
+
+    <script src="https://code.jquery.com/jquery-2.2.4.js"></script>
+    <script src="https://code.angularjs.org/1.5.5/angular.js"></script>
+    <script src="https://code.angularjs.org/1.5.5/angular-animate.js"></script>
+    <script src="https://code.angularjs.org/1.5.5/angular-resource.js"></script>
+    <script src="https://code.angularjs.org/1.5.5/angular-route.js"></script>
+
+    <script src="app.module.js"></script>
+    <script src="app.config.js"></script>
+    <script src="app.animations.js"></script>
+    <script src="core/core.module.js"></script>
+    <script src="core/checkmark/checkmark.filter.js"></script>
+    <script src="core/phone/phone.module.js"></script>
+    <script src="core/phone/phone.service.js"></script>
+    <script src="phone-list/phone-list.module.js"></script>
+    <script src="phone-list/phone-list.component.js"></script>
+    <script src="phone-detail/phone-detail.module.js"></script>
+    <script src="phone-detail/phone-detail.component.js"></script>
+  </head>
+  <body>
+
+    <div class="view-container">
+      <div ng-view class="view-frame"></div>
+    </div>
+
+  </body>
+</html>
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-detail/phone-detail.component.spec.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-detail/phone-detail.component.spec.ts
new file mode 100644
index 0000000000..15ff4a2464
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-detail/phone-detail.component.spec.ts
@@ -0,0 +1,38 @@
+// #docregion
+describe('phoneDetail', () => {
+
+  // Load the module that contains the `phoneDetail` component before each test
+  beforeEach(angular.mock.module('phoneDetail'));
+
+  // Test the controller
+  describe('PhoneDetailController', () => {
+    let $httpBackend: angular.IHttpBackendService
+    let ctrl: any;
+    let xyzPhoneData = {
+      name: 'phone xyz',
+      images: ['image/url1.png', 'image/url2.png']
+    };
+
+    beforeEach(inject(($componentController: any,
+                       _$httpBackend_: angular.IHttpBackendService,
+                       $routeParams: angular.route.IRouteParamsService) => {
+      $httpBackend = _$httpBackend_;
+      $httpBackend.expectGET('phones/xyz.json').respond(xyzPhoneData);
+
+      $routeParams['phoneId'] = 'xyz';
+
+      ctrl = $componentController('phoneDetail');
+    }));
+
+    it('should fetch the phone details', () => {
+      jasmine.addCustomEqualityTester(angular.equals);
+
+      expect(ctrl.phone).toEqual({});
+
+      $httpBackend.flush();
+      expect(ctrl.phone).toEqual(xyzPhoneData);
+    });
+
+  });
+
+});
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-detail/phone-detail.component.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-detail/phone-detail.component.ts
new file mode 100644
index 0000000000..079b31e2c2
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-detail/phone-detail.component.ts
@@ -0,0 +1,24 @@
+// #docregion
+class PhoneDetailController {
+  phone: any;
+  mainImageUrl: string;
+
+  static $inject = ['$routeParams', 'Phone'];
+  constructor($routeParams: angular.route.IRouteParamsService, Phone: any) {
+    let phoneId = $routeParams['phoneId'];
+    this.phone = Phone.get({phoneId}, (phone: any) => {
+      this.setImage(phone.images[0]);
+    });
+  }
+
+  setImage(imageUrl: string) {
+    this.mainImageUrl = imageUrl;
+  }
+}
+
+angular.
+  module('phoneDetail').
+  component('phoneDetail', {
+    templateUrl: 'phone-detail/phone-detail.template.html',
+    controller: PhoneDetailController
+  });
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-detail/phone-detail.module.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-detail/phone-detail.module.ts
new file mode 100644
index 0000000000..fd7cb3b920
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-detail/phone-detail.module.ts
@@ -0,0 +1,7 @@
+'use strict';
+
+// Define the `phoneDetail` module
+angular.module('phoneDetail', [
+  'ngRoute',
+  'core.phone'
+]);
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-detail/phone-detail.template.html b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-detail/phone-detail.template.html
new file mode 100644
index 0000000000..f48657803c
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-detail/phone-detail.template.html
@@ -0,0 +1,117 @@
+<div class="phone-images">
+  <img ng-src="{{img}}" class="phone"
+      ng-class="{selected: img === $ctrl.mainImageUrl}"
+      ng-repeat="img in $ctrl.phone.images" />
+</div>
+
+<h1>{{$ctrl.phone.name}}</h1>
+
+<p>{{$ctrl.phone.description}}</p>
+
+<ul class="phone-thumbs">
+  <li ng-repeat="img in $ctrl.phone.images">
+    <img ng-src="{{img}}" ng-click="$ctrl.setImage(img)" />
+  </li>
+</ul>
+
+<ul class="specs">
+  <li>
+    <span>Availability and Networks</span>
+    <dl>
+      <dt>Availability</dt>
+      <dd ng-repeat="availability in $ctrl.phone.availability">{{availability}}</dd>
+    </dl>
+  </li>
+  <li>
+    <span>Battery</span>
+    <dl>
+      <dt>Type</dt>
+      <dd>{{$ctrl.phone.battery.type}}</dd>
+      <dt>Talk Time</dt>
+      <dd>{{$ctrl.phone.battery.talkTime}}</dd>
+      <dt>Standby time (max)</dt>
+      <dd>{{$ctrl.phone.battery.standbyTime}}</dd>
+    </dl>
+  </li>
+  <li>
+    <span>Storage and Memory</span>
+    <dl>
+      <dt>RAM</dt>
+      <dd>{{$ctrl.phone.storage.ram}}</dd>
+      <dt>Internal Storage</dt>
+      <dd>{{$ctrl.phone.storage.flash}}</dd>
+    </dl>
+  </li>
+  <li>
+    <span>Connectivity</span>
+    <dl>
+      <dt>Network Support</dt>
+      <dd>{{$ctrl.phone.connectivity.cell}}</dd>
+      <dt>WiFi</dt>
+      <dd>{{$ctrl.phone.connectivity.wifi}}</dd>
+      <dt>Bluetooth</dt>
+      <dd>{{$ctrl.phone.connectivity.bluetooth}}</dd>
+      <dt>Infrared</dt>
+      <dd>{{$ctrl.phone.connectivity.infrared | checkmark}}</dd>
+      <dt>GPS</dt>
+      <dd>{{$ctrl.phone.connectivity.gps | checkmark}}</dd>
+    </dl>
+  </li>
+  <li>
+    <span>Android</span>
+    <dl>
+      <dt>OS Version</dt>
+      <dd>{{$ctrl.phone.android.os}}</dd>
+      <dt>UI</dt>
+      <dd>{{$ctrl.phone.android.ui}}</dd>
+    </dl>
+  </li>
+  <li>
+    <span>Size and Weight</span>
+    <dl>
+      <dt>Dimensions</dt>
+      <dd ng-repeat="dim in $ctrl.phone.sizeAndWeight.dimensions">{{dim}}</dd>
+      <dt>Weight</dt>
+      <dd>{{$ctrl.phone.sizeAndWeight.weight}}</dd>
+    </dl>
+  </li>
+  <li>
+    <span>Display</span>
+    <dl>
+      <dt>Screen size</dt>
+      <dd>{{$ctrl.phone.display.screenSize}}</dd>
+      <dt>Screen resolution</dt>
+      <dd>{{$ctrl.phone.display.screenResolution}}</dd>
+      <dt>Touch screen</dt>
+      <dd>{{$ctrl.phone.display.touchScreen | checkmark}}</dd>
+    </dl>
+  </li>
+  <li>
+    <span>Hardware</span>
+    <dl>
+      <dt>CPU</dt>
+      <dd>{{$ctrl.phone.hardware.cpu}}</dd>
+      <dt>USB</dt>
+      <dd>{{$ctrl.phone.hardware.usb}}</dd>
+      <dt>Audio / headphone jack</dt>
+      <dd>{{$ctrl.phone.hardware.audioJack}}</dd>
+      <dt>FM Radio</dt>
+      <dd>{{$ctrl.phone.hardware.fmRadio | checkmark}}</dd>
+      <dt>Accelerometer</dt>
+      <dd>{{$ctrl.phone.hardware.accelerometer | checkmark}}</dd>
+    </dl>
+  </li>
+  <li>
+    <span>Camera</span>
+    <dl>
+      <dt>Primary</dt>
+      <dd>{{$ctrl.phone.camera.primary}}</dd>
+      <dt>Features</dt>
+      <dd>{{$ctrl.phone.camera.features.join(', ')}}</dd>
+    </dl>
+  </li>
+  <li>
+    <span>Additional Features</span>
+    <dd>{{$ctrl.phone.additionalFeatures}}</dd>
+  </li>
+</ul>
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-list/phone-list.component.spec.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-list/phone-list.component.spec.ts
new file mode 100644
index 0000000000..19e1890817
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-list/phone-list.component.spec.ts
@@ -0,0 +1,36 @@
+'use strict';
+
+describe('phoneList', () => {
+
+  // Load the module that contains the `phoneList` component before each test
+  beforeEach(angular.mock.module('phoneList'));
+
+  // Test the controller
+  describe('PhoneListController', () => {
+    let $httpBackend: angular.IHttpBackendService;
+    let ctrl: any;
+
+    beforeEach(inject(($componentController: any, _$httpBackend_: angular.IHttpBackendService) => {
+      $httpBackend = _$httpBackend_;
+      $httpBackend.expectGET('phones/phones.json')
+                  .respond([{name: 'Nexus S'}, {name: 'Motorola DROID'}]);
+
+      ctrl = $componentController('phoneList');
+    }));
+
+    it('should create a `phones` property with 2 phones fetched with `$http`', () => {
+      jasmine.addCustomEqualityTester(angular.equals);
+
+      expect(ctrl.phones).toEqual([]);
+
+      $httpBackend.flush();
+      expect(ctrl.phones).toEqual([{name: 'Nexus S'}, {name: 'Motorola DROID'}]);
+    });
+
+    it('should set a default value for the `orderProp` property', () => {
+      expect(ctrl.orderProp).toBe('age');
+    });
+
+  });
+
+});
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-list/phone-list.component.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-list/phone-list.component.ts
new file mode 100644
index 0000000000..e2f2855ae6
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-list/phone-list.component.ts
@@ -0,0 +1,20 @@
+// #docregion
+class PhoneListController {
+  phones: any[];
+  orderProp: string;
+  query: string;
+
+  static $inject = ['Phone'];
+  constructor(Phone: any) {
+    this.phones = Phone.query();
+    this.orderProp = 'age';
+  }
+
+}
+
+angular.
+  module('phoneList').
+  component('phoneList', {
+    templateUrl: 'phone-list/phone-list.template.html',
+    controller: PhoneListController
+  });
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-list/phone-list.module.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-list/phone-list.module.ts
new file mode 100644
index 0000000000..8ade7c5b88
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-list/phone-list.module.ts
@@ -0,0 +1,4 @@
+'use strict';
+
+// Define the `phoneList` module
+angular.module('phoneList', ['core.phone']);
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-list/phone-list.template.html b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-list/phone-list.template.html
new file mode 100644
index 0000000000..90548f9f91
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phone-list/phone-list.template.html
@@ -0,0 +1,36 @@
+<div class="container-fluid">
+  <div class="row">
+    <div class="col-md-2">
+      <!--Sidebar content-->
+
+      <p>
+        Search:
+        <input ng-model="$ctrl.query" />
+      </p>
+
+      <p>
+        Sort by:
+        <select ng-model="$ctrl.orderProp">
+          <option value="name">Alphabetical</option>
+          <option value="age">Newest</option>
+        </select>
+      </p>
+
+    </div>
+    <div class="col-md-10">
+      <!--Body content-->
+
+      <ul class="phones">
+        <li ng-repeat="phone in $ctrl.phones | filter:$ctrl.query | orderBy:$ctrl.orderProp"
+            class="thumbnail phone-list-item">
+          <a href="#!/phones/{{phone.id}}" class="thumb">
+            <img ng-src="{{phone.imageUrl}}" alt="{{phone.name}}" />
+          </a>
+          <a href="#!/phones/{{phone.id}}">{{phone.name}}</a>
+          <p>{{phone.snippet}}</p>
+        </li>
+      </ul>
+
+    </div>
+  </div>
+</div>
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/dell-streak-7.json b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/dell-streak-7.json
new file mode 100644
index 0000000000..a32eb6ff98
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/dell-streak-7.json
@@ -0,0 +1,64 @@
+{
+    "additionalFeatures": "Front Facing 1.3MP Camera", 
+    "android": {
+        "os": "Android 2.2", 
+        "ui": "Dell Stage"
+    }, 
+    "availability": [
+        "T-Mobile"
+    ], 
+    "battery": {
+        "standbyTime": "", 
+        "talkTime": "", 
+        "type": "Lithium Ion (Li-Ion) (2780 mAH)"
+    }, 
+    "camera": {
+        "features": [
+            "Flash", 
+            "Video"
+        ], 
+        "primary": "5.0 megapixels"
+    }, 
+    "connectivity": {
+        "bluetooth": "Bluetooth 2.1", 
+        "cell": "T-mobile HSPA+ @ 2100/1900/AWS/850 MHz", 
+        "gps": true, 
+        "infrared": false, 
+        "wifi": "802.11 b/g"
+    }, 
+    "description": "Introducing Dell\u2122 Streak 7. Share photos, videos and movies together. It\u2019s small enough to carry around, big enough to gather around. Android\u2122 2.2-based tablet with over-the-air upgrade capability for future OS releases.  A vibrant 7-inch, multitouch display with full Adobe\u00ae Flash 10.1 pre-installed.  Includes a 1.3 MP front-facing camera for face-to-face chats on popular services such as Qik or Skype.  16 GB of internal storage, plus Wi-Fi, Bluetooth and built-in GPS keeps you in touch with the world around you.  Connect on your terms. Save with 2-year contract or flexibility with prepaid pay-as-you-go plans", 
+    "display": {
+        "screenResolution": "WVGA (800 x 480)", 
+        "screenSize": "7.0 inches", 
+        "touchScreen": true
+    }, 
+    "hardware": {
+        "accelerometer": true, 
+        "audioJack": "3.5mm", 
+        "cpu": "nVidia Tegra T20", 
+        "fmRadio": false, 
+        "physicalKeyboard": false, 
+        "usb": "USB 2.0"
+    }, 
+    "id": "dell-streak-7", 
+    "images": [
+        "img/phones/dell-streak-7.0.jpg", 
+        "img/phones/dell-streak-7.1.jpg", 
+        "img/phones/dell-streak-7.2.jpg", 
+        "img/phones/dell-streak-7.3.jpg", 
+        "img/phones/dell-streak-7.4.jpg"
+    ], 
+    "name": "Dell Streak 7", 
+    "sizeAndWeight": {
+        "dimensions": [
+            "199.9 mm (w)", 
+            "119.8 mm (h)", 
+            "12.4 mm (d)"
+        ], 
+        "weight": "450.0 grams"
+    }, 
+    "storage": {
+        "flash": "16000MB", 
+        "ram": "512MB"
+    }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/motorola-atrix-4g.json b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/motorola-atrix-4g.json
new file mode 100644
index 0000000000..ccca00e3b2
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/motorola-atrix-4g.json
@@ -0,0 +1,62 @@
+{
+    "additionalFeatures": "", 
+    "android": {
+        "os": "Android 2.2", 
+        "ui": "MOTOBLUR"
+    }, 
+    "availability": [
+        "AT&T"
+    ], 
+    "battery": {
+        "standbyTime": "400 hours", 
+        "talkTime": "5 hours", 
+        "type": "Lithium Ion (Li-Ion) (1930 mAH)"
+    }, 
+    "camera": {
+        "features": [
+            ""
+        ], 
+        "primary": ""
+    }, 
+    "connectivity": {
+        "bluetooth": "Bluetooth 2.1", 
+        "cell": "WCDMA 850/1900/2100, GSM 850/900/1800/1900, HSDPA 14Mbps (Category 10) Edge Class 12, GPRS Class 12, eCompass, AGPS", 
+        "gps": true, 
+        "infrared": false, 
+        "wifi": "802.11 a/b/g/n"
+    }, 
+    "description": "MOTOROLA ATRIX 4G gives you dual-core processing power and the revolutionary webtop application. With webtop and a compatible Motorola docking station, sold separately, you can surf the Internet with a full Firefox browser, create and edit docs, or access multimedia on a large screen almost anywhere.", 
+    "display": {
+        "screenResolution": "QHD (960 x 540)", 
+        "screenSize": "4.0 inches", 
+        "touchScreen": true
+    }, 
+    "hardware": {
+        "accelerometer": true, 
+        "audioJack": "3.5mm", 
+        "cpu": "1 GHz Dual Core", 
+        "fmRadio": false, 
+        "physicalKeyboard": false, 
+        "usb": "USB 2.0"
+    }, 
+    "id": "motorola-atrix-4g", 
+    "images": [
+        "img/phones/motorola-atrix-4g.0.jpg", 
+        "img/phones/motorola-atrix-4g.1.jpg", 
+        "img/phones/motorola-atrix-4g.2.jpg", 
+        "img/phones/motorola-atrix-4g.3.jpg"
+    ], 
+    "name": "MOTOROLA ATRIX\u2122 4G", 
+    "sizeAndWeight": {
+        "dimensions": [
+            "63.5 mm (w)", 
+            "117.75 mm (h)", 
+            "10.95 mm (d)"
+        ], 
+        "weight": "135.0 grams"
+    }, 
+    "storage": {
+        "flash": "", 
+        "ram": ""
+    }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/motorola-xoom-with-wi-fi.json b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/motorola-xoom-with-wi-fi.json
new file mode 100644
index 0000000000..4ba9c8d5b5
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/motorola-xoom-with-wi-fi.json
@@ -0,0 +1,65 @@
+{
+    "additionalFeatures": "Sensors: proximity, ambient light, barometer, gyroscope", 
+    "android": {
+        "os": "Android 3.0", 
+        "ui": "Honeycomb"
+    }, 
+    "availability": [
+        ""
+    ], 
+    "battery": {
+        "standbyTime": "336 hours", 
+        "talkTime": "24 hours", 
+        "type": "Other ( mAH)"
+    }, 
+    "camera": {
+        "features": [
+            "Flash", 
+            "Video"
+        ], 
+        "primary": "5.0 megapixels"
+    }, 
+    "connectivity": {
+        "bluetooth": "Bluetooth 2.1", 
+        "cell": "", 
+        "gps": true, 
+        "infrared": false, 
+        "wifi": "802.11 b/g/n"
+    }, 
+    "description": "Motorola XOOM with Wi-Fi has a super-powerful dual-core processor and Android\u2122 3.0 (Honeycomb) \u2014 the Android platform designed specifically for tablets. With its 10.1-inch HD widescreen display, you\u2019ll enjoy HD video in a thin, light, powerful and upgradeable tablet.", 
+    "display": {
+        "screenResolution": "WXGA (1200 x 800)", 
+        "screenSize": "10.1 inches", 
+        "touchScreen": true
+    }, 
+    "hardware": {
+        "accelerometer": true, 
+        "audioJack": "3.5mm", 
+        "cpu": "1 GHz Dual Core Tegra 2", 
+        "fmRadio": false, 
+        "physicalKeyboard": false, 
+        "usb": "USB 2.0"
+    }, 
+    "id": "motorola-xoom-with-wi-fi", 
+    "images": [
+        "img/phones/motorola-xoom-with-wi-fi.0.jpg", 
+        "img/phones/motorola-xoom-with-wi-fi.1.jpg", 
+        "img/phones/motorola-xoom-with-wi-fi.2.jpg", 
+        "img/phones/motorola-xoom-with-wi-fi.3.jpg", 
+        "img/phones/motorola-xoom-with-wi-fi.4.jpg", 
+        "img/phones/motorola-xoom-with-wi-fi.5.jpg"
+    ], 
+    "name": "Motorola XOOM\u2122 with Wi-Fi", 
+    "sizeAndWeight": {
+        "dimensions": [
+            "249.1 mm (w)", 
+            "167.8 mm (h)", 
+            "12.9 mm (d)"
+        ], 
+        "weight": "708.0 grams"
+    }, 
+    "storage": {
+        "flash": "32000MB", 
+        "ram": "1000MB"
+    }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/motorola-xoom.json b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/motorola-xoom.json
new file mode 100644
index 0000000000..f0f0c8711d
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/motorola-xoom.json
@@ -0,0 +1,62 @@
+{
+    "additionalFeatures": "Front-facing camera. Sensors: proximity, ambient light, barometer, gyroscope.", 
+    "android": {
+        "os": "Android 3.0", 
+        "ui": "Android"
+    }, 
+    "availability": [
+        "Verizon"
+    ], 
+    "battery": {
+        "standbyTime": "336 hours", 
+        "talkTime": "24 hours", 
+        "type": "Other (3250 mAH)"
+    }, 
+    "camera": {
+        "features": [
+            "Flash", 
+            "Video"
+        ], 
+        "primary": "5.0 megapixels"
+    }, 
+    "connectivity": {
+        "bluetooth": "Bluetooth 2.1", 
+        "cell": "CDMA 800 /1900 LTE 700, Rx diversity in all bands", 
+        "gps": true, 
+        "infrared": false, 
+        "wifi": "802.11 a/b/g/n"
+    }, 
+    "description": "MOTOROLA XOOM has a super-powerful dual-core processor and Android\u2122 3.0 (Honeycomb) \u2014 the Android platform designed specifically for tablets. With its 10.1-inch HD widescreen display, you\u2019ll enjoy HD video in a thin, light, powerful and upgradeable tablet.", 
+    "display": {
+        "screenResolution": "WXGA (1200 x 800)", 
+        "screenSize": "10.1 inches", 
+        "touchScreen": true
+    }, 
+    "hardware": {
+        "accelerometer": true, 
+        "audioJack": "3.5mm", 
+        "cpu": "1 GHz Dual Core Tegra 2", 
+        "fmRadio": false, 
+        "physicalKeyboard": false, 
+        "usb": "USB 2.0"
+    }, 
+    "id": "motorola-xoom", 
+    "images": [
+        "img/phones/motorola-xoom.0.jpg", 
+        "img/phones/motorola-xoom.1.jpg", 
+        "img/phones/motorola-xoom.2.jpg"
+    ], 
+    "name": "MOTOROLA XOOM\u2122", 
+    "sizeAndWeight": {
+        "dimensions": [
+            "249.0 mm (w)", 
+            "168.0 mm (h)", 
+            "12.7 mm (d)"
+        ], 
+        "weight": "726.0 grams"
+    }, 
+    "storage": {
+        "flash": "32000MB", 
+        "ram": "1000MB"
+    }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/nexus-s.json b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/nexus-s.json
new file mode 100644
index 0000000000..5e712e2ff8
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/nexus-s.json
@@ -0,0 +1,69 @@
+{
+    "additionalFeatures": "Contour Display, Near Field Communications (NFC), Three-axis gyroscope, Anti-fingerprint display coating, Internet Calling support (VoIP/SIP)", 
+    "android": {
+        "os": "Android 2.3", 
+        "ui": "Android"
+    }, 
+    "availability": [
+        "M1,", 
+        "O2,", 
+        "Orange,", 
+        "Singtel,", 
+        "StarHub,", 
+        "T-Mobile,", 
+        "Vodafone"
+    ], 
+    "battery": {
+        "standbyTime": "428 hours", 
+        "talkTime": "6 hours", 
+        "type": "Lithium Ion (Li-Ion) (1500 mAH)"
+    }, 
+    "camera": {
+        "features": [
+            "Flash", 
+            "Video"
+        ], 
+        "primary": "5.0 megapixels"
+    }, 
+    "connectivity": {
+        "bluetooth": "Bluetooth 2.1", 
+        "cell": "Quad-band GSM: 850, 900, 1800, 1900\r\nTri-band HSPA: 900, 2100, 1700\r\nHSPA type: HSDPA (7.2Mbps) HSUPA (5.76Mbps)", 
+        "gps": true, 
+        "infrared": false, 
+        "wifi": "802.11 b/g/n"
+    }, 
+    "description": "Nexus S is the next generation of Nexus devices, co-developed by Google and Samsung. The latest Android platform (Gingerbread), paired with a 1 GHz Hummingbird processor and 16GB of memory, makes Nexus S one of the fastest phones on the market. It comes pre-installed with the best of Google apps and enabled with new and popular features like true multi-tasking, Wi-Fi hotspot, Internet Calling, NFC support, and full web browsing. With this device, users will also be the first to receive software upgrades and new Google mobile apps as soon as they become available. For more details, visit http://www.google.com/nexus.", 
+    "display": {
+        "screenResolution": "WVGA (800 x 480)", 
+        "screenSize": "4.0 inches", 
+        "touchScreen": true
+    }, 
+    "hardware": {
+        "accelerometer": true, 
+        "audioJack": "3.5mm", 
+        "cpu": "1GHz Cortex A8 (Hummingbird) processor", 
+        "fmRadio": false, 
+        "physicalKeyboard": false, 
+        "usb": "USB 2.0"
+    }, 
+    "id": "nexus-s", 
+    "images": [
+        "img/phones/nexus-s.0.jpg", 
+        "img/phones/nexus-s.1.jpg", 
+        "img/phones/nexus-s.2.jpg", 
+        "img/phones/nexus-s.3.jpg"
+    ], 
+    "name": "Nexus S", 
+    "sizeAndWeight": {
+        "dimensions": [
+            "63.0 mm (w)", 
+            "123.9 mm (h)", 
+            "10.88 mm (d)"
+        ], 
+        "weight": "129.0 grams"
+    }, 
+    "storage": {
+        "flash": "16384MB", 
+        "ram": "512MB"
+    }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/phones.json b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/phones.json
new file mode 100644
index 0000000000..339b94fbb5
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/app/phones/phones.json
@@ -0,0 +1,155 @@
+[
+    {
+        "age": 0, 
+        "id": "motorola-xoom-with-wi-fi", 
+        "imageUrl": "img/phones/motorola-xoom-with-wi-fi.0.jpg", 
+        "name": "Motorola XOOM\u2122 with Wi-Fi", 
+        "snippet": "The Next, Next Generation\r\n\r\nExperience the future with Motorola XOOM with Wi-Fi, the world's first tablet powered by Android 3.0 (Honeycomb)."
+    }, 
+    {
+        "age": 1, 
+        "id": "motorola-xoom", 
+        "imageUrl": "img/phones/motorola-xoom.0.jpg", 
+        "name": "MOTOROLA XOOM\u2122", 
+        "snippet": "The Next, Next Generation\n\nExperience the future with MOTOROLA XOOM, the world's first tablet powered by Android 3.0 (Honeycomb)."
+    }, 
+    {
+        "age": 2, 
+        "carrier": "AT&T", 
+        "id": "motorola-atrix-4g", 
+        "imageUrl": "img/phones/motorola-atrix-4g.0.jpg", 
+        "name": "MOTOROLA ATRIX\u2122 4G", 
+        "snippet": "MOTOROLA ATRIX 4G the world's most powerful smartphone."
+    }, 
+    {
+        "age": 3, 
+        "id": "dell-streak-7", 
+        "imageUrl": "img/phones/dell-streak-7.0.jpg", 
+        "name": "Dell Streak 7", 
+        "snippet": "Introducing Dell\u2122 Streak 7. Share photos, videos and movies together. It\u2019s small enough to carry around, big enough to gather around."
+    }, 
+    {
+        "age": 4, 
+        "carrier": "Cellular South", 
+        "id": "samsung-gem", 
+        "imageUrl": "img/phones/samsung-gem.0.jpg", 
+        "name": "Samsung Gem\u2122", 
+        "snippet": "The Samsung Gem\u2122 brings you everything that you would expect and more from a touch display smart phone \u2013 more apps, more features and a more affordable price."
+    }, 
+    {
+        "age": 5, 
+        "carrier": "Dell", 
+        "id": "dell-venue", 
+        "imageUrl": "img/phones/dell-venue.0.jpg", 
+        "name": "Dell Venue", 
+        "snippet": "The Dell Venue; Your Personal Express Lane to Everything"
+    }, 
+    {
+        "age": 6, 
+        "carrier": "Best Buy", 
+        "id": "nexus-s", 
+        "imageUrl": "img/phones/nexus-s.0.jpg", 
+        "name": "Nexus S", 
+        "snippet": "Fast just got faster with Nexus S. A pure Google experience, Nexus S is the first phone to run Gingerbread (Android 2.3), the fastest version of Android yet."
+    }, 
+    {
+        "age": 7, 
+        "carrier": "Cellular South", 
+        "id": "lg-axis", 
+        "imageUrl": "img/phones/lg-axis.0.jpg", 
+        "name": "LG Axis", 
+        "snippet": "Android Powered, Google Maps Navigation, 5 Customizable Home Screens"
+    }, 
+    {
+        "age": 8, 
+        "id": "samsung-galaxy-tab", 
+        "imageUrl": "img/phones/samsung-galaxy-tab.0.jpg", 
+        "name": "Samsung Galaxy Tab\u2122", 
+        "snippet": "Feel Free to Tab\u2122. The Samsung Galaxy Tab\u2122 brings you an ultra-mobile entertainment experience through its 7\u201d display, high-power processor and Adobe\u00ae Flash\u00ae Player compatibility."
+    }, 
+    {
+        "age": 9, 
+        "carrier": "Cellular South", 
+        "id": "samsung-showcase-a-galaxy-s-phone", 
+        "imageUrl": "img/phones/samsung-showcase-a-galaxy-s-phone.0.jpg", 
+        "name": "Samsung Showcase\u2122 a Galaxy S\u2122 phone", 
+        "snippet": "The Samsung Showcase\u2122 delivers a cinema quality experience like you\u2019ve never seen before. Its innovative 4\u201d touch display technology provides rich picture brilliance, even outdoors"
+    }, 
+    {
+        "age": 10, 
+        "carrier": "Verizon", 
+        "id": "droid-2-global-by-motorola", 
+        "imageUrl": "img/phones/droid-2-global-by-motorola.0.jpg", 
+        "name": "DROID\u2122 2 Global by Motorola", 
+        "snippet": "The first smartphone with a 1.2 GHz processor and global capabilities."
+    }, 
+    {
+        "age": 11, 
+        "carrier": "Verizon", 
+        "id": "droid-pro-by-motorola", 
+        "imageUrl": "img/phones/droid-pro-by-motorola.0.jpg", 
+        "name": "DROID\u2122 Pro by Motorola", 
+        "snippet": "The next generation of DOES."
+    }, 
+    {
+        "age": 12, 
+        "carrier": "AT&T", 
+        "id": "motorola-bravo-with-motoblur", 
+        "imageUrl": "img/phones/motorola-bravo-with-motoblur.0.jpg", 
+        "name": "MOTOROLA BRAVO\u2122 with MOTOBLUR\u2122", 
+        "snippet": "An experience to cheer about."
+    }, 
+    {
+        "age": 13, 
+        "carrier": "T-Mobile", 
+        "id": "motorola-defy-with-motoblur", 
+        "imageUrl": "img/phones/motorola-defy-with-motoblur.0.jpg", 
+        "name": "Motorola DEFY\u2122 with MOTOBLUR\u2122", 
+        "snippet": "Are you ready for everything life throws your way?"
+    }, 
+    {
+        "age": 14, 
+        "carrier": "T-Mobile", 
+        "id": "t-mobile-mytouch-4g", 
+        "imageUrl": "img/phones/t-mobile-mytouch-4g.0.jpg", 
+        "name": "T-Mobile myTouch 4G", 
+        "snippet": "The T-Mobile myTouch 4G is a premium smartphone designed to deliver blazing fast 4G speeds so that you can video chat from practically anywhere, with or without Wi-Fi."
+    }, 
+    {
+        "age": 15, 
+        "carrier": "US Cellular", 
+        "id": "samsung-mesmerize-a-galaxy-s-phone", 
+        "imageUrl": "img/phones/samsung-mesmerize-a-galaxy-s-phone.0.jpg", 
+        "name": "Samsung Mesmerize\u2122 a Galaxy S\u2122 phone", 
+        "snippet": "The Samsung Mesmerize\u2122 delivers a cinema quality experience like you\u2019ve never seen before. Its innovative 4\u201d touch display technology provides rich picture brilliance,even outdoors"
+    }, 
+    {
+        "age": 16, 
+        "carrier": "Sprint", 
+        "id": "sanyo-zio", 
+        "imageUrl": "img/phones/sanyo-zio.0.jpg", 
+        "name": "SANYO ZIO", 
+        "snippet": "The Sanyo Zio by Kyocera is an Android smartphone with a combination of ultra-sleek styling, strong performance and unprecedented value."
+    }, 
+    {
+        "age": 17, 
+        "id": "samsung-transform", 
+        "imageUrl": "img/phones/samsung-transform.0.jpg", 
+        "name": "Samsung Transform\u2122", 
+        "snippet": "The Samsung Transform\u2122 brings you a fun way to customize your Android powered touch screen phone to just the way you like it through your favorite themed \u201cSprint ID Service Pack\u201d."
+    }, 
+    {
+        "age": 18, 
+        "id": "t-mobile-g2", 
+        "imageUrl": "img/phones/t-mobile-g2.0.jpg", 
+        "name": "T-Mobile G2", 
+        "snippet": "The T-Mobile G2 with Google is the first smartphone built for 4G speeds on T-Mobile's new network. Get the information you need, faster than you ever thought possible."
+    }, 
+    {
+        "age": 19, 
+        "id": "motorola-charm-with-motoblur", 
+        "imageUrl": "img/phones/motorola-charm-with-motoblur.0.jpg", 
+        "name": "Motorola CHARM\u2122 with MOTOBLUR\u2122", 
+        "snippet": "Motorola CHARM fits easily in your pocket or palm.  Includes MOTOBLUR service."
+    }
+]
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/img/.gitkeep b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/example-config.json
similarity index 100%
rename from public/docs/_examples/upgrade-phonecat/ts/classes/app/img/.gitkeep
rename to public/docs/_examples/upgrade-phonecat-1-typescript/ts/example-config.json
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/karma.conf.ng1.js b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/karma.conf.ng1.js
new file mode 100644
index 0000000000..dc829d1983
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/karma.conf.ng1.js
@@ -0,0 +1,32 @@
+//jshint strict: false
+module.exports = function(config) {
+  config.set({
+
+    basePath: './app',
+
+    files: [
+      'https://code.angularjs.org/1.5.5/angular.js',
+      'https://code.angularjs.org/1.5.5/angular-animate.js',
+      'https://code.angularjs.org/1.5.5/angular-resource.js',
+      'https://code.angularjs.org/1.5.5/angular-route.js',
+      'https://code.angularjs.org/1.5.5/angular-mocks.js',
+      '**/*.module.js',
+      '*!(.module|.spec).js',
+      '!(bower_components)/**/*!(.module|.spec).js',
+      '**/*.spec.js'
+    ],
+
+    autoWatch: true,
+
+    frameworks: ['jasmine'],
+
+    browsers: ['Chrome', 'Firefox'],
+
+    plugins: [
+      'karma-chrome-launcher',
+      'karma-firefox-launcher',
+      'karma-jasmine'
+    ]
+
+  });
+};
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/run-unit-tests.sh b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/run-unit-tests.sh
new file mode 100755
index 0000000000..00a5abb7bc
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/run-unit-tests.sh
@@ -0,0 +1,7 @@
+## The boilerplate Karma configuration won't work with Angular 1 tests since
+## a specific loading configuration is needed for them.
+## We keep one in karma.conf.ng1.js. This scripts runs the ng1 tests with
+## that config.
+
+PATH=$(npm bin):$PATH
+tsc && karma start karma.conf.ng1.js
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/tsconfig.ng1.json b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/tsconfig.ng1.json
new file mode 100644
index 0000000000..53da36ca95
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/tsconfig.ng1.json
@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "commonjs",
+    "moduleResolution": "node",
+    "sourceMap": true,
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "removeComments": false,
+    "noImplicitAny": false,
+    "suppressImplicitAnyIndexErrors": true
+  }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-animate/index.d.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-animate/index.d.ts
new file mode 100644
index 0000000000..c720d9293a
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-animate/index.d.ts
@@ -0,0 +1,294 @@
+// Generated by typings
+// Source: https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/f0b2681b481397d0c03557ac2ac4d70c1c61c464/angularjs/angular-animate.d.ts
+declare module "angular-animate" {
+    var _: string;
+    export = _;
+}
+
+/**
+ * ngAnimate module (angular-animate.js)
+ */
+declare namespace angular.animate {
+    interface IAnimateFactory {
+        (...args: any[]): IAnimateCallbackObject;
+    }
+
+    interface IAnimateCallbackObject {
+        eventFn?: (element: IAugmentedJQuery, doneFunction: Function, options: IAnimationOptions) => any;
+        setClass?: (element: IAugmentedJQuery, addedClasses: string, removedClasses: string, doneFunction: Function, options: IAnimationOptions) => any;
+        addClass?: (element: IAugmentedJQuery, addedClasses: string, doneFunction: Function, options: IAnimationOptions) => any;
+        removeClass?: (element: IAugmentedJQuery, removedClasses: string, doneFunction: Function, options: IAnimationOptions) => any;
+        enter?: (element: IAugmentedJQuery, doneFunction: Function, options: IAnimationOptions) => any;
+        leave?: (element: IAugmentedJQuery, doneFunction: Function, options: IAnimationOptions) => any;
+        move?: (element: IAugmentedJQuery, doneFunction: Function, options: IAnimationOptions) => any;
+        animate?: (element: IAugmentedJQuery, fromStyles: string, toStyles: string, doneFunction: Function, options: IAnimationOptions) => any;
+    }
+
+    interface IAnimationPromise extends IPromise<void> {}
+
+    /**
+     * AnimateService
+     * see http://docs.angularjs.org/api/ngAnimate/service/$animate
+     */
+    interface IAnimateService {
+        /**
+         * Sets up an event listener to fire whenever the animation event has fired on the given element or among any of its children.
+         *
+         * @param event the animation event that will be captured (e.g. enter, leave, move, addClass, removeClass, etc...)
+         * @param container the container element that will capture each of the animation events that are fired on itself as well as among its children
+         * @param callback the callback function that will be fired when the listener is triggered
+         */
+        on(event: string, container: JQuery, callback: Function): void;
+
+        /**
+         * Deregisters an event listener based on the event which has been associated with the provided element.
+         *
+         * @param event the animation event (e.g. enter, leave, move, addClass, removeClass, etc...)
+         * @param container the container element the event listener was placed on
+         * @param callback the callback function that was registered as the listener
+         */
+        off(event: string, container?: JQuery, callback?: Function): void;
+
+        /**
+         * Associates the provided element with a host parent element to allow the element to be animated even if it exists outside of the DOM structure of the Angular application.
+         *
+         * @param element the external element that will be pinned
+         * @param parentElement the host parent element that will be associated with the external element
+         */
+        pin(element: JQuery, parentElement: JQuery): void;
+
+        /**
+        * Globally enables / disables animations.
+        *
+        * @param element If provided then the element will be used to represent the enable/disable operation.
+        * @param value If provided then set the animation on or off.
+        * @returns current animation state
+        */
+        enabled(element: JQuery, value?: boolean): boolean;
+        enabled(value: boolean): boolean;
+
+        /**
+         * Cancels the provided animation.
+         */
+        cancel(animationPromise: IAnimationPromise): void;
+
+        /**
+         * Performs an inline animation on the element.
+         *
+         * @param element the element that will be the focus of the animation
+         * @param from a collection of CSS styles that will be applied to the element at the start of the animation
+         * @param to a collection of CSS styles that the element will animate towards
+         * @param className an optional CSS class that will be added to the element for the duration of the animation (the default class is 'ng-inline-animate')
+         * @param options an optional collection of styles that will be picked up by the CSS transition/animation
+         * @returns the animation callback promise
+         */
+        animate(element: JQuery, from: any, to: any, className?: string, options?: IAnimationOptions): IAnimationPromise;
+
+        /**
+         * Appends the element to the parentElement element that resides in the document and then runs the enter animation.
+         *
+         * @param element the element that will be the focus of the enter animation
+         * @param parentElement the parent element of the element that will be the focus of the enter animation
+         * @param afterElement the sibling element (which is the previous element) of the element that will be the focus of the enter animation
+         * @param options an optional collection of styles that will be picked up by the CSS transition/animation
+         * @returns the animation callback promise
+         */
+        enter(element: JQuery, parentElement: JQuery, afterElement?: JQuery, options?: IAnimationOptions): IAnimationPromise;
+
+        /**
+         * Runs the leave animation operation and, upon completion, removes the element from the DOM.
+         *
+         * @param element the element that will be the focus of the leave animation
+         * @param options an optional collection of styles that will be picked up by the CSS transition/animation
+         * @returns the animation callback promise
+         */
+        leave(element: JQuery, options?: IAnimationOptions): IAnimationPromise;
+
+        /**
+         * Fires the move DOM operation. Just before the animation starts, the animate service will either append
+         * it into the parentElement container or add the element directly after the afterElement element if present.
+         * Then the move animation will be run.
+         *
+         * @param element the element that will be the focus of the move animation
+         * @param parentElement the parent element of the element that will be the focus of the move animation
+         * @param afterElement the sibling element (which is the previous element) of the element that will be the focus of the move animation
+         * @returns the animation callback promise
+         */
+        move(element: JQuery, parentElement: JQuery, afterElement?: JQuery): IAnimationPromise;
+
+        /**
+         * Triggers a custom animation event based off the className variable and then attaches the className
+         * value to the element as a CSS class.
+         *
+         * @param element the element that will be animated
+         * @param className the CSS class that will be added to the element and then animated
+         * @param options an optional collection of styles that will be picked up by the CSS transition/animation
+         * @returns the animation callback promise
+         */
+        addClass(element: JQuery, className: string, options?: IAnimationOptions): IAnimationPromise;
+
+        /**
+         * Triggers a custom animation event based off the className variable and then removes the CSS class
+         * provided by the className value from the element.
+         *
+         * @param element the element that will be animated
+         * @param className the CSS class that will be animated and then removed from the element
+         * @param options an optional collection of styles that will be picked up by the CSS transition/animation
+         * @returns the animation callback promise
+         */
+        removeClass(element: JQuery, className: string, options?: IAnimationOptions): IAnimationPromise;
+
+        /**
+         * Adds and/or removes the given CSS classes to and from the element. Once complete, the done() callback
+         * will be fired (if provided).
+         *
+         * @param element the element which will have its CSS classes changed removed from it
+         * @param add the CSS classes which will be added to the element
+         * @param remove the CSS class which will be removed from the element CSS classes have been set on the element
+         * @param options an optional collection of styles that will be picked up by the CSS transition/animation
+         * @returns the animation callback promise
+         */
+        setClass(element: JQuery, add: string, remove: string, options?: IAnimationOptions): IAnimationPromise;
+    }
+
+    /**
+     * AnimateProvider
+     * see http://docs.angularjs.org/api/ngAnimate/provider/$animateProvider
+     */
+    interface IAnimateProvider {
+        /**
+         * Registers a new injectable animation factory function.
+         *
+         * @param name The name of the animation.
+         * @param factory The factory function that will be executed to return the animation object.
+         */
+        register(name: string, factory: IAnimateFactory): void;
+
+        /**
+         * Gets and/or sets the CSS class expression that is checked when performing an animation.
+         *
+         * @param expression The className expression which will be checked against all animations.
+         * @returns The current CSS className expression value. If null then there is no expression value.
+         */
+        classNameFilter(expression?: RegExp): RegExp;
+    }
+
+    /**
+     * Angular Animation Options
+     * see https://docs.angularjs.org/api/ngAnimate/#applying-directive-specific-styles-to-an-animation
+     */
+    interface IAnimationOptions {
+        /**
+         * The ending CSS styles (a key/value object) that will be applied across the animation via a CSS transition.
+         */
+        to?: Object;
+
+        /**
+         * The starting CSS styles (a key/value object) that will be applied at the start of the animation.
+         */
+        from?: Object;
+
+        /**
+         * The DOM event (e.g. enter, leave, move). When used, a generated CSS class of ng-EVENT and
+         * ng-EVENT-active will be applied to the element during the animation. Multiple events can be provided when
+         * spaces are used as a separator. (Note that this will not perform any DOM operation.)
+         */
+        event?: string;
+
+        /**
+         * The CSS easing value that will be applied to the transition or keyframe animation (or both).
+         */
+        easing?: string;
+
+        /**
+         * The raw CSS transition style that will be used (e.g. 1s linear all).
+         */
+        transition?: string;
+
+        /**
+         * The raw CSS keyframe animation style that will be used (e.g. 1s my_animation linear).
+         */
+        keyframe?: string;
+
+        /**
+         * A space separated list of CSS classes that will be added to the element and spread across the animation.
+         */
+        addClass?: string;
+
+        /**
+         * A space separated list of CSS classes that will be removed from the element and spread across
+         * the animation.
+         */
+        removeClass?: string;
+
+        /**
+         * A number value representing the total duration of the transition and/or keyframe (note that a value
+         * of 1 is 1000ms). If a value of 0 is provided then the animation will be skipped entirely.
+         */
+        duration?: number;
+
+        /**
+         * A number value representing the total delay of the transition and/or keyframe (note that a value of
+         * 1 is 1000ms). If a value of true is used then whatever delay value is detected from the CSS classes will be
+         * mirrored on the elements styles (e.g. by setting delay true then the style value of the element will be
+         * transition-delay: DETECTED_VALUE). Using true is useful when you want the CSS classes and inline styles to
+         * all share the same CSS delay value.
+         */
+        delay?: number;
+
+        /**
+         * A numeric time value representing the delay between successively animated elements (Click here to
+         * learn how CSS-based staggering works in ngAnimate.)
+         */
+        stagger?: number;
+
+        /**
+         * The numeric index representing the stagger item (e.g. a value of 5 is equal to the sixth item
+         * in the stagger; therefore when a stagger option value of 0.1 is used then there will be a stagger delay of 600ms)
+         * applyClassesEarly - Whether or not the classes being added or removed will be used when detecting the animation.
+         * This is set by $animate when enter/leave/move animations are fired to ensure that the CSS classes are resolved in time.
+         * (Note that this will prevent any transitions from occuring on the classes being added and removed.)
+         */
+        staggerIndex?: number;
+    }
+
+    interface IAnimateCssRunner {
+        /**
+         * Starts the animation
+         *
+         * @returns The animation runner with a done function for supplying a callback.
+         */
+        start(): IAnimateCssRunnerStart;
+
+        /**
+         * Ends (aborts) the animation
+         */
+        end(): void;
+    }
+
+    interface IAnimateCssRunnerStart extends IPromise<void> {
+        /**
+         * Allows you to add done callbacks to the running animation
+         *
+         * @param callbackFn: the callback function to be run
+         */
+        done(callbackFn: (animationFinished: boolean) => void): void;
+    }
+
+    /**
+     * AnimateCssService
+     * see http://docs.angularjs.org/api/ngAnimate/service/$animateCss
+     */
+    interface IAnimateCssService {
+        (element: JQuery, animateCssOptions: IAnimationOptions): IAnimateCssRunner;
+    }
+}
+
+declare module angular {
+    interface IModule {
+        animation(name: string, animationFactory: angular.animate.IAnimateFactory): IModule;
+        animation(name: string, inlineAnnotatedFunction: any[]): IModule;
+        animation(object: Object): IModule;
+    }
+
+}
\ No newline at end of file
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-animate/typings.json b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-animate/typings.json
new file mode 100644
index 0000000000..ea2467c89a
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-animate/typings.json
@@ -0,0 +1,8 @@
+{
+  "resolution": "main",
+  "tree": {
+    "src": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/f0b2681b481397d0c03557ac2ac4d70c1c61c464/angularjs/angular-animate.d.ts",
+    "raw": "registry:dt/angular-animate#1.5.0+20160407085121",
+    "typings": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/f0b2681b481397d0c03557ac2ac4d70c1c61c464/angularjs/angular-animate.d.ts"
+  }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-mocks/index.d.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-mocks/index.d.ts
new file mode 100644
index 0000000000..fd6e92534b
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-mocks/index.d.ts
@@ -0,0 +1,339 @@
+// Generated by typings
+// Source: https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/5b7257019ae959533341a715b339d2562bbf9b85/angularjs/angular-mocks.d.ts
+declare module "angular-mocks/ngMock" {
+    var _: string;
+    export = _;
+}
+
+declare module "angular-mocks/ngMockE2E" {
+    var _: string;
+    export = _;
+}
+
+declare module "angular-mocks/ngAnimateMock" {
+    var _: string;
+    export = _;
+}
+
+///////////////////////////////////////////////////////////////////////////////
+// ngMock module (angular-mocks.js)
+///////////////////////////////////////////////////////////////////////////////
+declare namespace angular {
+
+    ///////////////////////////////////////////////////////////////////////////
+    // AngularStatic
+    // We reopen it to add the MockStatic definition
+    ///////////////////////////////////////////////////////////////////////////
+    interface IAngularStatic {
+        mock: IMockStatic;
+    }
+
+    // see https://docs.angularjs.org/api/ngMock/function/angular.mock.inject
+    interface IInjectStatic {
+        (...fns: Function[]): any;
+        (...inlineAnnotatedConstructor: any[]): any; // this overload is undocumented, but works
+        strictDi(val?: boolean): void;
+    }
+
+    interface IMockStatic {
+        // see https://docs.angularjs.org/api/ngMock/function/angular.mock.dump
+        dump(obj: any): string;
+
+        inject: IInjectStatic
+
+        // see https://docs.angularjs.org/api/ngMock/function/angular.mock.module
+        module: {
+          (...modules: any[]): any;
+          sharedInjector(): void;
+        }
+
+        // see https://docs.angularjs.org/api/ngMock/type/angular.mock.TzDate
+        TzDate(offset: number, timestamp: number): Date;
+        TzDate(offset: number, timestamp: string): Date;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // ExceptionHandlerService
+    // see https://docs.angularjs.org/api/ngMock/service/$exceptionHandler
+    // see https://docs.angularjs.org/api/ngMock/provider/$exceptionHandlerProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface IExceptionHandlerProvider extends IServiceProvider {
+        mode(mode: string): void;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // TimeoutService
+    // see https://docs.angularjs.org/api/ngMock/service/$timeout
+    // Augments the original service
+    ///////////////////////////////////////////////////////////////////////////
+    interface ITimeoutService {
+        flush(delay?: number): void;
+        flushNext(expectedDelay?: number): void;
+        verifyNoPendingTasks(): void;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // IntervalService
+    // see https://docs.angularjs.org/api/ngMock/service/$interval
+    // Augments the original service
+    ///////////////////////////////////////////////////////////////////////////
+    interface IIntervalService {
+        flush(millis?: number): number;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // LogService
+    // see https://docs.angularjs.org/api/ngMock/service/$log
+    // Augments the original service
+    ///////////////////////////////////////////////////////////////////////////
+    interface ILogService {
+        assertEmpty(): void;
+        reset(): void;
+    }
+
+    interface ILogCall {
+        logs: string[];
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // ControllerService mock
+    // see https://docs.angularjs.org/api/ngMock/service/$controller
+    // This interface extends http://docs.angularjs.org/api/ng.$controller
+    ///////////////////////////////////////////////////////////////////////////
+    interface IControllerService {
+      // Although the documentation doesn't state this, locals are optional
+      <T>(controllerConstructor: new (...args: any[]) => T, locals?: any, bindings?: any): T;
+      <T>(controllerConstructor: Function, locals?: any, bindings?: any): T;
+      <T>(controllerName: string, locals?: any, bindings?: any): T;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // ComponentControllerService
+    // see https://docs.angularjs.org/api/ngMock/service/$componentController
+    ///////////////////////////////////////////////////////////////////////////
+    interface IComponentControllerService {
+      // TBinding is an interface exposed by a component as per John Papa's style guide
+      // https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#accessible-members-up-top
+      <T, TBinding>(componentName: string, locals: { $scope: IScope, [key: string]: any }, bindings?: TBinding, ident?: string): T;
+    }
+
+
+    ///////////////////////////////////////////////////////////////////////////
+    // HttpBackendService
+    // see https://docs.angularjs.org/api/ngMock/service/$httpBackend
+    ///////////////////////////////////////////////////////////////////////////
+    interface IHttpBackendService {
+        /**
+          * Flushes all pending requests using the trained responses.
+          * @param count Number of responses to flush (in the order they arrived). If undefined, all pending requests will be flushed.
+          */
+        flush(count?: number): void;
+
+        /**
+          * Resets all request expectations, but preserves all backend definitions.
+          */
+        resetExpectations(): void;
+
+        /**
+          * Verifies that all of the requests defined via the expect api were made. If any of the requests were not made, verifyNoOutstandingExpectation throws an exception.
+          */
+        verifyNoOutstandingExpectation(): void;
+
+        /**
+          * Verifies that there are no outstanding requests that need to be flushed.
+          */
+        verifyNoOutstandingRequest(): void;
+
+        /**
+          * Creates a new request expectation.
+          * Throws a preformatted error if expectation(s) don't match supplied string, regular expression, object, or if function returns false.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param method HTTP method.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param data HTTP request body string, json object, regular expression or function that receives the data and returns true if the data matches the current expectation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        expect(method: string, url: string | RegExp | ((url: string) => boolean), data?: string | RegExp | Object | ((data: string) => boolean), headers?: Object | ((object: Object) => boolean)) :mock.IRequestHandler;
+
+        /**
+          * Creates a new request expectation for DELETE requests.
+          * Throws a preformatted error if expectation(s) don't match supplied string, regular expression, object, or if function returns false.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url is as expected.
+          * @param headers HTTP headers object to be compared with the HTTP headers in the request.
+        */
+        expectDELETE(url: string | RegExp | ((url: string) => boolean), headers?: Object): mock.IRequestHandler;
+
+        /**
+          * Creates a new request expectation for GET requests.
+          * Throws a preformatted error if expectation(s) don't match supplied string, regular expression, object, or if function returns false.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param headers HTTP headers object to be compared with the HTTP headers in the request.
+          */
+        expectGET(url: string | RegExp | ((url: string) => boolean), headers?: Object): mock.IRequestHandler;
+
+        /**
+          * Creates a new request expectation for HEAD requests.
+          * Throws a preformatted error if expectation(s) don't match supplied string, regular expression, object, or if function returns false.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param headers HTTP headers object to be compared with the HTTP headers in the request.
+          */
+        expectHEAD(url: string | RegExp | ((url: string) => boolean), headers?: Object): mock.IRequestHandler;
+
+        /**
+          * Creates a new request expectation for JSONP requests.
+          * Throws a preformatted error if expectation(s) don't match supplied string, regular expression, or if function returns false.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          */
+        expectJSONP(url: string | RegExp | ((url: string) => boolean)): mock.IRequestHandler;
+
+        /**
+          * Creates a new request expectation for PATCH requests.
+          * Throws a preformatted error if expectation(s) don't match supplied string, regular expression, object, or if function returns false.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param data HTTP request body string, json object, regular expression or function that receives the data and returns true if the data matches the current expectation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        expectPATCH(url: string | RegExp | ((url: string) => boolean), data?: string | RegExp | Object | ((data: string) => boolean), headers?: Object): mock.IRequestHandler;
+
+        /**
+          * Creates a new request expectation for POST requests.
+          * Throws a preformatted error if expectation(s) don't match supplied string, regular expression, object, or if function returns false.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param data HTTP request body string, json object, regular expression or function that receives the data and returns true if the data matches the current expectation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        expectPOST(url: string | RegExp | ((url: string) => boolean), data?: string | RegExp | Object | ((data: string) => boolean), headers?: Object): mock.IRequestHandler;
+
+        /**
+          * Creates a new request expectation for PUT requests.
+          * Throws a preformatted error if expectation(s) don't match supplied string, regular expression, object, or if function returns false.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param data HTTP request body string, json object, regular expression or function that receives the data and returns true if the data matches the current expectation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        expectPUT(url: string | RegExp | ((url: string) => boolean), data?: string | RegExp | Object | ((data: string) => boolean), headers?: Object): mock.IRequestHandler;
+
+        /**
+          * Creates a new backend definition.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param method HTTP method.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param data HTTP request body string, json object, regular expression or function that receives the data and returns true if the data matches the current expectation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        when(method: string, url: string | RegExp | ((url: string) => boolean), data?: string | RegExp | Object | ((data: string) => boolean), headers?: Object | ((object: Object) => boolean)): mock.IRequestHandler;
+
+        /**
+          * Creates a new backend definition for DELETE requests.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        whenDELETE(url: string | RegExp | ((url: string) => boolean), headers?: Object | ((object: Object) => boolean)): mock.IRequestHandler;
+
+        /**
+          * Creates a new backend definition for GET requests.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        whenGET(url: string | RegExp | ((url: string) => boolean), headers?: Object | ((object: Object) => boolean)): mock.IRequestHandler;
+
+        /**
+          * Creates a new backend definition for HEAD requests.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        whenHEAD(url: string | RegExp | ((url: string) => boolean), headers?: Object | ((object: Object) => boolean)): mock.IRequestHandler;
+
+        /**
+          * Creates a new backend definition for JSONP requests.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        whenJSONP(url: string | RegExp | ((url: string) => boolean)): mock.IRequestHandler;
+
+        /**
+          * Creates a new backend definition for PATCH requests.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param data HTTP request body string, json object, regular expression or function that receives the data and returns true if the data matches the current expectation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        whenPATCH(url: string | RegExp | ((url: string) => boolean), data?: string | RegExp | Object | ((data: string) => boolean), headers?: Object | ((object: Object) => boolean)): mock.IRequestHandler;
+
+        /**
+          * Creates a new backend definition for POST requests.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param data HTTP request body string, json object, regular expression or function that receives the data and returns true if the data matches the current expectation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        whenPOST(url: string | RegExp | ((url: string) => boolean), data?: string | RegExp | Object | ((data: string) => boolean), headers?: Object | ((object: Object) => boolean)): mock.IRequestHandler;
+
+        /**
+          * Creates a new backend definition for PUT requests.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param data HTTP request body string, json object, regular expression or function that receives the data and returns true if the data matches the current expectation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        whenPUT(url: string | RegExp | ((url: string) => boolean), data?: string | RegExp | Object | ((data: string) => boolean), headers?: Object | ((object: Object) => boolean)): mock.IRequestHandler;
+    }
+
+    export module mock {
+        // returned interface by the the mocked HttpBackendService expect/when methods
+        interface IRequestHandler {
+
+            /**
+              * Controls the response for a matched request using a function to construct the response.
+              * Returns the RequestHandler object for possible overrides.
+              * @param func Function that receives the request HTTP method, url, data, and headers and returns an array containing response status (number), data, headers, and status text.
+              */
+            respond(func: ((method: string, url: string, data: string | Object, headers: Object) => [number, string | Object, Object, string])): IRequestHandler;
+
+            /**
+              * Controls the response for a matched request using supplied static data to construct the response.
+              * Returns the RequestHandler object for possible overrides.
+              * @param status HTTP status code to add to the response.
+              * @param data Data to add to the response.
+              * @param headers Headers object to add to the response.
+              * @param responseText Response text to add to the response.
+              */
+            respond(status: number, data: string | Object, headers?: Object, responseText?: string): IRequestHandler;
+
+            /**
+              * Controls the response for a matched request using the HTTP status code 200 and supplied static data to construct the response.
+              * Returns the RequestHandler object for possible overrides.
+              * @param data Data to add to the response.
+              * @param headers Headers object to add to the response.
+              * @param responseText Response text to add to the response.
+              */
+            respond(data: string | Object, headers?: Object, responseText?: string): IRequestHandler;
+
+            // Available when ngMockE2E is loaded
+            /**
+              * Any request matching a backend definition or expectation with passThrough handler will be passed through to the real backend (an XHR request will be made to the server.)
+              */
+            passThrough(): IRequestHandler;
+        }
+
+    }
+
+}
+
+///////////////////////////////////////////////////////////////////////////////
+// functions attached to global object (window)
+///////////////////////////////////////////////////////////////////////////////
+//Use `angular.mock.module` instead of `module`, as `module` conflicts with commonjs.
+//declare var module: (...modules: any[]) => any;
+declare var inject: angular.IInjectStatic;
\ No newline at end of file
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-mocks/typings.json b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-mocks/typings.json
new file mode 100644
index 0000000000..4e51b0e278
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-mocks/typings.json
@@ -0,0 +1,8 @@
+{
+  "resolution": "main",
+  "tree": {
+    "src": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/5b7257019ae959533341a715b339d2562bbf9b85/angularjs/angular-mocks.d.ts",
+    "raw": "registry:dt/angular-mocks#1.3.0+20160425155016",
+    "typings": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/5b7257019ae959533341a715b339d2562bbf9b85/angularjs/angular-mocks.d.ts"
+  }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-resource/index.d.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-resource/index.d.ts
new file mode 100644
index 0000000000..3735f9430c
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-resource/index.d.ts
@@ -0,0 +1,191 @@
+// Generated by typings
+// Source: https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/e684481e0cd360db62fd6213ca7248245315e8a2/angularjs/angular-resource.d.ts
+declare module 'angular-resource' {
+    var _: string;
+    export = _;
+}
+
+///////////////////////////////////////////////////////////////////////////////
+// ngResource module (angular-resource.js)
+///////////////////////////////////////////////////////////////////////////////
+declare namespace angular.resource {
+
+    /**
+     * Currently supported options for the $resource factory options argument.
+     */
+    interface IResourceOptions {
+        /**
+         * If true then the trailing slashes from any calculated URL will be stripped (defaults to true)
+         */
+        stripTrailingSlashes?: boolean;
+        /**
+         * If true, the request made by a "non-instance" call will be cancelled (if not already completed) by calling
+         * $cancelRequest() on the call's return value. This can be overwritten per action. (Defaults to false.)
+         */
+        cancellable?: boolean;
+    }
+
+
+    ///////////////////////////////////////////////////////////////////////////
+    // ResourceService
+    // see http://docs.angularjs.org/api/ngResource.$resource
+    // Most part of the following definitions were achieved by analyzing the
+    // actual implementation, since the documentation doesn't seem to cover
+    // that deeply.
+    ///////////////////////////////////////////////////////////////////////////
+    interface IResourceService {
+        (url: string, paramDefaults?: any,
+            /** example:  {update: { method: 'PUT' }, delete: deleteDescriptor }
+             where deleteDescriptor : IActionDescriptor */
+            actions?: any, options?: IResourceOptions): IResourceClass<IResource<any>>;
+        <T, U>(url: string, paramDefaults?: any,
+            /** example:  {update: { method: 'PUT' }, delete: deleteDescriptor }
+             where deleteDescriptor : IActionDescriptor */
+            actions?: any, options?: IResourceOptions): U;
+        <T>(url: string, paramDefaults?: any,
+            /** example:  {update: { method: 'PUT' }, delete: deleteDescriptor }
+             where deleteDescriptor : IActionDescriptor */
+            actions?: any, options?: IResourceOptions): IResourceClass<T>;
+    }
+
+    // Just a reference to facilitate describing new actions
+    interface IActionDescriptor {
+        method: string;
+        params?: any;
+        url?: string;
+        isArray?: boolean;
+        transformRequest?: angular.IHttpRequestTransformer | angular.IHttpRequestTransformer[];
+        transformResponse?: angular.IHttpResponseTransformer | angular.IHttpResponseTransformer[];
+        headers?: any;
+        cache?: boolean | angular.ICacheObject;
+        /**
+         * Note: In contrast to $http.config, promises are not supported in $resource, because the same value
+         * would be used for multiple requests. If you are looking for a way to cancel requests, you should
+         * use the cancellable option.
+         */
+        timeout?: number
+        cancellable?: boolean;
+        withCredentials?: boolean;
+        responseType?: string;
+        interceptor?: IHttpInterceptor;
+    }
+
+    // Allow specify more resource methods
+    // No need to add duplicates for all four overloads.
+    interface IResourceMethod<T> {
+        (): T;
+        (params: Object): T;
+        (success: Function, error?: Function): T;
+        (params: Object, success: Function, error?: Function): T;
+        (params: Object, data: Object, success?: Function, error?: Function): T;
+    }
+
+    // Allow specify resource moethod which returns the array
+    // No need to add duplicates for all four overloads.
+    interface IResourceArrayMethod<T> {
+        (): IResourceArray<T>;
+        (params: Object): IResourceArray<T>;
+        (success: Function, error?: Function): IResourceArray<T>;
+        (params: Object, success: Function, error?: Function): IResourceArray<T>;
+        (params: Object, data: Object, success?: Function, error?: Function): IResourceArray<T>;
+    }
+
+    // Baseclass for everyresource with default actions.
+    // If you define your new actions for the resource, you will need
+    // to extend this interface and typecast the ResourceClass to it.
+    //
+    // In case of passing the first argument as anything but a function,
+    // it's gonna be considered data if the action method is POST, PUT or
+    // PATCH (in other words, methods with body). Otherwise, it's going
+    // to be considered as parameters to the request.
+    // https://github.com/angular/angular.js/blob/v1.2.0/src/ngResource/resource.js#L461-L465
+    //
+    // Only those methods with an HTTP body do have 'data' as first parameter:
+    // https://github.com/angular/angular.js/blob/v1.2.0/src/ngResource/resource.js#L463
+    // More specifically, those methods are POST, PUT and PATCH:
+    // https://github.com/angular/angular.js/blob/v1.2.0/src/ngResource/resource.js#L432
+    //
+    // Also, static calls always return the IResource (or IResourceArray) retrieved
+    // https://github.com/angular/angular.js/blob/v1.2.0/src/ngResource/resource.js#L538-L549
+    interface IResourceClass<T> {
+        new(dataOrParams? : any) : T;
+        get: IResourceMethod<T>;
+
+        query: IResourceArrayMethod<T>;
+
+        save: IResourceMethod<T>;
+
+        remove: IResourceMethod<T>;
+
+        delete: IResourceMethod<T>;
+    }
+
+    // Instance calls always return the the promise of the request which retrieved the object
+    // https://github.com/angular/angular.js/blob/v1.2.0/src/ngResource/resource.js#L538-L546
+    interface IResource<T> {
+        $get(): angular.IPromise<T>;
+        $get(params?: Object, success?: Function, error?: Function): angular.IPromise<T>;
+        $get(success: Function, error?: Function): angular.IPromise<T>;
+
+        $query(): angular.IPromise<IResourceArray<T>>;
+        $query(params?: Object, success?: Function, error?: Function): angular.IPromise<IResourceArray<T>>;
+        $query(success: Function, error?: Function): angular.IPromise<IResourceArray<T>>;
+
+        $save(): angular.IPromise<T>;
+        $save(params?: Object, success?: Function, error?: Function): angular.IPromise<T>;
+        $save(success: Function, error?: Function): angular.IPromise<T>;
+
+        $remove(): angular.IPromise<T>;
+        $remove(params?: Object, success?: Function, error?: Function): angular.IPromise<T>;
+        $remove(success: Function, error?: Function): angular.IPromise<T>;
+
+        $delete(): angular.IPromise<T>;
+        $delete(params?: Object, success?: Function, error?: Function): angular.IPromise<T>;
+        $delete(success: Function, error?: Function): angular.IPromise<T>;
+
+        $cancelRequest(): void;
+
+        /** the promise of the original server interaction that created this instance. **/
+        $promise : angular.IPromise<T>;
+        $resolved : boolean;
+        toJSON(): T;
+    }
+
+    /**
+     * Really just a regular Array object with $promise and $resolve attached to it
+     */
+    interface IResourceArray<T> extends Array<T & IResource<T>> {
+        /** the promise of the original server interaction that created this collection. **/
+        $promise : angular.IPromise<IResourceArray<T>>;
+        $resolved : boolean;
+    }
+
+    /** when creating a resource factory via IModule.factory */
+    interface IResourceServiceFactoryFunction<T> {
+        ($resource: angular.resource.IResourceService): IResourceClass<T>;
+        <U extends IResourceClass<T>>($resource: angular.resource.IResourceService): U;
+    }
+
+    // IResourceServiceProvider used to configure global settings
+    interface IResourceServiceProvider extends angular.IServiceProvider {
+
+        defaults: IResourceOptions;
+    }
+
+}
+
+/** extensions to base ng based on using angular-resource */
+declare namespace angular {
+
+    interface IModule {
+        /** creating a resource service factory */
+        factory(name: string, resourceServiceFactoryFunction: angular.resource.IResourceServiceFactoryFunction<any>): IModule;
+    }
+}
+
+interface Array<T>
+{
+    /** the promise of the original server interaction that created this collection. **/
+    $promise : angular.IPromise<Array<T>>;
+    $resolved : boolean;
+}
\ No newline at end of file
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-resource/typings.json b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-resource/typings.json
new file mode 100644
index 0000000000..b60eafd673
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-resource/typings.json
@@ -0,0 +1,8 @@
+{
+  "resolution": "main",
+  "tree": {
+    "src": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/e684481e0cd360db62fd6213ca7248245315e8a2/angularjs/angular-resource.d.ts",
+    "raw": "registry:dt/angular-resource#1.5.0+20160412142209",
+    "typings": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/e684481e0cd360db62fd6213ca7248245315e8a2/angularjs/angular-resource.d.ts"
+  }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-route/index.d.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-route/index.d.ts
new file mode 100644
index 0000000000..5fad393d0a
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-route/index.d.ts
@@ -0,0 +1,154 @@
+// Generated by typings
+// Source: https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/7de6c3dd94feaeb21f20054b9f30d5dabc5efabd/angularjs/angular-route.d.ts
+declare module "angular-route" {
+    var _: string;
+    export = _;
+}
+
+///////////////////////////////////////////////////////////////////////////////
+// ngRoute module (angular-route.js)
+///////////////////////////////////////////////////////////////////////////////
+declare namespace angular.route {
+
+    ///////////////////////////////////////////////////////////////////////////
+    // RouteParamsService
+    // see http://docs.angularjs.org/api/ngRoute.$routeParams
+    ///////////////////////////////////////////////////////////////////////////
+    interface IRouteParamsService {
+        [key: string]: any;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // RouteService
+    // see http://docs.angularjs.org/api/ngRoute.$route
+    // see http://docs.angularjs.org/api/ngRoute.$routeProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface IRouteService {
+        reload(): void;
+        routes: any;
+
+        // May not always be available. For instance, current will not be available
+        // to a controller that was not initialized as a result of a route maching.
+        current?: ICurrentRoute;
+
+        /**
+         * Causes $route service to update the current URL, replacing current route parameters with those specified in newParams.
+         * Provided property names that match the route's path segment definitions will be interpolated into the
+         * location's path, while remaining properties will be treated as query params.
+         *
+         * @param newParams Object.<string, string> mapping of URL parameter names to values
+         */
+        updateParams(newParams:{[key:string]:string}): void;
+
+    }
+
+    type InlineAnnotatedFunction = Function|Array<string|Function>
+
+    /**
+     * see http://docs.angularjs.org/api/ngRoute/provider/$routeProvider#when for API documentation
+     */
+    interface IRoute {
+        /**
+         * {(string|function()=}
+         * Controller fn that should be associated with newly created scope or the name of a registered controller if passed as a string.
+         */
+        controller?: string|InlineAnnotatedFunction;
+        /**
+         * A controller alias name. If present the controller will be published to scope under the controllerAs name.
+         */
+        controllerAs?: string;
+        /**
+         * Undocumented?
+         */
+        name?: string;
+        /**
+         * {string=|function()=}
+         * Html template as a string or a function that returns an html template as a string which should be used by ngView or ngInclude directives. This property takes precedence over templateUrl.
+         *
+         * If template is a function, it will be called with the following parameters:
+         *
+         * {Array.<Object>} - route parameters extracted from the current $location.path() by applying the current route
+         */
+        template?: string|{($routeParams?: angular.route.IRouteParamsService) : string;}
+        /**
+         * {string=|function()=}
+         * Path or function that returns a path to an html template that should be used by ngView.
+         *
+         * If templateUrl is a function, it will be called with the following parameters:
+         *
+         * {Array.<Object>} - route parameters extracted from the current $location.path() by applying the current route
+         */
+        templateUrl?: string|{ ($routeParams?: angular.route.IRouteParamsService): string; }
+        /**
+         * {Object.<string, function>=} - An optional map of dependencies which should be injected into the controller. If any of these dependencies are promises, the router will wait for them all to be resolved or one to be rejected before the controller is instantiated. If all the promises are resolved successfully, the values of the resolved promises are injected and $routeChangeSuccess event is fired. If any of the promises are rejected the $routeChangeError event is fired. The map object is:
+         *
+         * - key - {string}: a name of a dependency to be injected into the controller.
+         * - factory - {string|function}: If string then it is an alias for a service. Otherwise if function, then it is injected and the return value is treated as the dependency. If the result is a promise, it is resolved before its value is injected into the controller. Be aware that ngRoute.$routeParams will still refer to the previous route within these resolve functions. Use $route.current.params to access the new route parameters, instead.
+         */
+        resolve?: {[key: string]: any};
+        /**
+         * {(string|function())=}
+         * Value to update $location path with and trigger route redirection.
+         *
+         * If redirectTo is a function, it will be called with the following parameters:
+         *
+         * - {Object.<string>} - route parameters extracted from the current $location.path() by applying the current route templateUrl.
+         * - {string} - current $location.path()
+         * - {Object} - current $location.search()
+         * - The custom redirectTo function is expected to return a string which will be used to update $location.path() and $location.search().
+         */
+        redirectTo?: string|{($routeParams?: angular.route.IRouteParamsService, $locationPath?: string, $locationSearch?: any) : string};
+        /**
+         * Reload route when only $location.search() or $location.hash() changes.
+         *
+         * This option defaults to true. If the option is set to false and url in the browser changes, then $routeUpdate event is broadcasted on the root scope.
+         */
+        reloadOnSearch?: boolean;
+        /**
+         * Match routes without being case sensitive
+         *
+         * This option defaults to false. If the option is set to true, then the particular route can be matched without being case sensitive
+         */
+        caseInsensitiveMatch?: boolean;
+    }
+
+    // see http://docs.angularjs.org/api/ng.$route#current
+    interface ICurrentRoute extends IRoute {
+        locals: {
+            [index: string]: any;
+            $scope: IScope;
+            $template: string;
+        };
+
+        params: any;
+    }
+
+    interface IRouteProvider extends IServiceProvider {
+		/**
+         * Match routes without being case sensitive
+         *
+         * This option defaults to false. If the option is set to true, then the particular route can be matched without being case sensitive
+         */
+        caseInsensitiveMatch?: boolean;
+        /**
+         * Sets route definition that will be used on route change when no other route definition is matched.
+         *
+         * @params Mapping information to be assigned to $route.current.
+         */
+        otherwise(params: IRoute): IRouteProvider;
+        /**
+         * Adds a new route definition to the $route service.
+         *
+         * @param path Route path (matched against $location.path). If $location.path contains redundant trailing slash or is missing one, the route will still match and the $location.path will be updated to add or drop the trailing slash to exactly match the route definition.
+         *
+         * - path can contain named groups starting with a colon: e.g. :name. All characters up to the next slash are matched and stored in $routeParams under the given name when the route matches.
+         * - path can contain named groups starting with a colon and ending with a star: e.g.:name*. All characters are eagerly stored in $routeParams under the given name when the route matches.
+         * - path can contain optional named groups with a question mark: e.g.:name?.
+         *
+         * For example, routes like /color/:color/largecode/:largecode*\/edit will match /color/brown/largecode/code/with/slashes/edit and extract: color: brown and largecode: code/with/slashes.
+         *
+         * @param route Mapping information to be assigned to $route.current on route match.
+         */
+        when(path: string, route: IRoute): IRouteProvider;
+    }
+}
\ No newline at end of file
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-route/typings.json b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-route/typings.json
new file mode 100644
index 0000000000..4c4677f34f
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular-route/typings.json
@@ -0,0 +1,8 @@
+{
+  "resolution": "main",
+  "tree": {
+    "src": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/7de6c3dd94feaeb21f20054b9f30d5dabc5efabd/angularjs/angular-route.d.ts",
+    "raw": "registry:dt/angular-route#1.3.0+20160317120654",
+    "typings": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/7de6c3dd94feaeb21f20054b9f30d5dabc5efabd/angularjs/angular-route.d.ts"
+  }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular/index.d.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular/index.d.ts
new file mode 100644
index 0000000000..dfde81e26b
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular/index.d.ts
@@ -0,0 +1,1953 @@
+// Generated by typings
+// Source: https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/b76dd8a7f95b71696982befbb7589940d27e940b/angularjs/angular.d.ts
+declare var angular: angular.IAngularStatic;
+
+// Support for painless dependency injection
+interface Function {
+    $inject?: string[];
+}
+
+// Collapse angular into ng
+import ng = angular;
+// Support AMD require
+declare module 'angular' {
+    export = angular;
+}
+
+///////////////////////////////////////////////////////////////////////////////
+// ng module (angular.js)
+///////////////////////////////////////////////////////////////////////////////
+declare namespace angular {
+
+    // not directly implemented, but ensures that constructed class implements $get
+    interface IServiceProviderClass {
+        new (...args: any[]): IServiceProvider;
+    }
+
+    interface IServiceProviderFactory {
+        (...args: any[]): IServiceProvider;
+    }
+
+    // All service providers extend this interface
+    interface IServiceProvider {
+        $get: any;
+    }
+
+    interface IAngularBootstrapConfig {
+        strictDi?: boolean;
+        debugInfoEnabled?: boolean;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // AngularStatic
+    // see http://docs.angularjs.org/api
+    ///////////////////////////////////////////////////////////////////////////
+    interface IAngularStatic {
+        bind(context: any, fn: Function, ...args: any[]): Function;
+
+        /**
+         * Use this function to manually start up angular application.
+         *
+         * @param element DOM element which is the root of angular application.
+         * @param modules An array of modules to load into the application.
+         *     Each item in the array should be the name of a predefined module or a (DI annotated)
+         *     function that will be invoked by the injector as a config block.
+         * @param config an object for defining configuration options for the application. The following keys are supported:
+         *     - `strictDi`: disable automatic function annotation for the application. This is meant to assist in finding bugs which break minified code.
+         */
+        bootstrap(element: string|Element|JQuery|Document, modules?: (string|Function|any[])[], config?: IAngularBootstrapConfig): auto.IInjectorService;
+
+        /**
+         * Creates a deep copy of source, which should be an object or an array.
+         *
+         * - If no destination is supplied, a copy of the object or array is created.
+         * - If a destination is provided, all of its elements (for array) or properties (for objects) are deleted and then all elements/properties from the source are copied to it.
+         * - If source is not an object or array (inc. null and undefined), source is returned.
+         * - If source is identical to 'destination' an exception will be thrown.
+         *
+         * @param source The source that will be used to make a copy. Can be any type, including primitives, null, and undefined.
+         * @param destination Destination into which the source is copied. If provided, must be of the same type as source.
+         */
+        copy<T>(source: T, destination?: T): T;
+
+        /**
+         * Wraps a raw DOM element or HTML string as a jQuery element.
+         *
+         * If jQuery is available, angular.element is an alias for the jQuery function. If jQuery is not available, angular.element delegates to Angular's built-in subset of jQuery, called "jQuery lite" or "jqLite."
+         */
+        element: IAugmentedJQueryStatic;
+        equals(value1: any, value2: any): boolean;
+        extend(destination: any, ...sources: any[]): any;
+
+        /**
+         * Invokes the iterator function once for each item in obj collection, which can be either an object or an array. The iterator function is invoked with iterator(value, key), where value is the value of an object property or an array element and key is the object property key or array element index. Specifying a context for the function is optional.
+         *
+         * It is worth noting that .forEach does not iterate over inherited properties because it filters using the hasOwnProperty method.
+         *
+         * @param obj Object to iterate over.
+         * @param iterator Iterator function.
+         * @param context Object to become context (this) for the iterator function.
+         */
+        forEach<T>(obj: T[], iterator: (value: T, key: number) => any, context?: any): any;
+        /**
+         * Invokes the iterator function once for each item in obj collection, which can be either an object or an array. The iterator function is invoked with iterator(value, key), where value is the value of an object property or an array element and key is the object property key or array element index. Specifying a context for the function is optional.
+         *
+         * It is worth noting that .forEach does not iterate over inherited properties because it filters using the hasOwnProperty method.
+         *
+         * @param obj Object to iterate over.
+         * @param iterator Iterator function.
+         * @param context Object to become context (this) for the iterator function.
+         */
+        forEach<T>(obj: { [index: string]: T; }, iterator: (value: T, key: string) => any, context?: any): any;
+        /**
+         * Invokes the iterator function once for each item in obj collection, which can be either an object or an array. The iterator function is invoked with iterator(value, key), where value is the value of an object property or an array element and key is the object property key or array element index. Specifying a context for the function is optional.
+         *
+         * It is worth noting that .forEach does not iterate over inherited properties because it filters using the hasOwnProperty method.
+         *
+         * @param obj Object to iterate over.
+         * @param iterator Iterator function.
+         * @param context Object to become context (this) for the iterator function.
+         */
+        forEach(obj: any, iterator: (value: any, key: any) => any, context?: any): any;
+
+        fromJson(json: string): any;
+        identity<T>(arg?: T): T;
+        injector(modules?: any[], strictDi?: boolean): auto.IInjectorService;
+        isArray(value: any): boolean;
+        isDate(value: any): boolean;
+        isDefined(value: any): boolean;
+        isElement(value: any): boolean;
+        isFunction(value: any): boolean;
+        isNumber(value: any): boolean;
+        isObject(value: any): boolean;
+        isString(value: any): boolean;
+        isUndefined(value: any): boolean;
+        lowercase(str: string): string;
+
+        /**
+         * Deeply extends the destination object dst by copying own enumerable properties from the src object(s) to dst. You can specify multiple src objects. If you want to preserve original objects, you can do so by passing an empty object as the target: var object = angular.merge({}, object1, object2).
+         *
+         * Unlike extend(), merge() recursively descends into object properties of source objects, performing a deep copy.
+         *
+         * @param dst Destination object.
+         * @param src Source object(s).
+         */
+        merge(dst: any, ...src: any[]): any;
+
+        /**
+         * The angular.module is a global place for creating, registering and retrieving Angular modules. All modules (angular core or 3rd party) that should be available to an application must be registered using this mechanism.
+         *
+         * When passed two or more arguments, a new module is created. If passed only one argument, an existing module (the name passed as the first argument to module) is retrieved.
+         *
+         * @param name The name of the module to create or retrieve.
+         * @param requires The names of modules this module depends on. If specified then new module is being created. If unspecified then the module is being retrieved for further configuration.
+         * @param configFn Optional configuration function for the module.
+         */
+        module(
+            name: string,
+            requires?: string[],
+            configFn?: Function): IModule;
+
+        noop(...args: any[]): void;
+        reloadWithDebugInfo(): void;
+        toJson(obj: any, pretty?: boolean): string;
+        uppercase(str: string): string;
+        version: {
+            full: string;
+            major: number;
+            minor: number;
+            dot: number;
+            codeName: string;
+        };
+
+        /**
+         * If window.name contains prefix NG_DEFER_BOOTSTRAP! when angular.bootstrap is called, the bootstrap process will be paused until angular.resumeBootstrap() is called.
+         * @param extraModules An optional array of modules that should be added to the original list of modules that the app was about to be bootstrapped with.
+         */
+        resumeBootstrap?(extraModules?: string[]): ng.auto.IInjectorService;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // Module
+    // see http://docs.angularjs.org/api/angular.Module
+    ///////////////////////////////////////////////////////////////////////////
+    interface IModule {
+        /**
+         * Use this method to register a component.
+         *
+         * @param name The name of the component.
+         * @param options A definition object passed into the component.
+         */
+        component(name: string, options: IComponentOptions): IModule;
+        /**
+         * Use this method to register work which needs to be performed on module loading.
+         *
+         * @param configFn Execute this function on module load. Useful for service configuration.
+         */
+        config(configFn: Function): IModule;
+        /**
+         * Use this method to register work which needs to be performed on module loading.
+         *
+         * @param inlineAnnotatedFunction Execute this function on module load. Useful for service configuration.
+         */
+        config(inlineAnnotatedFunction: any[]): IModule;
+        config(object: Object): IModule;
+        /**
+         * Register a constant service, such as a string, a number, an array, an object or a function, with the $injector. Unlike value it can be injected into a module configuration function (see config) and it cannot be overridden by an Angular decorator.
+         *
+         * @param name The name of the constant.
+         * @param value The constant value.
+         */
+        constant<T>(name: string, value: T): IModule;
+        constant(object: Object): IModule;
+        /**
+         * The $controller service is used by Angular to create new controllers.
+         *
+         * This provider allows controller registration via the register method.
+         *
+         * @param name Controller name, or an object map of controllers where the keys are the names and the values are the constructors.
+         * @param controllerConstructor Controller constructor fn (optionally decorated with DI annotations in the array notation).
+         */
+        controller(name: string, controllerConstructor: Function): IModule;
+        /**
+         * The $controller service is used by Angular to create new controllers.
+         *
+         * This provider allows controller registration via the register method.
+         *
+         * @param name Controller name, or an object map of controllers where the keys are the names and the values are the constructors.
+         * @param controllerConstructor Controller constructor fn (optionally decorated with DI annotations in the array notation).
+         */
+        controller(name: string, inlineAnnotatedConstructor: any[]): IModule;
+        controller(object: Object): IModule;
+        /**
+         * Register a new directive with the compiler.
+         *
+         * @param name Name of the directive in camel-case (i.e. ngBind which will match as ng-bind)
+         * @param directiveFactory An injectable directive factory function.
+         */
+        directive(name: string, directiveFactory: IDirectiveFactory): IModule;
+        /**
+         * Register a new directive with the compiler.
+         *
+         * @param name Name of the directive in camel-case (i.e. ngBind which will match as ng-bind)
+         * @param directiveFactory An injectable directive factory function.
+         */
+        directive(name: string, inlineAnnotatedFunction: any[]): IModule;
+        directive(object: Object): IModule;
+        /**
+         * Register a service factory, which will be called to return the service instance. This is short for registering a service where its provider consists of only a $get property, which is the given service factory function. You should use $provide.factory(getFn) if you do not need to configure your service in a provider.
+         *
+         * @param name The name of the instance.
+         * @param $getFn The $getFn for the instance creation. Internally this is a short hand for $provide.provider(name, {$get: $getFn}).
+         */
+        factory(name: string, $getFn: Function): IModule;
+        /**
+         * Register a service factory, which will be called to return the service instance. This is short for registering a service where its provider consists of only a $get property, which is the given service factory function. You should use $provide.factory(getFn) if you do not need to configure your service in a provider.
+         *
+         * @param name The name of the instance.
+         * @param inlineAnnotatedFunction The $getFn for the instance creation. Internally this is a short hand for $provide.provider(name, {$get: $getFn}).
+         */
+        factory(name: string, inlineAnnotatedFunction: any[]): IModule;
+        factory(object: Object): IModule;
+        filter(name: string, filterFactoryFunction: Function): IModule;
+        filter(name: string, inlineAnnotatedFunction: any[]): IModule;
+        filter(object: Object): IModule;
+        provider(name: string, serviceProviderFactory: IServiceProviderFactory): IModule;
+        provider(name: string, serviceProviderConstructor: IServiceProviderClass): IModule;
+        provider(name: string, inlineAnnotatedConstructor: any[]): IModule;
+        provider(name: string, providerObject: IServiceProvider): IModule;
+        provider(object: Object): IModule;
+        /**
+         * Run blocks are the closest thing in Angular to the main method. A run block is the code which needs to run to kickstart the application. It is executed after all of the service have been configured and the injector has been created. Run blocks typically contain code which is hard to unit-test, and for this reason should be declared in isolated modules, so that they can be ignored in the unit-tests.
+         */
+        run(initializationFunction: Function): IModule;
+        /**
+         * Run blocks are the closest thing in Angular to the main method. A run block is the code which needs to run to kickstart the application. It is executed after all of the service have been configured and the injector has been created. Run blocks typically contain code which is hard to unit-test, and for this reason should be declared in isolated modules, so that they can be ignored in the unit-tests.
+         */
+        run(inlineAnnotatedFunction: any[]): IModule;
+        /**
+         * Register a service constructor, which will be invoked with new to create the service instance. This is short for registering a service where its provider's $get property is a factory function that returns an instance instantiated by the injector from the service constructor function.
+         *
+         * @param name The name of the instance.
+         * @param serviceConstructor An injectable class (constructor function) that will be instantiated.
+         */
+        service(name: string, serviceConstructor: Function): IModule;
+        /**
+         * Register a service constructor, which will be invoked with new to create the service instance. This is short for registering a service where its provider's $get property is a factory function that returns an instance instantiated by the injector from the service constructor function.
+         *
+         * @param name The name of the instance.
+         * @param inlineAnnotatedConstructor An injectable class (constructor function) that will be instantiated.
+         */
+        service(name: string, inlineAnnotatedConstructor: any[]): IModule;
+        service(object: Object): IModule;
+        /**
+         * Register a value service with the $injector, such as a string, a number, an array, an object or a function. This is short for registering a service where its provider's $get property is a factory function that takes no arguments and returns the value service.
+
+           Value services are similar to constant services, except that they cannot be injected into a module configuration function (see config) but they can be overridden by an Angular decorator.
+         *
+         * @param name The name of the instance.
+         * @param value The value.
+         */
+        value<T>(name: string, value: T): IModule;
+        value(object: Object): IModule;
+
+        /**
+         * Register a service decorator with the $injector. A service decorator intercepts the creation of a service, allowing it to override or modify the behaviour of the service. The object returned by the decorator may be the original service, or a new service object which replaces or wraps and delegates to the original service.
+         * @param name The name of the service to decorate
+         * @param decorator This function will be invoked when the service needs to be instantiated and should return the decorated service instance. The function is called using the injector.invoke method and is therefore fully injectable. Local injection arguments: $delegate - The original service instance, which can be monkey patched, configured, decorated or delegated to.
+         */
+        decorator(name:string, decoratorConstructor: Function): IModule;
+        decorator(name:string, inlineAnnotatedConstructor: any[]): IModule;
+
+        // Properties
+        name: string;
+        requires: string[];
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // Attributes
+    // see http://docs.angularjs.org/api/ng.$compile.directive.Attributes
+    ///////////////////////////////////////////////////////////////////////////
+    interface IAttributes {
+        /**
+         * this is necessary to be able to access the scoped attributes. it's not very elegant
+         * because you have to use attrs['foo'] instead of attrs.foo but I don't know of a better way
+         * this should really be limited to return string but it creates this problem: http://stackoverflow.com/q/17201854/165656
+         */
+        [name: string]: any;
+
+        /**
+         * Converts an attribute name (e.g. dash/colon/underscore-delimited string, optionally prefixed with x- or data-) to its normalized, camelCase form.
+         *
+         * Also there is special case for Moz prefix starting with upper case letter.
+         *
+         * For further information check out the guide on @see https://docs.angularjs.org/guide/directive#matching-directives
+         */
+        $normalize(name: string): string;
+
+        /**
+         * Adds the CSS class value specified by the classVal parameter to the
+         * element. If animations are enabled then an animation will be triggered
+         * for the class addition.
+         */
+        $addClass(classVal: string): void;
+
+        /**
+         * Removes the CSS class value specified by the classVal parameter from the
+         * element. If animations are enabled then an animation will be triggered for
+         * the class removal.
+         */
+        $removeClass(classVal: string): void;
+
+        /**
+         * Adds and removes the appropriate CSS class values to the element based on the difference between
+         * the new and old CSS class values (specified as newClasses and oldClasses).
+         */
+        $updateClass(newClasses: string, oldClasses: string): void;
+
+        /**
+         * Set DOM element attribute value.
+         */
+        $set(key: string, value: any): void;
+
+        /**
+         * Observes an interpolated attribute.
+         * The observer function will be invoked once during the next $digest
+         * following compilation. The observer is then invoked whenever the
+         * interpolated value changes.
+         */
+        $observe<T>(name: string, fn: (value?: T) => any): Function;
+
+        /**
+         * A map of DOM element attribute names to the normalized name. This is needed
+         * to do reverse lookup from normalized name back to actual name.
+         */
+        $attr: Object;
+    }
+
+    /**
+     * form.FormController - type in module ng
+     * see https://docs.angularjs.org/api/ng/type/form.FormController
+     */
+    interface IFormController {
+
+        /**
+         * Indexer which should return ng.INgModelController for most properties but cannot because of "All named properties must be assignable to string indexer type" constraint - see https://github.com/Microsoft/TypeScript/issues/272
+         */
+        [name: string]: any;
+
+        $pristine: boolean;
+        $dirty: boolean;
+        $valid: boolean;
+        $invalid: boolean;
+        $submitted: boolean;
+        $error: any;
+        $pending: any;
+        $addControl(control: INgModelController | IFormController): void;
+        $removeControl(control: INgModelController | IFormController): void;
+        $setValidity(validationErrorKey: string, isValid: boolean, control: INgModelController | IFormController): void;
+        $setDirty(): void;
+        $setPristine(): void;
+        $commitViewValue(): void;
+        $rollbackViewValue(): void;
+        $setSubmitted(): void;
+        $setUntouched(): void;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // NgModelController
+    // see http://docs.angularjs.org/api/ng.directive:ngModel.NgModelController
+    ///////////////////////////////////////////////////////////////////////////
+    interface INgModelController {
+        $render(): void;
+        $setValidity(validationErrorKey: string, isValid: boolean): void;
+        // Documentation states viewValue and modelValue to be a string but other
+        // types do work and it's common to use them.
+        $setViewValue(value: any, trigger?: string): void;
+        $setPristine(): void;
+        $setDirty(): void;
+        $validate(): void;
+        $setTouched(): void;
+        $setUntouched(): void;
+        $rollbackViewValue(): void;
+        $commitViewValue(): void;
+        $isEmpty(value: any): boolean;
+
+        $viewValue: any;
+
+        $modelValue: any;
+
+        $parsers: IModelParser[];
+        $formatters: IModelFormatter[];
+        $viewChangeListeners: IModelViewChangeListener[];
+        $error: any;
+        $name: string;
+
+        $touched: boolean;
+        $untouched: boolean;
+
+        $validators: IModelValidators;
+        $asyncValidators: IAsyncModelValidators;
+
+        $pending: any;
+        $pristine: boolean;
+        $dirty: boolean;
+        $valid: boolean;
+        $invalid: boolean;
+    }
+
+    //Allows tuning how model updates are done.
+    //https://docs.angularjs.org/api/ng/directive/ngModelOptions
+    interface INgModelOptions {
+        updateOn?: string;
+        debounce?: any;
+        allowInvalid?: boolean;
+        getterSetter?: boolean;
+        timezone?: string;
+    }
+
+    interface IModelValidators {
+        /**
+         * viewValue is any because it can be an object that is called in the view like $viewValue.name:$viewValue.subName
+         */
+        [index: string]: (modelValue: any, viewValue: any) => boolean;
+    }
+
+    interface IAsyncModelValidators {
+        [index: string]: (modelValue: any, viewValue: any) => IPromise<any>;
+    }
+
+    interface IModelParser {
+        (value: any): any;
+    }
+
+    interface IModelFormatter {
+        (value: any): any;
+    }
+
+    interface IModelViewChangeListener {
+        (): void;
+    }
+
+    /**
+     * $rootScope - $rootScopeProvider - service in module ng
+     * see https://docs.angularjs.org/api/ng/type/$rootScope.Scope and https://docs.angularjs.org/api/ng/service/$rootScope
+     */
+    interface IRootScopeService {
+        [index: string]: any;
+
+        $apply(): any;
+        $apply(exp: string): any;
+        $apply(exp: (scope: IScope) => any): any;
+
+        $applyAsync(): any;
+        $applyAsync(exp: string): any;
+        $applyAsync(exp: (scope: IScope) => any): any;
+
+        /**
+         * Dispatches an event name downwards to all child scopes (and their children) notifying the registered $rootScope.Scope listeners.
+         *
+         * The event life cycle starts at the scope on which $broadcast was called. All listeners listening for name event on this scope get notified. Afterwards, the event propagates to all direct and indirect scopes of the current scope and calls all registered listeners along the way. The event cannot be canceled.
+         *
+         * Any exception emitted from the listeners will be passed onto the $exceptionHandler service.
+         *
+         * @param name Event name to broadcast.
+         * @param args Optional one or more arguments which will be passed onto the event listeners.
+         */
+        $broadcast(name: string, ...args: any[]): IAngularEvent;
+        $destroy(): void;
+        $digest(): void;
+        /**
+         * Dispatches an event name upwards through the scope hierarchy notifying the registered $rootScope.Scope listeners.
+         *
+         * The event life cycle starts at the scope on which $emit was called. All listeners listening for name event on this scope get notified. Afterwards, the event traverses upwards toward the root scope and calls all registered listeners along the way. The event will stop propagating if one of the listeners cancels it.
+         *
+         * Any exception emitted from the listeners will be passed onto the $exceptionHandler service.
+         *
+         * @param name Event name to emit.
+         * @param args Optional one or more arguments which will be passed onto the event listeners.
+         */
+        $emit(name: string, ...args: any[]): IAngularEvent;
+
+        $eval(): any;
+        $eval(expression: string, locals?: Object): any;
+        $eval(expression: (scope: IScope) => any, locals?: Object): any;
+
+        $evalAsync(): void;
+        $evalAsync(expression: string): void;
+        $evalAsync(expression: (scope: IScope) => any): void;
+
+        // Defaults to false by the implementation checking strategy
+        $new(isolate?: boolean, parent?: IScope): IScope;
+
+        /**
+         * Listens on events of a given type. See $emit for discussion of event life cycle.
+         *
+         * The event listener function format is: function(event, args...).
+         *
+         * @param name Event name to listen on.
+         * @param listener Function to call when the event is emitted.
+         */
+        $on(name: string, listener: (event: IAngularEvent, ...args: any[]) => any): () => void;
+
+        $watch(watchExpression: string, listener?: string, objectEquality?: boolean): () => void;
+        $watch<T>(watchExpression: string, listener?: (newValue: T, oldValue: T, scope: IScope) => any, objectEquality?: boolean): () => void;
+        $watch(watchExpression: (scope: IScope) => any, listener?: string, objectEquality?: boolean): () => void;
+        $watch<T>(watchExpression: (scope: IScope) => T, listener?: (newValue: T, oldValue: T, scope: IScope) => any, objectEquality?: boolean): () => void;
+
+        $watchCollection<T>(watchExpression: string, listener: (newValue: T, oldValue: T, scope: IScope) => any): () => void;
+        $watchCollection<T>(watchExpression: (scope: IScope) => T, listener: (newValue: T, oldValue: T, scope: IScope) => any): () => void;
+
+        $watchGroup(watchExpressions: any[], listener: (newValue: any, oldValue: any, scope: IScope) => any): () => void;
+        $watchGroup(watchExpressions: { (scope: IScope): any }[], listener: (newValue: any, oldValue: any, scope: IScope) => any): () => void;
+
+        $parent: IScope;
+        $root: IRootScopeService;
+        $id: number;
+
+        // Hidden members
+        $$isolateBindings: any;
+        $$phase: any;
+    }
+
+    interface IScope extends IRootScopeService { }
+
+    /**
+     * $scope for ngRepeat directive.
+     * see https://docs.angularjs.org/api/ng/directive/ngRepeat
+     */
+    interface IRepeatScope extends IScope {
+
+        /**
+         * iterator offset of the repeated element (0..length-1).
+         */
+        $index: number;
+
+        /**
+         * true if the repeated element is first in the iterator.
+         */
+        $first: boolean;
+
+        /**
+         * true if the repeated element is between the first and last in the iterator.
+         */
+        $middle: boolean;
+
+        /**
+         * true if the repeated element is last in the iterator.
+         */
+        $last: boolean;
+
+        /**
+         * true if the iterator position $index is even (otherwise false).
+         */
+        $even: boolean;
+
+        /**
+         * true if the iterator position $index is odd (otherwise false).
+         */
+        $odd: boolean;
+
+    }
+
+    interface IAngularEvent {
+        /**
+         * the scope on which the event was $emit-ed or $broadcast-ed.
+         */
+        targetScope: IScope;
+        /**
+         * the scope that is currently handling the event. Once the event propagates through the scope hierarchy, this property is set to null.
+         */
+        currentScope: IScope;
+        /**
+         * name of the event.
+         */
+        name: string;
+        /**
+         * calling stopPropagation function will cancel further event propagation (available only for events that were $emit-ed).
+         */
+        stopPropagation?: Function;
+        /**
+         * calling preventDefault sets defaultPrevented flag to true.
+         */
+        preventDefault: Function;
+        /**
+         * true if preventDefault was called.
+         */
+        defaultPrevented: boolean;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // WindowService
+    // see http://docs.angularjs.org/api/ng.$window
+    ///////////////////////////////////////////////////////////////////////////
+    interface IWindowService extends Window {
+        [key: string]: any;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // TimeoutService
+    // see http://docs.angularjs.org/api/ng.$timeout
+    ///////////////////////////////////////////////////////////////////////////
+    interface ITimeoutService {
+        (delay?: number, invokeApply?: boolean): IPromise<void>;
+        <T>(fn: (...args: any[]) => T, delay?: number, invokeApply?: boolean, ...args: any[]): IPromise<T>;
+        cancel(promise?: IPromise<any>): boolean;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // IntervalService
+    // see http://docs.angularjs.org/api/ng.$interval
+    ///////////////////////////////////////////////////////////////////////////
+    interface IIntervalService {
+        (func: Function, delay: number, count?: number, invokeApply?: boolean, ...args: any[]): IPromise<any>;
+        cancel(promise: IPromise<any>): boolean;
+    }
+
+    /**
+     * $filter - $filterProvider - service in module ng
+     *
+     * Filters are used for formatting data displayed to the user.
+     *
+     * see https://docs.angularjs.org/api/ng/service/$filter
+     */
+    interface IFilterService {
+        (name: 'filter'): IFilterFilter;
+        (name: 'currency'): IFilterCurrency;
+        (name: 'number'): IFilterNumber;
+        (name: 'date'): IFilterDate;
+        (name: 'json'): IFilterJson;
+        (name: 'lowercase'): IFilterLowercase;
+        (name: 'uppercase'): IFilterUppercase;
+        (name: 'limitTo'): IFilterLimitTo;
+        (name: 'orderBy'): IFilterOrderBy;
+        /**
+         * Usage:
+         * $filter(name);
+         *
+         * @param name Name of the filter function to retrieve
+         */
+        <T>(name: string): T;
+    }
+
+    interface IFilterFilter {
+        <T>(array: T[], expression: string | IFilterFilterPatternObject | IFilterFilterPredicateFunc<T>, comparator?: IFilterFilterComparatorFunc<T>|boolean): T[];
+    }
+
+    interface IFilterFilterPatternObject {
+        [name: string]: any;
+    }
+
+    interface IFilterFilterPredicateFunc<T> {
+        (value: T, index: number, array: T[]): boolean;
+    }
+
+    interface IFilterFilterComparatorFunc<T> {
+        (actual: T, expected: T): boolean;
+    }
+
+    interface IFilterCurrency {
+        /**
+         * Formats a number as a currency (ie $1,234.56). When no currency symbol is provided, default symbol for current locale is used.
+         * @param amount Input to filter.
+         * @param symbol Currency symbol or identifier to be displayed.
+         * @param fractionSize Number of decimal places to round the amount to, defaults to default max fraction size for current locale
+         * @return Formatted number
+         */
+        (amount: number, symbol?: string, fractionSize?: number): string;
+    }
+
+    interface IFilterNumber {
+        /**
+         * Formats a number as text.
+         * @param number Number to format.
+         * @param fractionSize Number of decimal places to round the number to. If this is not provided then the fraction size is computed from the current locale's number formatting pattern. In the case of the default locale, it will be 3.
+         * @return Number rounded to decimalPlaces and places a “,” after each third digit.
+         */
+        (value: number|string, fractionSize?: number|string): string;
+    }
+
+    interface IFilterDate {
+        /**
+         * Formats date to a string based on the requested format.
+         *
+         * @param date Date to format either as Date object, milliseconds (string or number) or various ISO 8601 datetime string formats (e.g. yyyy-MM-ddTHH:mm:ss.sssZ and its shorter versions like yyyy-MM-ddTHH:mmZ, yyyy-MM-dd or yyyyMMddTHHmmssZ). If no timezone is specified in the string input, the time is considered to be in the local timezone.
+         * @param format Formatting rules (see Description). If not specified, mediumDate is used.
+         * @param timezone Timezone to be used for formatting. It understands UTC/GMT and the continental US time zone abbreviations, but for general use, use a time zone offset, for example, '+0430' (4 hours, 30 minutes east of the Greenwich meridian) If not specified, the timezone of the browser will be used.
+         * @return Formatted string or the input if input is not recognized as date/millis.
+         */
+        (date: Date | number | string, format?: string, timezone?: string): string;
+    }
+
+    interface IFilterJson {
+        /**
+         * Allows you to convert a JavaScript object into JSON string.
+         * @param object Any JavaScript object (including arrays and primitive types) to filter.
+         * @param spacing The number of spaces to use per indentation, defaults to 2.
+         * @return JSON string.
+         */
+        (object: any, spacing?: number): string;
+    }
+
+    interface IFilterLowercase {
+        /**
+         * Converts string to lowercase.
+         */
+        (value: string): string;
+    }
+
+    interface IFilterUppercase {
+        /**
+         * Converts string to uppercase.
+         */
+        (value: string): string;
+    }
+
+    interface IFilterLimitTo {
+        /**
+         * Creates a new array containing only a specified number of elements. The elements are taken from either the beginning or the end of the source array, string or number, as specified by the value and sign (positive or negative) of limit.
+         * @param input Source array to be limited.
+         * @param limit The length of the returned array. If the limit number is positive, limit number of items from the beginning of the source array/string are copied. If the number is negative, limit number of items from the end of the source array are copied. The limit will be trimmed if it exceeds array.length. If limit is undefined, the input will be returned unchanged.
+         * @param begin Index at which to begin limitation. As a negative index, begin indicates an offset from the end of input. Defaults to 0.
+         * @return A new sub-array of length limit or less if input array had less than limit elements.
+         */
+        <T>(input: T[], limit: string|number, begin?: string|number): T[];
+        /**
+         * Creates a new string containing only a specified number of elements. The elements are taken from either the beginning or the end of the source string or number, as specified by the value and sign (positive or negative) of limit. If a number is used as input, it is converted to a string.
+         * @param input Source string or number to be limited.
+         * @param limit The length of the returned string. If the limit number is positive, limit number of items from the beginning of the source string are copied. If the number is negative, limit number of items from the end of the source string are copied. The limit will be trimmed if it exceeds input.length. If limit is undefined, the input will be returned unchanged.
+         * @param begin Index at which to begin limitation. As a negative index, begin indicates an offset from the end of input. Defaults to 0.
+         * @return A new substring of length limit or less if input had less than limit elements.
+         */
+        (input: string|number, limit: string|number, begin?: string|number): string;
+    }
+
+    interface IFilterOrderBy {
+        /**
+         * Orders a specified array by the expression predicate. It is ordered alphabetically for strings and numerically for numbers. Note: if you notice numbers are not being sorted as expected, make sure they are actually being saved as numbers and not strings.
+         * @param array The array to sort.
+         * @param expression A predicate to be used by the comparator to determine the order of elements.
+         * @param reverse Reverse the order of the array.
+         * @return Reverse the order of the array.
+         */
+        <T>(array: T[], expression: string|((value: T) => any)|(((value: T) => any)|string)[], reverse?: boolean): T[];
+    }
+
+    /**
+     * $filterProvider - $filter - provider in module ng
+     *
+     * Filters are just functions which transform input to an output. However filters need to be Dependency Injected. To achieve this a filter definition consists of a factory function which is annotated with dependencies and is responsible for creating a filter function.
+     *
+     * see https://docs.angularjs.org/api/ng/provider/$filterProvider
+     */
+    interface IFilterProvider extends IServiceProvider {
+        /**
+         * register(name);
+         *
+         * @param name Name of the filter function, or an object map of filters where the keys are the filter names and the values are the filter factories. Note: Filter names must be valid angular Expressions identifiers, such as uppercase or orderBy. Names with special characters, such as hyphens and dots, are not allowed. If you wish to namespace your filters, then you can use capitalization (myappSubsectionFilterx) or underscores (myapp_subsection_filterx).
+         */
+        register(name: string | {}): IServiceProvider;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // LocaleService
+    // see http://docs.angularjs.org/api/ng.$locale
+    ///////////////////////////////////////////////////////////////////////////
+    interface ILocaleService {
+        id: string;
+
+        // These are not documented
+        // Check angular's i18n files for exemples
+        NUMBER_FORMATS: ILocaleNumberFormatDescriptor;
+        DATETIME_FORMATS: ILocaleDateTimeFormatDescriptor;
+        pluralCat: (num: any) => string;
+    }
+
+    interface ILocaleNumberFormatDescriptor {
+        DECIMAL_SEP: string;
+        GROUP_SEP: string;
+        PATTERNS: ILocaleNumberPatternDescriptor[];
+        CURRENCY_SYM: string;
+    }
+
+    interface ILocaleNumberPatternDescriptor {
+        minInt: number;
+        minFrac: number;
+        maxFrac: number;
+        posPre: string;
+        posSuf: string;
+        negPre: string;
+        negSuf: string;
+        gSize: number;
+        lgSize: number;
+    }
+
+    interface ILocaleDateTimeFormatDescriptor {
+        MONTH: string[];
+        SHORTMONTH: string[];
+        DAY: string[];
+        SHORTDAY: string[];
+        AMPMS: string[];
+        medium: string;
+        short: string;
+        fullDate: string;
+        longDate: string;
+        mediumDate: string;
+        shortDate: string;
+        mediumTime: string;
+        shortTime: string;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // LogService
+    // see http://docs.angularjs.org/api/ng.$log
+    // see http://docs.angularjs.org/api/ng.$logProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface ILogService {
+        debug: ILogCall;
+        error: ILogCall;
+        info: ILogCall;
+        log: ILogCall;
+        warn: ILogCall;
+    }
+
+    interface ILogProvider extends IServiceProvider {
+        debugEnabled(): boolean;
+        debugEnabled(enabled: boolean): ILogProvider;
+    }
+
+    // We define this as separate interface so we can reopen it later for
+    // the ngMock module.
+    interface ILogCall {
+        (...args: any[]): void;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // ParseService
+    // see http://docs.angularjs.org/api/ng.$parse
+    // see http://docs.angularjs.org/api/ng.$parseProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface IParseService {
+        (expression: string): ICompiledExpression;
+    }
+
+    interface IParseProvider {
+        logPromiseWarnings(): boolean;
+        logPromiseWarnings(value: boolean): IParseProvider;
+
+        unwrapPromises(): boolean;
+        unwrapPromises(value: boolean): IParseProvider;
+    }
+
+    interface ICompiledExpression {
+        (context: any, locals?: any): any;
+
+        literal: boolean;
+        constant: boolean;
+
+        // If value is not provided, undefined is gonna be used since the implementation
+        // does not check the parameter. Let's force a value for consistency. If consumer
+        // whants to undefine it, pass the undefined value explicitly.
+        assign(context: any, value: any): any;
+    }
+
+    /**
+     * $location - $locationProvider - service in module ng
+     * see https://docs.angularjs.org/api/ng/service/$location
+     */
+    interface ILocationService {
+        absUrl(): string;
+        hash(): string;
+        hash(newHash: string): ILocationService;
+        host(): string;
+
+        /**
+         * Return path of current url
+         */
+        path(): string;
+
+        /**
+         * Change path when called with parameter and return $location.
+         * Note: Path should always begin with forward slash (/), this method will add the forward slash if it is missing.
+         *
+         * @param path New path
+         */
+        path(path: string): ILocationService;
+
+        port(): number;
+        protocol(): string;
+        replace(): ILocationService;
+
+        /**
+         * Return search part (as object) of current url
+         */
+        search(): any;
+
+        /**
+         * Change search part when called with parameter and return $location.
+         *
+         * @param search When called with a single argument the method acts as a setter, setting the search component of $location to the specified value.
+         *
+         * If the argument is a hash object containing an array of values, these values will be encoded as duplicate search parameters in the url.
+         */
+        search(search: any): ILocationService;
+
+        /**
+         * Change search part when called with parameter and return $location.
+         *
+         * @param search New search params
+         * @param paramValue If search is a string or a Number, then paramValue will override only a single search property. If paramValue is null, the property specified via the first argument will be deleted. If paramValue is an array, it will override the property of the search component of $location specified via the first argument. If paramValue is true, the property specified via the first argument will be added with no value nor trailing equal sign.
+         */
+        search(search: string, paramValue: string|number|string[]|boolean): ILocationService;
+
+        state(): any;
+        state(state: any): ILocationService;
+        url(): string;
+        url(url: string): ILocationService;
+    }
+
+    interface ILocationProvider extends IServiceProvider {
+        hashPrefix(): string;
+        hashPrefix(prefix: string): ILocationProvider;
+        html5Mode(): boolean;
+
+        // Documentation states that parameter is string, but
+        // implementation tests it as boolean, which makes more sense
+        // since this is a toggler
+        html5Mode(active: boolean): ILocationProvider;
+        html5Mode(mode: { enabled?: boolean; requireBase?: boolean; rewriteLinks?: boolean; }): ILocationProvider;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // DocumentService
+    // see http://docs.angularjs.org/api/ng.$document
+    ///////////////////////////////////////////////////////////////////////////
+    interface IDocumentService extends IAugmentedJQuery {}
+
+    ///////////////////////////////////////////////////////////////////////////
+    // ExceptionHandlerService
+    // see http://docs.angularjs.org/api/ng.$exceptionHandler
+    ///////////////////////////////////////////////////////////////////////////
+    interface IExceptionHandlerService {
+        (exception: Error, cause?: string): void;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // RootElementService
+    // see http://docs.angularjs.org/api/ng.$rootElement
+    ///////////////////////////////////////////////////////////////////////////
+    interface IRootElementService extends JQuery {}
+
+    interface IQResolveReject<T> {
+        (): void;
+        (value: T): void;
+    }
+    /**
+     * $q - service in module ng
+     * A promise/deferred implementation inspired by Kris Kowal's Q.
+     * See http://docs.angularjs.org/api/ng/service/$q
+     */
+    interface IQService {
+        new <T>(resolver: (resolve: IQResolveReject<T>) => any): IPromise<T>;
+        new <T>(resolver: (resolve: IQResolveReject<T>, reject: IQResolveReject<any>) => any): IPromise<T>;
+        <T>(resolver: (resolve: IQResolveReject<T>) => any): IPromise<T>;
+        <T>(resolver: (resolve: IQResolveReject<T>, reject: IQResolveReject<any>) => any): IPromise<T>;
+
+        /**
+         * Combines multiple promises into a single promise that is resolved when all of the input promises are resolved.
+         *
+         * Returns a single promise that will be resolved with an array of values, each value corresponding to the promise at the same index in the promises array. If any of the promises is resolved with a rejection, this resulting promise will be rejected with the same rejection value.
+         *
+         * @param promises An array of promises.
+         */
+        all<T1, T2, T3, T4, T5, T6, T7, T8, T9, T10>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>, T3 | IPromise<T3>, T4 | IPromise <T4>, T5 | IPromise<T5>, T6 | IPromise<T6>, T7 | IPromise<T7>, T8 | IPromise<T8>, T9 | IPromise<T9>, T10 | IPromise<T10>]): IPromise<[T1, T2, T3, T4, T5, T6, T7, T8, T9, T10]>;
+        all<T1, T2, T3, T4, T5, T6, T7, T8, T9>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>, T3 | IPromise<T3>, T4 | IPromise <T4>, T5 | IPromise<T5>, T6 | IPromise<T6>, T7 | IPromise<T7>, T8 | IPromise<T8>, T9 | IPromise<T9>]): IPromise<[T1, T2, T3, T4, T5, T6, T7, T8, T9]>;
+        all<T1, T2, T3, T4, T5, T6, T7, T8>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>, T3 | IPromise<T3>, T4 | IPromise <T4>, T5 | IPromise<T5>, T6 | IPromise<T6>, T7 | IPromise<T7>, T8 | IPromise<T8>]): IPromise<[T1, T2, T3, T4, T5, T6, T7, T8]>;
+        all<T1, T2, T3, T4, T5, T6, T7>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>, T3 | IPromise<T3>, T4 | IPromise <T4>, T5 | IPromise<T5>, T6 | IPromise<T6>, T7 | IPromise<T7>]): IPromise<[T1, T2, T3, T4, T5, T6, T7]>;
+        all<T1, T2, T3, T4, T5, T6>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>, T3 | IPromise<T3>, T4 | IPromise <T4>, T5 | IPromise<T5>, T6 | IPromise<T6>]): IPromise<[T1, T2, T3, T4, T5, T6]>;
+        all<T1, T2, T3, T4, T5>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>, T3 | IPromise<T3>, T4 | IPromise <T4>, T5 | IPromise<T5>]): IPromise<[T1, T2, T3, T4, T5]>;
+        all<T1, T2, T3, T4>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>, T3 | IPromise<T3>, T4 | IPromise <T4>]): IPromise<[T1, T2, T3, T4]>;
+        all<T1, T2, T3>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>, T3 | IPromise<T3>]): IPromise<[T1, T2, T3]>;
+        all<T1, T2>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>]): IPromise<[T1, T2]>;
+        all<TAll>(promises: IPromise<TAll>[]): IPromise<TAll[]>;
+        /**
+         * Combines multiple promises into a single promise that is resolved when all of the input promises are resolved.
+         *
+         * Returns a single promise that will be resolved with a hash of values, each value corresponding to the promise at the same key in the promises hash. If any of the promises is resolved with a rejection, this resulting promise will be rejected with the same rejection value.
+         *
+         * @param promises A hash of promises.
+         */
+        all(promises: { [id: string]: IPromise<any>; }): IPromise<{ [id: string]: any; }>;
+        all<T extends {}>(promises: { [id: string]: IPromise<any>; }): IPromise<T>;
+        /**
+         * Creates a Deferred object which represents a task which will finish in the future.
+         */
+        defer<T>(): IDeferred<T>;
+        /**
+         * Creates a promise that is resolved as rejected with the specified reason. This api should be used to forward rejection in a chain of promises. If you are dealing with the last promise in a promise chain, you don't need to worry about it.
+         *
+         * When comparing deferreds/promises to the familiar behavior of try/catch/throw, think of reject as the throw keyword in JavaScript. This also means that if you "catch" an error via a promise error callback and you want to forward the error to the promise derived from the current promise, you have to "rethrow" the error by returning a rejection constructed via reject.
+         *
+         * @param reason Constant, message, exception or an object representing the rejection reason.
+         */
+        reject(reason?: any): IPromise<any>;
+        /**
+         * Wraps an object that might be a value or a (3rd party) then-able promise into a $q promise. This is useful when you are dealing with an object that might or might not be a promise, or if the promise comes from a source that can't be trusted.
+         *
+         * @param value Value or a promise
+         */
+        resolve<T>(value: IPromise<T>|T): IPromise<T>;
+        /**
+         * Wraps an object that might be a value or a (3rd party) then-able promise into a $q promise. This is useful when you are dealing with an object that might or might not be a promise, or if the promise comes from a source that can't be trusted.
+         */
+        resolve(): IPromise<void>;
+        /**
+         * Wraps an object that might be a value or a (3rd party) then-able promise into a $q promise. This is useful when you are dealing with an object that might or might not be a promise, or if the promise comes from a source that can't be trusted.
+         *
+         * @param value Value or a promise
+         */
+        when<T>(value: IPromise<T>|T): IPromise<T>;
+        /**
+         * Wraps an object that might be a value or a (3rd party) then-able promise into a $q promise. This is useful when you are dealing with an object that might or might not be a promise, or if the promise comes from a source that can't be trusted.
+         */
+        when(): IPromise<void>;
+    }
+
+    interface IPromise<T> {
+        /**
+         * Regardless of when the promise was or will be resolved or rejected, then calls one of the success or error callbacks asynchronously as soon as the result is available. The callbacks are called with a single argument: the result or rejection reason. Additionally, the notify callback may be called zero or more times to provide a progress indication, before the promise is resolved or rejected.
+         * The successCallBack may return IPromise<void> for when a $q.reject() needs to be returned
+         * This method returns a new promise which is resolved or rejected via the return value of the successCallback, errorCallback. It also notifies via the return value of the notifyCallback method. The promise can not be resolved or rejected from the notifyCallback method.
+         */
+        then<TResult>(successCallback: (promiseValue: T) => IPromise<TResult>|TResult, errorCallback?: (reason: any) => any, notifyCallback?: (state: any) => any): IPromise<TResult>;
+
+        /**
+         * Shorthand for promise.then(null, errorCallback)
+         */
+        catch<TResult>(onRejected: (reason: any) => IPromise<TResult>|TResult): IPromise<TResult>;
+
+        /**
+         * Allows you to observe either the fulfillment or rejection of a promise, but to do so without modifying the final value. This is useful to release resources or do some clean-up that needs to be done whether the promise was rejected or resolved. See the full specification for more information.
+         *
+         * Because finally is a reserved word in JavaScript and reserved keywords are not supported as property names by ES3, you'll need to invoke the method like promise['finally'](callback) to make your code IE8 and Android 2.x compatible.
+         */
+        finally(finallyCallback: () => any): IPromise<T>;
+    }
+
+    interface IDeferred<T> {
+        resolve(value?: T|IPromise<T>): void;
+        reject(reason?: any): void;
+        notify(state?: any): void;
+        promise: IPromise<T>;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // AnchorScrollService
+    // see http://docs.angularjs.org/api/ng.$anchorScroll
+    ///////////////////////////////////////////////////////////////////////////
+    interface IAnchorScrollService {
+        (): void;
+        (hash: string): void;
+        yOffset: any;
+    }
+
+    interface IAnchorScrollProvider extends IServiceProvider {
+        disableAutoScrolling(): void;
+    }
+
+    /**
+     * $cacheFactory - service in module ng
+     *
+     * Factory that constructs Cache objects and gives access to them.
+     *
+     * see https://docs.angularjs.org/api/ng/service/$cacheFactory
+     */
+    interface ICacheFactoryService {
+        /**
+         * Factory that constructs Cache objects and gives access to them.
+         *
+         * @param cacheId Name or id of the newly created cache.
+         * @param optionsMap Options object that specifies the cache behavior. Properties:
+         *
+         * capacity — turns the cache into LRU cache.
+         */
+        (cacheId: string, optionsMap?: { capacity?: number; }): ICacheObject;
+
+        /**
+         * Get information about all the caches that have been created.
+         * @returns key-value map of cacheId to the result of calling cache#info
+         */
+        info(): any;
+
+        /**
+         * Get access to a cache object by the cacheId used when it was created.
+         *
+         * @param cacheId Name or id of a cache to access.
+         */
+        get(cacheId: string): ICacheObject;
+    }
+
+    /**
+     * $cacheFactory.Cache - type in module ng
+     *
+     * A cache object used to store and retrieve data, primarily used by $http and the script directive to cache templates and other data.
+     *
+     * see https://docs.angularjs.org/api/ng/type/$cacheFactory.Cache
+     */
+    interface ICacheObject {
+        /**
+         * Retrieve information regarding a particular Cache.
+         */
+        info(): {
+            /**
+             * the id of the cache instance
+             */
+            id: string;
+
+            /**
+             * the number of entries kept in the cache instance
+             */
+            size: number;
+
+            //...: any additional properties from the options object when creating the cache.
+        };
+
+        /**
+         * Inserts a named entry into the Cache object to be retrieved later, and incrementing the size of the cache if the key was not already present in the cache. If behaving like an LRU cache, it will also remove stale entries from the set.
+         *
+         * It will not insert undefined values into the cache.
+         *
+         * @param key the key under which the cached data is stored.
+         * @param value the value to store alongside the key. If it is undefined, the key will not be stored.
+         */
+        put<T>(key: string, value?: T): T;
+
+        /**
+         * Retrieves named data stored in the Cache object.
+         *
+         * @param key the key of the data to be retrieved
+         */
+        get<T>(key: string): T;
+
+        /**
+         * Removes an entry from the Cache object.
+         *
+         * @param key the key of the entry to be removed
+         */
+        remove(key: string): void;
+
+        /**
+         * Clears the cache object of any entries.
+         */
+        removeAll(): void;
+
+        /**
+         * Destroys the Cache object entirely, removing it from the $cacheFactory set.
+         */
+        destroy(): void;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // CompileService
+    // see http://docs.angularjs.org/api/ng.$compile
+    // see http://docs.angularjs.org/api/ng.$compileProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface ICompileService {
+        (element: string, transclude?: ITranscludeFunction, maxPriority?: number): ITemplateLinkingFunction;
+        (element: Element, transclude?: ITranscludeFunction, maxPriority?: number): ITemplateLinkingFunction;
+        (element: JQuery, transclude?: ITranscludeFunction, maxPriority?: number): ITemplateLinkingFunction;
+    }
+
+    interface ICompileProvider extends IServiceProvider {
+        directive(name: string, directiveFactory: Function): ICompileProvider;
+        directive(directivesMap: Object, directiveFactory: Function): ICompileProvider;
+        directive(name: string, inlineAnnotatedFunction: any[]): ICompileProvider;
+        directive(directivesMap: Object, inlineAnnotatedFunction: any[]): ICompileProvider;
+
+        // Undocumented, but it is there...
+        directive(directivesMap: any): ICompileProvider;
+
+        component(name: string, options: IComponentOptions): ICompileProvider;
+
+        aHrefSanitizationWhitelist(): RegExp;
+        aHrefSanitizationWhitelist(regexp: RegExp): ICompileProvider;
+
+        imgSrcSanitizationWhitelist(): RegExp;
+        imgSrcSanitizationWhitelist(regexp: RegExp): ICompileProvider;
+
+        debugInfoEnabled(enabled?: boolean): any;
+    }
+
+    interface ICloneAttachFunction {
+        // Let's hint but not force cloneAttachFn's signature
+        (clonedElement?: JQuery, scope?: IScope): any;
+    }
+
+    // This corresponds to the "publicLinkFn" returned by $compile.
+    interface ITemplateLinkingFunction {
+        (scope: IScope, cloneAttachFn?: ICloneAttachFunction): IAugmentedJQuery;
+    }
+
+    // This corresponds to $transclude (and also the transclude function passed to link).
+    interface ITranscludeFunction {
+        // If the scope is provided, then the cloneAttachFn must be as well.
+        (scope: IScope, cloneAttachFn: ICloneAttachFunction): IAugmentedJQuery;
+        // If one argument is provided, then it's assumed to be the cloneAttachFn.
+        (cloneAttachFn?: ICloneAttachFunction): IAugmentedJQuery;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // ControllerService
+    // see http://docs.angularjs.org/api/ng.$controller
+    // see http://docs.angularjs.org/api/ng.$controllerProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface IControllerService {
+        // Although the documentation doesn't state this, locals are optional
+        <T>(controllerConstructor: new (...args: any[]) => T, locals?: any, later?: boolean, ident?: string): T;
+        <T>(controllerConstructor: Function, locals?: any, later?: boolean, ident?: string): T;
+        <T>(controllerName: string, locals?: any, later?: boolean, ident?: string): T;
+    }
+
+    interface IControllerProvider extends IServiceProvider {
+        register(name: string, controllerConstructor: Function): void;
+        register(name: string, dependencyAnnotatedConstructor: any[]): void;
+        allowGlobals(): void;
+    }
+
+    /**
+     * xhrFactory
+     * Replace or decorate this service to create your own custom XMLHttpRequest objects.
+     * see https://docs.angularjs.org/api/ng/service/$xhrFactory
+     */
+    interface IXhrFactory<T> {
+        (method: string, url: string): T;
+    }
+
+    /**
+     * HttpService
+     * see http://docs.angularjs.org/api/ng/service/$http
+     */
+    interface IHttpService {
+        /**
+         * Object describing the request to be made and how it should be processed.
+         */
+        <T>(config: IRequestConfig): IHttpPromise<T>;
+
+        /**
+         * Shortcut method to perform GET request.
+         *
+         * @param url Relative or absolute URL specifying the destination of the request
+         * @param config Optional configuration object
+         */
+        get<T>(url: string, config?: IRequestShortcutConfig): IHttpPromise<T>;
+
+        /**
+         * Shortcut method to perform DELETE request.
+         *
+         * @param url Relative or absolute URL specifying the destination of the request
+         * @param config Optional configuration object
+         */
+        delete<T>(url: string, config?: IRequestShortcutConfig): IHttpPromise<T>;
+
+        /**
+         * Shortcut method to perform HEAD request.
+         *
+         * @param url Relative or absolute URL specifying the destination of the request
+         * @param config Optional configuration object
+         */
+        head<T>(url: string, config?: IRequestShortcutConfig): IHttpPromise<T>;
+
+        /**
+         * Shortcut method to perform JSONP request.
+         *
+         * @param url Relative or absolute URL specifying the destination of the request
+         * @param config Optional configuration object
+         */
+        jsonp<T>(url: string, config?: IRequestShortcutConfig): IHttpPromise<T>;
+
+        /**
+         * Shortcut method to perform POST request.
+         *
+         * @param url Relative or absolute URL specifying the destination of the request
+         * @param data Request content
+         * @param config Optional configuration object
+         */
+        post<T>(url: string, data: any, config?: IRequestShortcutConfig): IHttpPromise<T>;
+
+        /**
+         * Shortcut method to perform PUT request.
+         *
+         * @param url Relative or absolute URL specifying the destination of the request
+         * @param data Request content
+         * @param config Optional configuration object
+         */
+        put<T>(url: string, data: any, config?: IRequestShortcutConfig): IHttpPromise<T>;
+
+        /**
+         * Shortcut method to perform PATCH request.
+         *
+         * @param url Relative or absolute URL specifying the destination of the request
+         * @param data Request content
+         * @param config Optional configuration object
+         */
+        patch<T>(url: string, data: any, config?: IRequestShortcutConfig): IHttpPromise<T>;
+
+        /**
+         * Runtime equivalent of the $httpProvider.defaults property. Allows configuration of default headers, withCredentials as well as request and response transformations.
+         */
+        defaults: IHttpProviderDefaults;
+
+        /**
+         * Array of config objects for currently pending requests. This is primarily meant to be used for debugging purposes.
+         */
+        pendingRequests: IRequestConfig[];
+    }
+
+    /**
+     * Object describing the request to be made and how it should be processed.
+     * see http://docs.angularjs.org/api/ng/service/$http#usage
+     */
+    interface IRequestShortcutConfig extends IHttpProviderDefaults {
+        /**
+         * {Object.<string|Object>}
+         * Map of strings or objects which will be turned to ?key1=value1&key2=value2 after the url. If the value is not a string, it will be JSONified.
+         */
+        params?: any;
+
+        /**
+         * {string|Object}
+         * Data to be sent as the request message data.
+         */
+        data?: any;
+
+        /**
+         * Timeout in milliseconds, or promise that should abort the request when resolved.
+         */
+        timeout?: number|IPromise<any>;
+
+        /**
+         * See [XMLHttpRequest.responseType]https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest#xmlhttprequest-responsetype
+         */
+        responseType?: string;
+    }
+
+    /**
+     * Object describing the request to be made and how it should be processed.
+     * see http://docs.angularjs.org/api/ng/service/$http#usage
+     */
+    interface IRequestConfig extends IRequestShortcutConfig {
+        /**
+         * HTTP method (e.g. 'GET', 'POST', etc)
+         */
+        method: string;
+        /**
+         * Absolute or relative URL of the resource that is being requested.
+         */
+        url: string;
+    }
+
+    interface IHttpHeadersGetter {
+        (): { [name: string]: string; };
+        (headerName: string): string;
+    }
+
+    interface IHttpPromiseCallback<T> {
+        (data: T, status: number, headers: IHttpHeadersGetter, config: IRequestConfig): void;
+    }
+
+    interface IHttpPromiseCallbackArg<T> {
+        data?: T;
+        status?: number;
+        headers?: IHttpHeadersGetter;
+        config?: IRequestConfig;
+        statusText?: string;
+    }
+
+    interface IHttpPromise<T> extends IPromise<IHttpPromiseCallbackArg<T>> {
+        /**
+         * The $http legacy promise methods success and error have been deprecated. Use the standard then method instead.
+         * If $httpProvider.useLegacyPromiseExtensions is set to false then these methods will throw $http/legacy error.
+         * @deprecated
+         */
+        success?(callback: IHttpPromiseCallback<T>): IHttpPromise<T>;
+        /**
+         * The $http legacy promise methods success and error have been deprecated. Use the standard then method instead.
+         * If $httpProvider.useLegacyPromiseExtensions is set to false then these methods will throw $http/legacy error.
+         * @deprecated
+         */
+        error?(callback: IHttpPromiseCallback<any>): IHttpPromise<T>;
+    }
+
+    // See the jsdoc for transformData() at https://github.com/angular/angular.js/blob/master/src/ng/http.js#L228
+    interface IHttpRequestTransformer {
+        (data: any, headersGetter: IHttpHeadersGetter): any;
+    }
+
+    // The definition of fields are the same as IHttpPromiseCallbackArg
+    interface IHttpResponseTransformer {
+        (data: any, headersGetter: IHttpHeadersGetter, status: number): any;
+    }
+
+    type HttpHeaderType = {[requestType: string]:string|((config:IRequestConfig) => string)};
+
+    interface IHttpRequestConfigHeaders {
+        [requestType: string]: any;
+        common?: any;
+        get?: any;
+        post?: any;
+        put?: any;
+        patch?: any;
+    }
+
+    /**
+    * Object that controls the defaults for $http provider. Not all fields of IRequestShortcutConfig can be configured
+    * via defaults and the docs do not say which. The following is based on the inspection of the source code.
+    * https://docs.angularjs.org/api/ng/service/$http#defaults
+    * https://docs.angularjs.org/api/ng/service/$http#usage
+    * https://docs.angularjs.org/api/ng/provider/$httpProvider The properties section
+    */
+    interface IHttpProviderDefaults {
+        /**
+         * {boolean|Cache}
+         * If true, a default $http cache will be used to cache the GET request, otherwise if a cache instance built with $cacheFactory, this cache will be used for caching.
+         */
+        cache?: any;
+
+        /**
+         * Transform function or an array of such functions. The transform function takes the http request body and
+         * headers and returns its transformed (typically serialized) version.
+         * @see {@link https://docs.angularjs.org/api/ng/service/$http#transforming-requests-and-responses}
+         */
+        transformRequest?: IHttpRequestTransformer |IHttpRequestTransformer[];
+
+        /**
+         * Transform function or an array of such functions. The transform function takes the http response body and
+         * headers and returns its transformed (typically deserialized) version.
+         */
+        transformResponse?: IHttpResponseTransformer | IHttpResponseTransformer[];
+
+        /**
+         * Map of strings or functions which return strings representing HTTP headers to send to the server. If the
+         * return value of a function is null, the header will not be sent.
+         * The key of the map is the request verb in lower case. The "common" key applies to all requests.
+         * @see {@link https://docs.angularjs.org/api/ng/service/$http#setting-http-headers}
+         */
+        headers?: IHttpRequestConfigHeaders;
+
+        /** Name of HTTP header to populate with the XSRF token. */
+        xsrfHeaderName?: string;
+
+        /** Name of cookie containing the XSRF token. */
+        xsrfCookieName?: string;
+
+        /**
+         * whether to to set the withCredentials flag on the XHR object. See [requests with credentials]https://developer.mozilla.org/en/http_access_control#section_5 for more information.
+         */
+        withCredentials?: boolean;
+
+        /**
+        * A function used to the prepare string representation of request parameters (specified as an object). If
+        * specified as string, it is interpreted as a function registered with the $injector. Defaults to
+        * $httpParamSerializer.
+        */
+        paramSerializer?: string | ((obj: any) => string);
+    }
+
+    interface IHttpInterceptor {
+        request?: (config: IRequestConfig) => IRequestConfig|IPromise<IRequestConfig>;
+        requestError?: (rejection: any) => any;
+        response?: <T>(response: IHttpPromiseCallbackArg<T>) => IPromise<IHttpPromiseCallbackArg<T>>|IHttpPromiseCallbackArg<T>;
+        responseError?: (rejection: any) => any;
+    }
+
+    interface IHttpInterceptorFactory {
+        (...args: any[]): IHttpInterceptor;
+    }
+
+    interface IHttpProvider extends IServiceProvider {
+        defaults: IHttpProviderDefaults;
+
+        /**
+         * Register service factories (names or implementations) for interceptors which are called before and after
+         * each request.
+         */
+        interceptors: (string|IHttpInterceptorFactory|(string|IHttpInterceptorFactory)[])[];
+        useApplyAsync(): boolean;
+        useApplyAsync(value: boolean): IHttpProvider;
+
+        /**
+         *
+         * @param {boolean=} value If true, `$http` will return a normal promise without the `success` and `error` methods.
+         * @returns {boolean|Object} If a value is specified, returns the $httpProvider for chaining.
+         *    otherwise, returns the current configured value.
+         */
+        useLegacyPromiseExtensions(value:boolean) : boolean | IHttpProvider;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // HttpBackendService
+    // see http://docs.angularjs.org/api/ng.$httpBackend
+    // You should never need to use this service directly.
+    ///////////////////////////////////////////////////////////////////////////
+    interface IHttpBackendService {
+        // XXX Perhaps define callback signature in the future
+        (method: string, url: string, post?: any, callback?: Function, headers?: any, timeout?: number, withCredentials?: boolean): void;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // InterpolateService
+    // see http://docs.angularjs.org/api/ng.$interpolate
+    // see http://docs.angularjs.org/api/ng.$interpolateProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface IInterpolateService {
+        (text: string, mustHaveExpression?: boolean, trustedContext?: string, allOrNothing?: boolean): IInterpolationFunction;
+        endSymbol(): string;
+        startSymbol(): string;
+    }
+
+    interface IInterpolationFunction {
+        (context: any): string;
+    }
+
+    interface IInterpolateProvider extends IServiceProvider {
+        startSymbol(): string;
+        startSymbol(value: string): IInterpolateProvider;
+        endSymbol(): string;
+        endSymbol(value: string): IInterpolateProvider;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // TemplateCacheService
+    // see http://docs.angularjs.org/api/ng.$templateCache
+    ///////////////////////////////////////////////////////////////////////////
+    interface ITemplateCacheService extends ICacheObject {}
+
+    ///////////////////////////////////////////////////////////////////////////
+    // SCEService
+    // see http://docs.angularjs.org/api/ng.$sce
+    ///////////////////////////////////////////////////////////////////////////
+    interface ISCEService {
+        getTrusted(type: string, mayBeTrusted: any): any;
+        getTrustedCss(value: any): any;
+        getTrustedHtml(value: any): any;
+        getTrustedJs(value: any): any;
+        getTrustedResourceUrl(value: any): any;
+        getTrustedUrl(value: any): any;
+        parse(type: string, expression: string): (context: any, locals: any) => any;
+        parseAsCss(expression: string): (context: any, locals: any) => any;
+        parseAsHtml(expression: string): (context: any, locals: any) => any;
+        parseAsJs(expression: string): (context: any, locals: any) => any;
+        parseAsResourceUrl(expression: string): (context: any, locals: any) => any;
+        parseAsUrl(expression: string): (context: any, locals: any) => any;
+        trustAs(type: string, value: any): any;
+        trustAsHtml(value: any): any;
+        trustAsJs(value: any): any;
+        trustAsResourceUrl(value: any): any;
+        trustAsUrl(value: any): any;
+        isEnabled(): boolean;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // SCEProvider
+    // see http://docs.angularjs.org/api/ng.$sceProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface ISCEProvider extends IServiceProvider {
+        enabled(value: boolean): void;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // SCEDelegateService
+    // see http://docs.angularjs.org/api/ng.$sceDelegate
+    ///////////////////////////////////////////////////////////////////////////
+    interface ISCEDelegateService {
+        getTrusted(type: string, mayBeTrusted: any): any;
+        trustAs(type: string, value: any): any;
+        valueOf(value: any): any;
+    }
+
+
+    ///////////////////////////////////////////////////////////////////////////
+    // SCEDelegateProvider
+    // see http://docs.angularjs.org/api/ng.$sceDelegateProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface ISCEDelegateProvider extends IServiceProvider {
+        resourceUrlBlacklist(blacklist: any[]): void;
+        resourceUrlWhitelist(whitelist: any[]): void;
+        resourceUrlBlacklist(): any[];
+        resourceUrlWhitelist(): any[];
+    }
+
+    /**
+     * $templateRequest service
+     * see http://docs.angularjs.org/api/ng/service/$templateRequest
+     */
+    interface ITemplateRequestService {
+        /**
+         * Downloads a template using $http and, upon success, stores the
+         * contents inside of $templateCache.
+         *
+         * If the HTTP request fails or the response data of the HTTP request is
+         * empty then a $compile error will be thrown (unless
+         * {ignoreRequestError} is set to true).
+         *
+         * @param tpl                  The template URL.
+         * @param ignoreRequestError   Whether or not to ignore the exception
+         *                             when the request fails or the template is
+         *                             empty.
+         *
+         * @return   A promise whose value is the template content.
+         */
+        (tpl: string, ignoreRequestError?: boolean): IPromise<string>;
+        /**
+         * total amount of pending template requests being downloaded.
+         * @type {number}
+         */
+        totalPendingRequests: number;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // Component
+    // see http://angularjs.blogspot.com.br/2015/11/angularjs-15-beta2-and-14-releases.html
+    // and http://toddmotto.com/exploring-the-angular-1-5-component-method/
+    ///////////////////////////////////////////////////////////////////////////
+    /**
+     * Runtime representation a type that a Component or other object is instances of.
+     *
+     * An example of a `Type` is `MyCustomComponent` class, which in JavaScript is be represented by
+     * the `MyCustomComponent` constructor function.
+     */
+    interface Type extends Function {
+    }
+
+    /**
+     * `RouteDefinition` defines a route within a {@link RouteConfig} decorator.
+     *
+     * Supported keys:
+     * - `path` or `aux` (requires exactly one of these)
+     * - `component`, `loader`,  `redirectTo` (requires exactly one of these)
+     * - `name` or `as` (optional) (requires exactly one of these)
+     * - `data` (optional)
+     *
+     * See also {@link Route}, {@link AsyncRoute}, {@link AuxRoute}, and {@link Redirect}.
+     */
+    interface RouteDefinition {
+        path?: string;
+        aux?: string;
+        component?: Type | ComponentDefinition | string;
+        loader?: Function;
+        redirectTo?: any[];
+        as?: string;
+        name?: string;
+        data?: any;
+        useAsDefault?: boolean;
+    }
+
+    /**
+     * Represents either a component type (`type` is `component`) or a loader function
+     * (`type` is `loader`).
+     *
+     * See also {@link RouteDefinition}.
+     */
+    interface ComponentDefinition {
+        type: string;
+        loader?: Function;
+        component?: Type;
+    }
+
+    /**
+     * Component definition object (a simplified directive definition object)
+     */
+    interface IComponentOptions {
+        /**
+         * Controller constructor function that should be associated with newly created scope or the name of a registered
+         * controller if passed as a string. Empty function by default.
+         * Use the array form to define dependencies (necessary if strictDi is enabled and you require dependency injection)
+         */
+        controller?: string | Function | (string | Function)[];
+        /**
+         * An identifier name for a reference to the controller. If present, the controller will be published to scope under
+         * the controllerAs name. If not present, this will default to be the same as the component name.
+         * @default "$ctrl"
+         */
+        controllerAs?: string;
+        /**
+         * html template as a string or a function that returns an html template as a string which should be used as the
+         * contents of this component. Empty string by default.
+         * If template is a function, then it is injected with the following locals:
+         * $element - Current element
+         * $attrs - Current attributes object for the element
+         * Use the array form to define dependencies (necessary if strictDi is enabled and you require dependency injection)
+         */
+        template?: string | Function | (string | Function)[];
+        /**
+         * path or function that returns a path to an html template that should be used as the contents of this component.
+         * If templateUrl is a function, then it is injected with the following locals:
+         * $element - Current element
+         * $attrs - Current attributes object for the element
+         * Use the array form to define dependencies (necessary if strictDi is enabled and you require dependency injection)
+         */
+        templateUrl?: string | Function | (string | Function)[];
+        /**
+         * Define DOM attribute binding to component properties. Component properties are always bound to the component
+         * controller and not to the scope.
+         */
+        bindings?: {[binding: string]: string};
+        /**
+         * Whether transclusion is enabled. Enabled by default.
+         */
+        transclude?: boolean | string | {[slot: string]: string};
+        require?: string | string[] | {[controller: string]: string};
+    }
+
+    interface IComponentTemplateFn {
+        ( $element?: IAugmentedJQuery, $attrs?: IAttributes ): string;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // Directive
+    // see http://docs.angularjs.org/api/ng.$compileProvider#directive
+    // and http://docs.angularjs.org/guide/directive
+    ///////////////////////////////////////////////////////////////////////////
+
+    interface IDirectiveFactory {
+        (...args: any[]): IDirective;
+    }
+
+    interface IDirectiveLinkFn {
+        (
+            scope: IScope,
+            instanceElement: IAugmentedJQuery,
+            instanceAttributes: IAttributes,
+            controller: {},
+            transclude: ITranscludeFunction
+        ): void;
+    }
+
+    interface IDirectivePrePost {
+        pre?: IDirectiveLinkFn;
+        post?: IDirectiveLinkFn;
+    }
+
+    interface IDirectiveCompileFn {
+        (
+            templateElement: IAugmentedJQuery,
+            templateAttributes: IAttributes,
+            /**
+             * @deprecated
+             * Note: The transclude function that is passed to the compile function is deprecated,
+             * as it e.g. does not know about the right outer scope. Please use the transclude function
+             * that is passed to the link function instead.
+             */
+            transclude: ITranscludeFunction
+        ): IDirectivePrePost;
+    }
+
+    interface IDirective {
+        compile?: IDirectiveCompileFn;
+        controller?: any;
+        controllerAs?: string;
+        /**
+         * @deprecated
+         * Deprecation warning: although bindings for non-ES6 class controllers are currently bound to this before
+         * the controller constructor is called, this use is now deprecated. Please place initialization code that
+         * relies upon bindings inside a $onInit method on the controller, instead.
+         */
+        bindToController?: boolean | Object;
+        link?: IDirectiveLinkFn | IDirectivePrePost;
+        multiElement?: boolean;
+        name?: string;
+        priority?: number;
+        /**
+         * @deprecated
+         */
+        replace?: boolean;
+        require?: string | string[] | {[controller: string]: string};
+        restrict?: string;
+        scope?: boolean | Object;
+        template?: string | Function;
+        templateNamespace?: string;
+        templateUrl?: string | Function;
+        terminal?: boolean;
+        transclude?: boolean | string | {[slot: string]: string};
+    }
+
+    /**
+     * angular.element
+     * when calling angular.element, angular returns a jQuery object,
+     * augmented with additional methods like e.g. scope.
+     * see: http://docs.angularjs.org/api/angular.element
+     */
+    interface IAugmentedJQueryStatic extends JQueryStatic {
+        (selector: string, context?: any): IAugmentedJQuery;
+        (element: Element): IAugmentedJQuery;
+        (object: {}): IAugmentedJQuery;
+        (elementArray: Element[]): IAugmentedJQuery;
+        (object: JQuery): IAugmentedJQuery;
+        (func: Function): IAugmentedJQuery;
+        (array: any[]): IAugmentedJQuery;
+        (): IAugmentedJQuery;
+    }
+
+    interface IAugmentedJQuery extends JQuery {
+        // TODO: events, how to define?
+        //$destroy
+
+        find(selector: string): IAugmentedJQuery;
+        find(element: any): IAugmentedJQuery;
+        find(obj: JQuery): IAugmentedJQuery;
+        controller(): any;
+        controller(name: string): any;
+        injector(): any;
+        scope(): IScope;
+
+        /**
+        *   Overload for custom scope interfaces
+        */
+        scope<T extends IScope>(): T;
+        isolateScope(): IScope;
+
+        inheritedData(key: string, value: any): JQuery;
+        inheritedData(obj: { [key: string]: any; }): JQuery;
+        inheritedData(key?: string): any;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // AUTO module (angular.js)
+    ///////////////////////////////////////////////////////////////////////////
+    export module auto {
+
+        ///////////////////////////////////////////////////////////////////////
+        // InjectorService
+        // see http://docs.angularjs.org/api/AUTO.$injector
+        ///////////////////////////////////////////////////////////////////////
+        interface IInjectorService {
+            annotate(fn: Function, strictDi?: boolean): string[];
+            annotate(inlineAnnotatedFunction: any[]): string[];
+            get<T>(name: string, caller?: string): T;
+            get(name: '$anchorScroll'): IAnchorScrollService
+            get(name: '$cacheFactory'): ICacheFactoryService
+            get(name: '$compile'): ICompileService
+            get(name: '$controller'): IControllerService
+            get(name: '$document'): IDocumentService
+            get(name: '$exceptionHandler'): IExceptionHandlerService
+            get(name: '$filter'): IFilterService
+            get(name: '$http'): IHttpService
+            get(name: '$httpBackend'): IHttpBackendService
+            get(name: '$httpParamSerializer'): IHttpParamSerializer
+            get(name: '$httpParamSerializerJQLike'): IHttpParamSerializer
+            get(name: '$interpolate'): IInterpolateService
+            get(name: '$interval'): IIntervalService
+            get(name: '$locale'): ILocaleService
+            get(name: '$location'): ILocationService
+            get(name: '$log'): ILogService
+            get(name: '$parse'): IParseService
+            get(name: '$q'): IQService
+            get(name: '$rootElement'): IRootElementService
+            get(name: '$rootScope'): IRootScopeService
+            get(name: '$sce'): ISCEService
+            get(name: '$sceDelegate'): ISCEDelegateService
+            get(name: '$templateCache'): ITemplateCacheService
+            get(name: '$templateRequest'): ITemplateRequestService
+            get(name: '$timeout'): ITimeoutService
+            get(name: '$window'): IWindowService
+            get<T>(name: '$xhrFactory'): IXhrFactory<T>
+            has(name: string): boolean;
+            instantiate<T>(typeConstructor: Function, locals?: any): T;
+            invoke(inlineAnnotatedFunction: any[]): any;
+            invoke(func: Function, context?: any, locals?: any): any;
+            strictDi: boolean;
+        }
+
+        ///////////////////////////////////////////////////////////////////////
+        // ProvideService
+        // see http://docs.angularjs.org/api/AUTO.$provide
+        ///////////////////////////////////////////////////////////////////////
+        interface IProvideService {
+            // Documentation says it returns the registered instance, but actual
+            // implementation does not return anything.
+            // constant(name: string, value: any): any;
+            /**
+             * Register a constant service, such as a string, a number, an array, an object or a function, with the $injector. Unlike value it can be injected into a module configuration function (see config) and it cannot be overridden by an Angular decorator.
+             *
+             * @param name The name of the constant.
+             * @param value The constant value.
+             */
+            constant(name: string, value: any): void;
+
+            /**
+             * Register a service decorator with the $injector. A service decorator intercepts the creation of a service, allowing it to override or modify the behaviour of the service. The object returned by the decorator may be the original service, or a new service object which replaces or wraps and delegates to the original service.
+             *
+             * @param name The name of the service to decorate.
+             * @param decorator This function will be invoked when the service needs to be instantiated and should return the decorated service instance. The function is called using the injector.invoke method and is therefore fully injectable. Local injection arguments:
+             *
+             * $delegate - The original service instance, which can be monkey patched, configured, decorated or delegated to.
+             */
+            decorator(name: string, decorator: Function): void;
+            /**
+             * Register a service decorator with the $injector. A service decorator intercepts the creation of a service, allowing it to override or modify the behaviour of the service. The object returned by the decorator may be the original service, or a new service object which replaces or wraps and delegates to the original service.
+             *
+             * @param name The name of the service to decorate.
+             * @param inlineAnnotatedFunction This function will be invoked when the service needs to be instantiated and should return the decorated service instance. The function is called using the injector.invoke method and is therefore fully injectable. Local injection arguments:
+             *
+             * $delegate - The original service instance, which can be monkey patched, configured, decorated or delegated to.
+             */
+            decorator(name: string, inlineAnnotatedFunction: any[]): void;
+            factory(name: string, serviceFactoryFunction: Function): IServiceProvider;
+            factory(name: string, inlineAnnotatedFunction: any[]): IServiceProvider;
+            provider(name: string, provider: IServiceProvider): IServiceProvider;
+            provider(name: string, serviceProviderConstructor: Function): IServiceProvider;
+            service(name: string, constructor: Function): IServiceProvider;
+            service(name: string, inlineAnnotatedFunction: any[]): IServiceProvider;
+            value(name: string, value: any): IServiceProvider;
+        }
+
+    }
+
+    /**
+     * $http params serializer that converts objects to strings
+     * see https://docs.angularjs.org/api/ng/service/$httpParamSerializer
+     */
+    interface IHttpParamSerializer {
+        (obj: Object): string;
+    }
+}
\ No newline at end of file
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular/typings.json b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular/typings.json
new file mode 100644
index 0000000000..c974311fa7
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/angular/typings.json
@@ -0,0 +1,8 @@
+{
+  "resolution": "main",
+  "tree": {
+    "src": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/b76dd8a7f95b71696982befbb7589940d27e940b/angularjs/angular.d.ts",
+    "raw": "registry:dt/angular#1.5.0+20160517064839",
+    "typings": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/b76dd8a7f95b71696982befbb7589940d27e940b/angularjs/angular.d.ts"
+  }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/jquery/index.d.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/jquery/index.d.ts
new file mode 100644
index 0000000000..b4208b3b82
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/jquery/index.d.ts
@@ -0,0 +1,3199 @@
+// Generated by typings
+// Source: https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/4cdfbe96b666eec5e1defbb519a62abf04e96764/jquery/jquery.d.ts
+interface JQueryAjaxSettings {
+    /**
+     * The content type sent in the request header that tells the server what kind of response it will accept in return. If the accepts setting needs modification, it is recommended to do so once in the $.ajaxSetup() method.
+     */
+    accepts?: any;
+    /**
+     * By default, all requests are sent asynchronously (i.e. this is set to true by default). If you need synchronous requests, set this option to false. Cross-domain requests and dataType: "jsonp" requests do not support synchronous operation. Note that synchronous requests may temporarily lock the browser, disabling any actions while the request is active. As of jQuery 1.8, the use of async: false with jqXHR ($.Deferred) is deprecated; you must use the success/error/complete callback options instead of the corresponding methods of the jqXHR object such as jqXHR.done() or the deprecated jqXHR.success().
+     */
+    async?: boolean;
+    /**
+     * A pre-request callback function that can be used to modify the jqXHR (in jQuery 1.4.x, XMLHTTPRequest) object before it is sent. Use this to set custom headers, etc. The jqXHR and settings objects are passed as arguments. This is an Ajax Event. Returning false in the beforeSend function will cancel the request. As of jQuery 1.5, the beforeSend option will be called regardless of the type of request.
+     */
+    beforeSend? (jqXHR: JQueryXHR, settings: JQueryAjaxSettings): any;
+    /**
+     * If set to false, it will force requested pages not to be cached by the browser. Note: Setting cache to false will only work correctly with HEAD and GET requests. It works by appending "_={timestamp}" to the GET parameters. The parameter is not needed for other types of requests, except in IE8 when a POST is made to a URL that has already been requested by a GET.
+     */
+    cache?: boolean;
+    /**
+     * A function to be called when the request finishes (after success and error callbacks are executed). The function gets passed two arguments: The jqXHR (in jQuery 1.4.x, XMLHTTPRequest) object and a string categorizing the status of the request ("success", "notmodified", "error", "timeout", "abort", or "parsererror"). As of jQuery 1.5, the complete setting can accept an array of functions. Each function will be called in turn. This is an Ajax Event.
+     */
+    complete? (jqXHR: JQueryXHR, textStatus: string): any;
+    /**
+     * An object of string/regular-expression pairs that determine how jQuery will parse the response, given its content type. (version added: 1.5)
+     */
+    contents?: { [key: string]: any; };
+    //According to jQuery.ajax source code, ajax's option actually allows contentType to set to "false"
+    // https://github.com/DefinitelyTyped/DefinitelyTyped/issues/742
+    /**
+     * When sending data to the server, use this content type. Default is "application/x-www-form-urlencoded; charset=UTF-8", which is fine for most cases. If you explicitly pass in a content-type to $.ajax(), then it is always sent to the server (even if no data is sent). The W3C XMLHttpRequest specification dictates that the charset is always UTF-8; specifying another charset will not force the browser to change the encoding.
+     */
+    contentType?: any;
+    /**
+     * This object will be made the context of all Ajax-related callbacks. By default, the context is an object that represents the ajax settings used in the call ($.ajaxSettings merged with the settings passed to $.ajax).
+     */
+    context?: any;
+    /**
+     * An object containing dataType-to-dataType converters. Each converter's value is a function that returns the transformed value of the response. (version added: 1.5)
+     */
+    converters?: { [key: string]: any; };
+    /**
+     * If you wish to force a crossDomain request (such as JSONP) on the same domain, set the value of crossDomain to true. This allows, for example, server-side redirection to another domain. (version added: 1.5)
+     */
+    crossDomain?: boolean;
+    /**
+     * Data to be sent to the server. It is converted to a query string, if not already a string. It's appended to the url for GET-requests. See processData option to prevent this automatic processing. Object must be Key/Value pairs. If value is an Array, jQuery serializes multiple values with same key based on the value of the traditional setting (described below).
+     */
+    data?: any;
+    /**
+     * A function to be used to handle the raw response data of XMLHttpRequest.This is a pre-filtering function to sanitize the response. You should return the sanitized data. The function accepts two arguments: The raw data returned from the server and the 'dataType' parameter.
+     */
+    dataFilter? (data: any, ty: any): any;
+    /**
+     * The type of data that you're expecting back from the server. If none is specified, jQuery will try to infer it based on the MIME type of the response (an XML MIME type will yield XML, in 1.4 JSON will yield a JavaScript object, in 1.4 script will execute the script, and anything else will be returned as a string). 
+     */
+    dataType?: string;
+    /**
+     * A function to be called if the request fails. The function receives three arguments: The jqXHR (in jQuery 1.4.x, XMLHttpRequest) object, a string describing the type of error that occurred and an optional exception object, if one occurred. Possible values for the second argument (besides null) are "timeout", "error", "abort", and "parsererror". When an HTTP error occurs, errorThrown receives the textual portion of the HTTP status, such as "Not Found" or "Internal Server Error." As of jQuery 1.5, the error setting can accept an array of functions. Each function will be called in turn. Note: This handler is not called for cross-domain script and cross-domain JSONP requests. This is an Ajax Event.
+     */
+    error? (jqXHR: JQueryXHR, textStatus: string, errorThrown: string): any;
+    /**
+     * Whether to trigger global Ajax event handlers for this request. The default is true. Set to false to prevent the global handlers like ajaxStart or ajaxStop from being triggered. This can be used to control various Ajax Events.
+     */
+    global?: boolean;
+    /**
+     * An object of additional header key/value pairs to send along with requests using the XMLHttpRequest transport. The header X-Requested-With: XMLHttpRequest is always added, but its default XMLHttpRequest value can be changed here. Values in the headers setting can also be overwritten from within the beforeSend function. (version added: 1.5)
+     */
+    headers?: { [key: string]: any; };
+    /**
+     * Allow the request to be successful only if the response has changed since the last request. This is done by checking the Last-Modified header. Default value is false, ignoring the header. In jQuery 1.4 this technique also checks the 'etag' specified by the server to catch unmodified data.
+     */
+    ifModified?: boolean;
+    /**
+     * Allow the current environment to be recognized as "local," (e.g. the filesystem), even if jQuery does not recognize it as such by default. The following protocols are currently recognized as local: file, *-extension, and widget. If the isLocal setting needs modification, it is recommended to do so once in the $.ajaxSetup() method. (version added: 1.5.1)
+     */
+    isLocal?: boolean;
+    /**
+     * Override the callback function name in a jsonp request. This value will be used instead of 'callback' in the 'callback=?' part of the query string in the url. So {jsonp:'onJSONPLoad'} would result in 'onJSONPLoad=?' passed to the server. As of jQuery 1.5, setting the jsonp option to false prevents jQuery from adding the "?callback" string to the URL or attempting to use "=?" for transformation. In this case, you should also explicitly set the jsonpCallback setting. For example, { jsonp: false, jsonpCallback: "callbackName" }
+     */
+    jsonp?: any;
+    /**
+     * Specify the callback function name for a JSONP request. This value will be used instead of the random name automatically generated by jQuery. It is preferable to let jQuery generate a unique name as it'll make it easier to manage the requests and provide callbacks and error handling. You may want to specify the callback when you want to enable better browser caching of GET requests. As of jQuery 1.5, you can also use a function for this setting, in which case the value of jsonpCallback is set to the return value of that function.
+     */
+    jsonpCallback?: any;
+    /**
+     * The HTTP method to use for the request (e.g. "POST", "GET", "PUT"). (version added: 1.9.0)
+     */
+    method?: string;
+    /**
+     * A mime type to override the XHR mime type. (version added: 1.5.1)
+     */
+    mimeType?: string;
+    /**
+     * A password to be used with XMLHttpRequest in response to an HTTP access authentication request.
+     */
+    password?: string;
+    /**
+     * By default, data passed in to the data option as an object (technically, anything other than a string) will be processed and transformed into a query string, fitting to the default content-type "application/x-www-form-urlencoded". If you want to send a DOMDocument, or other non-processed data, set this option to false.
+     */
+    processData?: boolean;
+    /**
+     * Only applies when the "script" transport is used (e.g., cross-domain requests with "jsonp" or "script" dataType and "GET" type). Sets the charset attribute on the script tag used in the request. Used when the character set on the local page is not the same as the one on the remote script.
+     */
+    scriptCharset?: string;
+    /**
+     * An object of numeric HTTP codes and functions to be called when the response has the corresponding code. f the request is successful, the status code functions take the same parameters as the success callback; if it results in an error (including 3xx redirect), they take the same parameters as the error callback. (version added: 1.5)
+     */
+    statusCode?: { [key: string]: any; };
+    /**
+     * A function to be called if the request succeeds. The function gets passed three arguments: The data returned from the server, formatted according to the dataType parameter; a string describing the status; and the jqXHR (in jQuery 1.4.x, XMLHttpRequest) object. As of jQuery 1.5, the success setting can accept an array of functions. Each function will be called in turn. This is an Ajax Event.
+     */
+    success? (data: any, textStatus: string, jqXHR: JQueryXHR): any;
+    /**
+     * Set a timeout (in milliseconds) for the request. This will override any global timeout set with $.ajaxSetup(). The timeout period starts at the point the $.ajax call is made; if several other requests are in progress and the browser has no connections available, it is possible for a request to time out before it can be sent. In jQuery 1.4.x and below, the XMLHttpRequest object will be in an invalid state if the request times out; accessing any object members may throw an exception. In Firefox 3.0+ only, script and JSONP requests cannot be cancelled by a timeout; the script will run even if it arrives after the timeout period.
+     */
+    timeout?: number;
+    /**
+     * Set this to true if you wish to use the traditional style of param serialization.
+     */
+    traditional?: boolean;
+    /**
+     * The type of request to make ("POST" or "GET"), default is "GET". Note: Other HTTP request methods, such as PUT and DELETE, can also be used here, but they are not supported by all browsers.
+     */
+    type?: string;
+    /**
+     * A string containing the URL to which the request is sent.
+     */
+    url?: string;
+    /**
+     * A username to be used with XMLHttpRequest in response to an HTTP access authentication request.
+     */
+    username?: string;
+    /**
+     * Callback for creating the XMLHttpRequest object. Defaults to the ActiveXObject when available (IE), the XMLHttpRequest otherwise. Override to provide your own implementation for XMLHttpRequest or enhancements to the factory.
+     */
+    xhr?: any;
+    /**
+     * An object of fieldName-fieldValue pairs to set on the native XHR object. For example, you can use it to set withCredentials to true for cross-domain requests if needed. In jQuery 1.5, the withCredentials property was not propagated to the native XHR and thus CORS requests requiring it would ignore this flag. For this reason, we recommend using jQuery 1.5.1+ should you require the use of it. (version added: 1.5.1)
+     */
+    xhrFields?: { [key: string]: any; };
+}
+
+/**
+ * Interface for the jqXHR object
+ */
+interface JQueryXHR extends XMLHttpRequest, JQueryPromise<any> {
+    /**
+     * The .overrideMimeType() method may be used in the beforeSend() callback function, for example, to modify the response content-type header. As of jQuery 1.5.1, the jqXHR object also contains the overrideMimeType() method (it was available in jQuery 1.4.x, as well, but was temporarily removed in jQuery 1.5). 
+     */
+    overrideMimeType(mimeType: string): any;
+    /**
+     * Cancel the request. 
+     *
+     * @param statusText A string passed as the textStatus parameter for the done callback. Default value: "canceled"
+     */
+    abort(statusText?: string): void;
+    /**
+     * Incorporates the functionality of the .done() and .fail() methods, allowing (as of jQuery 1.8) the underlying Promise to be manipulated. Refer to deferred.then() for implementation details.
+     */
+    then<R>(doneCallback: (data: any, textStatus: string, jqXHR: JQueryXHR) => R, failCallback?: (jqXHR: JQueryXHR, textStatus: string, errorThrown: any) => void): JQueryPromise<R>;
+    /**
+     * Property containing the parsed response if the response Content-Type is json
+     */
+    responseJSON?: any;
+    /**
+     * A function to be called if the request fails.
+     */
+    error(xhr: JQueryXHR, textStatus: string, errorThrown: string): void;
+}
+
+/**
+ * Interface for the JQuery callback
+ */
+interface JQueryCallback {
+    /**
+     * Add a callback or a collection of callbacks to a callback list.
+     * 
+     * @param callbacks A function, or array of functions, that are to be added to the callback list.
+     */
+    add(callbacks: Function): JQueryCallback;
+    /**
+     * Add a callback or a collection of callbacks to a callback list.
+     * 
+     * @param callbacks A function, or array of functions, that are to be added to the callback list.
+     */
+    add(callbacks: Function[]): JQueryCallback;
+
+    /**
+     * Disable a callback list from doing anything more.
+     */
+    disable(): JQueryCallback;
+
+    /**
+     * Determine if the callbacks list has been disabled.
+     */
+    disabled(): boolean;
+
+    /**
+     * Remove all of the callbacks from a list.
+     */
+    empty(): JQueryCallback;
+
+    /**
+     * Call all of the callbacks with the given arguments
+     * 
+     * @param arguments The argument or list of arguments to pass back to the callback list.
+     */
+    fire(...arguments: any[]): JQueryCallback;
+
+    /**
+     * Determine if the callbacks have already been called at least once.
+     */
+    fired(): boolean;
+
+    /**
+     * Call all callbacks in a list with the given context and arguments.
+     * 
+     * @param context A reference to the context in which the callbacks in the list should be fired.
+     * @param arguments An argument, or array of arguments, to pass to the callbacks in the list.
+     */
+    fireWith(context?: any, args?: any[]): JQueryCallback;
+
+    /**
+     * Determine whether a supplied callback is in a list
+     * 
+     * @param callback The callback to search for.
+     */
+    has(callback: Function): boolean;
+
+    /**
+     * Lock a callback list in its current state.
+     */
+    lock(): JQueryCallback;
+
+    /**
+     * Determine if the callbacks list has been locked.
+     */
+    locked(): boolean;
+
+    /**
+     * Remove a callback or a collection of callbacks from a callback list.
+     * 
+     * @param callbacks A function, or array of functions, that are to be removed from the callback list.
+     */
+    remove(callbacks: Function): JQueryCallback;
+    /**
+     * Remove a callback or a collection of callbacks from a callback list.
+     * 
+     * @param callbacks A function, or array of functions, that are to be removed from the callback list.
+     */
+    remove(callbacks: Function[]): JQueryCallback;
+}
+
+/**
+ * Allows jQuery Promises to interop with non-jQuery promises
+ */
+interface JQueryGenericPromise<T> {
+    /**
+     * Add handlers to be called when the Deferred object is resolved, rejected, or still in progress.
+     * 
+     * @param doneFilter A function that is called when the Deferred is resolved.
+     * @param failFilter An optional function that is called when the Deferred is rejected.
+     */
+    then<U>(doneFilter: (value?: T, ...values: any[]) => U|JQueryPromise<U>, failFilter?: (...reasons: any[]) => any, progressFilter?: (...progression: any[]) => any): JQueryPromise<U>;
+
+    /**
+     * Add handlers to be called when the Deferred object is resolved, rejected, or still in progress.
+     * 
+     * @param doneFilter A function that is called when the Deferred is resolved.
+     * @param failFilter An optional function that is called when the Deferred is rejected.
+     */
+    then(doneFilter: (value?: T, ...values: any[]) => void, failFilter?: (...reasons: any[]) => any, progressFilter?: (...progression: any[]) => any): JQueryPromise<void>;
+}
+
+/**
+ * Interface for the JQuery promise/deferred callbacks
+ */
+interface JQueryPromiseCallback<T> {
+    (value?: T, ...args: any[]): void;
+}
+
+interface JQueryPromiseOperator<T, U> {
+    (callback1: JQueryPromiseCallback<T>|JQueryPromiseCallback<T>[], ...callbacksN: Array<JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[]>): JQueryPromise<U>;
+}
+
+/**
+ * Interface for the JQuery promise, part of callbacks
+ */
+interface JQueryPromise<T> extends JQueryGenericPromise<T> {
+    /**
+     * Determine the current state of a Deferred object.
+     */
+    state(): string;
+    /**
+     * Add handlers to be called when the Deferred object is either resolved or rejected.
+     * 
+     * @param alwaysCallbacks1 A function, or array of functions, that is called when the Deferred is resolved or rejected.
+     * @param alwaysCallbacks2 Optional additional functions, or arrays of functions, that are called when the Deferred is resolved or rejected.
+     */
+    always(alwaysCallback1?: JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[], ...alwaysCallbacksN: Array<JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[]>): JQueryPromise<T>;
+    /**
+     * Add handlers to be called when the Deferred object is resolved.
+     * 
+     * @param doneCallbacks1 A function, or array of functions, that are called when the Deferred is resolved.
+     * @param doneCallbacks2 Optional additional functions, or arrays of functions, that are called when the Deferred is resolved.
+     */
+    done(doneCallback1?: JQueryPromiseCallback<T>|JQueryPromiseCallback<T>[], ...doneCallbackN: Array<JQueryPromiseCallback<T>|JQueryPromiseCallback<T>[]>): JQueryPromise<T>;
+    /**
+     * Add handlers to be called when the Deferred object is rejected.
+     * 
+     * @param failCallbacks1 A function, or array of functions, that are called when the Deferred is rejected.
+     * @param failCallbacks2 Optional additional functions, or arrays of functions, that are called when the Deferred is rejected.
+     */
+    fail(failCallback1?: JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[], ...failCallbacksN: Array<JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[]>): JQueryPromise<T>;
+    /**
+     * Add handlers to be called when the Deferred object generates progress notifications.
+     * 
+     * @param progressCallbacks A function, or array of functions, to be called when the Deferred generates progress notifications.
+     */
+    progress(progressCallback1?: JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[], ...progressCallbackN: Array<JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[]>): JQueryPromise<T>;
+
+    // Deprecated - given no typings
+    pipe(doneFilter?: (x: any) => any, failFilter?: (x: any) => any, progressFilter?: (x: any) => any): JQueryPromise<any>;
+}
+
+/**
+ * Interface for the JQuery deferred, part of callbacks
+ */
+interface JQueryDeferred<T> extends JQueryGenericPromise<T> {
+    /**
+     * Determine the current state of a Deferred object.
+     */
+    state(): string;
+    /**
+     * Add handlers to be called when the Deferred object is either resolved or rejected.
+     * 
+     * @param alwaysCallbacks1 A function, or array of functions, that is called when the Deferred is resolved or rejected.
+     * @param alwaysCallbacks2 Optional additional functions, or arrays of functions, that are called when the Deferred is resolved or rejected.
+     */
+    always(alwaysCallback1?: JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[], ...alwaysCallbacksN: Array<JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[]>): JQueryDeferred<T>;
+    /**
+     * Add handlers to be called when the Deferred object is resolved.
+     * 
+     * @param doneCallbacks1 A function, or array of functions, that are called when the Deferred is resolved.
+     * @param doneCallbacks2 Optional additional functions, or arrays of functions, that are called when the Deferred is resolved.
+     */
+    done(doneCallback1?: JQueryPromiseCallback<T>|JQueryPromiseCallback<T>[], ...doneCallbackN: Array<JQueryPromiseCallback<T>|JQueryPromiseCallback<T>[]>): JQueryDeferred<T>;
+    /**
+     * Add handlers to be called when the Deferred object is rejected.
+     * 
+     * @param failCallbacks1 A function, or array of functions, that are called when the Deferred is rejected.
+     * @param failCallbacks2 Optional additional functions, or arrays of functions, that are called when the Deferred is rejected.
+     */
+    fail(failCallback1?: JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[], ...failCallbacksN: Array<JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[]>): JQueryDeferred<T>;
+    /**
+     * Add handlers to be called when the Deferred object generates progress notifications.
+     * 
+     * @param progressCallbacks A function, or array of functions, to be called when the Deferred generates progress notifications.
+     */
+    progress(progressCallback1?: JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[], ...progressCallbackN: Array<JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[]>): JQueryDeferred<T>;
+
+    /**
+     * Call the progressCallbacks on a Deferred object with the given args.
+     * 
+     * @param args Optional arguments that are passed to the progressCallbacks.
+     */
+    notify(value?: any, ...args: any[]): JQueryDeferred<T>;
+
+    /**
+     * Call the progressCallbacks on a Deferred object with the given context and args.
+     * 
+     * @param context Context passed to the progressCallbacks as the this object.
+     * @param args Optional arguments that are passed to the progressCallbacks.
+     */
+    notifyWith(context: any, value?: any[]): JQueryDeferred<T>;
+
+    /**
+     * Reject a Deferred object and call any failCallbacks with the given args.
+     * 
+     * @param args Optional arguments that are passed to the failCallbacks.
+     */
+    reject(value?: any, ...args: any[]): JQueryDeferred<T>;
+    /**
+     * Reject a Deferred object and call any failCallbacks with the given context and args.
+     * 
+     * @param context Context passed to the failCallbacks as the this object.
+     * @param args An optional array of arguments that are passed to the failCallbacks.
+     */
+    rejectWith(context: any, value?: any[]): JQueryDeferred<T>;
+
+    /**
+     * Resolve a Deferred object and call any doneCallbacks with the given args.
+     * 
+     * @param value First argument passed to doneCallbacks.
+     * @param args Optional subsequent arguments that are passed to the doneCallbacks.
+     */
+    resolve(value?: T, ...args: any[]): JQueryDeferred<T>;
+
+    /**
+     * Resolve a Deferred object and call any doneCallbacks with the given context and args.
+     * 
+     * @param context Context passed to the doneCallbacks as the this object.
+     * @param args An optional array of arguments that are passed to the doneCallbacks.
+     */
+    resolveWith(context: any, value?: T[]): JQueryDeferred<T>;
+
+    /**
+     * Return a Deferred's Promise object.
+     * 
+     * @param target Object onto which the promise methods have to be attached
+     */
+    promise(target?: any): JQueryPromise<T>;
+
+    // Deprecated - given no typings
+    pipe(doneFilter?: (x: any) => any, failFilter?: (x: any) => any, progressFilter?: (x: any) => any): JQueryPromise<any>;
+}
+
+/**
+ * Interface of the JQuery extension of the W3C event object
+ */
+interface BaseJQueryEventObject extends Event {
+    data: any;
+    delegateTarget: Element;
+    isDefaultPrevented(): boolean;
+    isImmediatePropagationStopped(): boolean;
+    isPropagationStopped(): boolean;
+    namespace: string;
+    originalEvent: Event;
+    preventDefault(): any;
+    relatedTarget: Element;
+    result: any;
+    stopImmediatePropagation(): void;
+    stopPropagation(): void;
+    target: Element;
+    pageX: number;
+    pageY: number;
+    which: number;
+    metaKey: boolean;
+}
+
+interface JQueryInputEventObject extends BaseJQueryEventObject {
+    altKey: boolean;
+    ctrlKey: boolean;
+    metaKey: boolean;
+    shiftKey: boolean;
+}
+
+interface JQueryMouseEventObject extends JQueryInputEventObject {
+    button: number;
+    clientX: number;
+    clientY: number;
+    offsetX: number;
+    offsetY: number;
+    pageX: number;
+    pageY: number;
+    screenX: number;
+    screenY: number;
+}
+
+interface JQueryKeyEventObject extends JQueryInputEventObject {
+    char: any;
+    charCode: number;
+    key: any;
+    keyCode: number;
+}
+
+interface JQueryEventObject extends BaseJQueryEventObject, JQueryInputEventObject, JQueryMouseEventObject, JQueryKeyEventObject{
+}
+
+/*
+    Collection of properties of the current browser
+*/
+
+interface JQuerySupport {
+    ajax?: boolean;
+    boxModel?: boolean;
+    changeBubbles?: boolean;
+    checkClone?: boolean;
+    checkOn?: boolean;
+    cors?: boolean;
+    cssFloat?: boolean;
+    hrefNormalized?: boolean;
+    htmlSerialize?: boolean;
+    leadingWhitespace?: boolean;
+    noCloneChecked?: boolean;
+    noCloneEvent?: boolean;
+    opacity?: boolean;
+    optDisabled?: boolean;
+    optSelected?: boolean;
+    scriptEval? (): boolean;
+    style?: boolean;
+    submitBubbles?: boolean;
+    tbody?: boolean;
+}
+
+interface JQueryParam {
+    /**
+     * Create a serialized representation of an array or object, suitable for use in a URL query string or Ajax request.
+     * 
+     * @param obj An array or object to serialize.
+     */
+    (obj: any): string;
+
+    /**
+     * Create a serialized representation of an array or object, suitable for use in a URL query string or Ajax request.
+     * 
+     * @param obj An array or object to serialize.
+     * @param traditional A Boolean indicating whether to perform a traditional "shallow" serialization.
+     */
+    (obj: any, traditional: boolean): string;
+}
+
+/**
+ * The interface used to construct jQuery events (with $.Event). It is
+ * defined separately instead of inline in JQueryStatic to allow
+ * overriding the construction function with specific strings
+ * returning specific event objects.
+ */
+interface JQueryEventConstructor {
+    (name: string, eventProperties?: any): JQueryEventObject;
+    new (name: string, eventProperties?: any): JQueryEventObject;
+}
+
+/**
+ * The interface used to specify coordinates.
+ */
+interface JQueryCoordinates {
+    left: number;
+    top: number;
+}
+
+/**
+ * Elements in the array returned by serializeArray()
+ */
+interface JQuerySerializeArrayElement {
+    name: string;
+    value: string;
+}
+
+interface JQueryAnimationOptions { 
+    /**
+     * A string or number determining how long the animation will run.
+     */
+    duration?: any; 
+    /**
+     * A string indicating which easing function to use for the transition.
+     */
+    easing?: string; 
+    /**
+     * A function to call once the animation is complete.
+     */
+    complete?: Function; 
+    /**
+     * A function to be called for each animated property of each animated element. This function provides an opportunity to modify the Tween object to change the value of the property before it is set.
+     */
+    step?: (now: number, tween: any) => any; 
+    /**
+     * A function to be called after each step of the animation, only once per animated element regardless of the number of animated properties. (version added: 1.8)
+     */
+    progress?: (animation: JQueryPromise<any>, progress: number, remainingMs: number) => any; 
+    /**
+     * A function to call when the animation begins. (version added: 1.8)
+     */
+    start?: (animation: JQueryPromise<any>) => any; 
+    /**
+     * A function to be called when the animation completes (its Promise object is resolved). (version added: 1.8)
+     */
+    done?: (animation: JQueryPromise<any>, jumpedToEnd: boolean) => any; 
+    /**
+     * A function to be called when the animation fails to complete (its Promise object is rejected). (version added: 1.8)
+     */
+    fail?: (animation: JQueryPromise<any>, jumpedToEnd: boolean) => any; 
+    /**
+     * A function to be called when the animation completes or stops without completing (its Promise object is either resolved or rejected). (version added: 1.8)
+     */
+    always?: (animation: JQueryPromise<any>, jumpedToEnd: boolean) => any; 
+    /**
+     * A Boolean indicating whether to place the animation in the effects queue. If false, the animation will begin immediately. As of jQuery 1.7, the queue option can also accept a string, in which case the animation is added to the queue represented by that string. When a custom queue name is used the animation does not automatically start; you must call .dequeue("queuename") to start it.
+     */
+    queue?: any; 
+    /**
+     * A map of one or more of the CSS properties defined by the properties argument and their corresponding easing functions. (version added: 1.4)
+     */
+    specialEasing?: Object;
+}
+
+interface JQueryEasingFunction {
+    ( percent: number ): number;
+}
+
+interface JQueryEasingFunctions {
+    [ name: string ]: JQueryEasingFunction;
+    linear: JQueryEasingFunction;
+    swing: JQueryEasingFunction;
+}
+
+/**
+ * Static members of jQuery (those on $ and jQuery themselves)
+ */
+interface JQueryStatic {
+
+    /**
+     * Perform an asynchronous HTTP (Ajax) request.
+     *
+     * @param settings A set of key/value pairs that configure the Ajax request. All settings are optional. A default can be set for any option with $.ajaxSetup().
+     */
+    ajax(settings: JQueryAjaxSettings): JQueryXHR;
+    /**
+     * Perform an asynchronous HTTP (Ajax) request.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param settings A set of key/value pairs that configure the Ajax request. All settings are optional. A default can be set for any option with $.ajaxSetup().
+     */
+    ajax(url: string, settings?: JQueryAjaxSettings): JQueryXHR;
+
+    /**
+     * Handle custom Ajax options or modify existing options before each request is sent and before they are processed by $.ajax().
+     *
+     * @param dataTypes An optional string containing one or more space-separated dataTypes
+     * @param handler A handler to set default values for future Ajax requests.
+     */
+    ajaxPrefilter(dataTypes: string, handler: (opts: any, originalOpts: JQueryAjaxSettings, jqXHR: JQueryXHR) => any): void;
+    /**
+     * Handle custom Ajax options or modify existing options before each request is sent and before they are processed by $.ajax().
+     *
+     * @param handler A handler to set default values for future Ajax requests.
+     */
+    ajaxPrefilter(handler: (opts: any, originalOpts: JQueryAjaxSettings, jqXHR: JQueryXHR) => any): void;
+
+    ajaxSettings: JQueryAjaxSettings;
+
+     /**
+      * Set default values for future Ajax requests. Its use is not recommended.
+      *
+      * @param options A set of key/value pairs that configure the default Ajax request. All options are optional.
+      */
+    ajaxSetup(options: JQueryAjaxSettings): void;
+
+    /**
+     * Load data from the server using a HTTP GET request.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param success A callback function that is executed if the request succeeds.
+     * @param dataType The type of data expected from the server. Default: Intelligent Guess (xml, json, script, or html).
+     */
+    get(url: string, success?: (data: any, textStatus: string, jqXHR: JQueryXHR) => any, dataType?: string): JQueryXHR;
+    /**
+     * Load data from the server using a HTTP GET request.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param data A plain object or string that is sent to the server with the request.
+     * @param success A callback function that is executed if the request succeeds.
+     * @param dataType The type of data expected from the server. Default: Intelligent Guess (xml, json, script, or html).
+     */
+    get(url: string, data?: Object|string, success?: (data: any, textStatus: string, jqXHR: JQueryXHR) => any, dataType?: string): JQueryXHR;
+    /**
+     * Load data from the server using a HTTP GET request.
+     *
+     * @param settings The JQueryAjaxSettings to be used for the request
+     */
+    get(settings : JQueryAjaxSettings): JQueryXHR;
+    /**
+     * Load JSON-encoded data from the server using a GET HTTP request.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param success A callback function that is executed if the request succeeds.
+     */
+    getJSON(url: string, success?: (data: any, textStatus: string, jqXHR: JQueryXHR) => any): JQueryXHR;
+    /**
+     * Load JSON-encoded data from the server using a GET HTTP request.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param data A plain object or string that is sent to the server with the request.
+     * @param success A callback function that is executed if the request succeeds.
+     */
+    getJSON(url: string, data?: Object|string, success?: (data: any, textStatus: string, jqXHR: JQueryXHR) => any): JQueryXHR;
+    /**
+     * Load a JavaScript file from the server using a GET HTTP request, then execute it.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param success A callback function that is executed if the request succeeds.
+     */
+    getScript(url: string, success?: (script: string, textStatus: string, jqXHR: JQueryXHR) => any): JQueryXHR;
+
+    /**
+     * Create a serialized representation of an array or object, suitable for use in a URL query string or Ajax request.
+     */
+    param: JQueryParam;
+
+    /**
+     * Load data from the server using a HTTP POST request.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param success A callback function that is executed if the request succeeds. Required if dataType is provided, but can be null in that case.
+     * @param dataType The type of data expected from the server. Default: Intelligent Guess (xml, json, script, text, html).
+     */
+    post(url: string, success?: (data: any, textStatus: string, jqXHR: JQueryXHR) => any, dataType?: string): JQueryXHR;
+    /**
+     * Load data from the server using a HTTP POST request.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param data A plain object or string that is sent to the server with the request.
+     * @param success A callback function that is executed if the request succeeds. Required if dataType is provided, but can be null in that case.
+     * @param dataType The type of data expected from the server. Default: Intelligent Guess (xml, json, script, text, html).
+     */
+    post(url: string, data?: Object|string, success?: (data: any, textStatus: string, jqXHR: JQueryXHR) => any, dataType?: string): JQueryXHR;
+    /**
+     * Load data from the server using a HTTP POST request.
+     *
+     * @param settings The JQueryAjaxSettings to be used for the request
+     */
+    post(settings : JQueryAjaxSettings): JQueryXHR;
+    /**
+     * A multi-purpose callbacks list object that provides a powerful way to manage callback lists.
+     *
+     * @param flags An optional list of space-separated flags that change how the callback list behaves.
+     */
+    Callbacks(flags?: string): JQueryCallback;
+
+    /**
+     * Holds or releases the execution of jQuery's ready event.
+     *
+     * @param hold Indicates whether the ready hold is being requested or released
+     */
+    holdReady(hold: boolean): void;
+
+    /**
+     * Accepts a string containing a CSS selector which is then used to match a set of elements.
+     *
+     * @param selector A string containing a selector expression
+     * @param context A DOM Element, Document, or jQuery to use as context
+     */
+    (selector: string, context?: Element|JQuery): JQuery;
+
+    /**
+     * Accepts a string containing a CSS selector which is then used to match a set of elements.
+     *
+     * @param element A DOM element to wrap in a jQuery object.
+     */
+    (element: Element): JQuery;
+
+    /**
+     * Accepts a string containing a CSS selector which is then used to match a set of elements.
+     *
+     * @param elementArray An array containing a set of DOM elements to wrap in a jQuery object.
+     */
+    (elementArray: Element[]): JQuery;
+
+    /**
+     * Binds a function to be executed when the DOM has finished loading.
+     *
+     * @param callback A function to execute after the DOM is ready.
+     */
+    (callback: (jQueryAlias?: JQueryStatic) => any): JQuery;
+
+    /**
+     * Accepts a string containing a CSS selector which is then used to match a set of elements.
+     *
+     * @param object A plain object to wrap in a jQuery object.
+     */
+    (object: {}): JQuery;
+
+    /**
+     * Accepts a string containing a CSS selector which is then used to match a set of elements.
+     *
+     * @param object An existing jQuery object to clone.
+     */
+    (object: JQuery): JQuery;
+
+    /**
+     * Specify a function to execute when the DOM is fully loaded.
+     */
+    (): JQuery;
+
+    /**
+     * Creates DOM elements on the fly from the provided string of raw HTML.
+     *
+     * @param html A string of HTML to create on the fly. Note that this parses HTML, not XML.
+     * @param ownerDocument A document in which the new elements will be created.
+     */
+    (html: string, ownerDocument?: Document): JQuery;
+
+    /**
+     * Creates DOM elements on the fly from the provided string of raw HTML.
+     *
+     * @param html A string defining a single, standalone, HTML element (e.g. <div/> or <div></div>).
+     * @param attributes An object of attributes, events, and methods to call on the newly-created element.
+     */
+    (html: string, attributes: Object): JQuery;
+
+    /**
+     * Relinquish jQuery's control of the $ variable.
+     *
+     * @param removeAll A Boolean indicating whether to remove all jQuery variables from the global scope (including jQuery itself).
+     */
+    noConflict(removeAll?: boolean): JQueryStatic;
+
+    /**
+     * Provides a way to execute callback functions based on one or more objects, usually Deferred objects that represent asynchronous events.
+     *
+     * @param deferreds One or more Deferred objects, or plain JavaScript objects.
+     */
+    when<T>(...deferreds: Array<T|JQueryPromise<T>/* as JQueryDeferred<T> */>): JQueryPromise<T>;
+
+    /**
+     * Hook directly into jQuery to override how particular CSS properties are retrieved or set, normalize CSS property naming, or create custom properties.
+     */
+    cssHooks: { [key: string]: any; };
+    cssNumber: any;
+
+    /**
+     * Store arbitrary data associated with the specified element. Returns the value that was set.
+     *
+     * @param element The DOM element to associate with the data.
+     * @param key A string naming the piece of data to set.
+     * @param value The new data value.
+     */
+    data<T>(element: Element, key: string, value: T): T;
+    /**
+     * Returns value at named data store for the element, as set by jQuery.data(element, name, value), or the full data store for the element.
+     *
+     * @param element The DOM element to associate with the data.
+     * @param key A string naming the piece of data to set.
+     */
+    data(element: Element, key: string): any;
+    /**
+     * Returns value at named data store for the element, as set by jQuery.data(element, name, value), or the full data store for the element.
+     *
+     * @param element The DOM element to associate with the data.
+     */
+    data(element: Element): any;
+
+    /**
+     * Execute the next function on the queue for the matched element.
+     *
+     * @param element A DOM element from which to remove and execute a queued function.
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     */
+    dequeue(element: Element, queueName?: string): void;
+
+    /**
+     * Determine whether an element has any jQuery data associated with it.
+     *
+     * @param element A DOM element to be checked for data.
+     */
+    hasData(element: Element): boolean;
+
+    /**
+     * Show the queue of functions to be executed on the matched element.
+     *
+     * @param element A DOM element to inspect for an attached queue.
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     */
+    queue(element: Element, queueName?: string): any[];
+    /**
+     * Manipulate the queue of functions to be executed on the matched element.
+     *
+     * @param element A DOM element where the array of queued functions is attached.
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     * @param newQueue An array of functions to replace the current queue contents.
+     */
+    queue(element: Element, queueName: string, newQueue: Function[]): JQuery;
+    /**
+     * Manipulate the queue of functions to be executed on the matched element.
+     *
+     * @param element A DOM element on which to add a queued function.
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     * @param callback The new function to add to the queue.
+     */
+    queue(element: Element, queueName: string, callback: Function): JQuery;
+
+    /**
+     * Remove a previously-stored piece of data.
+     *
+     * @param element A DOM element from which to remove data.
+     * @param name A string naming the piece of data to remove.
+     */
+    removeData(element: Element, name?: string): JQuery;
+
+    /**
+     * A constructor function that returns a chainable utility object with methods to register multiple callbacks into callback queues, invoke callback queues, and relay the success or failure state of any synchronous or asynchronous function.
+     *
+     * @param beforeStart A function that is called just before the constructor returns.
+     */
+    Deferred<T>(beforeStart?: (deferred: JQueryDeferred<T>) => any): JQueryDeferred<T>;
+
+    /**
+     * Effects
+     */
+
+    easing: JQueryEasingFunctions;
+
+    fx: {
+        tick: () => void;
+        /**
+         * The rate (in milliseconds) at which animations fire.
+         */
+        interval: number;
+        stop: () => void;
+        speeds: { slow: number; fast: number; };
+        /**
+         * Globally disable all animations.
+         */
+        off: boolean;
+        step: any;
+    };
+
+    /**
+     * Takes a function and returns a new one that will always have a particular context.
+     *
+     * @param fnction The function whose context will be changed.
+     * @param context The object to which the context (this) of the function should be set.
+     * @param additionalArguments Any number of arguments to be passed to the function referenced in the function argument.
+     */
+    proxy(fnction: (...args: any[]) => any, context: Object, ...additionalArguments: any[]): any;
+    /**
+     * Takes a function and returns a new one that will always have a particular context.
+     *
+     * @param context The object to which the context (this) of the function should be set.
+     * @param name The name of the function whose context will be changed (should be a property of the context object).
+     * @param additionalArguments Any number of arguments to be passed to the function named in the name argument.
+     */
+    proxy(context: Object, name: string, ...additionalArguments: any[]): any;
+
+    Event: JQueryEventConstructor;
+
+    /**
+     * Takes a string and throws an exception containing it.
+     *
+     * @param message The message to send out.
+     */
+    error(message: any): JQuery;
+
+    expr: any;
+    fn: any;  //TODO: Decide how we want to type this
+
+    isReady: boolean;
+
+    // Properties
+    support: JQuerySupport;
+
+    /**
+     * Check to see if a DOM element is a descendant of another DOM element.
+     * 
+     * @param container The DOM element that may contain the other element.
+     * @param contained The DOM element that may be contained by (a descendant of) the other element.
+     */
+    contains(container: Element, contained: Element): boolean;
+
+    /**
+     * A generic iterator function, which can be used to seamlessly iterate over both objects and arrays. Arrays and array-like objects with a length property (such as a function's arguments object) are iterated by numeric index, from 0 to length-1. Other objects are iterated via their named properties.
+     * 
+     * @param collection The object or array to iterate over.
+     * @param callback The function that will be executed on every object.
+     */
+    each<T>(
+        collection: T[],
+        callback: (indexInArray: number, valueOfElement: T) => any
+        ): any;
+
+    /**
+     * A generic iterator function, which can be used to seamlessly iterate over both objects and arrays. Arrays and array-like objects with a length property (such as a function's arguments object) are iterated by numeric index, from 0 to length-1. Other objects are iterated via their named properties.
+     * 
+     * @param collection The object or array to iterate over.
+     * @param callback The function that will be executed on every object.
+     */
+    each(
+        collection: any,
+        callback: (indexInArray: any, valueOfElement: any) => any
+        ): any;
+
+    /**
+     * Merge the contents of two or more objects together into the first object.
+     *
+     * @param target An object that will receive the new properties if additional objects are passed in or that will extend the jQuery namespace if it is the sole argument.
+     * @param object1 An object containing additional properties to merge in.
+     * @param objectN Additional objects containing properties to merge in.
+     */
+    extend(target: any, object1?: any, ...objectN: any[]): any;
+    /**
+     * Merge the contents of two or more objects together into the first object.
+     *
+     * @param deep If true, the merge becomes recursive (aka. deep copy).
+     * @param target The object to extend. It will receive the new properties.
+     * @param object1 An object containing additional properties to merge in.
+     * @param objectN Additional objects containing properties to merge in.
+     */
+    extend(deep: boolean, target: any, object1?: any, ...objectN: any[]): any;
+
+    /**
+     * Execute some JavaScript code globally.
+     *
+     * @param code The JavaScript code to execute.
+     */
+    globalEval(code: string): any;
+
+    /**
+     * Finds the elements of an array which satisfy a filter function. The original array is not affected.
+     *
+     * @param array The array to search through.
+     * @param func The function to process each item against. The first argument to the function is the item, and the second argument is the index. The function should return a Boolean value.  this will be the global window object.
+     * @param invert If "invert" is false, or not provided, then the function returns an array consisting of all elements for which "callback" returns true. If "invert" is true, then the function returns an array consisting of all elements for which "callback" returns false.
+     */
+    grep<T>(array: T[], func: (elementOfArray: T, indexInArray: number) => boolean, invert?: boolean): T[];
+
+    /**
+     * Search for a specified value within an array and return its index (or -1 if not found).
+     *
+     * @param value The value to search for.
+     * @param array An array through which to search.
+     * @param fromIndex he index of the array at which to begin the search. The default is 0, which will search the whole array.
+     */
+    inArray<T>(value: T, array: T[], fromIndex?: number): number;
+
+    /**
+     * Determine whether the argument is an array.
+     *
+     * @param obj Object to test whether or not it is an array.
+     */
+    isArray(obj: any): boolean;
+    /**
+     * Check to see if an object is empty (contains no enumerable properties).
+     *
+     * @param obj The object that will be checked to see if it's empty.
+     */
+    isEmptyObject(obj: any): boolean;
+    /**
+     * Determine if the argument passed is a Javascript function object.
+     *
+     * @param obj Object to test whether or not it is a function.
+     */
+    isFunction(obj: any): boolean;
+    /**
+     * Determines whether its argument is a number.
+     *
+     * @param obj The value to be tested.
+     */
+    isNumeric(value: any): boolean;
+    /**
+     * Check to see if an object is a plain object (created using "{}" or "new Object").
+     *
+     * @param obj The object that will be checked to see if it's a plain object.
+     */
+    isPlainObject(obj: any): boolean;
+    /**
+     * Determine whether the argument is a window.
+     *
+     * @param obj Object to test whether or not it is a window.
+     */
+    isWindow(obj: any): boolean;
+    /**
+     * Check to see if a DOM node is within an XML document (or is an XML document).
+     *
+     * @param node he DOM node that will be checked to see if it's in an XML document.
+     */
+    isXMLDoc(node: Node): boolean;
+
+    /**
+     * Convert an array-like object into a true JavaScript array.
+     * 
+     * @param obj Any object to turn into a native Array.
+     */
+    makeArray(obj: any): any[];
+
+    /**
+     * Translate all items in an array or object to new array of items.
+     * 
+     * @param array The Array to translate.
+     * @param callback The function to process each item against. The first argument to the function is the array item, the second argument is the index in array The function can return any value. Within the function, this refers to the global (window) object.
+     */
+    map<T, U>(array: T[], callback: (elementOfArray: T, indexInArray: number) => U): U[];
+    /**
+     * Translate all items in an array or object to new array of items.
+     * 
+     * @param arrayOrObject The Array or Object to translate.
+     * @param callback The function to process each item against. The first argument to the function is the value; the second argument is the index or key of the array or object property. The function can return any value to add to the array. A returned array will be flattened into the resulting array. Within the function, this refers to the global (window) object.
+     */
+    map(arrayOrObject: any, callback: (value: any, indexOrKey: any) => any): any;
+
+    /**
+     * Merge the contents of two arrays together into the first array.
+     * 
+     * @param first The first array to merge, the elements of second added.
+     * @param second The second array to merge into the first, unaltered.
+     */
+    merge<T>(first: T[], second: T[]): T[];
+
+    /**
+     * An empty function.
+     */
+    noop(): any;
+
+    /**
+     * Return a number representing the current time.
+     */
+    now(): number;
+
+    /**
+     * Takes a well-formed JSON string and returns the resulting JavaScript object.
+     * 
+     * @param json The JSON string to parse.
+     */
+    parseJSON(json: string): any;
+
+    /**
+     * Parses a string into an XML document.
+     *
+     * @param data a well-formed XML string to be parsed
+     */
+    parseXML(data: string): XMLDocument;
+
+    /**
+     * Remove the whitespace from the beginning and end of a string.
+     * 
+     * @param str Remove the whitespace from the beginning and end of a string.
+     */
+    trim(str: string): string;
+
+    /**
+     * Determine the internal JavaScript [[Class]] of an object.
+     * 
+     * @param obj Object to get the internal JavaScript [[Class]] of.
+     */
+    type(obj: any): string;
+
+    /**
+     * Sorts an array of DOM elements, in place, with the duplicates removed. Note that this only works on arrays of DOM elements, not strings or numbers.
+     * 
+     * @param array The Array of DOM elements.
+     */
+    unique(array: Element[]): Element[];
+
+    /**
+     * Parses a string into an array of DOM nodes.
+     *
+     * @param data HTML string to be parsed
+     * @param context DOM element to serve as the context in which the HTML fragment will be created
+     * @param keepScripts A Boolean indicating whether to include scripts passed in the HTML string
+     */
+    parseHTML(data: string, context?: HTMLElement, keepScripts?: boolean): any[];
+
+    /**
+     * Parses a string into an array of DOM nodes.
+     *
+     * @param data HTML string to be parsed
+     * @param context DOM element to serve as the context in which the HTML fragment will be created
+     * @param keepScripts A Boolean indicating whether to include scripts passed in the HTML string
+     */
+    parseHTML(data: string, context?: Document, keepScripts?: boolean): any[];
+}
+
+/**
+ * The jQuery instance members
+ */
+interface JQuery {
+    /**
+     * Register a handler to be called when Ajax requests complete. This is an AjaxEvent.
+     *
+     * @param handler The function to be invoked.
+     */
+    ajaxComplete(handler: (event: JQueryEventObject, XMLHttpRequest: XMLHttpRequest, ajaxOptions: any) => any): JQuery;
+    /**
+     * Register a handler to be called when Ajax requests complete with an error. This is an Ajax Event.
+     *
+     * @param handler The function to be invoked.
+     */
+    ajaxError(handler: (event: JQueryEventObject, jqXHR: JQueryXHR, ajaxSettings: JQueryAjaxSettings, thrownError: any) => any): JQuery;
+    /**
+     * Attach a function to be executed before an Ajax request is sent. This is an Ajax Event.
+     *
+     * @param handler The function to be invoked.
+     */
+    ajaxSend(handler: (event: JQueryEventObject, jqXHR: JQueryXHR, ajaxOptions: JQueryAjaxSettings) => any): JQuery;
+    /**
+     * Register a handler to be called when the first Ajax request begins. This is an Ajax Event.
+     *
+     * @param handler The function to be invoked.
+     */
+    ajaxStart(handler: () => any): JQuery;
+    /**
+     * Register a handler to be called when all Ajax requests have completed. This is an Ajax Event.
+     *
+     * @param handler The function to be invoked.
+     */
+    ajaxStop(handler: () => any): JQuery;
+    /**
+     * Attach a function to be executed whenever an Ajax request completes successfully. This is an Ajax Event.
+     *
+     * @param handler The function to be invoked.
+     */
+    ajaxSuccess(handler: (event: JQueryEventObject, XMLHttpRequest: XMLHttpRequest, ajaxOptions: JQueryAjaxSettings) => any): JQuery;
+
+    /**
+     * Load data from the server and place the returned HTML into the matched element.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param data A plain object or string that is sent to the server with the request.
+     * @param complete A callback function that is executed when the request completes.
+     */
+    load(url: string, data?: string|Object, complete?: (responseText: string, textStatus: string, XMLHttpRequest: XMLHttpRequest) => any): JQuery;
+
+    /**
+     * Encode a set of form elements as a string for submission.
+     */
+    serialize(): string;
+    /**
+     * Encode a set of form elements as an array of names and values.
+     */
+    serializeArray(): JQuerySerializeArrayElement[];
+
+    /**
+     * Adds the specified class(es) to each of the set of matched elements.
+     *
+     * @param className One or more space-separated classes to be added to the class attribute of each matched element.
+     */
+    addClass(className: string): JQuery;
+    /**
+     * Adds the specified class(es) to each of the set of matched elements.
+     *
+     * @param function A function returning one or more space-separated class names to be added to the existing class name(s). Receives the index position of the element in the set and the existing class name(s) as arguments. Within the function, this refers to the current element in the set.
+     */
+    addClass(func: (index: number, className: string) => string): JQuery;
+
+    /**
+     * Add the previous set of elements on the stack to the current set, optionally filtered by a selector.
+     */
+    addBack(selector?: string): JQuery;
+
+    /**
+     * Get the value of an attribute for the first element in the set of matched elements.
+     *
+     * @param attributeName The name of the attribute to get.
+     */
+    attr(attributeName: string): string;
+    /**
+     * Set one or more attributes for the set of matched elements.
+     *
+     * @param attributeName The name of the attribute to set.
+     * @param value A value to set for the attribute.
+     */
+    attr(attributeName: string, value: string|number): JQuery;
+    /**
+     * Set one or more attributes for the set of matched elements.
+     *
+     * @param attributeName The name of the attribute to set.
+     * @param func A function returning the value to set. this is the current element. Receives the index position of the element in the set and the old attribute value as arguments.
+     */
+    attr(attributeName: string, func: (index: number, attr: string) => string|number): JQuery;
+    /**
+     * Set one or more attributes for the set of matched elements.
+     *
+     * @param attributes An object of attribute-value pairs to set.
+     */
+    attr(attributes: Object): JQuery;
+    
+    /**
+     * Determine whether any of the matched elements are assigned the given class.
+     *
+     * @param className The class name to search for.
+     */
+    hasClass(className: string): boolean;
+
+    /**
+     * Get the HTML contents of the first element in the set of matched elements.
+     */
+    html(): string;
+    /**
+     * Set the HTML contents of each element in the set of matched elements.
+     *
+     * @param htmlString A string of HTML to set as the content of each matched element.
+     */
+    html(htmlString: string): JQuery;
+    /**
+     * Set the HTML contents of each element in the set of matched elements.
+     *
+     * @param func A function returning the HTML content to set. Receives the index position of the element in the set and the old HTML value as arguments. jQuery empties the element before calling the function; use the oldhtml argument to reference the previous content. Within the function, this refers to the current element in the set.
+     */
+    html(func: (index: number, oldhtml: string) => string): JQuery;
+    /**
+     * Set the HTML contents of each element in the set of matched elements.
+     *
+     * @param func A function returning the HTML content to set. Receives the index position of the element in the set and the old HTML value as arguments. jQuery empties the element before calling the function; use the oldhtml argument to reference the previous content. Within the function, this refers to the current element in the set.
+     */
+
+    /**
+     * Get the value of a property for the first element in the set of matched elements.
+     *
+     * @param propertyName The name of the property to get.
+     */
+    prop(propertyName: string): any;
+    /**
+     * Set one or more properties for the set of matched elements.
+     *
+     * @param propertyName The name of the property to set.
+     * @param value A value to set for the property.
+     */
+    prop(propertyName: string, value: string|number|boolean): JQuery;
+    /**
+     * Set one or more properties for the set of matched elements.
+     *
+     * @param properties An object of property-value pairs to set.
+     */
+    prop(properties: Object): JQuery;
+    /**
+     * Set one or more properties for the set of matched elements.
+     *
+     * @param propertyName The name of the property to set.
+     * @param func A function returning the value to set. Receives the index position of the element in the set and the old property value as arguments. Within the function, the keyword this refers to the current element.
+     */
+    prop(propertyName: string, func: (index: number, oldPropertyValue: any) => any): JQuery;
+
+    /**
+     * Remove an attribute from each element in the set of matched elements.
+     *
+     * @param attributeName An attribute to remove; as of version 1.7, it can be a space-separated list of attributes.
+     */
+    removeAttr(attributeName: string): JQuery;
+
+    /**
+     * Remove a single class, multiple classes, or all classes from each element in the set of matched elements.
+     *
+     * @param className One or more space-separated classes to be removed from the class attribute of each matched element.
+     */
+    removeClass(className?: string): JQuery;
+    /**
+     * Remove a single class, multiple classes, or all classes from each element in the set of matched elements.
+     *
+     * @param function A function returning one or more space-separated class names to be removed. Receives the index position of the element in the set and the old class value as arguments.
+     */
+    removeClass(func: (index: number, className: string) => string): JQuery;
+
+    /**
+     * Remove a property for the set of matched elements.
+     *
+     * @param propertyName The name of the property to remove.
+     */
+    removeProp(propertyName: string): JQuery;
+
+    /**
+     * Add or remove one or more classes from each element in the set of matched elements, depending on either the class's presence or the value of the switch argument.
+     *
+     * @param className One or more class names (separated by spaces) to be toggled for each element in the matched set.
+     * @param swtch A Boolean (not just truthy/falsy) value to determine whether the class should be added or removed.
+     */
+    toggleClass(className: string, swtch?: boolean): JQuery;
+    /**
+     * Add or remove one or more classes from each element in the set of matched elements, depending on either the class's presence or the value of the switch argument.
+     *
+     * @param swtch A boolean value to determine whether the class should be added or removed.
+     */
+    toggleClass(swtch?: boolean): JQuery;
+    /**
+     * Add or remove one or more classes from each element in the set of matched elements, depending on either the class's presence or the value of the switch argument.
+     *
+     * @param func A function that returns class names to be toggled in the class attribute of each element in the matched set. Receives the index position of the element in the set, the old class value, and the switch as arguments.
+     * @param swtch A boolean value to determine whether the class should be added or removed.
+     */
+    toggleClass(func: (index: number, className: string, swtch: boolean) => string, swtch?: boolean): JQuery;
+
+    /**
+     * Get the current value of the first element in the set of matched elements.
+     */
+    val(): any;
+    /**
+     * Set the value of each element in the set of matched elements.
+     *
+     * @param value A string of text, an array of strings or number corresponding to the value of each matched element to set as selected/checked.
+     */
+    val(value: string|string[]|number): JQuery;
+    /**
+     * Set the value of each element in the set of matched elements.
+     *
+     * @param func A function returning the value to set. this is the current element. Receives the index position of the element in the set and the old value as arguments.
+     */
+    val(func: (index: number, value: string) => string): JQuery;
+
+
+    /**
+     * Get the value of style properties for the first element in the set of matched elements.
+     *
+     * @param propertyName A CSS property.
+     */
+    css(propertyName: string): string;
+    /**
+     * Set one or more CSS properties for the set of matched elements.
+     *
+     * @param propertyName A CSS property name.
+     * @param value A value to set for the property.
+     */
+    css(propertyName: string, value: string|number): JQuery;
+    /**
+     * Set one or more CSS properties for the set of matched elements.
+     *
+     * @param propertyName A CSS property name.
+     * @param value A function returning the value to set. this is the current element. Receives the index position of the element in the set and the old value as arguments.
+     */
+    css(propertyName: string, value: (index: number, value: string) => string|number): JQuery;
+    /**
+     * Set one or more CSS properties for the set of matched elements.
+     *
+     * @param properties An object of property-value pairs to set.
+     */
+    css(properties: Object): JQuery;
+
+    /**
+     * Get the current computed height for the first element in the set of matched elements.
+     */
+    height(): number;
+    /**
+     * Set the CSS height of every matched element.
+     *
+     * @param value An integer representing the number of pixels, or an integer with an optional unit of measure appended (as a string).
+     */
+    height(value: number|string): JQuery;
+    /**
+     * Set the CSS height of every matched element.
+     *
+     * @param func A function returning the height to set. Receives the index position of the element in the set and the old height as arguments. Within the function, this refers to the current element in the set.
+     */
+    height(func: (index: number, height: number) => number|string): JQuery;
+
+    /**
+     * Get the current computed height for the first element in the set of matched elements, including padding but not border.
+     */
+    innerHeight(): number;
+
+    /**
+     * Sets the inner height on elements in the set of matched elements, including padding but not border.
+     *
+     * @param value An integer representing the number of pixels, or an integer along with an optional unit of measure appended (as a string).
+     */
+    innerHeight(height: number|string): JQuery;
+    
+    /**
+     * Get the current computed width for the first element in the set of matched elements, including padding but not border.
+     */
+    innerWidth(): number;
+
+    /**
+     * Sets the inner width on elements in the set of matched elements, including padding but not border.
+     *
+     * @param value An integer representing the number of pixels, or an integer along with an optional unit of measure appended (as a string).
+     */
+    innerWidth(width: number|string): JQuery;
+    
+    /**
+     * Get the current coordinates of the first element in the set of matched elements, relative to the document.
+     */
+    offset(): JQueryCoordinates;
+    /**
+     * An object containing the properties top and left, which are integers indicating the new top and left coordinates for the elements.
+     *
+     * @param coordinates An object containing the properties top and left, which are integers indicating the new top and left coordinates for the elements.
+     */
+    offset(coordinates: JQueryCoordinates): JQuery;
+    /**
+     * An object containing the properties top and left, which are integers indicating the new top and left coordinates for the elements.
+     *
+     * @param func A function to return the coordinates to set. Receives the index of the element in the collection as the first argument and the current coordinates as the second argument. The function should return an object with the new top and left properties.
+     */
+    offset(func: (index: number, coords: JQueryCoordinates) => JQueryCoordinates): JQuery;
+
+    /**
+     * Get the current computed height for the first element in the set of matched elements, including padding, border, and optionally margin. Returns an integer (without "px") representation of the value or null if called on an empty set of elements.
+     *
+     * @param includeMargin A Boolean indicating whether to include the element's margin in the calculation.
+     */
+    outerHeight(includeMargin?: boolean): number;
+
+    /**
+     * Sets the outer height on elements in the set of matched elements, including padding and border.
+     *
+     * @param value An integer representing the number of pixels, or an integer along with an optional unit of measure appended (as a string).
+     */
+    outerHeight(height: number|string): JQuery;
+
+    /**
+     * Get the current computed width for the first element in the set of matched elements, including padding and border.
+     *
+     * @param includeMargin A Boolean indicating whether to include the element's margin in the calculation.
+     */
+    outerWidth(includeMargin?: boolean): number;
+
+    /**
+     * Sets the outer width on elements in the set of matched elements, including padding and border.
+     *
+     * @param value An integer representing the number of pixels, or an integer along with an optional unit of measure appended (as a string).
+     */
+    outerWidth(width: number|string): JQuery;
+
+    /**
+     * Get the current coordinates of the first element in the set of matched elements, relative to the offset parent.
+     */
+    position(): JQueryCoordinates;
+
+    /**
+     * Get the current horizontal position of the scroll bar for the first element in the set of matched elements or set the horizontal position of the scroll bar for every matched element.
+     */
+    scrollLeft(): number;
+    /**
+     * Set the current horizontal position of the scroll bar for each of the set of matched elements.
+     *
+     * @param value An integer indicating the new position to set the scroll bar to.
+     */
+    scrollLeft(value: number): JQuery;
+
+    /**
+     * Get the current vertical position of the scroll bar for the first element in the set of matched elements or set the vertical position of the scroll bar for every matched element.
+     */
+    scrollTop(): number;
+    /**
+     * Set the current vertical position of the scroll bar for each of the set of matched elements.
+     *
+     * @param value An integer indicating the new position to set the scroll bar to.
+     */
+    scrollTop(value: number): JQuery;
+
+    /**
+     * Get the current computed width for the first element in the set of matched elements.
+     */
+    width(): number;
+    /**
+     * Set the CSS width of each element in the set of matched elements.
+     *
+     * @param value An integer representing the number of pixels, or an integer along with an optional unit of measure appended (as a string).
+     */
+    width(value: number|string): JQuery;
+    /**
+     * Set the CSS width of each element in the set of matched elements.
+     *
+     * @param func A function returning the width to set. Receives the index position of the element in the set and the old width as arguments. Within the function, this refers to the current element in the set.
+     */
+    width(func: (index: number, width: number) => number|string): JQuery;
+
+    /**
+     * Remove from the queue all items that have not yet been run.
+     *
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     */
+    clearQueue(queueName?: string): JQuery;
+
+    /**
+     * Store arbitrary data associated with the matched elements.
+     *
+     * @param key A string naming the piece of data to set.
+     * @param value The new data value; it can be any Javascript type including Array or Object.
+     */
+    data(key: string, value: any): JQuery;
+    /**
+     * Return the value at the named data store for the first element in the jQuery collection, as set by data(name, value) or by an HTML5 data-* attribute.
+     *
+     * @param key Name of the data stored.
+     */
+    data(key: string): any;
+    /**
+     * Store arbitrary data associated with the matched elements.
+     *
+     * @param obj An object of key-value pairs of data to update.
+     */
+    data(obj: { [key: string]: any; }): JQuery;
+    /**
+     * Return the value at the named data store for the first element in the jQuery collection, as set by data(name, value) or by an HTML5 data-* attribute.
+     */
+    data(): any;
+
+    /**
+     * Execute the next function on the queue for the matched elements.
+     *
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     */
+    dequeue(queueName?: string): JQuery;
+
+    /**
+     * Remove a previously-stored piece of data.
+     *
+     * @param name A string naming the piece of data to delete or space-separated string naming the pieces of data to delete.
+     */
+    removeData(name: string): JQuery;
+    /**
+     * Remove a previously-stored piece of data.
+     *
+     * @param list An array of strings naming the pieces of data to delete.
+     */
+    removeData(list: string[]): JQuery;
+    /**
+     * Remove all previously-stored piece of data.
+     */
+    removeData(): JQuery;
+
+    /**
+     * Return a Promise object to observe when all actions of a certain type bound to the collection, queued or not, have finished.
+     *
+     * @param type The type of queue that needs to be observed. (default: fx)
+     * @param target Object onto which the promise methods have to be attached
+     */
+    promise(type?: string, target?: Object): JQueryPromise<any>;
+
+    /**
+     * Perform a custom animation of a set of CSS properties.
+     *
+     * @param properties An object of CSS properties and values that the animation will move toward.
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    animate(properties: Object, duration?: string|number, complete?: Function): JQuery;
+    /**
+     * Perform a custom animation of a set of CSS properties.
+     *
+     * @param properties An object of CSS properties and values that the animation will move toward.
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition. (default: swing)
+     * @param complete A function to call once the animation is complete.
+     */
+    animate(properties: Object, duration?: string|number, easing?: string, complete?: Function): JQuery;
+    /**
+     * Perform a custom animation of a set of CSS properties.
+     *
+     * @param properties An object of CSS properties and values that the animation will move toward.
+     * @param options A map of additional options to pass to the method.
+     */
+    animate(properties: Object, options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Set a timer to delay execution of subsequent items in the queue.
+     *
+     * @param duration An integer indicating the number of milliseconds to delay execution of the next item in the queue.
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     */
+    delay(duration: number, queueName?: string): JQuery;
+
+    /**
+     * Display the matched elements by fading them to opaque.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    fadeIn(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Display the matched elements by fading them to opaque.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    fadeIn(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Display the matched elements by fading them to opaque.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    fadeIn(options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Hide the matched elements by fading them to transparent.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    fadeOut(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Hide the matched elements by fading them to transparent.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    fadeOut(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Hide the matched elements by fading them to transparent.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    fadeOut(options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Adjust the opacity of the matched elements.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param opacity A number between 0 and 1 denoting the target opacity.
+     * @param complete A function to call once the animation is complete.
+     */
+    fadeTo(duration: string|number, opacity: number, complete?: Function): JQuery;
+    /**
+     * Adjust the opacity of the matched elements.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param opacity A number between 0 and 1 denoting the target opacity.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    fadeTo(duration: string|number, opacity: number, easing?: string, complete?: Function): JQuery;
+
+    /**
+     * Display or hide the matched elements by animating their opacity.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    fadeToggle(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Display or hide the matched elements by animating their opacity.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    fadeToggle(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Display or hide the matched elements by animating their opacity.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    fadeToggle(options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Stop the currently-running animation, remove all queued animations, and complete all animations for the matched elements.
+     *
+     * @param queue The name of the queue in which to stop animations.
+     */
+    finish(queue?: string): JQuery;
+
+    /**
+     * Hide the matched elements.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    hide(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Hide the matched elements.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    hide(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Hide the matched elements.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    hide(options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Display the matched elements.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    show(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Display the matched elements.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    show(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Display the matched elements.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    show(options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Display the matched elements with a sliding motion.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    slideDown(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Display the matched elements with a sliding motion.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    slideDown(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Display the matched elements with a sliding motion.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    slideDown(options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Display or hide the matched elements with a sliding motion.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    slideToggle(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Display or hide the matched elements with a sliding motion.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    slideToggle(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Display or hide the matched elements with a sliding motion.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    slideToggle(options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Hide the matched elements with a sliding motion.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    slideUp(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Hide the matched elements with a sliding motion.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    slideUp(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Hide the matched elements with a sliding motion.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    slideUp(options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Stop the currently-running animation on the matched elements.
+     *
+     * @param clearQueue A Boolean indicating whether to remove queued animation as well. Defaults to false.
+     * @param jumpToEnd A Boolean indicating whether to complete the current animation immediately. Defaults to false.
+     */
+    stop(clearQueue?: boolean, jumpToEnd?: boolean): JQuery;
+    /**
+     * Stop the currently-running animation on the matched elements.
+     *
+     * @param queue The name of the queue in which to stop animations.
+     * @param clearQueue A Boolean indicating whether to remove queued animation as well. Defaults to false.
+     * @param jumpToEnd A Boolean indicating whether to complete the current animation immediately. Defaults to false.
+     */
+    stop(queue?: string, clearQueue?: boolean, jumpToEnd?: boolean): JQuery;
+
+    /**
+     * Display or hide the matched elements.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    toggle(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Display or hide the matched elements.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    toggle(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Display or hide the matched elements.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    toggle(options: JQueryAnimationOptions): JQuery;
+    /**
+     * Display or hide the matched elements.
+     *
+     * @param showOrHide A Boolean indicating whether to show or hide the elements.
+     */
+    toggle(showOrHide: boolean): JQuery;
+
+    /**
+     * Attach a handler to an event for the elements.
+     * 
+     * @param eventType A string containing one or more DOM event types, such as "click" or "submit," or custom event names.
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    bind(eventType: string, eventData: any, handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Attach a handler to an event for the elements.
+     * 
+     * @param eventType A string containing one or more DOM event types, such as "click" or "submit," or custom event names.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    bind(eventType: string, handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Attach a handler to an event for the elements.
+     * 
+     * @param eventType A string containing one or more DOM event types, such as "click" or "submit," or custom event names.
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param preventBubble Setting the third argument to false will attach a function that prevents the default action from occurring and stops the event from bubbling. The default is true.
+     */
+    bind(eventType: string, eventData: any, preventBubble: boolean): JQuery;
+    /**
+     * Attach a handler to an event for the elements.
+     * 
+     * @param eventType A string containing one or more DOM event types, such as "click" or "submit," or custom event names.
+     * @param preventBubble Setting the third argument to false will attach a function that prevents the default action from occurring and stops the event from bubbling. The default is true.
+     */
+    bind(eventType: string, preventBubble: boolean): JQuery;
+    /**
+     * Attach a handler to an event for the elements.
+     * 
+     * @param events An object containing one or more DOM event types and functions to execute for them.
+     */
+    bind(events: any): JQuery;
+
+    /**
+     * Trigger the "blur" event on an element
+     */
+    blur(): JQuery;
+    /**
+     * Bind an event handler to the "blur" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    blur(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "blur" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    blur(eventData?: any, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "change" event on an element.
+     */
+    change(): JQuery;
+    /**
+     * Bind an event handler to the "change" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    change(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "change" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    change(eventData?: any, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "click" event on an element.
+     */
+    click(): JQuery;
+    /**
+     * Bind an event handler to the "click" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     */
+    click(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "click" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    click(eventData?: any, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "dblclick" event on an element.
+     */
+    dblclick(): JQuery;
+    /**
+     * Bind an event handler to the "dblclick" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    dblclick(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "dblclick" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    dblclick(eventData?: any, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+
+    delegate(selector: any, eventType: string, handler: (eventObject: JQueryEventObject) => any): JQuery;
+    delegate(selector: any, eventType: string, eventData: any, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "focus" event on an element.
+     */
+    focus(): JQuery;
+    /**
+     * Bind an event handler to the "focus" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    focus(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "focus" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    focus(eventData?: any, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "focusin" event on an element.
+     */
+    focusin(): JQuery;
+    /**
+     * Bind an event handler to the "focusin" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    focusin(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "focusin" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    focusin(eventData: Object, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "focusout" event on an element.
+     */
+    focusout(): JQuery;
+    /**
+     * Bind an event handler to the "focusout" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    focusout(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "focusout" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    focusout(eventData: Object, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Bind two handlers to the matched elements, to be executed when the mouse pointer enters and leaves the elements.
+     *
+     * @param handlerIn A function to execute when the mouse pointer enters the element.
+     * @param handlerOut A function to execute when the mouse pointer leaves the element.
+     */
+    hover(handlerIn: (eventObject: JQueryEventObject) => any, handlerOut: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind a single handler to the matched elements, to be executed when the mouse pointer enters or leaves the elements.
+     *
+     * @param handlerInOut A function to execute when the mouse pointer enters or leaves the element.
+     */
+    hover(handlerInOut: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "keydown" event on an element.
+     */
+    keydown(): JQuery;
+    /**
+     * Bind an event handler to the "keydown" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    keydown(handler: (eventObject: JQueryKeyEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "keydown" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    keydown(eventData?: any, handler?: (eventObject: JQueryKeyEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "keypress" event on an element.
+     */
+    keypress(): JQuery;
+    /**
+     * Bind an event handler to the "keypress" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    keypress(handler: (eventObject: JQueryKeyEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "keypress" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    keypress(eventData?: any, handler?: (eventObject: JQueryKeyEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "keyup" event on an element.
+     */
+    keyup(): JQuery;
+    /**
+     * Bind an event handler to the "keyup" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    keyup(handler: (eventObject: JQueryKeyEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "keyup" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    keyup(eventData?: any, handler?: (eventObject: JQueryKeyEventObject) => any): JQuery;
+
+    /**
+     * Bind an event handler to the "load" JavaScript event.
+     *
+     * @param handler A function to execute when the event is triggered.
+     */
+    load(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "load" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    load(eventData?: any, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "mousedown" event on an element.
+     */
+    mousedown(): JQuery;
+    /**
+     * Bind an event handler to the "mousedown" JavaScript event.
+     *
+     * @param handler A function to execute when the event is triggered.
+     */
+    mousedown(handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "mousedown" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    mousedown(eventData: Object, handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "mouseenter" event on an element.
+     */
+    mouseenter(): JQuery;
+    /**
+     * Bind an event handler to be fired when the mouse enters an element.
+     *
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseenter(handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to be fired when the mouse enters an element.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseenter(eventData: Object, handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "mouseleave" event on an element.
+     */
+    mouseleave(): JQuery;
+    /**
+     * Bind an event handler to be fired when the mouse leaves an element.
+     *
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseleave(handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to be fired when the mouse leaves an element.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseleave(eventData: Object, handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "mousemove" event on an element.
+     */
+    mousemove(): JQuery;
+    /**
+     * Bind an event handler to the "mousemove" JavaScript event.
+     *
+     * @param handler A function to execute when the event is triggered.
+     */
+    mousemove(handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "mousemove" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    mousemove(eventData: Object, handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "mouseout" event on an element.
+     */
+    mouseout(): JQuery;
+    /**
+     * Bind an event handler to the "mouseout" JavaScript event.
+     *
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseout(handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "mouseout" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseout(eventData: Object, handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "mouseover" event on an element.
+     */
+    mouseover(): JQuery;
+    /**
+     * Bind an event handler to the "mouseover" JavaScript event.
+     *
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseover(handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "mouseover" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseover(eventData: Object, handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "mouseup" event on an element.
+     */
+    mouseup(): JQuery;
+    /**
+     * Bind an event handler to the "mouseup" JavaScript event.
+     *
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseup(handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "mouseup" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseup(eventData: Object, handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+
+    /**
+     * Remove an event handler.
+     */
+    off(): JQuery;
+    /**
+     * Remove an event handler.
+     *
+     * @param events One or more space-separated event types and optional namespaces, or just namespaces, such as "click", "keydown.myPlugin", or ".myPlugin".
+     * @param selector A selector which should match the one originally passed to .on() when attaching event handlers.
+     * @param handler A handler function previously attached for the event(s), or the special value false.
+     */
+    off(events: string, selector?: string, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Remove an event handler.
+     *
+     * @param events One or more space-separated event types and optional namespaces, or just namespaces, such as "click", "keydown.myPlugin", or ".myPlugin".
+     * @param handler A handler function previously attached for the event(s), or the special value false. Takes handler with extra args that can be attached with on().
+     */
+    off(events: string, handler: (eventObject: JQueryEventObject, ...args: any[]) => any): JQuery;
+    /**
+     * Remove an event handler.
+     *
+     * @param events One or more space-separated event types and optional namespaces, or just namespaces, such as "click", "keydown.myPlugin", or ".myPlugin".
+     * @param handler A handler function previously attached for the event(s), or the special value false.
+     */
+    off(events: string, handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Remove an event handler.
+     *
+     * @param events An object where the string keys represent one or more space-separated event types and optional namespaces, and the values represent handler functions previously attached for the event(s).
+     * @param selector A selector which should match the one originally passed to .on() when attaching event handlers.
+     */
+    off(events: { [key: string]: any; }, selector?: string): JQuery;
+
+    /**
+     * Attach an event handler function for one or more events to the selected elements.
+     *
+     * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin".
+     * @param handler A function to execute when the event is triggered. The value false is also allowed as a shorthand for a function that simply does return false. Rest parameter args is for optional parameters passed to jQuery.trigger(). Note that the actual parameters on the event handler function must be marked as optional (? syntax).
+     */
+    on(events: string, handler: (eventObject: JQueryEventObject, ...args: any[]) => any): JQuery;
+    /**
+     * Attach an event handler function for one or more events to the selected elements.
+     *
+     * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin".
+     * @param data Data to be passed to the handler in event.data when an event is triggered.
+     * @param handler A function to execute when the event is triggered. The value false is also allowed as a shorthand for a function that simply does return false.
+    */
+    on(events: string, data : any, handler: (eventObject: JQueryEventObject, ...args: any[]) => any): JQuery;
+    /**
+     * Attach an event handler function for one or more events to the selected elements.
+     *
+     * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin".
+     * @param selector A selector string to filter the descendants of the selected elements that trigger the event. If the selector is null or omitted, the event is always triggered when it reaches the selected element.
+     * @param handler A function to execute when the event is triggered. The value false is also allowed as a shorthand for a function that simply does return false.
+     */
+    on(events: string, selector: string, handler: (eventObject: JQueryEventObject, ...eventData: any[]) => any): JQuery;
+    /**
+     * Attach an event handler function for one or more events to the selected elements.
+     *
+     * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin".
+     * @param selector A selector string to filter the descendants of the selected elements that trigger the event. If the selector is null or omitted, the event is always triggered when it reaches the selected element.
+     * @param data Data to be passed to the handler in event.data when an event is triggered.
+     * @param handler A function to execute when the event is triggered. The value false is also allowed as a shorthand for a function that simply does return false.
+     */
+    on(events: string, selector: string, data: any, handler: (eventObject: JQueryEventObject, ...eventData: any[]) => any): JQuery;
+    /**
+     * Attach an event handler function for one or more events to the selected elements.
+     *
+     * @param events An object in which the string keys represent one or more space-separated event types and optional namespaces, and the values represent a handler function to be called for the event(s).
+     * @param selector A selector string to filter the descendants of the selected elements that will call the handler. If the selector is null or omitted, the handler is always called when it reaches the selected element.
+     * @param data Data to be passed to the handler in event.data when an event occurs.
+     */
+    on(events: { [key: string]: any; }, selector?: string, data?: any): JQuery;
+    /**
+     * Attach an event handler function for one or more events to the selected elements.
+     *
+     * @param events An object in which the string keys represent one or more space-separated event types and optional namespaces, and the values represent a handler function to be called for the event(s).
+     * @param data Data to be passed to the handler in event.data when an event occurs.
+     */
+    on(events: { [key: string]: any; }, data?: any): JQuery;
+
+    /**
+     * Attach a handler to an event for the elements. The handler is executed at most once per element per event type.
+     *
+     * @param events A string containing one or more JavaScript event types, such as "click" or "submit," or custom event names.
+     * @param handler A function to execute at the time the event is triggered.
+     */
+    one(events: string, handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Attach a handler to an event for the elements. The handler is executed at most once per element per event type.
+     *
+     * @param events A string containing one or more JavaScript event types, such as "click" or "submit," or custom event names.
+     * @param data An object containing data that will be passed to the event handler.
+     * @param handler A function to execute at the time the event is triggered.
+     */
+    one(events: string, data: Object, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Attach a handler to an event for the elements. The handler is executed at most once per element per event type.
+     *
+     * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin".
+     * @param selector A selector string to filter the descendants of the selected elements that trigger the event. If the selector is null or omitted, the event is always triggered when it reaches the selected element.
+     * @param handler A function to execute when the event is triggered. The value false is also allowed as a shorthand for a function that simply does return false.
+     */
+    one(events: string, selector: string, handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Attach a handler to an event for the elements. The handler is executed at most once per element per event type.
+     *
+     * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin".
+     * @param selector A selector string to filter the descendants of the selected elements that trigger the event. If the selector is null or omitted, the event is always triggered when it reaches the selected element.
+     * @param data Data to be passed to the handler in event.data when an event is triggered.
+     * @param handler A function to execute when the event is triggered. The value false is also allowed as a shorthand for a function that simply does return false.
+     */
+    one(events: string, selector: string, data: any, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Attach a handler to an event for the elements. The handler is executed at most once per element per event type.
+     *
+     * @param events An object in which the string keys represent one or more space-separated event types and optional namespaces, and the values represent a handler function to be called for the event(s).
+     * @param selector A selector string to filter the descendants of the selected elements that will call the handler. If the selector is null or omitted, the handler is always called when it reaches the selected element.
+     * @param data Data to be passed to the handler in event.data when an event occurs.
+     */
+    one(events: { [key: string]: any; }, selector?: string, data?: any): JQuery;
+
+    /**
+     * Attach a handler to an event for the elements. The handler is executed at most once per element per event type.
+     *
+     * @param events An object in which the string keys represent one or more space-separated event types and optional namespaces, and the values represent a handler function to be called for the event(s).
+     * @param data Data to be passed to the handler in event.data when an event occurs.
+     */
+    one(events: { [key: string]: any; }, data?: any): JQuery;
+
+
+    /**
+     * Specify a function to execute when the DOM is fully loaded.
+     *
+     * @param handler A function to execute after the DOM is ready.
+     */
+    ready(handler: (jQueryAlias?: JQueryStatic) => any): JQuery;
+
+    /**
+     * Trigger the "resize" event on an element.
+     */
+    resize(): JQuery;
+    /**
+     * Bind an event handler to the "resize" JavaScript event.
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    resize(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "resize" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    resize(eventData: Object, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "scroll" event on an element.
+     */
+    scroll(): JQuery;
+    /**
+     * Bind an event handler to the "scroll" JavaScript event.
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    scroll(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "scroll" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    scroll(eventData: Object, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "select" event on an element.
+     */
+    select(): JQuery;
+    /**
+     * Bind an event handler to the "select" JavaScript event.
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    select(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "select" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    select(eventData: Object, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "submit" event on an element.
+     */
+    submit(): JQuery;
+    /**
+     * Bind an event handler to the "submit" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    submit(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "submit" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    submit(eventData?: any, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Execute all handlers and behaviors attached to the matched elements for the given event type.
+     * 
+     * @param eventType A string containing a JavaScript event type, such as click or submit.
+     * @param extraParameters Additional parameters to pass along to the event handler.
+     */
+    trigger(eventType: string, extraParameters?: any[]|Object): JQuery;
+    /**
+     * Execute all handlers and behaviors attached to the matched elements for the given event type.
+     * 
+     * @param event A jQuery.Event object.
+     * @param extraParameters Additional parameters to pass along to the event handler.
+     */
+    trigger(event: JQueryEventObject, extraParameters?: any[]|Object): JQuery;
+
+    /**
+     * Execute all handlers attached to an element for an event.
+     * 
+     * @param eventType A string containing a JavaScript event type, such as click or submit.
+     * @param extraParameters An array of additional parameters to pass along to the event handler.
+     */
+    triggerHandler(eventType: string, ...extraParameters: any[]): Object;
+
+    /**
+     * Execute all handlers attached to an element for an event.
+     * 
+     * @param event A jQuery.Event object.
+     * @param extraParameters An array of additional parameters to pass along to the event handler.
+     */
+    triggerHandler(event: JQueryEventObject, ...extraParameters: any[]): Object;
+
+    /**
+     * Remove a previously-attached event handler from the elements.
+     * 
+     * @param eventType A string containing a JavaScript event type, such as click or submit.
+     * @param handler The function that is to be no longer executed.
+     */
+    unbind(eventType?: string, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Remove a previously-attached event handler from the elements.
+     * 
+     * @param eventType A string containing a JavaScript event type, such as click or submit.
+     * @param fls Unbinds the corresponding 'return false' function that was bound using .bind( eventType, false ).
+     */
+    unbind(eventType: string, fls: boolean): JQuery;
+    /**
+     * Remove a previously-attached event handler from the elements.
+     * 
+     * @param evt A JavaScript event object as passed to an event handler.
+     */
+    unbind(evt: any): JQuery;
+
+    /**
+     * Remove a handler from the event for all elements which match the current selector, based upon a specific set of root elements.
+     */
+    undelegate(): JQuery;
+    /**
+     * Remove a handler from the event for all elements which match the current selector, based upon a specific set of root elements.
+     * 
+     * @param selector A selector which will be used to filter the event results.
+     * @param eventType A string containing a JavaScript event type, such as "click" or "keydown"
+     * @param handler A function to execute at the time the event is triggered.
+     */
+    undelegate(selector: string, eventType: string, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Remove a handler from the event for all elements which match the current selector, based upon a specific set of root elements.
+     * 
+     * @param selector A selector which will be used to filter the event results.
+     * @param events An object of one or more event types and previously bound functions to unbind from them.
+     */
+    undelegate(selector: string, events: Object): JQuery;
+    /**
+     * Remove a handler from the event for all elements which match the current selector, based upon a specific set of root elements.
+     * 
+     * @param namespace A string containing a namespace to unbind all events from.
+     */
+    undelegate(namespace: string): JQuery;
+
+    /**
+     * Bind an event handler to the "unload" JavaScript event. (DEPRECATED from v1.8)
+     * 
+     * @param handler A function to execute when the event is triggered.
+     */
+    unload(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "unload" JavaScript event. (DEPRECATED from v1.8)
+     * 
+     * @param eventData A plain object of data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    unload(eventData?: any, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * The DOM node context originally passed to jQuery(); if none was passed then context will likely be the document. (DEPRECATED from v1.10)
+     */
+    context: Element;
+
+    jquery: string;
+
+    /**
+     * Bind an event handler to the "error" JavaScript event. (DEPRECATED from v1.8)
+     * 
+     * @param handler A function to execute when the event is triggered.
+     */
+    error(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "error" JavaScript event. (DEPRECATED from v1.8)
+     * 
+     * @param eventData A plain object of data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    error(eventData: any, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Add a collection of DOM elements onto the jQuery stack.
+     * 
+     * @param elements An array of elements to push onto the stack and make into a new jQuery object.
+     */
+    pushStack(elements: any[]): JQuery;
+    /**
+     * Add a collection of DOM elements onto the jQuery stack.
+     * 
+     * @param elements An array of elements to push onto the stack and make into a new jQuery object.
+     * @param name The name of a jQuery method that generated the array of elements.
+     * @param arguments The arguments that were passed in to the jQuery method (for serialization).
+     */
+    pushStack(elements: any[], name: string, arguments: any[]): JQuery;
+
+    /**
+     * Insert content, specified by the parameter, after each element in the set of matched elements.
+     * 
+     * param content1 HTML string, DOM element, array of elements, or jQuery object to insert after each element in the set of matched elements.
+     * param content2 One or more additional DOM elements, arrays of elements, HTML strings, or jQuery objects to insert after each element in the set of matched elements.
+     */
+    after(content1: JQuery|any[]|Element|Text|string, ...content2: any[]): JQuery;
+    /**
+     * Insert content, specified by the parameter, after each element in the set of matched elements.
+     * 
+     * param func A function that returns an HTML string, DOM element(s), or jQuery object to insert after each element in the set of matched elements. Receives the index position of the element in the set as an argument. Within the function, this refers to the current element in the set.
+     */
+    after(func: (index: number, html: string) => string|Element|JQuery): JQuery;
+
+    /**
+     * Insert content, specified by the parameter, to the end of each element in the set of matched elements.
+     * 
+     * param content1 DOM element, array of elements, HTML string, or jQuery object to insert at the end of each element in the set of matched elements.
+     * param content2 One or more additional DOM elements, arrays of elements, HTML strings, or jQuery objects to insert at the end of each element in the set of matched elements.
+     */
+    append(content1: JQuery|any[]|Element|Text|string, ...content2: any[]): JQuery;
+    /**
+     * Insert content, specified by the parameter, to the end of each element in the set of matched elements.
+     * 
+     * param func A function that returns an HTML string, DOM element(s), or jQuery object to insert at the end of each element in the set of matched elements. Receives the index position of the element in the set and the old HTML value of the element as arguments. Within the function, this refers to the current element in the set.
+     */
+    append(func: (index: number, html: string) => string|Element|JQuery): JQuery;
+
+    /**
+     * Insert every element in the set of matched elements to the end of the target.
+     * 
+     * @param target A selector, element, HTML string, array of elements, or jQuery object; the matched set of elements will be inserted at the end of the element(s) specified by this parameter.
+     */
+    appendTo(target: JQuery|any[]|Element|string): JQuery;
+
+    /**
+     * Insert content, specified by the parameter, before each element in the set of matched elements.
+     * 
+     * param content1 HTML string, DOM element, array of elements, or jQuery object to insert before each element in the set of matched elements.
+     * param content2 One or more additional DOM elements, arrays of elements, HTML strings, or jQuery objects to insert before each element in the set of matched elements.
+     */
+    before(content1: JQuery|any[]|Element|Text|string, ...content2: any[]): JQuery;
+    /**
+     * Insert content, specified by the parameter, before each element in the set of matched elements.
+     * 
+     * param func A function that returns an HTML string, DOM element(s), or jQuery object to insert before each element in the set of matched elements. Receives the index position of the element in the set as an argument. Within the function, this refers to the current element in the set.
+     */
+    before(func: (index: number, html: string) => string|Element|JQuery): JQuery;
+
+    /**
+     * Create a deep copy of the set of matched elements.
+     * 
+     * param withDataAndEvents A Boolean indicating whether event handlers and data should be copied along with the elements. The default value is false.
+     * param deepWithDataAndEvents A Boolean indicating whether event handlers and data for all children of the cloned element should be copied. By default its value matches the first argument's value (which defaults to false).
+     */
+    clone(withDataAndEvents?: boolean, deepWithDataAndEvents?: boolean): JQuery;
+
+    /**
+     * Remove the set of matched elements from the DOM.
+     * 
+     * param selector A selector expression that filters the set of matched elements to be removed.
+     */
+    detach(selector?: string): JQuery;
+
+    /**
+     * Remove all child nodes of the set of matched elements from the DOM.
+     */
+    empty(): JQuery;
+
+    /**
+     * Insert every element in the set of matched elements after the target.
+     * 
+     * param target A selector, element, array of elements, HTML string, or jQuery object; the matched set of elements will be inserted after the element(s) specified by this parameter.
+     */
+    insertAfter(target: JQuery|any[]|Element|Text|string): JQuery;
+
+    /**
+     * Insert every element in the set of matched elements before the target.
+     * 
+     * param target A selector, element, array of elements, HTML string, or jQuery object; the matched set of elements will be inserted before the element(s) specified by this parameter.
+     */
+    insertBefore(target: JQuery|any[]|Element|Text|string): JQuery;
+
+    /**
+     * Insert content, specified by the parameter, to the beginning of each element in the set of matched elements.
+     * 
+     * param content1 DOM element, array of elements, HTML string, or jQuery object to insert at the beginning of each element in the set of matched elements.
+     * param content2 One or more additional DOM elements, arrays of elements, HTML strings, or jQuery objects to insert at the beginning of each element in the set of matched elements.
+     */
+    prepend(content1: JQuery|any[]|Element|Text|string, ...content2: any[]): JQuery;
+    /**
+     * Insert content, specified by the parameter, to the beginning of each element in the set of matched elements.
+     * 
+     * param func A function that returns an HTML string, DOM element(s), or jQuery object to insert at the beginning of each element in the set of matched elements. Receives the index position of the element in the set and the old HTML value of the element as arguments. Within the function, this refers to the current element in the set.
+     */
+    prepend(func: (index: number, html: string) => string|Element|JQuery): JQuery;
+
+    /**
+     * Insert every element in the set of matched elements to the beginning of the target.
+     * 
+     * @param target A selector, element, HTML string, array of elements, or jQuery object; the matched set of elements will be inserted at the beginning of the element(s) specified by this parameter.
+     */
+    prependTo(target: JQuery|any[]|Element|string): JQuery;
+
+    /**
+     * Remove the set of matched elements from the DOM.
+     * 
+     * @param selector A selector expression that filters the set of matched elements to be removed.
+     */
+    remove(selector?: string): JQuery;
+
+    /**
+     * Replace each target element with the set of matched elements.
+     * 
+     * @param target A selector string, jQuery object, DOM element, or array of elements indicating which element(s) to replace.
+     */
+    replaceAll(target: JQuery|any[]|Element|string): JQuery;
+
+    /**
+     * Replace each element in the set of matched elements with the provided new content and return the set of elements that was removed.
+     * 
+     * param newContent The content to insert. May be an HTML string, DOM element, array of DOM elements, or jQuery object.
+     */
+    replaceWith(newContent: JQuery|any[]|Element|Text|string): JQuery;
+    /**
+     * Replace each element in the set of matched elements with the provided new content and return the set of elements that was removed.
+     * 
+     * param func A function that returns content with which to replace the set of matched elements.
+     */
+    replaceWith(func: () => Element|JQuery): JQuery;
+
+    /**
+     * Get the combined text contents of each element in the set of matched elements, including their descendants.
+     */
+    text(): string;
+    /**
+     * Set the content of each element in the set of matched elements to the specified text.
+     * 
+     * @param text The text to set as the content of each matched element. When Number or Boolean is supplied, it will be converted to a String representation.
+     */
+    text(text: string|number|boolean): JQuery;
+    /**
+     * Set the content of each element in the set of matched elements to the specified text.
+     * 
+     * @param func A function returning the text content to set. Receives the index position of the element in the set and the old text value as arguments.
+     */
+    text(func: (index: number, text: string) => string): JQuery;
+
+    /**
+     * Retrieve all the elements contained in the jQuery set, as an array.
+     */
+    toArray(): any[];
+
+    /**
+     * Remove the parents of the set of matched elements from the DOM, leaving the matched elements in their place.
+     */
+    unwrap(): JQuery;
+
+    /**
+     * Wrap an HTML structure around each element in the set of matched elements.
+     * 
+     * @param wrappingElement A selector, element, HTML string, or jQuery object specifying the structure to wrap around the matched elements.
+     */
+    wrap(wrappingElement: JQuery|Element|string): JQuery;
+    /**
+     * Wrap an HTML structure around each element in the set of matched elements.
+     * 
+     * @param func A callback function returning the HTML content or jQuery object to wrap around the matched elements. Receives the index position of the element in the set as an argument. Within the function, this refers to the current element in the set.
+     */
+    wrap(func: (index: number) => string|JQuery): JQuery;
+
+    /**
+     * Wrap an HTML structure around all elements in the set of matched elements.
+     * 
+     * @param wrappingElement A selector, element, HTML string, or jQuery object specifying the structure to wrap around the matched elements.
+     */
+    wrapAll(wrappingElement: JQuery|Element|string): JQuery;
+    wrapAll(func: (index: number) => string): JQuery;
+
+    /**
+     * Wrap an HTML structure around the content of each element in the set of matched elements.
+     * 
+     * @param wrappingElement An HTML snippet, selector expression, jQuery object, or DOM element specifying the structure to wrap around the content of the matched elements.
+     */
+    wrapInner(wrappingElement: JQuery|Element|string): JQuery;
+    /**
+     * Wrap an HTML structure around the content of each element in the set of matched elements.
+     * 
+     * @param func A callback function which generates a structure to wrap around the content of the matched elements. Receives the index position of the element in the set as an argument. Within the function, this refers to the current element in the set.
+     */
+    wrapInner(func: (index: number) => string): JQuery;
+
+    /**
+     * Iterate over a jQuery object, executing a function for each matched element.
+     * 
+     * @param func A function to execute for each matched element.
+     */
+    each(func: (index: number, elem: Element) => any): JQuery;
+
+    /**
+     * Retrieve one of the elements matched by the jQuery object.
+     * 
+     * @param index A zero-based integer indicating which element to retrieve.
+     */
+    get(index: number): HTMLElement;
+    /**
+     * Retrieve the elements matched by the jQuery object.
+     */
+    get(): any[];
+
+    /**
+     * Search for a given element from among the matched elements.
+     */
+    index(): number;
+    /**
+     * Search for a given element from among the matched elements.
+     * 
+     * @param selector A selector representing a jQuery collection in which to look for an element.
+     */
+    index(selector: string|JQuery|Element): number;
+
+    /**
+     * The number of elements in the jQuery object.
+     */
+    length: number;
+    /**
+     * A selector representing selector passed to jQuery(), if any, when creating the original set.
+     * version deprecated: 1.7, removed: 1.9
+     */
+    selector: string;
+    [index: string]: any;
+    [index: number]: HTMLElement;
+
+    /**
+     * Add elements to the set of matched elements.
+     * 
+     * @param selector A string representing a selector expression to find additional elements to add to the set of matched elements.
+     * @param context The point in the document at which the selector should begin matching; similar to the context argument of the $(selector, context) method.
+     */
+    add(selector: string, context?: Element): JQuery;
+    /**
+     * Add elements to the set of matched elements.
+     * 
+     * @param elements One or more elements to add to the set of matched elements.
+     */
+    add(...elements: Element[]): JQuery;
+    /**
+     * Add elements to the set of matched elements.
+     * 
+     * @param html An HTML fragment to add to the set of matched elements.
+     */
+    add(html: string): JQuery;
+    /**
+     * Add elements to the set of matched elements.
+     * 
+     * @param obj An existing jQuery object to add to the set of matched elements.
+     */
+    add(obj: JQuery): JQuery;
+
+    /**
+     * Get the children of each element in the set of matched elements, optionally filtered by a selector.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    children(selector?: string): JQuery;
+
+    /**
+     * For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    closest(selector: string): JQuery;
+    /**
+     * For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     * @param context A DOM element within which a matching element may be found. If no context is passed in then the context of the jQuery set will be used instead.
+     */
+    closest(selector: string, context?: Element): JQuery;
+    /**
+     * For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.
+     * 
+     * @param obj A jQuery object to match elements against.
+     */
+    closest(obj: JQuery): JQuery;
+    /**
+     * For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.
+     * 
+     * @param element An element to match elements against.
+     */
+    closest(element: Element): JQuery;
+
+    /**
+     * Get an array of all the elements and selectors matched against the current element up through the DOM tree.
+     * 
+     * @param selectors An array or string containing a selector expression to match elements against (can also be a jQuery object).
+     * @param context A DOM element within which a matching element may be found. If no context is passed in then the context of the jQuery set will be used instead.
+     */
+    closest(selectors: any, context?: Element): any[];
+
+    /**
+     * Get the children of each element in the set of matched elements, including text and comment nodes.
+     */
+    contents(): JQuery;
+
+    /**
+     * End the most recent filtering operation in the current chain and return the set of matched elements to its previous state.
+     */
+    end(): JQuery;
+
+    /**
+     * Reduce the set of matched elements to the one at the specified index.
+     * 
+     * @param index An integer indicating the 0-based position of the element. OR An integer indicating the position of the element, counting backwards from the last element in the set.
+     *  
+     */
+    eq(index: number): JQuery;
+
+    /**
+     * Reduce the set of matched elements to those that match the selector or pass the function's test.
+     * 
+     * @param selector A string containing a selector expression to match the current set of elements against.
+     */
+    filter(selector: string): JQuery;
+    /**
+     * Reduce the set of matched elements to those that match the selector or pass the function's test.
+     * 
+     * @param func A function used as a test for each element in the set. this is the current DOM element.
+     */
+    filter(func: (index: number, element: Element) => any): JQuery;
+    /**
+     * Reduce the set of matched elements to those that match the selector or pass the function's test.
+     * 
+     * @param element An element to match the current set of elements against.
+     */
+    filter(element: Element): JQuery;
+    /**
+     * Reduce the set of matched elements to those that match the selector or pass the function's test.
+     * 
+     * @param obj An existing jQuery object to match the current set of elements against.
+     */
+    filter(obj: JQuery): JQuery;
+
+    /**
+     * Get the descendants of each element in the current set of matched elements, filtered by a selector, jQuery object, or element.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    find(selector: string): JQuery;
+    /**
+     * Get the descendants of each element in the current set of matched elements, filtered by a selector, jQuery object, or element.
+     * 
+     * @param element An element to match elements against.
+     */
+    find(element: Element): JQuery;
+    /**
+     * Get the descendants of each element in the current set of matched elements, filtered by a selector, jQuery object, or element.
+     * 
+     * @param obj A jQuery object to match elements against.
+     */
+    find(obj: JQuery): JQuery;
+
+    /**
+     * Reduce the set of matched elements to the first in the set.
+     */
+    first(): JQuery;
+
+    /**
+     * Reduce the set of matched elements to those that have a descendant that matches the selector or DOM element.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    has(selector: string): JQuery;
+    /**
+     * Reduce the set of matched elements to those that have a descendant that matches the selector or DOM element.
+     * 
+     * @param contained A DOM element to match elements against.
+     */
+    has(contained: Element): JQuery;
+
+    /**
+     * Check the current matched set of elements against a selector, element, or jQuery object and return true if at least one of these elements matches the given arguments.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    is(selector: string): boolean;
+    /**
+     * Check the current matched set of elements against a selector, element, or jQuery object and return true if at least one of these elements matches the given arguments.
+     * 
+     * @param func A function used as a test for the set of elements. It accepts one argument, index, which is the element's index in the jQuery collection.Within the function, this refers to the current DOM element.
+     */
+    is(func: (index: number, element: Element) => boolean): boolean;
+    /**
+     * Check the current matched set of elements against a selector, element, or jQuery object and return true if at least one of these elements matches the given arguments.
+     * 
+     * @param obj An existing jQuery object to match the current set of elements against.
+     */
+    is(obj: JQuery): boolean;
+    /**
+     * Check the current matched set of elements against a selector, element, or jQuery object and return true if at least one of these elements matches the given arguments.
+     * 
+     * @param elements One or more elements to match the current set of elements against.
+     */
+    is(elements: any): boolean;
+
+    /**
+     * Reduce the set of matched elements to the final one in the set.
+     */
+    last(): JQuery;
+
+    /**
+     * Pass each element in the current matched set through a function, producing a new jQuery object containing the return values.
+     * 
+     * @param callback A function object that will be invoked for each element in the current set.
+     */
+    map(callback: (index: number, domElement: Element) => any): JQuery;
+
+    /**
+     * Get the immediately following sibling of each element in the set of matched elements. If a selector is provided, it retrieves the next sibling only if it matches that selector.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    next(selector?: string): JQuery;
+
+    /**
+     * Get all following siblings of each element in the set of matched elements, optionally filtered by a selector.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    nextAll(selector?: string): JQuery;
+
+    /**
+     * Get all following siblings of each element up to but not including the element matched by the selector, DOM node, or jQuery object passed.
+     * 
+     * @param selector A string containing a selector expression to indicate where to stop matching following sibling elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    nextUntil(selector?: string, filter?: string): JQuery;
+    /**
+     * Get all following siblings of each element up to but not including the element matched by the selector, DOM node, or jQuery object passed.
+     * 
+     * @param element A DOM node or jQuery object indicating where to stop matching following sibling elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    nextUntil(element?: Element, filter?: string): JQuery;
+    /**
+     * Get all following siblings of each element up to but not including the element matched by the selector, DOM node, or jQuery object passed.
+     * 
+     * @param obj A DOM node or jQuery object indicating where to stop matching following sibling elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    nextUntil(obj?: JQuery, filter?: string): JQuery;
+
+    /**
+     * Remove elements from the set of matched elements.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    not(selector: string): JQuery;
+    /**
+     * Remove elements from the set of matched elements.
+     * 
+     * @param func A function used as a test for each element in the set. this is the current DOM element.
+     */
+    not(func: (index: number, element: Element) => boolean): JQuery;
+    /**
+     * Remove elements from the set of matched elements.
+     * 
+     * @param elements One or more DOM elements to remove from the matched set.
+     */
+    not(elements: Element|Element[]): JQuery;
+    /**
+     * Remove elements from the set of matched elements.
+     * 
+     * @param obj An existing jQuery object to match the current set of elements against.
+     */
+    not(obj: JQuery): JQuery;
+
+    /**
+     * Get the closest ancestor element that is positioned.
+     */
+    offsetParent(): JQuery;
+
+    /**
+     * Get the parent of each element in the current set of matched elements, optionally filtered by a selector.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    parent(selector?: string): JQuery;
+
+    /**
+     * Get the ancestors of each element in the current set of matched elements, optionally filtered by a selector.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    parents(selector?: string): JQuery;
+
+    /**
+     * Get the ancestors of each element in the current set of matched elements, up to but not including the element matched by the selector, DOM node, or jQuery object.
+     * 
+     * @param selector A string containing a selector expression to indicate where to stop matching ancestor elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    parentsUntil(selector?: string, filter?: string): JQuery;
+    /**
+     * Get the ancestors of each element in the current set of matched elements, up to but not including the element matched by the selector, DOM node, or jQuery object.
+     * 
+     * @param element A DOM node or jQuery object indicating where to stop matching ancestor elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    parentsUntil(element?: Element, filter?: string): JQuery;
+    /**
+     * Get the ancestors of each element in the current set of matched elements, up to but not including the element matched by the selector, DOM node, or jQuery object.
+     * 
+     * @param obj A DOM node or jQuery object indicating where to stop matching ancestor elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    parentsUntil(obj?: JQuery, filter?: string): JQuery;
+
+    /**
+     * Get the immediately preceding sibling of each element in the set of matched elements, optionally filtered by a selector.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    prev(selector?: string): JQuery;
+
+    /**
+     * Get all preceding siblings of each element in the set of matched elements, optionally filtered by a selector.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    prevAll(selector?: string): JQuery;
+
+    /**
+     * Get all preceding siblings of each element up to but not including the element matched by the selector, DOM node, or jQuery object.
+     * 
+     * @param selector A string containing a selector expression to indicate where to stop matching preceding sibling elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    prevUntil(selector?: string, filter?: string): JQuery;
+    /**
+     * Get all preceding siblings of each element up to but not including the element matched by the selector, DOM node, or jQuery object.
+     * 
+     * @param element A DOM node or jQuery object indicating where to stop matching preceding sibling elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    prevUntil(element?: Element, filter?: string): JQuery;
+    /**
+     * Get all preceding siblings of each element up to but not including the element matched by the selector, DOM node, or jQuery object.
+     * 
+     * @param obj A DOM node or jQuery object indicating where to stop matching preceding sibling elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    prevUntil(obj?: JQuery, filter?: string): JQuery;
+
+    /**
+     * Get the siblings of each element in the set of matched elements, optionally filtered by a selector.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    siblings(selector?: string): JQuery;
+
+    /**
+     * Reduce the set of matched elements to a subset specified by a range of indices.
+     * 
+     * @param start An integer indicating the 0-based position at which the elements begin to be selected. If negative, it indicates an offset from the end of the set.
+     * @param end An integer indicating the 0-based position at which the elements stop being selected. If negative, it indicates an offset from the end of the set. If omitted, the range continues until the end of the set.
+     */
+    slice(start: number, end?: number): JQuery;
+
+    /**
+     * Show the queue of functions to be executed on the matched elements.
+     * 
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     */
+    queue(queueName?: string): any[];
+    /**
+     * Manipulate the queue of functions to be executed, once for each matched element.
+     * 
+     * @param newQueue An array of functions to replace the current queue contents.
+     */
+    queue(newQueue: Function[]): JQuery;
+    /**
+     * Manipulate the queue of functions to be executed, once for each matched element.
+     * 
+     * @param callback The new function to add to the queue, with a function to call that will dequeue the next item.
+     */
+    queue(callback: Function): JQuery;
+    /**
+     * Manipulate the queue of functions to be executed, once for each matched element.
+     * 
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     * @param newQueue An array of functions to replace the current queue contents.
+     */
+    queue(queueName: string, newQueue: Function[]): JQuery;
+    /**
+     * Manipulate the queue of functions to be executed, once for each matched element.
+     * 
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     * @param callback The new function to add to the queue, with a function to call that will dequeue the next item.
+     */
+    queue(queueName: string, callback: Function): JQuery;
+}
+declare module "jquery" {
+    export = $;
+}
+declare var jQuery: JQueryStatic;
+declare var $: JQueryStatic;
\ No newline at end of file
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/jquery/typings.json b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/jquery/typings.json
new file mode 100644
index 0000000000..0af7c54b42
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/globals/jquery/typings.json
@@ -0,0 +1,8 @@
+{
+  "resolution": "main",
+  "tree": {
+    "src": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/4cdfbe96b666eec5e1defbb519a62abf04e96764/jquery/jquery.d.ts",
+    "raw": "registry:dt/jquery#1.10.0+20160417213236",
+    "typings": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/4cdfbe96b666eec5e1defbb519a62abf04e96764/jquery/jquery.d.ts"
+  }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/index.d.ts b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/index.d.ts
new file mode 100644
index 0000000000..7b1af70fde
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-1-typescript/ts/typings-ng1/index.d.ts
@@ -0,0 +1,6 @@
+/// <reference path="globals/angular-animate/index.d.ts" />
+/// <reference path="globals/angular-mocks/index.d.ts" />
+/// <reference path="globals/angular-resource/index.d.ts" />
+/// <reference path="globals/angular-route/index.d.ts" />
+/// <reference path="globals/angular/index.d.ts" />
+/// <reference path="globals/jquery/index.d.ts" />
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/README.md b/public/docs/_examples/upgrade-phonecat-2-hybrid/README.md
new file mode 100644
index 0000000000..31fd100e68
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/README.md
@@ -0,0 +1,37 @@
+This is the Angular Phonecat application adjusted to fit our boilerplate project
+structure.
+
+The following changes from vanilla Phonecat are applied:
+
+* Karma config for unit tests is in karma.conf.ng1.js because the boilerplate
+  Karma config is not compatible with the way Angular 1 tests need to be run.
+  The shell script run-unit-tests.sh can be used to run the unit tests.
+* There's a `package.ng1.json`, which is not used to run anything but only to
+  show an example of changing the PhoneCat http-server root path.
+* Also for the Karma shim, there is a `karma-test-shim.1.js` file which isn't
+  used but is shown in the test appendix.
+* Instead of using Bower, Angular 1 and its dependencies are fetched from a CDN
+  in index.html and karma.conf.ng1.js.
+* E2E tests have been moved to the parent directory, where `run-e2e-tests` can
+  discover and run them along with all the other examples.
+* Angular 1 typings (from DefinitelyTyped) are added to typings-ng1 so that
+  TypeScript can recognize Angular 1 code. (typings.json comes from boilerplate
+  so we can't add them there).
+* Most of the phone JSON and image data removed in the interest of keeping
+  repo weight down. Keeping enough to retain testability of the app.
+
+## Running the app
+
+Start like any example
+
+    npm run start
+
+## Running unit tests
+
+    ./run-unit-tests.sh
+
+## Running E2E tests
+
+Like for any example (at the project root):
+
+    gulp run-e2e-tests --filter=phonecat-2
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/e2e-spec.js b/public/docs/_examples/upgrade-phonecat-2-hybrid/e2e-spec.js
new file mode 100644
index 0000000000..627c684d69
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/e2e-spec.js
@@ -0,0 +1,104 @@
+'use strict';
+
+// Angular E2E Testing Guide:
+// https://docs.angularjs.org/guide/e2e-testing
+
+describe('PhoneCat Application', function() {
+
+  beforeAll(function() {
+    setProtractorToNg1Mode();
+  });
+
+  it('should redirect `index.html` to `index.html#!/phones', function() {
+    browser.get('index.html');
+    expect(browser.getLocationAbsUrl()).toBe('/phones');
+  });
+
+  describe('View: Phone list', function() {
+
+    beforeEach(function() {
+      browser.get('index.html#!/phones');
+    });
+
+    it('should filter the phone list as a user types into the search box', function() {
+      var phoneList = element.all(by.css('.phones li'));
+      var query = element(by.css('input'));
+
+      expect(phoneList.count()).toBe(20);
+
+      sendKeys(query, 'nexus');
+      expect(phoneList.count()).toBe(1);
+
+      query.clear();
+      sendKeys(query, 'motorola');
+      expect(phoneList.count()).toBe(8);
+    });
+
+    it('should be possible to control phone order via the drop-down menu', function() {
+      var queryField = element(by.css('input'));
+      var orderSelect = element(by.css('select'));
+      var nameOption = orderSelect.element(by.css('option[value="name"]'));
+      var phoneNameColumn = element.all(by.css('.phones .name'));
+
+      function getNames() {
+        return phoneNameColumn.map(function(elem) {
+          return elem.getText();
+        });
+      }
+
+      sendKeys(queryField, 'tablet');   // Let's narrow the dataset to make the assertions shorter
+
+      expect(getNames()).toEqual([
+        'Motorola XOOM\u2122 with Wi-Fi',
+        'MOTOROLA XOOM\u2122'
+      ]);
+
+      nameOption.click();
+
+      expect(getNames()).toEqual([
+        'MOTOROLA XOOM\u2122',
+        'Motorola XOOM\u2122 with Wi-Fi'
+      ]);
+    });
+
+    it('should render phone specific links', function() {
+      var query = element(by.css('input'));
+      sendKeys(query, 'nexus');
+
+      element.all(by.css('.phones li a')).first().click();
+      browser.refresh(); // Not sure why this is needed but it is. The route change works fine.
+      expect(browser.getLocationAbsUrl()).toBe('/phones/nexus-s');
+    });
+
+  });
+
+  describe('View: Phone detail', function() {
+
+    beforeEach(function() {
+      browser.get('index.html#!/phones/nexus-s');
+    });
+
+    it('should display the `nexus-s` page', function() {
+      expect(element(by.css('h1')).getText()).toBe('Nexus S');
+    });
+
+    it('should display the first phone image as the main phone image', function() {
+      var mainImage = element(by.css('img.phone.selected'));
+
+      expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/);
+    });
+
+    it('should swap the main image when clicking on a thumbnail image', function() {
+      var mainImage = element(by.css('img.phone.selected'));
+      var thumbnails = element.all(by.css('.phone-thumbs img'));
+
+      thumbnails.get(2).click();
+      expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.2.jpg/);
+
+      thumbnails.get(0).click();
+      expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/);
+    });
+
+  });
+
+});
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.animations.css b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.animations.css
new file mode 100644
index 0000000000..175320b509
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.animations.css
@@ -0,0 +1,67 @@
+/* Animate `ngRepeat` in `phoneList` component */
+.phone-list-item.ng-enter,
+.phone-list-item.ng-leave,
+.phone-list-item.ng-move {
+  overflow: hidden;
+  transition: 0.5s linear all;
+}
+
+.phone-list-item.ng-enter,
+.phone-list-item.ng-leave.ng-leave-active,
+.phone-list-item.ng-move {
+  height: 0;
+  margin-bottom: 0;
+  opacity: 0;
+  padding-bottom: 0;
+  padding-top: 0;
+}
+
+.phone-list-item.ng-enter.ng-enter-active,
+.phone-list-item.ng-leave,
+.phone-list-item.ng-move.ng-move-active {
+  height: 120px;
+  margin-bottom: 20px;
+  opacity: 1;
+  padding-bottom: 4px;
+  padding-top: 15px;
+}
+
+/* Animate view transitions with `ngView` */
+.view-container {
+  position: relative;
+}
+
+.view-frame {
+  margin-top: 20px;
+}
+
+.view-frame.ng-enter,
+.view-frame.ng-leave {
+  background: white;
+  left: 0;
+  position: absolute;
+  right: 0;
+  top: 0;
+}
+
+.view-frame.ng-enter {
+  animation: 1s fade-in;
+  z-index: 100;
+}
+
+.view-frame.ng-leave {
+  animation: 1s fade-out;
+  z-index: 99;
+}
+
+@keyframes fade-in {
+  from { opacity: 0; }
+  to   { opacity: 1; }
+}
+
+@keyframes fade-out {
+  from { opacity: 1; }
+  to   { opacity: 0; }
+}
+
+/* Older browsers might need vendor-prefixes for keyframes and animation! */
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.animations.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.animations.ts
new file mode 100644
index 0000000000..4af94f3d37
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.animations.ts
@@ -0,0 +1,43 @@
+'use strict';
+
+angular.
+  module('phonecatApp').
+  animation('.phone', function phoneAnimationFactory() {
+    return {
+      addClass: animateIn,
+      removeClass: animateOut
+    };
+
+    function animateIn(element: JQuery, className: string, done: () => void) {
+      if (className !== 'selected') return;
+
+      element.css({
+        display: 'block',
+        position: 'absolute',
+        top: 500,
+        left: 0
+      }).animate({
+        top: 0
+      }, done);
+
+      return function animateInEnd(wasCanceled: boolean) {
+        if (wasCanceled) element.stop();
+      };
+    }
+
+    function animateOut(element: JQuery, className: string, done: () => void) {
+      if (className !== 'selected') return;
+
+      element.css({
+        position: 'absolute',
+        top: 0,
+        left: 0
+      }).animate({
+        top: -500
+      }, done);
+
+      return function animateOutEnd(wasCanceled: boolean) {
+        if (wasCanceled) element.stop();
+      };
+    }
+  });
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.config.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.config.ts
new file mode 100644
index 0000000000..72bbb2de49
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.config.ts
@@ -0,0 +1,19 @@
+'use strict';
+
+angular.
+  module('phonecatApp').
+  config(['$locationProvider' ,'$routeProvider',
+    function config($locationProvider:angular.ILocationProvider,
+                    $routeProvider: angular.route.IRouteProvider) {
+      $locationProvider.hashPrefix('!');
+
+      $routeProvider.
+        when('/phones', {
+          template: '<phone-list></phone-list>'
+        }).
+        when('/phones/:phoneId', {
+          template: '<phone-detail></phone-detail>'
+        }).
+        otherwise('/phones');
+    }
+  ]);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/css/app.css b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.css
similarity index 79%
rename from public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/css/app.css
rename to public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.css
index 951ea087cc..f4b45b02a5 100644
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/css/app.css
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.css
@@ -1,99 +1,93 @@
-/* app css stylesheet */
-
 body {
-  padding-top: 20px;
+  padding: 20px;
 }
 
-
-.phone-images {
-  background-color: white;
-  width: 450px;
-  height: 450px;
-  overflow: hidden;
-  position: relative;
-  float: left;
+h1 {
+  border-bottom: 1px solid gray;
+  margin-top: 0;
 }
 
+/* View: Phone list */
 .phones {
   list-style: none;
 }
 
-.thumb {
-  float: left;
-  margin: -0.5em 1em 1.5em 0;
-  padding-bottom: 1em;
-  height: 100px;
-  width: 100px;
-}
-
 .phones li {
   clear: both;
   height: 115px;
   padding-top: 15px;
 }
 
-/** Detail View **/
-img.phone {
+.thumb {
   float: left;
-  margin-right: 3em;
-  margin-bottom: 2em;
-  background-color: white;
-  padding: 2em;
-  height: 400px;
-  width: 400px;
-  display: none;
+  height: 100px;
+  margin: -0.5em 1em 1.5em 0;
+  padding-bottom: 1em;
+  width: 100px;
 }
 
-img.phone:first-child {
+/* View: Phone detail */
+.phone {
+  background-color: white;
+  display: none;
+  float: left;
+  height: 400px;
+  margin-bottom: 2em;
+  margin-right: 3em;
+  padding: 2em;
+  width: 400px;
+}
+
+.phone:first-child {
   display: block;
 }
 
-
-ul.phone-thumbs {
-  margin: 0;
-  list-style: none;
+.phone-images {
+  background-color: white;
+  float: left;
+  height: 450px;
+  overflow: hidden;
+  position: relative;
+  width: 450px;
 }
 
-ul.phone-thumbs li {
+.phone-thumbs {
+  list-style: none;
+  margin: 0;
+}
+
+.phone-thumbs img {
+  height: 100px;
+  padding: 1em;
+  width: 100px;
+}
+
+.phone-thumbs li {
+  background-color: white;
   border: 1px solid black;
+  cursor: pointer;
   display: inline-block;
   margin: 1em;
-  background-color: white;
 }
 
-ul.phone-thumbs img {
-  height: 100px;
-  width: 100px;
-  padding: 1em;
-}
-
-ul.phone-thumbs img:hover {
-  cursor: pointer;
-}
-
-
-ul.specs {
+.specs {
   clear: both;
+  list-style: none;
   margin: 0;
   padding: 0;
-  list-style: none;
 }
 
-ul.specs > li{
+.specs dt {
+  font-weight: bold;
+}
+
+.specs > li {
   display: inline-block;
-  width: 200px;
   vertical-align: top;
+  width: 200px;
 }
 
-ul.specs > li > span{
-  font-weight: bold;
+.specs > li > span {
   font-size: 1.2em;
-}
-
-ul.specs dt {
   font-weight: bold;
 }
-
-h1 {
-  border-bottom: 1px solid gray;
-}
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.module.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.module.ts
new file mode 100644
index 0000000000..ab6d353eeb
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.module.ts
@@ -0,0 +1,10 @@
+'use strict';
+
+// Define the `phonecatApp` module
+angular.module('phonecatApp', [
+  'ngAnimate',
+  'ngRoute',
+  'core',
+  'phoneDetail',
+  'phoneList',
+]);
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/checkmark/checkmark.pipe.spec.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/checkmark/checkmark.pipe.spec.ts
new file mode 100644
index 0000000000..5b9ad15f32
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/checkmark/checkmark.pipe.spec.ts
@@ -0,0 +1,22 @@
+// #docregion
+import {
+  describe,
+  beforeEachProviders,
+  it,
+  inject,
+  expect
+} from '@angular/core/testing';
+import { CheckmarkPipe } from './checkmark.pipe';
+
+describe('CheckmarkPipe', function() {
+
+  beforeEachProviders(() => [CheckmarkPipe]);
+
+  it('should convert boolean values to unicode checkmark or cross',
+    inject([CheckmarkPipe], function(checkmarkPipe: CheckmarkPipe) {
+      expect(checkmarkPipe.transform(true)).toBe('\u2713');
+      expect(checkmarkPipe.transform(false)).toBe('\u2718');
+    })
+  );
+
+});
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/checkmark/checkmark.pipe.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/checkmark/checkmark.pipe.ts
new file mode 100644
index 0000000000..e79b99fc80
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/checkmark/checkmark.pipe.ts
@@ -0,0 +1,11 @@
+// #docregion
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({name: 'checkmark'})
+export class CheckmarkPipe implements PipeTransform {
+
+  transform(input: boolean) {
+    return input ? '\u2713' : '\u2718';
+  }
+
+}
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/core.module.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/core.module.ts
new file mode 100644
index 0000000000..84a91dc7a6
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/core.module.ts
@@ -0,0 +1,4 @@
+'use strict';
+
+// Define the `core` module
+angular.module('core', ['core.phone']);
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/phone/phone.module.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/phone/phone.module.ts
new file mode 100644
index 0000000000..0b6b348899
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/phone/phone.module.ts
@@ -0,0 +1,4 @@
+'use strict';
+
+// Define the `core.phone` module
+angular.module('core.phone', ['ngResource']);
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/phone/phone.service.spec.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/phone/phone.service.spec.ts
new file mode 100644
index 0000000000..c44f82b4fe
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/phone/phone.service.spec.ts
@@ -0,0 +1,58 @@
+// #docregion
+import { provide } from '@angular/core';
+import {
+  describe,
+  beforeEach,
+  beforeEachProviders,
+  it,
+  inject
+} from '@angular/core/testing';
+import {
+  Http,
+  BaseRequestOptions,
+  ResponseOptions,
+  Response
+} from '@angular/http';
+import { MockBackend, MockConnection } from '@angular/http/testing';
+import { Phone, PhoneData } from './phone.service';
+
+describe('Phone', function() {
+  let phone:Phone;
+  let phonesData:PhoneData[] = [
+    {name: 'Phone X', snippet: '', images: []},
+    {name: 'Phone Y', snippet: '', images: []},
+    {name: 'Phone Z', snippet: '', images: []}
+  ];
+  let mockBackend:MockBackend;
+
+  beforeEachProviders(() => [
+    Phone,
+    MockBackend,
+    BaseRequestOptions,
+    provide(Http, {
+      useFactory: (backend: MockBackend, options: BaseRequestOptions) =>
+                    new Http(backend, options),
+      deps: [MockBackend, BaseRequestOptions]
+    })
+  ]);
+
+  beforeEach(inject([MockBackend, Phone],
+                    (_mockBackend_:MockBackend, _phone_:Phone) => {
+    mockBackend = _mockBackend_;
+    phone = _phone_;
+  }));
+
+  it('should fetch the phones data from `/phones/phones.json`',
+    (done: () => void) => {
+    mockBackend.connections.subscribe((conn: MockConnection) => {
+      conn.mockRespond(new Response(new ResponseOptions({
+        body: JSON.stringify(phonesData)
+      })));
+    });
+    phone.query().subscribe(result => {
+      expect(result).toEqual(phonesData);
+      done();
+    });
+  });
+
+});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/core/phones.service.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/phone/phone.service.ts
similarity index 51%
rename from public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/core/phones.service.ts
rename to public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/phone/phone.service.ts
index 96cce48520..b19eea598d 100644
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/core/phones.service.ts
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/core/phone/phone.service.ts
@@ -1,38 +1,33 @@
-// #docregion full
+// #docregion
 import { Injectable } from '@angular/core';
 import { Http, Response } from '@angular/http';
 import { Observable } from 'rxjs/Rx';
 
 import 'rxjs/add/operator/map';
 
-// #docregion phone-interface
-export interface Phone {
+// #docregion phonedata-interface
+export interface PhoneData {
   name: string;
   snippet: string;
   images: string[];
 }
-// #enddocregion phone-interface
+// #enddocregion phonedata-interface
 
 // #docregion fullclass
-// #docregion class
+// #docregion classdef
 @Injectable()
-export class Phones {
-// #enddocregion class
-
+export class Phone {
+// #enddocregion classdef
   constructor(private http: Http) { }
-
-  query():Observable<Phone[]> {
+  query(): Observable<PhoneData[]> {
     return this.http.get(`phones/phones.json`)
-      .map((res:Response) => res.json());
+      .map((res: Response) => res.json());
   }
-
-  get(id: string):Observable<Phone> {
+  get(id: string): Observable<PhoneData> {
     return this.http.get(`phones/${id}.json`)
-      .map((res:Response) => res.json());
+      .map((res: Response) => res.json());
   }
-
-// #docregion class
+// #docregion classdef
 }
-// #enddocregion class
+// #enddocregion classdef
 // #enddocregion fullclass
-// #docregion full
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/css/.gitkeep b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/.gitkeep
similarity index 100%
rename from public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/css/.gitkeep
rename to public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/.gitkeep
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/dell-streak-7.0.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/dell-streak-7.0.jpg
new file mode 100644
index 0000000000..7ce0dce4ee
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/dell-streak-7.0.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/dell-streak-7.1.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/dell-streak-7.1.jpg
new file mode 100644
index 0000000000..ed8cad89fb
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/dell-streak-7.1.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/dell-streak-7.2.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/dell-streak-7.2.jpg
new file mode 100644
index 0000000000..c83529e0f9
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/dell-streak-7.2.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/dell-streak-7.3.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/dell-streak-7.3.jpg
new file mode 100644
index 0000000000..cd2c30280d
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/dell-streak-7.3.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/dell-streak-7.4.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/dell-streak-7.4.jpg
new file mode 100644
index 0000000000..b4d8472da8
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/dell-streak-7.4.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-atrix-4g.0.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-atrix-4g.0.jpg
new file mode 100644
index 0000000000..2446159e93
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-atrix-4g.0.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-atrix-4g.1.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-atrix-4g.1.jpg
new file mode 100644
index 0000000000..867f207459
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-atrix-4g.1.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-atrix-4g.2.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-atrix-4g.2.jpg
new file mode 100644
index 0000000000..27d78338c4
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-atrix-4g.2.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-atrix-4g.3.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-atrix-4g.3.jpg
new file mode 100644
index 0000000000..29459a68a4
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-atrix-4g.3.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.0.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.0.jpg
new file mode 100644
index 0000000000..a6c993291e
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.0.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.1.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.1.jpg
new file mode 100644
index 0000000000..400b89e2df
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.1.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.2.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.2.jpg
new file mode 100644
index 0000000000..86b55d28dd
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.2.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.3.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.3.jpg
new file mode 100644
index 0000000000..85ec293ae5
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.3.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.4.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.4.jpg
new file mode 100644
index 0000000000..75ef1464cb
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.4.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.5.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.5.jpg
new file mode 100644
index 0000000000..4d42db4330
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom-with-wi-fi.5.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom.0.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom.0.jpg
new file mode 100644
index 0000000000..bf6954bbd5
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom.0.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom.1.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom.1.jpg
new file mode 100644
index 0000000000..659688a47d
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom.1.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom.2.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom.2.jpg
new file mode 100644
index 0000000000..ce0ff1002e
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/motorola-xoom.2.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/nexus-s.0.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/nexus-s.0.jpg
new file mode 100644
index 0000000000..0952bc79c2
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/nexus-s.0.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/nexus-s.1.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/nexus-s.1.jpg
new file mode 100644
index 0000000000..f33004dd7f
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/nexus-s.1.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/nexus-s.2.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/nexus-s.2.jpg
new file mode 100644
index 0000000000..c5c63621f1
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/nexus-s.2.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/nexus-s.3.jpg b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/nexus-s.3.jpg
new file mode 100644
index 0000000000..e51f75b0ed
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/img/phones/nexus-s.3.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/main.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/main.ts
new file mode 100644
index 0000000000..5ca4771a27
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/main.ts
@@ -0,0 +1,61 @@
+// #docregion import-adapter
+import { UpgradeAdapter } from '@angular/upgrade';
+// #enddocregion import-adapter
+// #docregion import-http
+import { HTTP_PROVIDERS } from '@angular/http';
+// #enddocregion import-http
+// #docregion phone-service
+import { Phone } from './core/phone/phone.service';
+
+// #enddocregion phone-service
+// #docregion phone-list
+import { PhoneListComponent } from './phone-list/phone-list.component';
+
+// #enddocregion phone-list
+// #docregion phone-detail
+import { PhoneDetailComponent } from './phone-detail/phone-detail.component';
+
+// #enddocregion phone-detail
+// #docregion init-adapter
+let upgradeAdapter = new UpgradeAdapter();
+// #enddocregion init-adapter
+
+// #docregion add-http
+upgradeAdapter.addProvider(HTTP_PROVIDERS);
+// #enddocregion add-http
+// #docregion phone-service
+
+upgradeAdapter.addProvider(Phone);
+
+// #enddocregion phone-service
+// #docregion routeparams
+upgradeAdapter.upgradeNg1Provider('$routeParams');
+// #enddocregion routeparams
+
+// #docregion phone-service
+
+angular.module('core.phone')
+  .factory('phone', upgradeAdapter.downgradeNg2Provider(Phone));
+// #enddocregion phone-service
+// #docregion phone-list
+
+angular.module('phoneList')
+  .directive(
+    'phoneList',
+    <angular.IDirectiveFactory>
+      upgradeAdapter.downgradeNg2Component(PhoneListComponent)
+  );
+// #enddocregion phone-list
+// #docregion phone-detail
+
+angular.module('phoneDetail')
+  .directive(
+    'phoneDetail',
+    <angular.IDirectiveFactory>
+      upgradeAdapter.downgradeNg2Component(PhoneDetailComponent)
+  );
+// #enddocregion phone-detail
+
+// #docregion bootstrap
+upgradeAdapter.bootstrap(document.documentElement, ['phonecatApp']);
+// #enddocregion bootstrap
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.ng1.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.ng1.ts
new file mode 100644
index 0000000000..b458343ece
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.ng1.ts
@@ -0,0 +1,27 @@
+// #docregion
+import { Phone, PhoneData } from '../core/phone/phone.service';
+
+class PhoneDetailController {
+  phone: PhoneData;
+  mainImageUrl: string;
+
+  static $inject = ['$routeParams', 'phone'];
+  constructor($routeParams: angular.route.IRouteParamsService, phone: Phone) {
+    let phoneId = $routeParams['phoneId'];
+    phone.get(phoneId).subscribe(data => {
+      this.phone = data;
+      this.setImage(data.images[0]);
+    });
+  }
+
+  setImage(imageUrl: string) {
+    this.mainImageUrl = imageUrl;
+  }
+}
+
+angular.
+  module('phoneDetail').
+  component('phoneDetail', {
+    templateUrl: 'phone-detail/phone-detail.template.html',
+    controller: PhoneDetailController
+  });
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.spec.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.spec.ts
new file mode 100644
index 0000000000..65abca7c8d
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.spec.ts
@@ -0,0 +1,53 @@
+// #docregion
+import { provide } from '@angular/core';
+import { HTTP_PROVIDERS } from '@angular/http';
+import { Observable } from 'rxjs/Rx';
+
+import {
+  describe,
+  beforeEachProviders,
+  inject,
+  it,
+  expect
+} from '@angular/core/testing';
+import {
+  TestComponentBuilder,
+  ComponentFixture
+} from '@angular/compiler/testing';
+
+import { PhoneDetailComponent } from './phone-detail.component';
+import { Phone, PhoneData } from '../core/phone/phone.service';
+
+function xyzPhoneData():PhoneData {
+  return {
+    name: 'phone xyz',
+    snippet: '',
+    images: ['image/url1.png', 'image/url2.png']
+  }
+}
+
+class MockPhone extends Phone {
+  get(id: string):Observable<PhoneData> {
+    return Observable.of(xyzPhoneData());
+  }
+}
+
+describe('PhoneDetailComponent', () => {
+
+  beforeEachProviders(() => [
+    provide(Phone, {useClass: MockPhone}),
+    provide('$routeParams', {useValue: {phoneId: 'xyz'}}),
+    HTTP_PROVIDERS
+  ]);
+
+  it('should fetch phone detail',
+      inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    return tcb.createAsync(PhoneDetailComponent)
+        .then((fixture: ComponentFixture<PhoneDetailComponent>) => {
+      fixture.detectChanges();
+      let compiled = fixture.debugElement.nativeElement;
+      expect(compiled.querySelector('h1')).toHaveText(xyzPhoneData().name);
+    });
+  }));
+
+});
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.ts
new file mode 100644
index 0000000000..3f42ba3044
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.ts
@@ -0,0 +1,35 @@
+// #docplaster
+// #docregion initialclass
+import { Component, Inject } from '@angular/core';
+import { Phone, PhoneData } from '../core/phone/phone.service';
+// #enddocregion initialclass
+// #docregion checkmark-pipe
+import { CheckmarkPipe } from '../core/checkmark/checkmark.pipe';
+
+// #docregion initialclass
+@Component({
+  selector: 'phone-detail',
+  templateUrl: 'phone-detail/phone-detail.template.html',
+  // #enddocregion initialclass
+  pipes: [ CheckmarkPipe ]
+  // #docregion initialclass
+})
+// #enddocregion checkmark-pipe
+export class PhoneDetailComponent{
+  phone: PhoneData;
+  mainImageUrl: string;
+
+  constructor(@Inject('$routeParams')
+                $routeParams: angular.route.IRouteParamsService,
+              phone: Phone) {
+    phone.get($routeParams['phoneId']).subscribe(phone => {
+      this.phone = phone;
+      this.setImage(phone.images[0]);
+    });
+  }
+
+  setImage(imageUrl: string) {
+    this.mainImageUrl = imageUrl;
+  }
+}
+// #enddocregion initialclass
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.module.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.module.ts
new file mode 100644
index 0000000000..fd7cb3b920
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.module.ts
@@ -0,0 +1,7 @@
+'use strict';
+
+// Define the `phoneDetail` module
+angular.module('phoneDetail', [
+  'ngRoute',
+  'core.phone'
+]);
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.template.html b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.template.html
new file mode 100644
index 0000000000..46a96d66c3
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.template.html
@@ -0,0 +1,120 @@
+<!-- #docregion -->
+<div *ngIf="phone">
+  <div class="phone-images">
+    <img [src]="img" class="phone"
+        [ngClass]="{selected: img === mainImageUrl}"
+        *ngFor="let img of phone.images" />
+  </div>
+
+  <h1>{{phone.name}}</h1>
+
+  <p>{{phone.description}}</p>
+
+  <ul class="phone-thumbs">
+    <li *ngFor="let img of phone.images">
+      <img [src]="img" (click)="setImage(img)" />
+    </li>
+  </ul>
+
+  <ul class="specs">
+    <li>
+      <span>Availability and Networks</span>
+      <dl>
+        <dt>Availability</dt>
+        <dd *ngFor="let availability of phone.availability">{{availability}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Battery</span>
+      <dl>
+        <dt>Type</dt>
+        <dd>{{phone.battery?.type}}</dd>
+        <dt>Talk Time</dt>
+        <dd>{{phone.battery?.talkTime}}</dd>
+        <dt>Standby time (max)</dt>
+        <dd>{{phone.battery?.standbyTime}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Storage and Memory</span>
+      <dl>
+        <dt>RAM</dt>
+        <dd>{{phone.storage?.ram}}</dd>
+        <dt>Internal Storage</dt>
+        <dd>{{phone.storage?.flash}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Connectivity</span>
+      <dl>
+        <dt>Network Support</dt>
+        <dd>{{phone.connectivity?.cell}}</dd>
+        <dt>WiFi</dt>
+        <dd>{{phone.connectivity?.wifi}}</dd>
+        <dt>Bluetooth</dt>
+        <dd>{{phone.connectivity?.bluetooth}}</dd>
+        <dt>Infrared</dt>
+        <dd>{{phone.connectivity?.infrared | checkmark}}</dd>
+        <dt>GPS</dt>
+        <dd>{{phone.connectivity?.gps | checkmark}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Android</span>
+      <dl>
+        <dt>OS Version</dt>
+        <dd>{{phone.android?.os}}</dd>
+        <dt>UI</dt>
+        <dd>{{phone.android?.ui}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Size and Weight</span>
+      <dl>
+        <dt>Dimensions</dt>
+        <dd *ngFor="let dim of phone.sizeAndWeight?.dimensions">{{dim}}</dd>
+        <dt>Weight</dt>
+        <dd>{{phone.sizeAndWeight?.weight}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Display</span>
+      <dl>
+        <dt>Screen size</dt>
+        <dd>{{phone.display?.screenSize}}</dd>
+        <dt>Screen resolution</dt>
+        <dd>{{phone.display?.screenResolution}}</dd>
+        <dt>Touch screen</dt>
+        <dd>{{phone.display?.touchScreen | checkmark}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Hardware</span>
+      <dl>
+        <dt>CPU</dt>
+        <dd>{{phone.hardware?.cpu}}</dd>
+        <dt>USB</dt>
+        <dd>{{phone.hardware?.usb}}</dd>
+        <dt>Audio / headphone jack</dt>
+        <dd>{{phone.hardware?.audioJack}}</dd>
+        <dt>FM Radio</dt>
+        <dd>{{phone.hardware?.fmRadio | checkmark}}</dd>
+        <dt>Accelerometer</dt>
+        <dd>{{phone.hardware?.accelerometer | checkmark}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Camera</span>
+      <dl>
+        <dt>Primary</dt>
+        <dd>{{phone.camera?.primary}}</dd>
+        <dt>Features</dt>
+        <dd>{{phone.camera?.features?.join(', ')}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Additional Features</span>
+      <dd>{{phone.additionalFeatures}}</dd>
+    </li>
+  </ul>
+</div>
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.component.ng1.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.component.ng1.ts
new file mode 100644
index 0000000000..6b36772a72
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.component.ng1.ts
@@ -0,0 +1,23 @@
+// #docregion
+import { Phone, PhoneData } from '../core/phone/phone.service';
+
+class PhoneListController {
+  phones: PhoneData[];
+  orderProp: string;
+
+  static $inject = ['phone'];
+  constructor(phone: Phone) {
+    phone.query().subscribe(phones => {
+      this.phones = phones;
+    });
+    this.orderProp = 'age';
+  }
+
+}
+
+angular.
+  module('phoneList').
+  component('phoneList', {
+    templateUrl: 'app/phone-list/phone-list.template.html',
+    controller: PhoneListController
+  });
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.component.spec.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.component.spec.ts
new file mode 100644
index 0000000000..4b96534b43
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.component.spec.ts
@@ -0,0 +1,67 @@
+// #docregion
+import { provide } from '@angular/core';
+import { HTTP_PROVIDERS } from '@angular/http';
+import { Observable } from 'rxjs/Rx';
+import {
+  describe,
+  beforeEachProviders,
+  inject,
+  it,
+  expect
+} from '@angular/core/testing';
+import {
+  TestComponentBuilder,
+  ComponentFixture
+} from '@angular/compiler/testing';
+
+import { PhoneListComponent } from './phone-list.component';
+import { Phone, PhoneData } from '../core/phone/phone.service';
+
+class MockPhone extends Phone {
+  query():Observable<PhoneData[]> {
+    console.log('mocking here');
+    return Observable.of(
+      [
+        {name: 'Nexus S', snippet: '', images: []},
+        {name: 'Motorola DROID', snippet: '', images: []}
+      ]
+    )
+  }
+}
+
+describe('PhoneList', () => {
+
+  beforeEachProviders(() => [
+    provide(Phone, {useClass: MockPhone}),
+    HTTP_PROVIDERS
+  ]);
+
+  it('should create "phones" model with 2 phones fetched from xhr',
+      inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    return tcb.createAsync(PhoneListComponent)
+        .then((fixture: ComponentFixture<PhoneListComponent>) => {
+      fixture.detectChanges();
+      let compiled = fixture.debugElement.nativeElement;
+      expect(compiled.querySelectorAll('.phone-list-item').length).toBe(2);
+      expect(
+        compiled.querySelector('.phone-list-item:nth-child(1)').textContent
+      ).toContain('Motorola DROID');
+      expect(
+        compiled.querySelector('.phone-list-item:nth-child(2)').textContent
+      ).toContain('Nexus S');
+    });
+  }));
+
+  it('should set the default value of orderProp model',
+      inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    return tcb.createAsync(PhoneListComponent)
+        .then((fixture: ComponentFixture<PhoneListComponent>) => {
+      fixture.detectChanges();
+      let compiled = fixture.debugElement.nativeElement;
+      expect(
+        compiled.querySelector('select option:last-child').selected
+      ).toBe(true);
+    });
+  }));
+
+});
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.component.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.component.ts
new file mode 100644
index 0000000000..a8b16c123f
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.component.ts
@@ -0,0 +1,58 @@
+// #docplaster
+// #docregion initialclass
+import { Component } from '@angular/core';
+import { Phone, PhoneData } from '../core/phone/phone.service';
+
+@Component({
+  selector: 'phone-list',
+  templateUrl: 'phone-list/phone-list.template.html'
+})
+export class PhoneListComponent {
+  phones: PhoneData[];
+  query:string;
+  orderProp: string;
+
+  constructor(phone: Phone) {
+    phone.query().subscribe(phones => {
+      this.phones = phones;
+    });
+    this.orderProp = 'age';
+  }
+  // #enddocregion initialclass
+
+  // #docregion getphones
+  getPhones():PhoneData[] {
+    return this.sortPhones(this.filterPhones(this.phones));
+  }
+
+  private filterPhones(phones: PhoneData[]) {
+    if (phones && this.query) {
+      return phones.filter(phone => {
+        let name = phone.name.toLowerCase();
+        let snippet = phone.snippet.toLowerCase();
+        return name.indexOf(this.query) >= 0 || snippet.indexOf(this.query) >= 0;
+      });
+    }
+    return phones;
+  }
+
+  private sortPhones(phones: PhoneData[]) {
+      if (phones && this.orderProp) {
+          return phones
+            .slice(0) // Make a copy
+            .sort((a, b) => {
+               if (a[this.orderProp] < b[this.orderProp]) {
+                 return -1;
+               } else if ([b[this.orderProp] < a[this.orderProp]]) {
+                 return 1;
+               } else {
+                 return 0;
+               }
+            });
+      }
+      return phones;
+  }
+  // #enddocregion getphones
+  // #docregion initialclass
+}
+// #enddocregion initialclass
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.module.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.module.ts
new file mode 100644
index 0000000000..8ade7c5b88
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.module.ts
@@ -0,0 +1,4 @@
+'use strict';
+
+// Define the `phoneList` module
+angular.module('phoneList', ['core.phone']);
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.template.html b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.template.html
new file mode 100644
index 0000000000..8f02113985
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.template.html
@@ -0,0 +1,40 @@
+<div class="container-fluid">
+  <div class="row">
+    <div class="col-md-2">
+      <!--Sidebar content-->
+
+      <!-- #docregion controls -->
+      <p>
+        Search:
+        <input [(ngModel)]="query" />
+      </p>
+
+      <p>
+        Sort by:
+        <select [(ngModel)]="orderProp">
+          <option value="name">Alphabetical</option>
+          <option value="age">Newest</option>
+        </select>
+      </p>
+      <!-- #enddocregion controls -->
+
+    </div>
+    <div class="col-md-10">
+      <!--Body content-->
+
+      <!-- #docregion list -->
+      <ul class="phones">
+        <li *ngFor="let phone of getPhones()"
+            class="thumbnail phone-list-item">
+          <a href="/#!/phones/{{phone.id}}" class="thumb">
+            <img [src]="phone.imageUrl" [alt]="phone.name" />
+          </a>
+          <a href="/#!/phones/{{phone.id}}" class="name">{{phone.name}}</a>
+          <p>{{phone.snippet}}</p>
+        </li>
+      </ul>
+      <!-- #enddocregion list -->
+
+    </div>
+  </div>
+</div>
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/dell-streak-7.json b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/dell-streak-7.json
new file mode 100644
index 0000000000..a32eb6ff98
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/dell-streak-7.json
@@ -0,0 +1,64 @@
+{
+    "additionalFeatures": "Front Facing 1.3MP Camera", 
+    "android": {
+        "os": "Android 2.2", 
+        "ui": "Dell Stage"
+    }, 
+    "availability": [
+        "T-Mobile"
+    ], 
+    "battery": {
+        "standbyTime": "", 
+        "talkTime": "", 
+        "type": "Lithium Ion (Li-Ion) (2780 mAH)"
+    }, 
+    "camera": {
+        "features": [
+            "Flash", 
+            "Video"
+        ], 
+        "primary": "5.0 megapixels"
+    }, 
+    "connectivity": {
+        "bluetooth": "Bluetooth 2.1", 
+        "cell": "T-mobile HSPA+ @ 2100/1900/AWS/850 MHz", 
+        "gps": true, 
+        "infrared": false, 
+        "wifi": "802.11 b/g"
+    }, 
+    "description": "Introducing Dell\u2122 Streak 7. Share photos, videos and movies together. It\u2019s small enough to carry around, big enough to gather around. Android\u2122 2.2-based tablet with over-the-air upgrade capability for future OS releases.  A vibrant 7-inch, multitouch display with full Adobe\u00ae Flash 10.1 pre-installed.  Includes a 1.3 MP front-facing camera for face-to-face chats on popular services such as Qik or Skype.  16 GB of internal storage, plus Wi-Fi, Bluetooth and built-in GPS keeps you in touch with the world around you.  Connect on your terms. Save with 2-year contract or flexibility with prepaid pay-as-you-go plans", 
+    "display": {
+        "screenResolution": "WVGA (800 x 480)", 
+        "screenSize": "7.0 inches", 
+        "touchScreen": true
+    }, 
+    "hardware": {
+        "accelerometer": true, 
+        "audioJack": "3.5mm", 
+        "cpu": "nVidia Tegra T20", 
+        "fmRadio": false, 
+        "physicalKeyboard": false, 
+        "usb": "USB 2.0"
+    }, 
+    "id": "dell-streak-7", 
+    "images": [
+        "img/phones/dell-streak-7.0.jpg", 
+        "img/phones/dell-streak-7.1.jpg", 
+        "img/phones/dell-streak-7.2.jpg", 
+        "img/phones/dell-streak-7.3.jpg", 
+        "img/phones/dell-streak-7.4.jpg"
+    ], 
+    "name": "Dell Streak 7", 
+    "sizeAndWeight": {
+        "dimensions": [
+            "199.9 mm (w)", 
+            "119.8 mm (h)", 
+            "12.4 mm (d)"
+        ], 
+        "weight": "450.0 grams"
+    }, 
+    "storage": {
+        "flash": "16000MB", 
+        "ram": "512MB"
+    }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/motorola-atrix-4g.json b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/motorola-atrix-4g.json
new file mode 100644
index 0000000000..ccca00e3b2
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/motorola-atrix-4g.json
@@ -0,0 +1,62 @@
+{
+    "additionalFeatures": "", 
+    "android": {
+        "os": "Android 2.2", 
+        "ui": "MOTOBLUR"
+    }, 
+    "availability": [
+        "AT&T"
+    ], 
+    "battery": {
+        "standbyTime": "400 hours", 
+        "talkTime": "5 hours", 
+        "type": "Lithium Ion (Li-Ion) (1930 mAH)"
+    }, 
+    "camera": {
+        "features": [
+            ""
+        ], 
+        "primary": ""
+    }, 
+    "connectivity": {
+        "bluetooth": "Bluetooth 2.1", 
+        "cell": "WCDMA 850/1900/2100, GSM 850/900/1800/1900, HSDPA 14Mbps (Category 10) Edge Class 12, GPRS Class 12, eCompass, AGPS", 
+        "gps": true, 
+        "infrared": false, 
+        "wifi": "802.11 a/b/g/n"
+    }, 
+    "description": "MOTOROLA ATRIX 4G gives you dual-core processing power and the revolutionary webtop application. With webtop and a compatible Motorola docking station, sold separately, you can surf the Internet with a full Firefox browser, create and edit docs, or access multimedia on a large screen almost anywhere.", 
+    "display": {
+        "screenResolution": "QHD (960 x 540)", 
+        "screenSize": "4.0 inches", 
+        "touchScreen": true
+    }, 
+    "hardware": {
+        "accelerometer": true, 
+        "audioJack": "3.5mm", 
+        "cpu": "1 GHz Dual Core", 
+        "fmRadio": false, 
+        "physicalKeyboard": false, 
+        "usb": "USB 2.0"
+    }, 
+    "id": "motorola-atrix-4g", 
+    "images": [
+        "img/phones/motorola-atrix-4g.0.jpg", 
+        "img/phones/motorola-atrix-4g.1.jpg", 
+        "img/phones/motorola-atrix-4g.2.jpg", 
+        "img/phones/motorola-atrix-4g.3.jpg"
+    ], 
+    "name": "MOTOROLA ATRIX\u2122 4G", 
+    "sizeAndWeight": {
+        "dimensions": [
+            "63.5 mm (w)", 
+            "117.75 mm (h)", 
+            "10.95 mm (d)"
+        ], 
+        "weight": "135.0 grams"
+    }, 
+    "storage": {
+        "flash": "", 
+        "ram": ""
+    }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/motorola-xoom-with-wi-fi.json b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/motorola-xoom-with-wi-fi.json
new file mode 100644
index 0000000000..4ba9c8d5b5
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/motorola-xoom-with-wi-fi.json
@@ -0,0 +1,65 @@
+{
+    "additionalFeatures": "Sensors: proximity, ambient light, barometer, gyroscope", 
+    "android": {
+        "os": "Android 3.0", 
+        "ui": "Honeycomb"
+    }, 
+    "availability": [
+        ""
+    ], 
+    "battery": {
+        "standbyTime": "336 hours", 
+        "talkTime": "24 hours", 
+        "type": "Other ( mAH)"
+    }, 
+    "camera": {
+        "features": [
+            "Flash", 
+            "Video"
+        ], 
+        "primary": "5.0 megapixels"
+    }, 
+    "connectivity": {
+        "bluetooth": "Bluetooth 2.1", 
+        "cell": "", 
+        "gps": true, 
+        "infrared": false, 
+        "wifi": "802.11 b/g/n"
+    }, 
+    "description": "Motorola XOOM with Wi-Fi has a super-powerful dual-core processor and Android\u2122 3.0 (Honeycomb) \u2014 the Android platform designed specifically for tablets. With its 10.1-inch HD widescreen display, you\u2019ll enjoy HD video in a thin, light, powerful and upgradeable tablet.", 
+    "display": {
+        "screenResolution": "WXGA (1200 x 800)", 
+        "screenSize": "10.1 inches", 
+        "touchScreen": true
+    }, 
+    "hardware": {
+        "accelerometer": true, 
+        "audioJack": "3.5mm", 
+        "cpu": "1 GHz Dual Core Tegra 2", 
+        "fmRadio": false, 
+        "physicalKeyboard": false, 
+        "usb": "USB 2.0"
+    }, 
+    "id": "motorola-xoom-with-wi-fi", 
+    "images": [
+        "img/phones/motorola-xoom-with-wi-fi.0.jpg", 
+        "img/phones/motorola-xoom-with-wi-fi.1.jpg", 
+        "img/phones/motorola-xoom-with-wi-fi.2.jpg", 
+        "img/phones/motorola-xoom-with-wi-fi.3.jpg", 
+        "img/phones/motorola-xoom-with-wi-fi.4.jpg", 
+        "img/phones/motorola-xoom-with-wi-fi.5.jpg"
+    ], 
+    "name": "Motorola XOOM\u2122 with Wi-Fi", 
+    "sizeAndWeight": {
+        "dimensions": [
+            "249.1 mm (w)", 
+            "167.8 mm (h)", 
+            "12.9 mm (d)"
+        ], 
+        "weight": "708.0 grams"
+    }, 
+    "storage": {
+        "flash": "32000MB", 
+        "ram": "1000MB"
+    }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/motorola-xoom.json b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/motorola-xoom.json
new file mode 100644
index 0000000000..f0f0c8711d
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/motorola-xoom.json
@@ -0,0 +1,62 @@
+{
+    "additionalFeatures": "Front-facing camera. Sensors: proximity, ambient light, barometer, gyroscope.", 
+    "android": {
+        "os": "Android 3.0", 
+        "ui": "Android"
+    }, 
+    "availability": [
+        "Verizon"
+    ], 
+    "battery": {
+        "standbyTime": "336 hours", 
+        "talkTime": "24 hours", 
+        "type": "Other (3250 mAH)"
+    }, 
+    "camera": {
+        "features": [
+            "Flash", 
+            "Video"
+        ], 
+        "primary": "5.0 megapixels"
+    }, 
+    "connectivity": {
+        "bluetooth": "Bluetooth 2.1", 
+        "cell": "CDMA 800 /1900 LTE 700, Rx diversity in all bands", 
+        "gps": true, 
+        "infrared": false, 
+        "wifi": "802.11 a/b/g/n"
+    }, 
+    "description": "MOTOROLA XOOM has a super-powerful dual-core processor and Android\u2122 3.0 (Honeycomb) \u2014 the Android platform designed specifically for tablets. With its 10.1-inch HD widescreen display, you\u2019ll enjoy HD video in a thin, light, powerful and upgradeable tablet.", 
+    "display": {
+        "screenResolution": "WXGA (1200 x 800)", 
+        "screenSize": "10.1 inches", 
+        "touchScreen": true
+    }, 
+    "hardware": {
+        "accelerometer": true, 
+        "audioJack": "3.5mm", 
+        "cpu": "1 GHz Dual Core Tegra 2", 
+        "fmRadio": false, 
+        "physicalKeyboard": false, 
+        "usb": "USB 2.0"
+    }, 
+    "id": "motorola-xoom", 
+    "images": [
+        "img/phones/motorola-xoom.0.jpg", 
+        "img/phones/motorola-xoom.1.jpg", 
+        "img/phones/motorola-xoom.2.jpg"
+    ], 
+    "name": "MOTOROLA XOOM\u2122", 
+    "sizeAndWeight": {
+        "dimensions": [
+            "249.0 mm (w)", 
+            "168.0 mm (h)", 
+            "12.7 mm (d)"
+        ], 
+        "weight": "726.0 grams"
+    }, 
+    "storage": {
+        "flash": "32000MB", 
+        "ram": "1000MB"
+    }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/nexus-s.json b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/nexus-s.json
new file mode 100644
index 0000000000..5e712e2ff8
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/nexus-s.json
@@ -0,0 +1,69 @@
+{
+    "additionalFeatures": "Contour Display, Near Field Communications (NFC), Three-axis gyroscope, Anti-fingerprint display coating, Internet Calling support (VoIP/SIP)", 
+    "android": {
+        "os": "Android 2.3", 
+        "ui": "Android"
+    }, 
+    "availability": [
+        "M1,", 
+        "O2,", 
+        "Orange,", 
+        "Singtel,", 
+        "StarHub,", 
+        "T-Mobile,", 
+        "Vodafone"
+    ], 
+    "battery": {
+        "standbyTime": "428 hours", 
+        "talkTime": "6 hours", 
+        "type": "Lithium Ion (Li-Ion) (1500 mAH)"
+    }, 
+    "camera": {
+        "features": [
+            "Flash", 
+            "Video"
+        ], 
+        "primary": "5.0 megapixels"
+    }, 
+    "connectivity": {
+        "bluetooth": "Bluetooth 2.1", 
+        "cell": "Quad-band GSM: 850, 900, 1800, 1900\r\nTri-band HSPA: 900, 2100, 1700\r\nHSPA type: HSDPA (7.2Mbps) HSUPA (5.76Mbps)", 
+        "gps": true, 
+        "infrared": false, 
+        "wifi": "802.11 b/g/n"
+    }, 
+    "description": "Nexus S is the next generation of Nexus devices, co-developed by Google and Samsung. The latest Android platform (Gingerbread), paired with a 1 GHz Hummingbird processor and 16GB of memory, makes Nexus S one of the fastest phones on the market. It comes pre-installed with the best of Google apps and enabled with new and popular features like true multi-tasking, Wi-Fi hotspot, Internet Calling, NFC support, and full web browsing. With this device, users will also be the first to receive software upgrades and new Google mobile apps as soon as they become available. For more details, visit http://www.google.com/nexus.", 
+    "display": {
+        "screenResolution": "WVGA (800 x 480)", 
+        "screenSize": "4.0 inches", 
+        "touchScreen": true
+    }, 
+    "hardware": {
+        "accelerometer": true, 
+        "audioJack": "3.5mm", 
+        "cpu": "1GHz Cortex A8 (Hummingbird) processor", 
+        "fmRadio": false, 
+        "physicalKeyboard": false, 
+        "usb": "USB 2.0"
+    }, 
+    "id": "nexus-s", 
+    "images": [
+        "img/phones/nexus-s.0.jpg", 
+        "img/phones/nexus-s.1.jpg", 
+        "img/phones/nexus-s.2.jpg", 
+        "img/phones/nexus-s.3.jpg"
+    ], 
+    "name": "Nexus S", 
+    "sizeAndWeight": {
+        "dimensions": [
+            "63.0 mm (w)", 
+            "123.9 mm (h)", 
+            "10.88 mm (d)"
+        ], 
+        "weight": "129.0 grams"
+    }, 
+    "storage": {
+        "flash": "16384MB", 
+        "ram": "512MB"
+    }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/phones.json b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/phones.json
new file mode 100644
index 0000000000..339b94fbb5
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phones/phones.json
@@ -0,0 +1,155 @@
+[
+    {
+        "age": 0, 
+        "id": "motorola-xoom-with-wi-fi", 
+        "imageUrl": "img/phones/motorola-xoom-with-wi-fi.0.jpg", 
+        "name": "Motorola XOOM\u2122 with Wi-Fi", 
+        "snippet": "The Next, Next Generation\r\n\r\nExperience the future with Motorola XOOM with Wi-Fi, the world's first tablet powered by Android 3.0 (Honeycomb)."
+    }, 
+    {
+        "age": 1, 
+        "id": "motorola-xoom", 
+        "imageUrl": "img/phones/motorola-xoom.0.jpg", 
+        "name": "MOTOROLA XOOM\u2122", 
+        "snippet": "The Next, Next Generation\n\nExperience the future with MOTOROLA XOOM, the world's first tablet powered by Android 3.0 (Honeycomb)."
+    }, 
+    {
+        "age": 2, 
+        "carrier": "AT&T", 
+        "id": "motorola-atrix-4g", 
+        "imageUrl": "img/phones/motorola-atrix-4g.0.jpg", 
+        "name": "MOTOROLA ATRIX\u2122 4G", 
+        "snippet": "MOTOROLA ATRIX 4G the world's most powerful smartphone."
+    }, 
+    {
+        "age": 3, 
+        "id": "dell-streak-7", 
+        "imageUrl": "img/phones/dell-streak-7.0.jpg", 
+        "name": "Dell Streak 7", 
+        "snippet": "Introducing Dell\u2122 Streak 7. Share photos, videos and movies together. It\u2019s small enough to carry around, big enough to gather around."
+    }, 
+    {
+        "age": 4, 
+        "carrier": "Cellular South", 
+        "id": "samsung-gem", 
+        "imageUrl": "img/phones/samsung-gem.0.jpg", 
+        "name": "Samsung Gem\u2122", 
+        "snippet": "The Samsung Gem\u2122 brings you everything that you would expect and more from a touch display smart phone \u2013 more apps, more features and a more affordable price."
+    }, 
+    {
+        "age": 5, 
+        "carrier": "Dell", 
+        "id": "dell-venue", 
+        "imageUrl": "img/phones/dell-venue.0.jpg", 
+        "name": "Dell Venue", 
+        "snippet": "The Dell Venue; Your Personal Express Lane to Everything"
+    }, 
+    {
+        "age": 6, 
+        "carrier": "Best Buy", 
+        "id": "nexus-s", 
+        "imageUrl": "img/phones/nexus-s.0.jpg", 
+        "name": "Nexus S", 
+        "snippet": "Fast just got faster with Nexus S. A pure Google experience, Nexus S is the first phone to run Gingerbread (Android 2.3), the fastest version of Android yet."
+    }, 
+    {
+        "age": 7, 
+        "carrier": "Cellular South", 
+        "id": "lg-axis", 
+        "imageUrl": "img/phones/lg-axis.0.jpg", 
+        "name": "LG Axis", 
+        "snippet": "Android Powered, Google Maps Navigation, 5 Customizable Home Screens"
+    }, 
+    {
+        "age": 8, 
+        "id": "samsung-galaxy-tab", 
+        "imageUrl": "img/phones/samsung-galaxy-tab.0.jpg", 
+        "name": "Samsung Galaxy Tab\u2122", 
+        "snippet": "Feel Free to Tab\u2122. The Samsung Galaxy Tab\u2122 brings you an ultra-mobile entertainment experience through its 7\u201d display, high-power processor and Adobe\u00ae Flash\u00ae Player compatibility."
+    }, 
+    {
+        "age": 9, 
+        "carrier": "Cellular South", 
+        "id": "samsung-showcase-a-galaxy-s-phone", 
+        "imageUrl": "img/phones/samsung-showcase-a-galaxy-s-phone.0.jpg", 
+        "name": "Samsung Showcase\u2122 a Galaxy S\u2122 phone", 
+        "snippet": "The Samsung Showcase\u2122 delivers a cinema quality experience like you\u2019ve never seen before. Its innovative 4\u201d touch display technology provides rich picture brilliance, even outdoors"
+    }, 
+    {
+        "age": 10, 
+        "carrier": "Verizon", 
+        "id": "droid-2-global-by-motorola", 
+        "imageUrl": "img/phones/droid-2-global-by-motorola.0.jpg", 
+        "name": "DROID\u2122 2 Global by Motorola", 
+        "snippet": "The first smartphone with a 1.2 GHz processor and global capabilities."
+    }, 
+    {
+        "age": 11, 
+        "carrier": "Verizon", 
+        "id": "droid-pro-by-motorola", 
+        "imageUrl": "img/phones/droid-pro-by-motorola.0.jpg", 
+        "name": "DROID\u2122 Pro by Motorola", 
+        "snippet": "The next generation of DOES."
+    }, 
+    {
+        "age": 12, 
+        "carrier": "AT&T", 
+        "id": "motorola-bravo-with-motoblur", 
+        "imageUrl": "img/phones/motorola-bravo-with-motoblur.0.jpg", 
+        "name": "MOTOROLA BRAVO\u2122 with MOTOBLUR\u2122", 
+        "snippet": "An experience to cheer about."
+    }, 
+    {
+        "age": 13, 
+        "carrier": "T-Mobile", 
+        "id": "motorola-defy-with-motoblur", 
+        "imageUrl": "img/phones/motorola-defy-with-motoblur.0.jpg", 
+        "name": "Motorola DEFY\u2122 with MOTOBLUR\u2122", 
+        "snippet": "Are you ready for everything life throws your way?"
+    }, 
+    {
+        "age": 14, 
+        "carrier": "T-Mobile", 
+        "id": "t-mobile-mytouch-4g", 
+        "imageUrl": "img/phones/t-mobile-mytouch-4g.0.jpg", 
+        "name": "T-Mobile myTouch 4G", 
+        "snippet": "The T-Mobile myTouch 4G is a premium smartphone designed to deliver blazing fast 4G speeds so that you can video chat from practically anywhere, with or without Wi-Fi."
+    }, 
+    {
+        "age": 15, 
+        "carrier": "US Cellular", 
+        "id": "samsung-mesmerize-a-galaxy-s-phone", 
+        "imageUrl": "img/phones/samsung-mesmerize-a-galaxy-s-phone.0.jpg", 
+        "name": "Samsung Mesmerize\u2122 a Galaxy S\u2122 phone", 
+        "snippet": "The Samsung Mesmerize\u2122 delivers a cinema quality experience like you\u2019ve never seen before. Its innovative 4\u201d touch display technology provides rich picture brilliance,even outdoors"
+    }, 
+    {
+        "age": 16, 
+        "carrier": "Sprint", 
+        "id": "sanyo-zio", 
+        "imageUrl": "img/phones/sanyo-zio.0.jpg", 
+        "name": "SANYO ZIO", 
+        "snippet": "The Sanyo Zio by Kyocera is an Android smartphone with a combination of ultra-sleek styling, strong performance and unprecedented value."
+    }, 
+    {
+        "age": 17, 
+        "id": "samsung-transform", 
+        "imageUrl": "img/phones/samsung-transform.0.jpg", 
+        "name": "Samsung Transform\u2122", 
+        "snippet": "The Samsung Transform\u2122 brings you a fun way to customize your Android powered touch screen phone to just the way you like it through your favorite themed \u201cSprint ID Service Pack\u201d."
+    }, 
+    {
+        "age": 18, 
+        "id": "t-mobile-g2", 
+        "imageUrl": "img/phones/t-mobile-g2.0.jpg", 
+        "name": "T-Mobile G2", 
+        "snippet": "The T-Mobile G2 with Google is the first smartphone built for 4G speeds on T-Mobile's new network. Get the information you need, faster than you ever thought possible."
+    }, 
+    {
+        "age": 19, 
+        "id": "motorola-charm-with-motoblur", 
+        "imageUrl": "img/phones/motorola-charm-with-motoblur.0.jpg", 
+        "name": "Motorola CHARM\u2122 with MOTOBLUR\u2122", 
+        "snippet": "Motorola CHARM fits easily in your pocket or palm.  Includes MOTOBLUR service."
+    }
+]
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/img/.gitkeep b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/example-config.json
similarity index 100%
rename from public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/img/.gitkeep
rename to public/docs/_examples/upgrade-phonecat-2-hybrid/ts/example-config.json
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/index.html b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/index.html
new file mode 100644
index 0000000000..393d465911
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/index.html
@@ -0,0 +1,52 @@
+<!-- #docplaster -->
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <!-- #docregion base -->
+    <base href="/app/">
+    <!-- #enddocregion base -->
+    <title>Google Phone Gallery</title>
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
+    <link rel="stylesheet" href="app.css" />
+    <link rel="stylesheet" href="app.animations.css" />
+
+    <script src="https://code.jquery.com/jquery-2.2.4.js"></script>
+    <script src="https://code.angularjs.org/1.5.5/angular.js"></script>
+    <script src="https://code.angularjs.org/1.5.5/angular-animate.js"></script>
+    <script src="https://code.angularjs.org/1.5.5/angular-resource.js"></script>
+    <script src="https://code.angularjs.org/1.5.5/angular-route.js"></script>
+
+    <script src="app.module.js"></script>
+    <script src="app.config.js"></script>
+    <script src="app.animations.js"></script>
+    <script src="core/core.module.js"></script>
+    <script src="core/phone/phone.module.js"></script>
+    <script src="phone-list/phone-list.module.js"></script>
+    <script src="phone-detail/phone-detail.module.js"></script>
+
+    <!-- #docregion ng2 -->
+    <script src="/node_modules/core-js/client/shim.min.js"></script>
+    <script src="/node_modules/zone.js/dist/zone.js"></script>
+    <script src="/node_modules/reflect-metadata/Reflect.js"></script>
+    <script src="/node_modules/systemjs/dist/system.src.js"></script>
+    <!-- #enddocregion ng2 -->
+    <script src="/systemjs.config.1.js"></script>
+    <!-- #docregion ng2
+    <script src="/systemjs.config.js"></script>
+    <script>
+      System.import('/app');
+    </script>
+    <!-- #enddocregion ng2 -->
+    <script>
+      System.import('/app');
+    </script>
+  </head>
+  <body>
+
+    <div class="view-container">
+      <div ng-view class="view-frame"></div>
+    </div>
+
+  </body>
+</html>
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/karma-test-shim.1.js b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/karma-test-shim.1.js
new file mode 100644
index 0000000000..bf17063954
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/karma-test-shim.1.js
@@ -0,0 +1,55 @@
+// #docregion
+// /*global jasmine, __karma__, window*/
+Error.stackTraceLimit = Infinity;
+jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;
+
+__karma__.loaded = function () {
+};
+
+function isJsFile(path) {
+  return path.slice(-3) == '.js';
+}
+
+function isSpecFile(path) {
+  return /\.spec\.js$/.test(path);
+}
+
+function isBuiltFile(path) {
+  var builtPath = '/base/app/';
+  return isJsFile(path) && (path.substr(0, builtPath.length) == builtPath);
+}
+
+var allSpecFiles = Object.keys(window.__karma__.files)
+  .filter(isSpecFile)
+  .filter(isBuiltFile);
+
+System.config({
+  baseURL: '/base',
+  packageWithIndex: true // sadly, we can't use umd packages (yet?)
+});
+
+System.import('systemjs.config.js')
+  .then(function () {
+    return Promise.all([
+      System.import('@angular/core/testing'),
+      System.import('@angular/platform-browser-dynamic/testing')
+    ])
+  })
+  .then(function (providers) {
+    var testing = providers[0];
+    var testingBrowser = providers[1];
+
+    testing.setBaseTestProviders(
+      testingBrowser.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
+      testingBrowser.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS);
+
+  })
+  .then(function() {
+    // Finally, load all spec files.
+    // This will run the tests directly.
+    return Promise.all(
+      allSpecFiles.map(function (moduleName) {
+        return System.import(moduleName);
+      }));
+  })
+  .then(__karma__.start, __karma__.error);
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/karma.conf.ng1.js b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/karma.conf.ng1.js
new file mode 100644
index 0000000000..7156e025ce
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/karma.conf.ng1.js
@@ -0,0 +1,72 @@
+//jshint strict: false
+module.exports = function(config) {
+  config.set({
+
+    // #docregion basepath
+    basePath: './',
+    // #enddocregion basepath
+
+    files: [
+      'https://code.angularjs.org/1.5.5/angular.js',
+      'https://code.angularjs.org/1.5.5/angular-animate.js',
+      'https://code.angularjs.org/1.5.5/angular-resource.js',
+      'https://code.angularjs.org/1.5.5/angular-route.js',
+      'https://code.angularjs.org/1.5.5/angular-mocks.js',
+
+      // #docregion files
+      // System.js for module loading
+      'node_modules/systemjs/dist/system.src.js',
+
+      // Polyfills
+      'node_modules/core-js/client/shim.js',
+
+      // Reflect and Zone.js
+      'node_modules/reflect-metadata/Reflect.js',
+      'node_modules/zone.js/dist/zone.js',
+      'node_modules/zone.js/dist/jasmine-patch.js',
+      'node_modules/zone.js/dist/async-test.js',
+      'node_modules/zone.js/dist/fake-async-test.js',
+
+      // RxJs.
+      { pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false },
+      { pattern: 'node_modules/rxjs/**/*.js.map', included: false, watched: false },
+
+      // Angular 2 itself and the testing library
+      {pattern: 'node_modules/@angular/**/*.js', included: false, watched: false},
+      {pattern: 'node_modules/@angular/**/*.js.map', included: false, watched: false},
+
+      {pattern: 'systemjs.config.js', included: false, watched: false},
+      'karma-test-shim.js',
+
+      {pattern: 'app/**/*.module.js', included: false, watched: true},
+      {pattern: 'app/*!(.module|.spec).js', included: false, watched: true},
+      {pattern: 'app/!(bower_components)/**/*!(.module|.spec).js', included: false, watched: true},
+      {pattern: 'app/**/*.spec.js', included: false, watched: true},
+
+      {pattern: '**/*.html', included: false, watched: true},
+      // #enddocregion files
+    ],
+
+    // #docregion html
+    // proxied base paths for loading assets
+    proxies: {
+      // required for component assets fetched by Angular's compiler
+      "/phone-detail": '/base/app/phone-detail',
+      "/phone-list": '/base/app/phone-list'
+    },
+    // #enddocregion html
+
+    autoWatch: true,
+
+    frameworks: ['jasmine'],
+
+    browsers: ['Chrome', 'Firefox'],
+
+    plugins: [
+      'karma-chrome-launcher',
+      'karma-firefox-launcher',
+      'karma-jasmine'
+    ]
+
+  });
+};
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/package.ng1.json b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/package.ng1.json
new file mode 100644
index 0000000000..54f73776dd
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/package.ng1.json
@@ -0,0 +1,37 @@
+{
+  "name": "angular-phonecat",
+  "private": true,
+  "version": "0.0.0",
+  "description": "A tutorial application for AngularJS",
+  "repository": "https://github.com/angular/angular-phonecat",
+  "license": "MIT",
+  "devDependencies": {
+    "bower": "^1.7.7",
+    "http-server": "^0.9.0",
+    "jasmine-core": "^2.4.1",
+    "karma": "^0.13.22",
+    "karma-chrome-launcher": "^0.2.3",
+    "karma-firefox-launcher": "^0.1.7",
+    "karma-jasmine": "^0.3.8",
+    "protractor": "^3.2.2",
+    "shelljs": "^0.6.0"
+  },
+  "scripts": {
+    "postinstall": "bower install",
+
+    "prestart": "npm install",
+    "start": "http-server -a localhost -p 8000 -c-1 ./",
+
+    "pretest": "npm install",
+    "test": "karma start karma.conf.js",
+    "test-single-run": "karma start karma.conf.js --single-run",
+
+    "preupdate-webdriver": "npm install",
+    "update-webdriver": "webdriver-manager update",
+
+    "preprotractor": "npm run update-webdriver",
+    "protractor": "protractor e2e-tests/protractor.conf.js",
+
+    "update-index-async": "node -e \"require('shelljs/global'); sed('-i', /\\/\\/@@NG_LOADER_START@@[\\s\\S]*\\/\\/@@NG_LOADER_END@@/, '//@@NG_LOADER_START@@\\n' + sed(/sourceMappingURL=angular-loader.min.js.map/,'sourceMappingURL=bower_components/angular-loader/angular-loader.min.js.map','app/bower_components/angular-loader/angular-loader.min.js') + '\\n//@@NG_LOADER_END@@', 'app/index-async.html');\""
+  }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/run-unit-tests.sh b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/run-unit-tests.sh
new file mode 100755
index 0000000000..00a5abb7bc
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/run-unit-tests.sh
@@ -0,0 +1,7 @@
+## The boilerplate Karma configuration won't work with Angular 1 tests since
+## a specific loading configuration is needed for them.
+## We keep one in karma.conf.ng1.js. This scripts runs the ng1 tests with
+## that config.
+
+PATH=$(npm bin):$PATH
+tsc && karma start karma.conf.ng1.js
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/systemjs.config.1.js b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/systemjs.config.1.js
new file mode 100644
index 0000000000..3a455980bb
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/systemjs.config.1.js
@@ -0,0 +1,58 @@
+/**
+ * System configuration for Angular 2 samples
+ * Adjust as necessary for your application needs.
+ */
+(function(global) {
+
+  // map tells the System loader where to look for things
+  // #docregion paths
+  var map = {
+    'app':                        '/app', // 'dist',
+
+    '@angular':                   '/node_modules/@angular',
+    'angular2-in-memory-web-api': '/node_modules/angular2-in-memory-web-api',
+    'rxjs':                       '/node_modules/rxjs'
+  };
+
+  var packages = {
+    '/app':                       { main: 'main.js',  defaultExtension: 'js' },
+    'rxjs':                       { defaultExtension: 'js' },
+    'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' },
+  };
+  // #enddocregion paths
+
+  var ngPackageNames = [
+    'common',
+    'compiler',
+    'core',
+    'http',
+    'platform-browser',
+    'platform-browser-dynamic',
+    'router',
+    'router-deprecated',
+    'upgrade',
+  ];
+
+  // Individual files (~300 requests):
+  function packIndex(pkgName) {
+    packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' };
+  }
+
+  // Bundled (~40 requests):
+  function packUmd(pkgName) {
+    packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' };
+  };
+
+  var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
+
+  // Add package entries for angular packages
+  ngPackageNames.forEach(setPackageConfig);
+
+  var config = {
+    map: map,
+    packages: packages
+  }
+
+  System.config(config);
+
+})(this);
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-animate/index.d.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-animate/index.d.ts
new file mode 100644
index 0000000000..c720d9293a
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-animate/index.d.ts
@@ -0,0 +1,294 @@
+// Generated by typings
+// Source: https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/f0b2681b481397d0c03557ac2ac4d70c1c61c464/angularjs/angular-animate.d.ts
+declare module "angular-animate" {
+    var _: string;
+    export = _;
+}
+
+/**
+ * ngAnimate module (angular-animate.js)
+ */
+declare namespace angular.animate {
+    interface IAnimateFactory {
+        (...args: any[]): IAnimateCallbackObject;
+    }
+
+    interface IAnimateCallbackObject {
+        eventFn?: (element: IAugmentedJQuery, doneFunction: Function, options: IAnimationOptions) => any;
+        setClass?: (element: IAugmentedJQuery, addedClasses: string, removedClasses: string, doneFunction: Function, options: IAnimationOptions) => any;
+        addClass?: (element: IAugmentedJQuery, addedClasses: string, doneFunction: Function, options: IAnimationOptions) => any;
+        removeClass?: (element: IAugmentedJQuery, removedClasses: string, doneFunction: Function, options: IAnimationOptions) => any;
+        enter?: (element: IAugmentedJQuery, doneFunction: Function, options: IAnimationOptions) => any;
+        leave?: (element: IAugmentedJQuery, doneFunction: Function, options: IAnimationOptions) => any;
+        move?: (element: IAugmentedJQuery, doneFunction: Function, options: IAnimationOptions) => any;
+        animate?: (element: IAugmentedJQuery, fromStyles: string, toStyles: string, doneFunction: Function, options: IAnimationOptions) => any;
+    }
+
+    interface IAnimationPromise extends IPromise<void> {}
+
+    /**
+     * AnimateService
+     * see http://docs.angularjs.org/api/ngAnimate/service/$animate
+     */
+    interface IAnimateService {
+        /**
+         * Sets up an event listener to fire whenever the animation event has fired on the given element or among any of its children.
+         *
+         * @param event the animation event that will be captured (e.g. enter, leave, move, addClass, removeClass, etc...)
+         * @param container the container element that will capture each of the animation events that are fired on itself as well as among its children
+         * @param callback the callback function that will be fired when the listener is triggered
+         */
+        on(event: string, container: JQuery, callback: Function): void;
+
+        /**
+         * Deregisters an event listener based on the event which has been associated with the provided element.
+         *
+         * @param event the animation event (e.g. enter, leave, move, addClass, removeClass, etc...)
+         * @param container the container element the event listener was placed on
+         * @param callback the callback function that was registered as the listener
+         */
+        off(event: string, container?: JQuery, callback?: Function): void;
+
+        /**
+         * Associates the provided element with a host parent element to allow the element to be animated even if it exists outside of the DOM structure of the Angular application.
+         *
+         * @param element the external element that will be pinned
+         * @param parentElement the host parent element that will be associated with the external element
+         */
+        pin(element: JQuery, parentElement: JQuery): void;
+
+        /**
+        * Globally enables / disables animations.
+        *
+        * @param element If provided then the element will be used to represent the enable/disable operation.
+        * @param value If provided then set the animation on or off.
+        * @returns current animation state
+        */
+        enabled(element: JQuery, value?: boolean): boolean;
+        enabled(value: boolean): boolean;
+
+        /**
+         * Cancels the provided animation.
+         */
+        cancel(animationPromise: IAnimationPromise): void;
+
+        /**
+         * Performs an inline animation on the element.
+         *
+         * @param element the element that will be the focus of the animation
+         * @param from a collection of CSS styles that will be applied to the element at the start of the animation
+         * @param to a collection of CSS styles that the element will animate towards
+         * @param className an optional CSS class that will be added to the element for the duration of the animation (the default class is 'ng-inline-animate')
+         * @param options an optional collection of styles that will be picked up by the CSS transition/animation
+         * @returns the animation callback promise
+         */
+        animate(element: JQuery, from: any, to: any, className?: string, options?: IAnimationOptions): IAnimationPromise;
+
+        /**
+         * Appends the element to the parentElement element that resides in the document and then runs the enter animation.
+         *
+         * @param element the element that will be the focus of the enter animation
+         * @param parentElement the parent element of the element that will be the focus of the enter animation
+         * @param afterElement the sibling element (which is the previous element) of the element that will be the focus of the enter animation
+         * @param options an optional collection of styles that will be picked up by the CSS transition/animation
+         * @returns the animation callback promise
+         */
+        enter(element: JQuery, parentElement: JQuery, afterElement?: JQuery, options?: IAnimationOptions): IAnimationPromise;
+
+        /**
+         * Runs the leave animation operation and, upon completion, removes the element from the DOM.
+         *
+         * @param element the element that will be the focus of the leave animation
+         * @param options an optional collection of styles that will be picked up by the CSS transition/animation
+         * @returns the animation callback promise
+         */
+        leave(element: JQuery, options?: IAnimationOptions): IAnimationPromise;
+
+        /**
+         * Fires the move DOM operation. Just before the animation starts, the animate service will either append
+         * it into the parentElement container or add the element directly after the afterElement element if present.
+         * Then the move animation will be run.
+         *
+         * @param element the element that will be the focus of the move animation
+         * @param parentElement the parent element of the element that will be the focus of the move animation
+         * @param afterElement the sibling element (which is the previous element) of the element that will be the focus of the move animation
+         * @returns the animation callback promise
+         */
+        move(element: JQuery, parentElement: JQuery, afterElement?: JQuery): IAnimationPromise;
+
+        /**
+         * Triggers a custom animation event based off the className variable and then attaches the className
+         * value to the element as a CSS class.
+         *
+         * @param element the element that will be animated
+         * @param className the CSS class that will be added to the element and then animated
+         * @param options an optional collection of styles that will be picked up by the CSS transition/animation
+         * @returns the animation callback promise
+         */
+        addClass(element: JQuery, className: string, options?: IAnimationOptions): IAnimationPromise;
+
+        /**
+         * Triggers a custom animation event based off the className variable and then removes the CSS class
+         * provided by the className value from the element.
+         *
+         * @param element the element that will be animated
+         * @param className the CSS class that will be animated and then removed from the element
+         * @param options an optional collection of styles that will be picked up by the CSS transition/animation
+         * @returns the animation callback promise
+         */
+        removeClass(element: JQuery, className: string, options?: IAnimationOptions): IAnimationPromise;
+
+        /**
+         * Adds and/or removes the given CSS classes to and from the element. Once complete, the done() callback
+         * will be fired (if provided).
+         *
+         * @param element the element which will have its CSS classes changed removed from it
+         * @param add the CSS classes which will be added to the element
+         * @param remove the CSS class which will be removed from the element CSS classes have been set on the element
+         * @param options an optional collection of styles that will be picked up by the CSS transition/animation
+         * @returns the animation callback promise
+         */
+        setClass(element: JQuery, add: string, remove: string, options?: IAnimationOptions): IAnimationPromise;
+    }
+
+    /**
+     * AnimateProvider
+     * see http://docs.angularjs.org/api/ngAnimate/provider/$animateProvider
+     */
+    interface IAnimateProvider {
+        /**
+         * Registers a new injectable animation factory function.
+         *
+         * @param name The name of the animation.
+         * @param factory The factory function that will be executed to return the animation object.
+         */
+        register(name: string, factory: IAnimateFactory): void;
+
+        /**
+         * Gets and/or sets the CSS class expression that is checked when performing an animation.
+         *
+         * @param expression The className expression which will be checked against all animations.
+         * @returns The current CSS className expression value. If null then there is no expression value.
+         */
+        classNameFilter(expression?: RegExp): RegExp;
+    }
+
+    /**
+     * Angular Animation Options
+     * see https://docs.angularjs.org/api/ngAnimate/#applying-directive-specific-styles-to-an-animation
+     */
+    interface IAnimationOptions {
+        /**
+         * The ending CSS styles (a key/value object) that will be applied across the animation via a CSS transition.
+         */
+        to?: Object;
+
+        /**
+         * The starting CSS styles (a key/value object) that will be applied at the start of the animation.
+         */
+        from?: Object;
+
+        /**
+         * The DOM event (e.g. enter, leave, move). When used, a generated CSS class of ng-EVENT and
+         * ng-EVENT-active will be applied to the element during the animation. Multiple events can be provided when
+         * spaces are used as a separator. (Note that this will not perform any DOM operation.)
+         */
+        event?: string;
+
+        /**
+         * The CSS easing value that will be applied to the transition or keyframe animation (or both).
+         */
+        easing?: string;
+
+        /**
+         * The raw CSS transition style that will be used (e.g. 1s linear all).
+         */
+        transition?: string;
+
+        /**
+         * The raw CSS keyframe animation style that will be used (e.g. 1s my_animation linear).
+         */
+        keyframe?: string;
+
+        /**
+         * A space separated list of CSS classes that will be added to the element and spread across the animation.
+         */
+        addClass?: string;
+
+        /**
+         * A space separated list of CSS classes that will be removed from the element and spread across
+         * the animation.
+         */
+        removeClass?: string;
+
+        /**
+         * A number value representing the total duration of the transition and/or keyframe (note that a value
+         * of 1 is 1000ms). If a value of 0 is provided then the animation will be skipped entirely.
+         */
+        duration?: number;
+
+        /**
+         * A number value representing the total delay of the transition and/or keyframe (note that a value of
+         * 1 is 1000ms). If a value of true is used then whatever delay value is detected from the CSS classes will be
+         * mirrored on the elements styles (e.g. by setting delay true then the style value of the element will be
+         * transition-delay: DETECTED_VALUE). Using true is useful when you want the CSS classes and inline styles to
+         * all share the same CSS delay value.
+         */
+        delay?: number;
+
+        /**
+         * A numeric time value representing the delay between successively animated elements (Click here to
+         * learn how CSS-based staggering works in ngAnimate.)
+         */
+        stagger?: number;
+
+        /**
+         * The numeric index representing the stagger item (e.g. a value of 5 is equal to the sixth item
+         * in the stagger; therefore when a stagger option value of 0.1 is used then there will be a stagger delay of 600ms)
+         * applyClassesEarly - Whether or not the classes being added or removed will be used when detecting the animation.
+         * This is set by $animate when enter/leave/move animations are fired to ensure that the CSS classes are resolved in time.
+         * (Note that this will prevent any transitions from occuring on the classes being added and removed.)
+         */
+        staggerIndex?: number;
+    }
+
+    interface IAnimateCssRunner {
+        /**
+         * Starts the animation
+         *
+         * @returns The animation runner with a done function for supplying a callback.
+         */
+        start(): IAnimateCssRunnerStart;
+
+        /**
+         * Ends (aborts) the animation
+         */
+        end(): void;
+    }
+
+    interface IAnimateCssRunnerStart extends IPromise<void> {
+        /**
+         * Allows you to add done callbacks to the running animation
+         *
+         * @param callbackFn: the callback function to be run
+         */
+        done(callbackFn: (animationFinished: boolean) => void): void;
+    }
+
+    /**
+     * AnimateCssService
+     * see http://docs.angularjs.org/api/ngAnimate/service/$animateCss
+     */
+    interface IAnimateCssService {
+        (element: JQuery, animateCssOptions: IAnimationOptions): IAnimateCssRunner;
+    }
+}
+
+declare module angular {
+    interface IModule {
+        animation(name: string, animationFactory: angular.animate.IAnimateFactory): IModule;
+        animation(name: string, inlineAnnotatedFunction: any[]): IModule;
+        animation(object: Object): IModule;
+    }
+
+}
\ No newline at end of file
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-animate/typings.json b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-animate/typings.json
new file mode 100644
index 0000000000..ea2467c89a
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-animate/typings.json
@@ -0,0 +1,8 @@
+{
+  "resolution": "main",
+  "tree": {
+    "src": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/f0b2681b481397d0c03557ac2ac4d70c1c61c464/angularjs/angular-animate.d.ts",
+    "raw": "registry:dt/angular-animate#1.5.0+20160407085121",
+    "typings": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/f0b2681b481397d0c03557ac2ac4d70c1c61c464/angularjs/angular-animate.d.ts"
+  }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-mocks/index.d.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-mocks/index.d.ts
new file mode 100644
index 0000000000..fd6e92534b
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-mocks/index.d.ts
@@ -0,0 +1,339 @@
+// Generated by typings
+// Source: https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/5b7257019ae959533341a715b339d2562bbf9b85/angularjs/angular-mocks.d.ts
+declare module "angular-mocks/ngMock" {
+    var _: string;
+    export = _;
+}
+
+declare module "angular-mocks/ngMockE2E" {
+    var _: string;
+    export = _;
+}
+
+declare module "angular-mocks/ngAnimateMock" {
+    var _: string;
+    export = _;
+}
+
+///////////////////////////////////////////////////////////////////////////////
+// ngMock module (angular-mocks.js)
+///////////////////////////////////////////////////////////////////////////////
+declare namespace angular {
+
+    ///////////////////////////////////////////////////////////////////////////
+    // AngularStatic
+    // We reopen it to add the MockStatic definition
+    ///////////////////////////////////////////////////////////////////////////
+    interface IAngularStatic {
+        mock: IMockStatic;
+    }
+
+    // see https://docs.angularjs.org/api/ngMock/function/angular.mock.inject
+    interface IInjectStatic {
+        (...fns: Function[]): any;
+        (...inlineAnnotatedConstructor: any[]): any; // this overload is undocumented, but works
+        strictDi(val?: boolean): void;
+    }
+
+    interface IMockStatic {
+        // see https://docs.angularjs.org/api/ngMock/function/angular.mock.dump
+        dump(obj: any): string;
+
+        inject: IInjectStatic
+
+        // see https://docs.angularjs.org/api/ngMock/function/angular.mock.module
+        module: {
+          (...modules: any[]): any;
+          sharedInjector(): void;
+        }
+
+        // see https://docs.angularjs.org/api/ngMock/type/angular.mock.TzDate
+        TzDate(offset: number, timestamp: number): Date;
+        TzDate(offset: number, timestamp: string): Date;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // ExceptionHandlerService
+    // see https://docs.angularjs.org/api/ngMock/service/$exceptionHandler
+    // see https://docs.angularjs.org/api/ngMock/provider/$exceptionHandlerProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface IExceptionHandlerProvider extends IServiceProvider {
+        mode(mode: string): void;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // TimeoutService
+    // see https://docs.angularjs.org/api/ngMock/service/$timeout
+    // Augments the original service
+    ///////////////////////////////////////////////////////////////////////////
+    interface ITimeoutService {
+        flush(delay?: number): void;
+        flushNext(expectedDelay?: number): void;
+        verifyNoPendingTasks(): void;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // IntervalService
+    // see https://docs.angularjs.org/api/ngMock/service/$interval
+    // Augments the original service
+    ///////////////////////////////////////////////////////////////////////////
+    interface IIntervalService {
+        flush(millis?: number): number;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // LogService
+    // see https://docs.angularjs.org/api/ngMock/service/$log
+    // Augments the original service
+    ///////////////////////////////////////////////////////////////////////////
+    interface ILogService {
+        assertEmpty(): void;
+        reset(): void;
+    }
+
+    interface ILogCall {
+        logs: string[];
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // ControllerService mock
+    // see https://docs.angularjs.org/api/ngMock/service/$controller
+    // This interface extends http://docs.angularjs.org/api/ng.$controller
+    ///////////////////////////////////////////////////////////////////////////
+    interface IControllerService {
+      // Although the documentation doesn't state this, locals are optional
+      <T>(controllerConstructor: new (...args: any[]) => T, locals?: any, bindings?: any): T;
+      <T>(controllerConstructor: Function, locals?: any, bindings?: any): T;
+      <T>(controllerName: string, locals?: any, bindings?: any): T;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // ComponentControllerService
+    // see https://docs.angularjs.org/api/ngMock/service/$componentController
+    ///////////////////////////////////////////////////////////////////////////
+    interface IComponentControllerService {
+      // TBinding is an interface exposed by a component as per John Papa's style guide
+      // https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#accessible-members-up-top
+      <T, TBinding>(componentName: string, locals: { $scope: IScope, [key: string]: any }, bindings?: TBinding, ident?: string): T;
+    }
+
+
+    ///////////////////////////////////////////////////////////////////////////
+    // HttpBackendService
+    // see https://docs.angularjs.org/api/ngMock/service/$httpBackend
+    ///////////////////////////////////////////////////////////////////////////
+    interface IHttpBackendService {
+        /**
+          * Flushes all pending requests using the trained responses.
+          * @param count Number of responses to flush (in the order they arrived). If undefined, all pending requests will be flushed.
+          */
+        flush(count?: number): void;
+
+        /**
+          * Resets all request expectations, but preserves all backend definitions.
+          */
+        resetExpectations(): void;
+
+        /**
+          * Verifies that all of the requests defined via the expect api were made. If any of the requests were not made, verifyNoOutstandingExpectation throws an exception.
+          */
+        verifyNoOutstandingExpectation(): void;
+
+        /**
+          * Verifies that there are no outstanding requests that need to be flushed.
+          */
+        verifyNoOutstandingRequest(): void;
+
+        /**
+          * Creates a new request expectation.
+          * Throws a preformatted error if expectation(s) don't match supplied string, regular expression, object, or if function returns false.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param method HTTP method.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param data HTTP request body string, json object, regular expression or function that receives the data and returns true if the data matches the current expectation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        expect(method: string, url: string | RegExp | ((url: string) => boolean), data?: string | RegExp | Object | ((data: string) => boolean), headers?: Object | ((object: Object) => boolean)) :mock.IRequestHandler;
+
+        /**
+          * Creates a new request expectation for DELETE requests.
+          * Throws a preformatted error if expectation(s) don't match supplied string, regular expression, object, or if function returns false.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url is as expected.
+          * @param headers HTTP headers object to be compared with the HTTP headers in the request.
+        */
+        expectDELETE(url: string | RegExp | ((url: string) => boolean), headers?: Object): mock.IRequestHandler;
+
+        /**
+          * Creates a new request expectation for GET requests.
+          * Throws a preformatted error if expectation(s) don't match supplied string, regular expression, object, or if function returns false.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param headers HTTP headers object to be compared with the HTTP headers in the request.
+          */
+        expectGET(url: string | RegExp | ((url: string) => boolean), headers?: Object): mock.IRequestHandler;
+
+        /**
+          * Creates a new request expectation for HEAD requests.
+          * Throws a preformatted error if expectation(s) don't match supplied string, regular expression, object, or if function returns false.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param headers HTTP headers object to be compared with the HTTP headers in the request.
+          */
+        expectHEAD(url: string | RegExp | ((url: string) => boolean), headers?: Object): mock.IRequestHandler;
+
+        /**
+          * Creates a new request expectation for JSONP requests.
+          * Throws a preformatted error if expectation(s) don't match supplied string, regular expression, or if function returns false.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          */
+        expectJSONP(url: string | RegExp | ((url: string) => boolean)): mock.IRequestHandler;
+
+        /**
+          * Creates a new request expectation for PATCH requests.
+          * Throws a preformatted error if expectation(s) don't match supplied string, regular expression, object, or if function returns false.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param data HTTP request body string, json object, regular expression or function that receives the data and returns true if the data matches the current expectation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        expectPATCH(url: string | RegExp | ((url: string) => boolean), data?: string | RegExp | Object | ((data: string) => boolean), headers?: Object): mock.IRequestHandler;
+
+        /**
+          * Creates a new request expectation for POST requests.
+          * Throws a preformatted error if expectation(s) don't match supplied string, regular expression, object, or if function returns false.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param data HTTP request body string, json object, regular expression or function that receives the data and returns true if the data matches the current expectation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        expectPOST(url: string | RegExp | ((url: string) => boolean), data?: string | RegExp | Object | ((data: string) => boolean), headers?: Object): mock.IRequestHandler;
+
+        /**
+          * Creates a new request expectation for PUT requests.
+          * Throws a preformatted error if expectation(s) don't match supplied string, regular expression, object, or if function returns false.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param data HTTP request body string, json object, regular expression or function that receives the data and returns true if the data matches the current expectation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        expectPUT(url: string | RegExp | ((url: string) => boolean), data?: string | RegExp | Object | ((data: string) => boolean), headers?: Object): mock.IRequestHandler;
+
+        /**
+          * Creates a new backend definition.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param method HTTP method.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param data HTTP request body string, json object, regular expression or function that receives the data and returns true if the data matches the current expectation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        when(method: string, url: string | RegExp | ((url: string) => boolean), data?: string | RegExp | Object | ((data: string) => boolean), headers?: Object | ((object: Object) => boolean)): mock.IRequestHandler;
+
+        /**
+          * Creates a new backend definition for DELETE requests.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        whenDELETE(url: string | RegExp | ((url: string) => boolean), headers?: Object | ((object: Object) => boolean)): mock.IRequestHandler;
+
+        /**
+          * Creates a new backend definition for GET requests.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        whenGET(url: string | RegExp | ((url: string) => boolean), headers?: Object | ((object: Object) => boolean)): mock.IRequestHandler;
+
+        /**
+          * Creates a new backend definition for HEAD requests.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        whenHEAD(url: string | RegExp | ((url: string) => boolean), headers?: Object | ((object: Object) => boolean)): mock.IRequestHandler;
+
+        /**
+          * Creates a new backend definition for JSONP requests.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        whenJSONP(url: string | RegExp | ((url: string) => boolean)): mock.IRequestHandler;
+
+        /**
+          * Creates a new backend definition for PATCH requests.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param data HTTP request body string, json object, regular expression or function that receives the data and returns true if the data matches the current expectation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        whenPATCH(url: string | RegExp | ((url: string) => boolean), data?: string | RegExp | Object | ((data: string) => boolean), headers?: Object | ((object: Object) => boolean)): mock.IRequestHandler;
+
+        /**
+          * Creates a new backend definition for POST requests.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param data HTTP request body string, json object, regular expression or function that receives the data and returns true if the data matches the current expectation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        whenPOST(url: string | RegExp | ((url: string) => boolean), data?: string | RegExp | Object | ((data: string) => boolean), headers?: Object | ((object: Object) => boolean)): mock.IRequestHandler;
+
+        /**
+          * Creates a new backend definition for PUT requests.
+          * Returns an object with respond method that controls how a matched request is handled.
+          * @param url HTTP url string, regular expression or function that receives a url and returns true if the url matches the current expctation.
+          * @param data HTTP request body string, json object, regular expression or function that receives the data and returns true if the data matches the current expectation.
+          * @param headers HTTP headers object or function that receives the headers and returns true if the headers match the current expectation.
+          */
+        whenPUT(url: string | RegExp | ((url: string) => boolean), data?: string | RegExp | Object | ((data: string) => boolean), headers?: Object | ((object: Object) => boolean)): mock.IRequestHandler;
+    }
+
+    export module mock {
+        // returned interface by the the mocked HttpBackendService expect/when methods
+        interface IRequestHandler {
+
+            /**
+              * Controls the response for a matched request using a function to construct the response.
+              * Returns the RequestHandler object for possible overrides.
+              * @param func Function that receives the request HTTP method, url, data, and headers and returns an array containing response status (number), data, headers, and status text.
+              */
+            respond(func: ((method: string, url: string, data: string | Object, headers: Object) => [number, string | Object, Object, string])): IRequestHandler;
+
+            /**
+              * Controls the response for a matched request using supplied static data to construct the response.
+              * Returns the RequestHandler object for possible overrides.
+              * @param status HTTP status code to add to the response.
+              * @param data Data to add to the response.
+              * @param headers Headers object to add to the response.
+              * @param responseText Response text to add to the response.
+              */
+            respond(status: number, data: string | Object, headers?: Object, responseText?: string): IRequestHandler;
+
+            /**
+              * Controls the response for a matched request using the HTTP status code 200 and supplied static data to construct the response.
+              * Returns the RequestHandler object for possible overrides.
+              * @param data Data to add to the response.
+              * @param headers Headers object to add to the response.
+              * @param responseText Response text to add to the response.
+              */
+            respond(data: string | Object, headers?: Object, responseText?: string): IRequestHandler;
+
+            // Available when ngMockE2E is loaded
+            /**
+              * Any request matching a backend definition or expectation with passThrough handler will be passed through to the real backend (an XHR request will be made to the server.)
+              */
+            passThrough(): IRequestHandler;
+        }
+
+    }
+
+}
+
+///////////////////////////////////////////////////////////////////////////////
+// functions attached to global object (window)
+///////////////////////////////////////////////////////////////////////////////
+//Use `angular.mock.module` instead of `module`, as `module` conflicts with commonjs.
+//declare var module: (...modules: any[]) => any;
+declare var inject: angular.IInjectStatic;
\ No newline at end of file
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-mocks/typings.json b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-mocks/typings.json
new file mode 100644
index 0000000000..4e51b0e278
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-mocks/typings.json
@@ -0,0 +1,8 @@
+{
+  "resolution": "main",
+  "tree": {
+    "src": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/5b7257019ae959533341a715b339d2562bbf9b85/angularjs/angular-mocks.d.ts",
+    "raw": "registry:dt/angular-mocks#1.3.0+20160425155016",
+    "typings": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/5b7257019ae959533341a715b339d2562bbf9b85/angularjs/angular-mocks.d.ts"
+  }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-resource/index.d.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-resource/index.d.ts
new file mode 100644
index 0000000000..3735f9430c
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-resource/index.d.ts
@@ -0,0 +1,191 @@
+// Generated by typings
+// Source: https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/e684481e0cd360db62fd6213ca7248245315e8a2/angularjs/angular-resource.d.ts
+declare module 'angular-resource' {
+    var _: string;
+    export = _;
+}
+
+///////////////////////////////////////////////////////////////////////////////
+// ngResource module (angular-resource.js)
+///////////////////////////////////////////////////////////////////////////////
+declare namespace angular.resource {
+
+    /**
+     * Currently supported options for the $resource factory options argument.
+     */
+    interface IResourceOptions {
+        /**
+         * If true then the trailing slashes from any calculated URL will be stripped (defaults to true)
+         */
+        stripTrailingSlashes?: boolean;
+        /**
+         * If true, the request made by a "non-instance" call will be cancelled (if not already completed) by calling
+         * $cancelRequest() on the call's return value. This can be overwritten per action. (Defaults to false.)
+         */
+        cancellable?: boolean;
+    }
+
+
+    ///////////////////////////////////////////////////////////////////////////
+    // ResourceService
+    // see http://docs.angularjs.org/api/ngResource.$resource
+    // Most part of the following definitions were achieved by analyzing the
+    // actual implementation, since the documentation doesn't seem to cover
+    // that deeply.
+    ///////////////////////////////////////////////////////////////////////////
+    interface IResourceService {
+        (url: string, paramDefaults?: any,
+            /** example:  {update: { method: 'PUT' }, delete: deleteDescriptor }
+             where deleteDescriptor : IActionDescriptor */
+            actions?: any, options?: IResourceOptions): IResourceClass<IResource<any>>;
+        <T, U>(url: string, paramDefaults?: any,
+            /** example:  {update: { method: 'PUT' }, delete: deleteDescriptor }
+             where deleteDescriptor : IActionDescriptor */
+            actions?: any, options?: IResourceOptions): U;
+        <T>(url: string, paramDefaults?: any,
+            /** example:  {update: { method: 'PUT' }, delete: deleteDescriptor }
+             where deleteDescriptor : IActionDescriptor */
+            actions?: any, options?: IResourceOptions): IResourceClass<T>;
+    }
+
+    // Just a reference to facilitate describing new actions
+    interface IActionDescriptor {
+        method: string;
+        params?: any;
+        url?: string;
+        isArray?: boolean;
+        transformRequest?: angular.IHttpRequestTransformer | angular.IHttpRequestTransformer[];
+        transformResponse?: angular.IHttpResponseTransformer | angular.IHttpResponseTransformer[];
+        headers?: any;
+        cache?: boolean | angular.ICacheObject;
+        /**
+         * Note: In contrast to $http.config, promises are not supported in $resource, because the same value
+         * would be used for multiple requests. If you are looking for a way to cancel requests, you should
+         * use the cancellable option.
+         */
+        timeout?: number
+        cancellable?: boolean;
+        withCredentials?: boolean;
+        responseType?: string;
+        interceptor?: IHttpInterceptor;
+    }
+
+    // Allow specify more resource methods
+    // No need to add duplicates for all four overloads.
+    interface IResourceMethod<T> {
+        (): T;
+        (params: Object): T;
+        (success: Function, error?: Function): T;
+        (params: Object, success: Function, error?: Function): T;
+        (params: Object, data: Object, success?: Function, error?: Function): T;
+    }
+
+    // Allow specify resource moethod which returns the array
+    // No need to add duplicates for all four overloads.
+    interface IResourceArrayMethod<T> {
+        (): IResourceArray<T>;
+        (params: Object): IResourceArray<T>;
+        (success: Function, error?: Function): IResourceArray<T>;
+        (params: Object, success: Function, error?: Function): IResourceArray<T>;
+        (params: Object, data: Object, success?: Function, error?: Function): IResourceArray<T>;
+    }
+
+    // Baseclass for everyresource with default actions.
+    // If you define your new actions for the resource, you will need
+    // to extend this interface and typecast the ResourceClass to it.
+    //
+    // In case of passing the first argument as anything but a function,
+    // it's gonna be considered data if the action method is POST, PUT or
+    // PATCH (in other words, methods with body). Otherwise, it's going
+    // to be considered as parameters to the request.
+    // https://github.com/angular/angular.js/blob/v1.2.0/src/ngResource/resource.js#L461-L465
+    //
+    // Only those methods with an HTTP body do have 'data' as first parameter:
+    // https://github.com/angular/angular.js/blob/v1.2.0/src/ngResource/resource.js#L463
+    // More specifically, those methods are POST, PUT and PATCH:
+    // https://github.com/angular/angular.js/blob/v1.2.0/src/ngResource/resource.js#L432
+    //
+    // Also, static calls always return the IResource (or IResourceArray) retrieved
+    // https://github.com/angular/angular.js/blob/v1.2.0/src/ngResource/resource.js#L538-L549
+    interface IResourceClass<T> {
+        new(dataOrParams? : any) : T;
+        get: IResourceMethod<T>;
+
+        query: IResourceArrayMethod<T>;
+
+        save: IResourceMethod<T>;
+
+        remove: IResourceMethod<T>;
+
+        delete: IResourceMethod<T>;
+    }
+
+    // Instance calls always return the the promise of the request which retrieved the object
+    // https://github.com/angular/angular.js/blob/v1.2.0/src/ngResource/resource.js#L538-L546
+    interface IResource<T> {
+        $get(): angular.IPromise<T>;
+        $get(params?: Object, success?: Function, error?: Function): angular.IPromise<T>;
+        $get(success: Function, error?: Function): angular.IPromise<T>;
+
+        $query(): angular.IPromise<IResourceArray<T>>;
+        $query(params?: Object, success?: Function, error?: Function): angular.IPromise<IResourceArray<T>>;
+        $query(success: Function, error?: Function): angular.IPromise<IResourceArray<T>>;
+
+        $save(): angular.IPromise<T>;
+        $save(params?: Object, success?: Function, error?: Function): angular.IPromise<T>;
+        $save(success: Function, error?: Function): angular.IPromise<T>;
+
+        $remove(): angular.IPromise<T>;
+        $remove(params?: Object, success?: Function, error?: Function): angular.IPromise<T>;
+        $remove(success: Function, error?: Function): angular.IPromise<T>;
+
+        $delete(): angular.IPromise<T>;
+        $delete(params?: Object, success?: Function, error?: Function): angular.IPromise<T>;
+        $delete(success: Function, error?: Function): angular.IPromise<T>;
+
+        $cancelRequest(): void;
+
+        /** the promise of the original server interaction that created this instance. **/
+        $promise : angular.IPromise<T>;
+        $resolved : boolean;
+        toJSON(): T;
+    }
+
+    /**
+     * Really just a regular Array object with $promise and $resolve attached to it
+     */
+    interface IResourceArray<T> extends Array<T & IResource<T>> {
+        /** the promise of the original server interaction that created this collection. **/
+        $promise : angular.IPromise<IResourceArray<T>>;
+        $resolved : boolean;
+    }
+
+    /** when creating a resource factory via IModule.factory */
+    interface IResourceServiceFactoryFunction<T> {
+        ($resource: angular.resource.IResourceService): IResourceClass<T>;
+        <U extends IResourceClass<T>>($resource: angular.resource.IResourceService): U;
+    }
+
+    // IResourceServiceProvider used to configure global settings
+    interface IResourceServiceProvider extends angular.IServiceProvider {
+
+        defaults: IResourceOptions;
+    }
+
+}
+
+/** extensions to base ng based on using angular-resource */
+declare namespace angular {
+
+    interface IModule {
+        /** creating a resource service factory */
+        factory(name: string, resourceServiceFactoryFunction: angular.resource.IResourceServiceFactoryFunction<any>): IModule;
+    }
+}
+
+interface Array<T>
+{
+    /** the promise of the original server interaction that created this collection. **/
+    $promise : angular.IPromise<Array<T>>;
+    $resolved : boolean;
+}
\ No newline at end of file
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-resource/typings.json b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-resource/typings.json
new file mode 100644
index 0000000000..b60eafd673
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-resource/typings.json
@@ -0,0 +1,8 @@
+{
+  "resolution": "main",
+  "tree": {
+    "src": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/e684481e0cd360db62fd6213ca7248245315e8a2/angularjs/angular-resource.d.ts",
+    "raw": "registry:dt/angular-resource#1.5.0+20160412142209",
+    "typings": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/e684481e0cd360db62fd6213ca7248245315e8a2/angularjs/angular-resource.d.ts"
+  }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-route/index.d.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-route/index.d.ts
new file mode 100644
index 0000000000..5fad393d0a
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-route/index.d.ts
@@ -0,0 +1,154 @@
+// Generated by typings
+// Source: https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/7de6c3dd94feaeb21f20054b9f30d5dabc5efabd/angularjs/angular-route.d.ts
+declare module "angular-route" {
+    var _: string;
+    export = _;
+}
+
+///////////////////////////////////////////////////////////////////////////////
+// ngRoute module (angular-route.js)
+///////////////////////////////////////////////////////////////////////////////
+declare namespace angular.route {
+
+    ///////////////////////////////////////////////////////////////////////////
+    // RouteParamsService
+    // see http://docs.angularjs.org/api/ngRoute.$routeParams
+    ///////////////////////////////////////////////////////////////////////////
+    interface IRouteParamsService {
+        [key: string]: any;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // RouteService
+    // see http://docs.angularjs.org/api/ngRoute.$route
+    // see http://docs.angularjs.org/api/ngRoute.$routeProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface IRouteService {
+        reload(): void;
+        routes: any;
+
+        // May not always be available. For instance, current will not be available
+        // to a controller that was not initialized as a result of a route maching.
+        current?: ICurrentRoute;
+
+        /**
+         * Causes $route service to update the current URL, replacing current route parameters with those specified in newParams.
+         * Provided property names that match the route's path segment definitions will be interpolated into the
+         * location's path, while remaining properties will be treated as query params.
+         *
+         * @param newParams Object.<string, string> mapping of URL parameter names to values
+         */
+        updateParams(newParams:{[key:string]:string}): void;
+
+    }
+
+    type InlineAnnotatedFunction = Function|Array<string|Function>
+
+    /**
+     * see http://docs.angularjs.org/api/ngRoute/provider/$routeProvider#when for API documentation
+     */
+    interface IRoute {
+        /**
+         * {(string|function()=}
+         * Controller fn that should be associated with newly created scope or the name of a registered controller if passed as a string.
+         */
+        controller?: string|InlineAnnotatedFunction;
+        /**
+         * A controller alias name. If present the controller will be published to scope under the controllerAs name.
+         */
+        controllerAs?: string;
+        /**
+         * Undocumented?
+         */
+        name?: string;
+        /**
+         * {string=|function()=}
+         * Html template as a string or a function that returns an html template as a string which should be used by ngView or ngInclude directives. This property takes precedence over templateUrl.
+         *
+         * If template is a function, it will be called with the following parameters:
+         *
+         * {Array.<Object>} - route parameters extracted from the current $location.path() by applying the current route
+         */
+        template?: string|{($routeParams?: angular.route.IRouteParamsService) : string;}
+        /**
+         * {string=|function()=}
+         * Path or function that returns a path to an html template that should be used by ngView.
+         *
+         * If templateUrl is a function, it will be called with the following parameters:
+         *
+         * {Array.<Object>} - route parameters extracted from the current $location.path() by applying the current route
+         */
+        templateUrl?: string|{ ($routeParams?: angular.route.IRouteParamsService): string; }
+        /**
+         * {Object.<string, function>=} - An optional map of dependencies which should be injected into the controller. If any of these dependencies are promises, the router will wait for them all to be resolved or one to be rejected before the controller is instantiated. If all the promises are resolved successfully, the values of the resolved promises are injected and $routeChangeSuccess event is fired. If any of the promises are rejected the $routeChangeError event is fired. The map object is:
+         *
+         * - key - {string}: a name of a dependency to be injected into the controller.
+         * - factory - {string|function}: If string then it is an alias for a service. Otherwise if function, then it is injected and the return value is treated as the dependency. If the result is a promise, it is resolved before its value is injected into the controller. Be aware that ngRoute.$routeParams will still refer to the previous route within these resolve functions. Use $route.current.params to access the new route parameters, instead.
+         */
+        resolve?: {[key: string]: any};
+        /**
+         * {(string|function())=}
+         * Value to update $location path with and trigger route redirection.
+         *
+         * If redirectTo is a function, it will be called with the following parameters:
+         *
+         * - {Object.<string>} - route parameters extracted from the current $location.path() by applying the current route templateUrl.
+         * - {string} - current $location.path()
+         * - {Object} - current $location.search()
+         * - The custom redirectTo function is expected to return a string which will be used to update $location.path() and $location.search().
+         */
+        redirectTo?: string|{($routeParams?: angular.route.IRouteParamsService, $locationPath?: string, $locationSearch?: any) : string};
+        /**
+         * Reload route when only $location.search() or $location.hash() changes.
+         *
+         * This option defaults to true. If the option is set to false and url in the browser changes, then $routeUpdate event is broadcasted on the root scope.
+         */
+        reloadOnSearch?: boolean;
+        /**
+         * Match routes without being case sensitive
+         *
+         * This option defaults to false. If the option is set to true, then the particular route can be matched without being case sensitive
+         */
+        caseInsensitiveMatch?: boolean;
+    }
+
+    // see http://docs.angularjs.org/api/ng.$route#current
+    interface ICurrentRoute extends IRoute {
+        locals: {
+            [index: string]: any;
+            $scope: IScope;
+            $template: string;
+        };
+
+        params: any;
+    }
+
+    interface IRouteProvider extends IServiceProvider {
+		/**
+         * Match routes without being case sensitive
+         *
+         * This option defaults to false. If the option is set to true, then the particular route can be matched without being case sensitive
+         */
+        caseInsensitiveMatch?: boolean;
+        /**
+         * Sets route definition that will be used on route change when no other route definition is matched.
+         *
+         * @params Mapping information to be assigned to $route.current.
+         */
+        otherwise(params: IRoute): IRouteProvider;
+        /**
+         * Adds a new route definition to the $route service.
+         *
+         * @param path Route path (matched against $location.path). If $location.path contains redundant trailing slash or is missing one, the route will still match and the $location.path will be updated to add or drop the trailing slash to exactly match the route definition.
+         *
+         * - path can contain named groups starting with a colon: e.g. :name. All characters up to the next slash are matched and stored in $routeParams under the given name when the route matches.
+         * - path can contain named groups starting with a colon and ending with a star: e.g.:name*. All characters are eagerly stored in $routeParams under the given name when the route matches.
+         * - path can contain optional named groups with a question mark: e.g.:name?.
+         *
+         * For example, routes like /color/:color/largecode/:largecode*\/edit will match /color/brown/largecode/code/with/slashes/edit and extract: color: brown and largecode: code/with/slashes.
+         *
+         * @param route Mapping information to be assigned to $route.current on route match.
+         */
+        when(path: string, route: IRoute): IRouteProvider;
+    }
+}
\ No newline at end of file
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-route/typings.json b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-route/typings.json
new file mode 100644
index 0000000000..4c4677f34f
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular-route/typings.json
@@ -0,0 +1,8 @@
+{
+  "resolution": "main",
+  "tree": {
+    "src": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/7de6c3dd94feaeb21f20054b9f30d5dabc5efabd/angularjs/angular-route.d.ts",
+    "raw": "registry:dt/angular-route#1.3.0+20160317120654",
+    "typings": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/7de6c3dd94feaeb21f20054b9f30d5dabc5efabd/angularjs/angular-route.d.ts"
+  }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular/index.d.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular/index.d.ts
new file mode 100644
index 0000000000..dfde81e26b
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular/index.d.ts
@@ -0,0 +1,1953 @@
+// Generated by typings
+// Source: https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/b76dd8a7f95b71696982befbb7589940d27e940b/angularjs/angular.d.ts
+declare var angular: angular.IAngularStatic;
+
+// Support for painless dependency injection
+interface Function {
+    $inject?: string[];
+}
+
+// Collapse angular into ng
+import ng = angular;
+// Support AMD require
+declare module 'angular' {
+    export = angular;
+}
+
+///////////////////////////////////////////////////////////////////////////////
+// ng module (angular.js)
+///////////////////////////////////////////////////////////////////////////////
+declare namespace angular {
+
+    // not directly implemented, but ensures that constructed class implements $get
+    interface IServiceProviderClass {
+        new (...args: any[]): IServiceProvider;
+    }
+
+    interface IServiceProviderFactory {
+        (...args: any[]): IServiceProvider;
+    }
+
+    // All service providers extend this interface
+    interface IServiceProvider {
+        $get: any;
+    }
+
+    interface IAngularBootstrapConfig {
+        strictDi?: boolean;
+        debugInfoEnabled?: boolean;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // AngularStatic
+    // see http://docs.angularjs.org/api
+    ///////////////////////////////////////////////////////////////////////////
+    interface IAngularStatic {
+        bind(context: any, fn: Function, ...args: any[]): Function;
+
+        /**
+         * Use this function to manually start up angular application.
+         *
+         * @param element DOM element which is the root of angular application.
+         * @param modules An array of modules to load into the application.
+         *     Each item in the array should be the name of a predefined module or a (DI annotated)
+         *     function that will be invoked by the injector as a config block.
+         * @param config an object for defining configuration options for the application. The following keys are supported:
+         *     - `strictDi`: disable automatic function annotation for the application. This is meant to assist in finding bugs which break minified code.
+         */
+        bootstrap(element: string|Element|JQuery|Document, modules?: (string|Function|any[])[], config?: IAngularBootstrapConfig): auto.IInjectorService;
+
+        /**
+         * Creates a deep copy of source, which should be an object or an array.
+         *
+         * - If no destination is supplied, a copy of the object or array is created.
+         * - If a destination is provided, all of its elements (for array) or properties (for objects) are deleted and then all elements/properties from the source are copied to it.
+         * - If source is not an object or array (inc. null and undefined), source is returned.
+         * - If source is identical to 'destination' an exception will be thrown.
+         *
+         * @param source The source that will be used to make a copy. Can be any type, including primitives, null, and undefined.
+         * @param destination Destination into which the source is copied. If provided, must be of the same type as source.
+         */
+        copy<T>(source: T, destination?: T): T;
+
+        /**
+         * Wraps a raw DOM element or HTML string as a jQuery element.
+         *
+         * If jQuery is available, angular.element is an alias for the jQuery function. If jQuery is not available, angular.element delegates to Angular's built-in subset of jQuery, called "jQuery lite" or "jqLite."
+         */
+        element: IAugmentedJQueryStatic;
+        equals(value1: any, value2: any): boolean;
+        extend(destination: any, ...sources: any[]): any;
+
+        /**
+         * Invokes the iterator function once for each item in obj collection, which can be either an object or an array. The iterator function is invoked with iterator(value, key), where value is the value of an object property or an array element and key is the object property key or array element index. Specifying a context for the function is optional.
+         *
+         * It is worth noting that .forEach does not iterate over inherited properties because it filters using the hasOwnProperty method.
+         *
+         * @param obj Object to iterate over.
+         * @param iterator Iterator function.
+         * @param context Object to become context (this) for the iterator function.
+         */
+        forEach<T>(obj: T[], iterator: (value: T, key: number) => any, context?: any): any;
+        /**
+         * Invokes the iterator function once for each item in obj collection, which can be either an object or an array. The iterator function is invoked with iterator(value, key), where value is the value of an object property or an array element and key is the object property key or array element index. Specifying a context for the function is optional.
+         *
+         * It is worth noting that .forEach does not iterate over inherited properties because it filters using the hasOwnProperty method.
+         *
+         * @param obj Object to iterate over.
+         * @param iterator Iterator function.
+         * @param context Object to become context (this) for the iterator function.
+         */
+        forEach<T>(obj: { [index: string]: T; }, iterator: (value: T, key: string) => any, context?: any): any;
+        /**
+         * Invokes the iterator function once for each item in obj collection, which can be either an object or an array. The iterator function is invoked with iterator(value, key), where value is the value of an object property or an array element and key is the object property key or array element index. Specifying a context for the function is optional.
+         *
+         * It is worth noting that .forEach does not iterate over inherited properties because it filters using the hasOwnProperty method.
+         *
+         * @param obj Object to iterate over.
+         * @param iterator Iterator function.
+         * @param context Object to become context (this) for the iterator function.
+         */
+        forEach(obj: any, iterator: (value: any, key: any) => any, context?: any): any;
+
+        fromJson(json: string): any;
+        identity<T>(arg?: T): T;
+        injector(modules?: any[], strictDi?: boolean): auto.IInjectorService;
+        isArray(value: any): boolean;
+        isDate(value: any): boolean;
+        isDefined(value: any): boolean;
+        isElement(value: any): boolean;
+        isFunction(value: any): boolean;
+        isNumber(value: any): boolean;
+        isObject(value: any): boolean;
+        isString(value: any): boolean;
+        isUndefined(value: any): boolean;
+        lowercase(str: string): string;
+
+        /**
+         * Deeply extends the destination object dst by copying own enumerable properties from the src object(s) to dst. You can specify multiple src objects. If you want to preserve original objects, you can do so by passing an empty object as the target: var object = angular.merge({}, object1, object2).
+         *
+         * Unlike extend(), merge() recursively descends into object properties of source objects, performing a deep copy.
+         *
+         * @param dst Destination object.
+         * @param src Source object(s).
+         */
+        merge(dst: any, ...src: any[]): any;
+
+        /**
+         * The angular.module is a global place for creating, registering and retrieving Angular modules. All modules (angular core or 3rd party) that should be available to an application must be registered using this mechanism.
+         *
+         * When passed two or more arguments, a new module is created. If passed only one argument, an existing module (the name passed as the first argument to module) is retrieved.
+         *
+         * @param name The name of the module to create or retrieve.
+         * @param requires The names of modules this module depends on. If specified then new module is being created. If unspecified then the module is being retrieved for further configuration.
+         * @param configFn Optional configuration function for the module.
+         */
+        module(
+            name: string,
+            requires?: string[],
+            configFn?: Function): IModule;
+
+        noop(...args: any[]): void;
+        reloadWithDebugInfo(): void;
+        toJson(obj: any, pretty?: boolean): string;
+        uppercase(str: string): string;
+        version: {
+            full: string;
+            major: number;
+            minor: number;
+            dot: number;
+            codeName: string;
+        };
+
+        /**
+         * If window.name contains prefix NG_DEFER_BOOTSTRAP! when angular.bootstrap is called, the bootstrap process will be paused until angular.resumeBootstrap() is called.
+         * @param extraModules An optional array of modules that should be added to the original list of modules that the app was about to be bootstrapped with.
+         */
+        resumeBootstrap?(extraModules?: string[]): ng.auto.IInjectorService;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // Module
+    // see http://docs.angularjs.org/api/angular.Module
+    ///////////////////////////////////////////////////////////////////////////
+    interface IModule {
+        /**
+         * Use this method to register a component.
+         *
+         * @param name The name of the component.
+         * @param options A definition object passed into the component.
+         */
+        component(name: string, options: IComponentOptions): IModule;
+        /**
+         * Use this method to register work which needs to be performed on module loading.
+         *
+         * @param configFn Execute this function on module load. Useful for service configuration.
+         */
+        config(configFn: Function): IModule;
+        /**
+         * Use this method to register work which needs to be performed on module loading.
+         *
+         * @param inlineAnnotatedFunction Execute this function on module load. Useful for service configuration.
+         */
+        config(inlineAnnotatedFunction: any[]): IModule;
+        config(object: Object): IModule;
+        /**
+         * Register a constant service, such as a string, a number, an array, an object or a function, with the $injector. Unlike value it can be injected into a module configuration function (see config) and it cannot be overridden by an Angular decorator.
+         *
+         * @param name The name of the constant.
+         * @param value The constant value.
+         */
+        constant<T>(name: string, value: T): IModule;
+        constant(object: Object): IModule;
+        /**
+         * The $controller service is used by Angular to create new controllers.
+         *
+         * This provider allows controller registration via the register method.
+         *
+         * @param name Controller name, or an object map of controllers where the keys are the names and the values are the constructors.
+         * @param controllerConstructor Controller constructor fn (optionally decorated with DI annotations in the array notation).
+         */
+        controller(name: string, controllerConstructor: Function): IModule;
+        /**
+         * The $controller service is used by Angular to create new controllers.
+         *
+         * This provider allows controller registration via the register method.
+         *
+         * @param name Controller name, or an object map of controllers where the keys are the names and the values are the constructors.
+         * @param controllerConstructor Controller constructor fn (optionally decorated with DI annotations in the array notation).
+         */
+        controller(name: string, inlineAnnotatedConstructor: any[]): IModule;
+        controller(object: Object): IModule;
+        /**
+         * Register a new directive with the compiler.
+         *
+         * @param name Name of the directive in camel-case (i.e. ngBind which will match as ng-bind)
+         * @param directiveFactory An injectable directive factory function.
+         */
+        directive(name: string, directiveFactory: IDirectiveFactory): IModule;
+        /**
+         * Register a new directive with the compiler.
+         *
+         * @param name Name of the directive in camel-case (i.e. ngBind which will match as ng-bind)
+         * @param directiveFactory An injectable directive factory function.
+         */
+        directive(name: string, inlineAnnotatedFunction: any[]): IModule;
+        directive(object: Object): IModule;
+        /**
+         * Register a service factory, which will be called to return the service instance. This is short for registering a service where its provider consists of only a $get property, which is the given service factory function. You should use $provide.factory(getFn) if you do not need to configure your service in a provider.
+         *
+         * @param name The name of the instance.
+         * @param $getFn The $getFn for the instance creation. Internally this is a short hand for $provide.provider(name, {$get: $getFn}).
+         */
+        factory(name: string, $getFn: Function): IModule;
+        /**
+         * Register a service factory, which will be called to return the service instance. This is short for registering a service where its provider consists of only a $get property, which is the given service factory function. You should use $provide.factory(getFn) if you do not need to configure your service in a provider.
+         *
+         * @param name The name of the instance.
+         * @param inlineAnnotatedFunction The $getFn for the instance creation. Internally this is a short hand for $provide.provider(name, {$get: $getFn}).
+         */
+        factory(name: string, inlineAnnotatedFunction: any[]): IModule;
+        factory(object: Object): IModule;
+        filter(name: string, filterFactoryFunction: Function): IModule;
+        filter(name: string, inlineAnnotatedFunction: any[]): IModule;
+        filter(object: Object): IModule;
+        provider(name: string, serviceProviderFactory: IServiceProviderFactory): IModule;
+        provider(name: string, serviceProviderConstructor: IServiceProviderClass): IModule;
+        provider(name: string, inlineAnnotatedConstructor: any[]): IModule;
+        provider(name: string, providerObject: IServiceProvider): IModule;
+        provider(object: Object): IModule;
+        /**
+         * Run blocks are the closest thing in Angular to the main method. A run block is the code which needs to run to kickstart the application. It is executed after all of the service have been configured and the injector has been created. Run blocks typically contain code which is hard to unit-test, and for this reason should be declared in isolated modules, so that they can be ignored in the unit-tests.
+         */
+        run(initializationFunction: Function): IModule;
+        /**
+         * Run blocks are the closest thing in Angular to the main method. A run block is the code which needs to run to kickstart the application. It is executed after all of the service have been configured and the injector has been created. Run blocks typically contain code which is hard to unit-test, and for this reason should be declared in isolated modules, so that they can be ignored in the unit-tests.
+         */
+        run(inlineAnnotatedFunction: any[]): IModule;
+        /**
+         * Register a service constructor, which will be invoked with new to create the service instance. This is short for registering a service where its provider's $get property is a factory function that returns an instance instantiated by the injector from the service constructor function.
+         *
+         * @param name The name of the instance.
+         * @param serviceConstructor An injectable class (constructor function) that will be instantiated.
+         */
+        service(name: string, serviceConstructor: Function): IModule;
+        /**
+         * Register a service constructor, which will be invoked with new to create the service instance. This is short for registering a service where its provider's $get property is a factory function that returns an instance instantiated by the injector from the service constructor function.
+         *
+         * @param name The name of the instance.
+         * @param inlineAnnotatedConstructor An injectable class (constructor function) that will be instantiated.
+         */
+        service(name: string, inlineAnnotatedConstructor: any[]): IModule;
+        service(object: Object): IModule;
+        /**
+         * Register a value service with the $injector, such as a string, a number, an array, an object or a function. This is short for registering a service where its provider's $get property is a factory function that takes no arguments and returns the value service.
+
+           Value services are similar to constant services, except that they cannot be injected into a module configuration function (see config) but they can be overridden by an Angular decorator.
+         *
+         * @param name The name of the instance.
+         * @param value The value.
+         */
+        value<T>(name: string, value: T): IModule;
+        value(object: Object): IModule;
+
+        /**
+         * Register a service decorator with the $injector. A service decorator intercepts the creation of a service, allowing it to override or modify the behaviour of the service. The object returned by the decorator may be the original service, or a new service object which replaces or wraps and delegates to the original service.
+         * @param name The name of the service to decorate
+         * @param decorator This function will be invoked when the service needs to be instantiated and should return the decorated service instance. The function is called using the injector.invoke method and is therefore fully injectable. Local injection arguments: $delegate - The original service instance, which can be monkey patched, configured, decorated or delegated to.
+         */
+        decorator(name:string, decoratorConstructor: Function): IModule;
+        decorator(name:string, inlineAnnotatedConstructor: any[]): IModule;
+
+        // Properties
+        name: string;
+        requires: string[];
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // Attributes
+    // see http://docs.angularjs.org/api/ng.$compile.directive.Attributes
+    ///////////////////////////////////////////////////////////////////////////
+    interface IAttributes {
+        /**
+         * this is necessary to be able to access the scoped attributes. it's not very elegant
+         * because you have to use attrs['foo'] instead of attrs.foo but I don't know of a better way
+         * this should really be limited to return string but it creates this problem: http://stackoverflow.com/q/17201854/165656
+         */
+        [name: string]: any;
+
+        /**
+         * Converts an attribute name (e.g. dash/colon/underscore-delimited string, optionally prefixed with x- or data-) to its normalized, camelCase form.
+         *
+         * Also there is special case for Moz prefix starting with upper case letter.
+         *
+         * For further information check out the guide on @see https://docs.angularjs.org/guide/directive#matching-directives
+         */
+        $normalize(name: string): string;
+
+        /**
+         * Adds the CSS class value specified by the classVal parameter to the
+         * element. If animations are enabled then an animation will be triggered
+         * for the class addition.
+         */
+        $addClass(classVal: string): void;
+
+        /**
+         * Removes the CSS class value specified by the classVal parameter from the
+         * element. If animations are enabled then an animation will be triggered for
+         * the class removal.
+         */
+        $removeClass(classVal: string): void;
+
+        /**
+         * Adds and removes the appropriate CSS class values to the element based on the difference between
+         * the new and old CSS class values (specified as newClasses and oldClasses).
+         */
+        $updateClass(newClasses: string, oldClasses: string): void;
+
+        /**
+         * Set DOM element attribute value.
+         */
+        $set(key: string, value: any): void;
+
+        /**
+         * Observes an interpolated attribute.
+         * The observer function will be invoked once during the next $digest
+         * following compilation. The observer is then invoked whenever the
+         * interpolated value changes.
+         */
+        $observe<T>(name: string, fn: (value?: T) => any): Function;
+
+        /**
+         * A map of DOM element attribute names to the normalized name. This is needed
+         * to do reverse lookup from normalized name back to actual name.
+         */
+        $attr: Object;
+    }
+
+    /**
+     * form.FormController - type in module ng
+     * see https://docs.angularjs.org/api/ng/type/form.FormController
+     */
+    interface IFormController {
+
+        /**
+         * Indexer which should return ng.INgModelController for most properties but cannot because of "All named properties must be assignable to string indexer type" constraint - see https://github.com/Microsoft/TypeScript/issues/272
+         */
+        [name: string]: any;
+
+        $pristine: boolean;
+        $dirty: boolean;
+        $valid: boolean;
+        $invalid: boolean;
+        $submitted: boolean;
+        $error: any;
+        $pending: any;
+        $addControl(control: INgModelController | IFormController): void;
+        $removeControl(control: INgModelController | IFormController): void;
+        $setValidity(validationErrorKey: string, isValid: boolean, control: INgModelController | IFormController): void;
+        $setDirty(): void;
+        $setPristine(): void;
+        $commitViewValue(): void;
+        $rollbackViewValue(): void;
+        $setSubmitted(): void;
+        $setUntouched(): void;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // NgModelController
+    // see http://docs.angularjs.org/api/ng.directive:ngModel.NgModelController
+    ///////////////////////////////////////////////////////////////////////////
+    interface INgModelController {
+        $render(): void;
+        $setValidity(validationErrorKey: string, isValid: boolean): void;
+        // Documentation states viewValue and modelValue to be a string but other
+        // types do work and it's common to use them.
+        $setViewValue(value: any, trigger?: string): void;
+        $setPristine(): void;
+        $setDirty(): void;
+        $validate(): void;
+        $setTouched(): void;
+        $setUntouched(): void;
+        $rollbackViewValue(): void;
+        $commitViewValue(): void;
+        $isEmpty(value: any): boolean;
+
+        $viewValue: any;
+
+        $modelValue: any;
+
+        $parsers: IModelParser[];
+        $formatters: IModelFormatter[];
+        $viewChangeListeners: IModelViewChangeListener[];
+        $error: any;
+        $name: string;
+
+        $touched: boolean;
+        $untouched: boolean;
+
+        $validators: IModelValidators;
+        $asyncValidators: IAsyncModelValidators;
+
+        $pending: any;
+        $pristine: boolean;
+        $dirty: boolean;
+        $valid: boolean;
+        $invalid: boolean;
+    }
+
+    //Allows tuning how model updates are done.
+    //https://docs.angularjs.org/api/ng/directive/ngModelOptions
+    interface INgModelOptions {
+        updateOn?: string;
+        debounce?: any;
+        allowInvalid?: boolean;
+        getterSetter?: boolean;
+        timezone?: string;
+    }
+
+    interface IModelValidators {
+        /**
+         * viewValue is any because it can be an object that is called in the view like $viewValue.name:$viewValue.subName
+         */
+        [index: string]: (modelValue: any, viewValue: any) => boolean;
+    }
+
+    interface IAsyncModelValidators {
+        [index: string]: (modelValue: any, viewValue: any) => IPromise<any>;
+    }
+
+    interface IModelParser {
+        (value: any): any;
+    }
+
+    interface IModelFormatter {
+        (value: any): any;
+    }
+
+    interface IModelViewChangeListener {
+        (): void;
+    }
+
+    /**
+     * $rootScope - $rootScopeProvider - service in module ng
+     * see https://docs.angularjs.org/api/ng/type/$rootScope.Scope and https://docs.angularjs.org/api/ng/service/$rootScope
+     */
+    interface IRootScopeService {
+        [index: string]: any;
+
+        $apply(): any;
+        $apply(exp: string): any;
+        $apply(exp: (scope: IScope) => any): any;
+
+        $applyAsync(): any;
+        $applyAsync(exp: string): any;
+        $applyAsync(exp: (scope: IScope) => any): any;
+
+        /**
+         * Dispatches an event name downwards to all child scopes (and their children) notifying the registered $rootScope.Scope listeners.
+         *
+         * The event life cycle starts at the scope on which $broadcast was called. All listeners listening for name event on this scope get notified. Afterwards, the event propagates to all direct and indirect scopes of the current scope and calls all registered listeners along the way. The event cannot be canceled.
+         *
+         * Any exception emitted from the listeners will be passed onto the $exceptionHandler service.
+         *
+         * @param name Event name to broadcast.
+         * @param args Optional one or more arguments which will be passed onto the event listeners.
+         */
+        $broadcast(name: string, ...args: any[]): IAngularEvent;
+        $destroy(): void;
+        $digest(): void;
+        /**
+         * Dispatches an event name upwards through the scope hierarchy notifying the registered $rootScope.Scope listeners.
+         *
+         * The event life cycle starts at the scope on which $emit was called. All listeners listening for name event on this scope get notified. Afterwards, the event traverses upwards toward the root scope and calls all registered listeners along the way. The event will stop propagating if one of the listeners cancels it.
+         *
+         * Any exception emitted from the listeners will be passed onto the $exceptionHandler service.
+         *
+         * @param name Event name to emit.
+         * @param args Optional one or more arguments which will be passed onto the event listeners.
+         */
+        $emit(name: string, ...args: any[]): IAngularEvent;
+
+        $eval(): any;
+        $eval(expression: string, locals?: Object): any;
+        $eval(expression: (scope: IScope) => any, locals?: Object): any;
+
+        $evalAsync(): void;
+        $evalAsync(expression: string): void;
+        $evalAsync(expression: (scope: IScope) => any): void;
+
+        // Defaults to false by the implementation checking strategy
+        $new(isolate?: boolean, parent?: IScope): IScope;
+
+        /**
+         * Listens on events of a given type. See $emit for discussion of event life cycle.
+         *
+         * The event listener function format is: function(event, args...).
+         *
+         * @param name Event name to listen on.
+         * @param listener Function to call when the event is emitted.
+         */
+        $on(name: string, listener: (event: IAngularEvent, ...args: any[]) => any): () => void;
+
+        $watch(watchExpression: string, listener?: string, objectEquality?: boolean): () => void;
+        $watch<T>(watchExpression: string, listener?: (newValue: T, oldValue: T, scope: IScope) => any, objectEquality?: boolean): () => void;
+        $watch(watchExpression: (scope: IScope) => any, listener?: string, objectEquality?: boolean): () => void;
+        $watch<T>(watchExpression: (scope: IScope) => T, listener?: (newValue: T, oldValue: T, scope: IScope) => any, objectEquality?: boolean): () => void;
+
+        $watchCollection<T>(watchExpression: string, listener: (newValue: T, oldValue: T, scope: IScope) => any): () => void;
+        $watchCollection<T>(watchExpression: (scope: IScope) => T, listener: (newValue: T, oldValue: T, scope: IScope) => any): () => void;
+
+        $watchGroup(watchExpressions: any[], listener: (newValue: any, oldValue: any, scope: IScope) => any): () => void;
+        $watchGroup(watchExpressions: { (scope: IScope): any }[], listener: (newValue: any, oldValue: any, scope: IScope) => any): () => void;
+
+        $parent: IScope;
+        $root: IRootScopeService;
+        $id: number;
+
+        // Hidden members
+        $$isolateBindings: any;
+        $$phase: any;
+    }
+
+    interface IScope extends IRootScopeService { }
+
+    /**
+     * $scope for ngRepeat directive.
+     * see https://docs.angularjs.org/api/ng/directive/ngRepeat
+     */
+    interface IRepeatScope extends IScope {
+
+        /**
+         * iterator offset of the repeated element (0..length-1).
+         */
+        $index: number;
+
+        /**
+         * true if the repeated element is first in the iterator.
+         */
+        $first: boolean;
+
+        /**
+         * true if the repeated element is between the first and last in the iterator.
+         */
+        $middle: boolean;
+
+        /**
+         * true if the repeated element is last in the iterator.
+         */
+        $last: boolean;
+
+        /**
+         * true if the iterator position $index is even (otherwise false).
+         */
+        $even: boolean;
+
+        /**
+         * true if the iterator position $index is odd (otherwise false).
+         */
+        $odd: boolean;
+
+    }
+
+    interface IAngularEvent {
+        /**
+         * the scope on which the event was $emit-ed or $broadcast-ed.
+         */
+        targetScope: IScope;
+        /**
+         * the scope that is currently handling the event. Once the event propagates through the scope hierarchy, this property is set to null.
+         */
+        currentScope: IScope;
+        /**
+         * name of the event.
+         */
+        name: string;
+        /**
+         * calling stopPropagation function will cancel further event propagation (available only for events that were $emit-ed).
+         */
+        stopPropagation?: Function;
+        /**
+         * calling preventDefault sets defaultPrevented flag to true.
+         */
+        preventDefault: Function;
+        /**
+         * true if preventDefault was called.
+         */
+        defaultPrevented: boolean;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // WindowService
+    // see http://docs.angularjs.org/api/ng.$window
+    ///////////////////////////////////////////////////////////////////////////
+    interface IWindowService extends Window {
+        [key: string]: any;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // TimeoutService
+    // see http://docs.angularjs.org/api/ng.$timeout
+    ///////////////////////////////////////////////////////////////////////////
+    interface ITimeoutService {
+        (delay?: number, invokeApply?: boolean): IPromise<void>;
+        <T>(fn: (...args: any[]) => T, delay?: number, invokeApply?: boolean, ...args: any[]): IPromise<T>;
+        cancel(promise?: IPromise<any>): boolean;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // IntervalService
+    // see http://docs.angularjs.org/api/ng.$interval
+    ///////////////////////////////////////////////////////////////////////////
+    interface IIntervalService {
+        (func: Function, delay: number, count?: number, invokeApply?: boolean, ...args: any[]): IPromise<any>;
+        cancel(promise: IPromise<any>): boolean;
+    }
+
+    /**
+     * $filter - $filterProvider - service in module ng
+     *
+     * Filters are used for formatting data displayed to the user.
+     *
+     * see https://docs.angularjs.org/api/ng/service/$filter
+     */
+    interface IFilterService {
+        (name: 'filter'): IFilterFilter;
+        (name: 'currency'): IFilterCurrency;
+        (name: 'number'): IFilterNumber;
+        (name: 'date'): IFilterDate;
+        (name: 'json'): IFilterJson;
+        (name: 'lowercase'): IFilterLowercase;
+        (name: 'uppercase'): IFilterUppercase;
+        (name: 'limitTo'): IFilterLimitTo;
+        (name: 'orderBy'): IFilterOrderBy;
+        /**
+         * Usage:
+         * $filter(name);
+         *
+         * @param name Name of the filter function to retrieve
+         */
+        <T>(name: string): T;
+    }
+
+    interface IFilterFilter {
+        <T>(array: T[], expression: string | IFilterFilterPatternObject | IFilterFilterPredicateFunc<T>, comparator?: IFilterFilterComparatorFunc<T>|boolean): T[];
+    }
+
+    interface IFilterFilterPatternObject {
+        [name: string]: any;
+    }
+
+    interface IFilterFilterPredicateFunc<T> {
+        (value: T, index: number, array: T[]): boolean;
+    }
+
+    interface IFilterFilterComparatorFunc<T> {
+        (actual: T, expected: T): boolean;
+    }
+
+    interface IFilterCurrency {
+        /**
+         * Formats a number as a currency (ie $1,234.56). When no currency symbol is provided, default symbol for current locale is used.
+         * @param amount Input to filter.
+         * @param symbol Currency symbol or identifier to be displayed.
+         * @param fractionSize Number of decimal places to round the amount to, defaults to default max fraction size for current locale
+         * @return Formatted number
+         */
+        (amount: number, symbol?: string, fractionSize?: number): string;
+    }
+
+    interface IFilterNumber {
+        /**
+         * Formats a number as text.
+         * @param number Number to format.
+         * @param fractionSize Number of decimal places to round the number to. If this is not provided then the fraction size is computed from the current locale's number formatting pattern. In the case of the default locale, it will be 3.
+         * @return Number rounded to decimalPlaces and places a “,” after each third digit.
+         */
+        (value: number|string, fractionSize?: number|string): string;
+    }
+
+    interface IFilterDate {
+        /**
+         * Formats date to a string based on the requested format.
+         *
+         * @param date Date to format either as Date object, milliseconds (string or number) or various ISO 8601 datetime string formats (e.g. yyyy-MM-ddTHH:mm:ss.sssZ and its shorter versions like yyyy-MM-ddTHH:mmZ, yyyy-MM-dd or yyyyMMddTHHmmssZ). If no timezone is specified in the string input, the time is considered to be in the local timezone.
+         * @param format Formatting rules (see Description). If not specified, mediumDate is used.
+         * @param timezone Timezone to be used for formatting. It understands UTC/GMT and the continental US time zone abbreviations, but for general use, use a time zone offset, for example, '+0430' (4 hours, 30 minutes east of the Greenwich meridian) If not specified, the timezone of the browser will be used.
+         * @return Formatted string or the input if input is not recognized as date/millis.
+         */
+        (date: Date | number | string, format?: string, timezone?: string): string;
+    }
+
+    interface IFilterJson {
+        /**
+         * Allows you to convert a JavaScript object into JSON string.
+         * @param object Any JavaScript object (including arrays and primitive types) to filter.
+         * @param spacing The number of spaces to use per indentation, defaults to 2.
+         * @return JSON string.
+         */
+        (object: any, spacing?: number): string;
+    }
+
+    interface IFilterLowercase {
+        /**
+         * Converts string to lowercase.
+         */
+        (value: string): string;
+    }
+
+    interface IFilterUppercase {
+        /**
+         * Converts string to uppercase.
+         */
+        (value: string): string;
+    }
+
+    interface IFilterLimitTo {
+        /**
+         * Creates a new array containing only a specified number of elements. The elements are taken from either the beginning or the end of the source array, string or number, as specified by the value and sign (positive or negative) of limit.
+         * @param input Source array to be limited.
+         * @param limit The length of the returned array. If the limit number is positive, limit number of items from the beginning of the source array/string are copied. If the number is negative, limit number of items from the end of the source array are copied. The limit will be trimmed if it exceeds array.length. If limit is undefined, the input will be returned unchanged.
+         * @param begin Index at which to begin limitation. As a negative index, begin indicates an offset from the end of input. Defaults to 0.
+         * @return A new sub-array of length limit or less if input array had less than limit elements.
+         */
+        <T>(input: T[], limit: string|number, begin?: string|number): T[];
+        /**
+         * Creates a new string containing only a specified number of elements. The elements are taken from either the beginning or the end of the source string or number, as specified by the value and sign (positive or negative) of limit. If a number is used as input, it is converted to a string.
+         * @param input Source string or number to be limited.
+         * @param limit The length of the returned string. If the limit number is positive, limit number of items from the beginning of the source string are copied. If the number is negative, limit number of items from the end of the source string are copied. The limit will be trimmed if it exceeds input.length. If limit is undefined, the input will be returned unchanged.
+         * @param begin Index at which to begin limitation. As a negative index, begin indicates an offset from the end of input. Defaults to 0.
+         * @return A new substring of length limit or less if input had less than limit elements.
+         */
+        (input: string|number, limit: string|number, begin?: string|number): string;
+    }
+
+    interface IFilterOrderBy {
+        /**
+         * Orders a specified array by the expression predicate. It is ordered alphabetically for strings and numerically for numbers. Note: if you notice numbers are not being sorted as expected, make sure they are actually being saved as numbers and not strings.
+         * @param array The array to sort.
+         * @param expression A predicate to be used by the comparator to determine the order of elements.
+         * @param reverse Reverse the order of the array.
+         * @return Reverse the order of the array.
+         */
+        <T>(array: T[], expression: string|((value: T) => any)|(((value: T) => any)|string)[], reverse?: boolean): T[];
+    }
+
+    /**
+     * $filterProvider - $filter - provider in module ng
+     *
+     * Filters are just functions which transform input to an output. However filters need to be Dependency Injected. To achieve this a filter definition consists of a factory function which is annotated with dependencies and is responsible for creating a filter function.
+     *
+     * see https://docs.angularjs.org/api/ng/provider/$filterProvider
+     */
+    interface IFilterProvider extends IServiceProvider {
+        /**
+         * register(name);
+         *
+         * @param name Name of the filter function, or an object map of filters where the keys are the filter names and the values are the filter factories. Note: Filter names must be valid angular Expressions identifiers, such as uppercase or orderBy. Names with special characters, such as hyphens and dots, are not allowed. If you wish to namespace your filters, then you can use capitalization (myappSubsectionFilterx) or underscores (myapp_subsection_filterx).
+         */
+        register(name: string | {}): IServiceProvider;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // LocaleService
+    // see http://docs.angularjs.org/api/ng.$locale
+    ///////////////////////////////////////////////////////////////////////////
+    interface ILocaleService {
+        id: string;
+
+        // These are not documented
+        // Check angular's i18n files for exemples
+        NUMBER_FORMATS: ILocaleNumberFormatDescriptor;
+        DATETIME_FORMATS: ILocaleDateTimeFormatDescriptor;
+        pluralCat: (num: any) => string;
+    }
+
+    interface ILocaleNumberFormatDescriptor {
+        DECIMAL_SEP: string;
+        GROUP_SEP: string;
+        PATTERNS: ILocaleNumberPatternDescriptor[];
+        CURRENCY_SYM: string;
+    }
+
+    interface ILocaleNumberPatternDescriptor {
+        minInt: number;
+        minFrac: number;
+        maxFrac: number;
+        posPre: string;
+        posSuf: string;
+        negPre: string;
+        negSuf: string;
+        gSize: number;
+        lgSize: number;
+    }
+
+    interface ILocaleDateTimeFormatDescriptor {
+        MONTH: string[];
+        SHORTMONTH: string[];
+        DAY: string[];
+        SHORTDAY: string[];
+        AMPMS: string[];
+        medium: string;
+        short: string;
+        fullDate: string;
+        longDate: string;
+        mediumDate: string;
+        shortDate: string;
+        mediumTime: string;
+        shortTime: string;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // LogService
+    // see http://docs.angularjs.org/api/ng.$log
+    // see http://docs.angularjs.org/api/ng.$logProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface ILogService {
+        debug: ILogCall;
+        error: ILogCall;
+        info: ILogCall;
+        log: ILogCall;
+        warn: ILogCall;
+    }
+
+    interface ILogProvider extends IServiceProvider {
+        debugEnabled(): boolean;
+        debugEnabled(enabled: boolean): ILogProvider;
+    }
+
+    // We define this as separate interface so we can reopen it later for
+    // the ngMock module.
+    interface ILogCall {
+        (...args: any[]): void;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // ParseService
+    // see http://docs.angularjs.org/api/ng.$parse
+    // see http://docs.angularjs.org/api/ng.$parseProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface IParseService {
+        (expression: string): ICompiledExpression;
+    }
+
+    interface IParseProvider {
+        logPromiseWarnings(): boolean;
+        logPromiseWarnings(value: boolean): IParseProvider;
+
+        unwrapPromises(): boolean;
+        unwrapPromises(value: boolean): IParseProvider;
+    }
+
+    interface ICompiledExpression {
+        (context: any, locals?: any): any;
+
+        literal: boolean;
+        constant: boolean;
+
+        // If value is not provided, undefined is gonna be used since the implementation
+        // does not check the parameter. Let's force a value for consistency. If consumer
+        // whants to undefine it, pass the undefined value explicitly.
+        assign(context: any, value: any): any;
+    }
+
+    /**
+     * $location - $locationProvider - service in module ng
+     * see https://docs.angularjs.org/api/ng/service/$location
+     */
+    interface ILocationService {
+        absUrl(): string;
+        hash(): string;
+        hash(newHash: string): ILocationService;
+        host(): string;
+
+        /**
+         * Return path of current url
+         */
+        path(): string;
+
+        /**
+         * Change path when called with parameter and return $location.
+         * Note: Path should always begin with forward slash (/), this method will add the forward slash if it is missing.
+         *
+         * @param path New path
+         */
+        path(path: string): ILocationService;
+
+        port(): number;
+        protocol(): string;
+        replace(): ILocationService;
+
+        /**
+         * Return search part (as object) of current url
+         */
+        search(): any;
+
+        /**
+         * Change search part when called with parameter and return $location.
+         *
+         * @param search When called with a single argument the method acts as a setter, setting the search component of $location to the specified value.
+         *
+         * If the argument is a hash object containing an array of values, these values will be encoded as duplicate search parameters in the url.
+         */
+        search(search: any): ILocationService;
+
+        /**
+         * Change search part when called with parameter and return $location.
+         *
+         * @param search New search params
+         * @param paramValue If search is a string or a Number, then paramValue will override only a single search property. If paramValue is null, the property specified via the first argument will be deleted. If paramValue is an array, it will override the property of the search component of $location specified via the first argument. If paramValue is true, the property specified via the first argument will be added with no value nor trailing equal sign.
+         */
+        search(search: string, paramValue: string|number|string[]|boolean): ILocationService;
+
+        state(): any;
+        state(state: any): ILocationService;
+        url(): string;
+        url(url: string): ILocationService;
+    }
+
+    interface ILocationProvider extends IServiceProvider {
+        hashPrefix(): string;
+        hashPrefix(prefix: string): ILocationProvider;
+        html5Mode(): boolean;
+
+        // Documentation states that parameter is string, but
+        // implementation tests it as boolean, which makes more sense
+        // since this is a toggler
+        html5Mode(active: boolean): ILocationProvider;
+        html5Mode(mode: { enabled?: boolean; requireBase?: boolean; rewriteLinks?: boolean; }): ILocationProvider;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // DocumentService
+    // see http://docs.angularjs.org/api/ng.$document
+    ///////////////////////////////////////////////////////////////////////////
+    interface IDocumentService extends IAugmentedJQuery {}
+
+    ///////////////////////////////////////////////////////////////////////////
+    // ExceptionHandlerService
+    // see http://docs.angularjs.org/api/ng.$exceptionHandler
+    ///////////////////////////////////////////////////////////////////////////
+    interface IExceptionHandlerService {
+        (exception: Error, cause?: string): void;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // RootElementService
+    // see http://docs.angularjs.org/api/ng.$rootElement
+    ///////////////////////////////////////////////////////////////////////////
+    interface IRootElementService extends JQuery {}
+
+    interface IQResolveReject<T> {
+        (): void;
+        (value: T): void;
+    }
+    /**
+     * $q - service in module ng
+     * A promise/deferred implementation inspired by Kris Kowal's Q.
+     * See http://docs.angularjs.org/api/ng/service/$q
+     */
+    interface IQService {
+        new <T>(resolver: (resolve: IQResolveReject<T>) => any): IPromise<T>;
+        new <T>(resolver: (resolve: IQResolveReject<T>, reject: IQResolveReject<any>) => any): IPromise<T>;
+        <T>(resolver: (resolve: IQResolveReject<T>) => any): IPromise<T>;
+        <T>(resolver: (resolve: IQResolveReject<T>, reject: IQResolveReject<any>) => any): IPromise<T>;
+
+        /**
+         * Combines multiple promises into a single promise that is resolved when all of the input promises are resolved.
+         *
+         * Returns a single promise that will be resolved with an array of values, each value corresponding to the promise at the same index in the promises array. If any of the promises is resolved with a rejection, this resulting promise will be rejected with the same rejection value.
+         *
+         * @param promises An array of promises.
+         */
+        all<T1, T2, T3, T4, T5, T6, T7, T8, T9, T10>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>, T3 | IPromise<T3>, T4 | IPromise <T4>, T5 | IPromise<T5>, T6 | IPromise<T6>, T7 | IPromise<T7>, T8 | IPromise<T8>, T9 | IPromise<T9>, T10 | IPromise<T10>]): IPromise<[T1, T2, T3, T4, T5, T6, T7, T8, T9, T10]>;
+        all<T1, T2, T3, T4, T5, T6, T7, T8, T9>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>, T3 | IPromise<T3>, T4 | IPromise <T4>, T5 | IPromise<T5>, T6 | IPromise<T6>, T7 | IPromise<T7>, T8 | IPromise<T8>, T9 | IPromise<T9>]): IPromise<[T1, T2, T3, T4, T5, T6, T7, T8, T9]>;
+        all<T1, T2, T3, T4, T5, T6, T7, T8>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>, T3 | IPromise<T3>, T4 | IPromise <T4>, T5 | IPromise<T5>, T6 | IPromise<T6>, T7 | IPromise<T7>, T8 | IPromise<T8>]): IPromise<[T1, T2, T3, T4, T5, T6, T7, T8]>;
+        all<T1, T2, T3, T4, T5, T6, T7>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>, T3 | IPromise<T3>, T4 | IPromise <T4>, T5 | IPromise<T5>, T6 | IPromise<T6>, T7 | IPromise<T7>]): IPromise<[T1, T2, T3, T4, T5, T6, T7]>;
+        all<T1, T2, T3, T4, T5, T6>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>, T3 | IPromise<T3>, T4 | IPromise <T4>, T5 | IPromise<T5>, T6 | IPromise<T6>]): IPromise<[T1, T2, T3, T4, T5, T6]>;
+        all<T1, T2, T3, T4, T5>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>, T3 | IPromise<T3>, T4 | IPromise <T4>, T5 | IPromise<T5>]): IPromise<[T1, T2, T3, T4, T5]>;
+        all<T1, T2, T3, T4>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>, T3 | IPromise<T3>, T4 | IPromise <T4>]): IPromise<[T1, T2, T3, T4]>;
+        all<T1, T2, T3>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>, T3 | IPromise<T3>]): IPromise<[T1, T2, T3]>;
+        all<T1, T2>(values: [T1 | IPromise<T1>, T2 | IPromise<T2>]): IPromise<[T1, T2]>;
+        all<TAll>(promises: IPromise<TAll>[]): IPromise<TAll[]>;
+        /**
+         * Combines multiple promises into a single promise that is resolved when all of the input promises are resolved.
+         *
+         * Returns a single promise that will be resolved with a hash of values, each value corresponding to the promise at the same key in the promises hash. If any of the promises is resolved with a rejection, this resulting promise will be rejected with the same rejection value.
+         *
+         * @param promises A hash of promises.
+         */
+        all(promises: { [id: string]: IPromise<any>; }): IPromise<{ [id: string]: any; }>;
+        all<T extends {}>(promises: { [id: string]: IPromise<any>; }): IPromise<T>;
+        /**
+         * Creates a Deferred object which represents a task which will finish in the future.
+         */
+        defer<T>(): IDeferred<T>;
+        /**
+         * Creates a promise that is resolved as rejected with the specified reason. This api should be used to forward rejection in a chain of promises. If you are dealing with the last promise in a promise chain, you don't need to worry about it.
+         *
+         * When comparing deferreds/promises to the familiar behavior of try/catch/throw, think of reject as the throw keyword in JavaScript. This also means that if you "catch" an error via a promise error callback and you want to forward the error to the promise derived from the current promise, you have to "rethrow" the error by returning a rejection constructed via reject.
+         *
+         * @param reason Constant, message, exception or an object representing the rejection reason.
+         */
+        reject(reason?: any): IPromise<any>;
+        /**
+         * Wraps an object that might be a value or a (3rd party) then-able promise into a $q promise. This is useful when you are dealing with an object that might or might not be a promise, or if the promise comes from a source that can't be trusted.
+         *
+         * @param value Value or a promise
+         */
+        resolve<T>(value: IPromise<T>|T): IPromise<T>;
+        /**
+         * Wraps an object that might be a value or a (3rd party) then-able promise into a $q promise. This is useful when you are dealing with an object that might or might not be a promise, or if the promise comes from a source that can't be trusted.
+         */
+        resolve(): IPromise<void>;
+        /**
+         * Wraps an object that might be a value or a (3rd party) then-able promise into a $q promise. This is useful when you are dealing with an object that might or might not be a promise, or if the promise comes from a source that can't be trusted.
+         *
+         * @param value Value or a promise
+         */
+        when<T>(value: IPromise<T>|T): IPromise<T>;
+        /**
+         * Wraps an object that might be a value or a (3rd party) then-able promise into a $q promise. This is useful when you are dealing with an object that might or might not be a promise, or if the promise comes from a source that can't be trusted.
+         */
+        when(): IPromise<void>;
+    }
+
+    interface IPromise<T> {
+        /**
+         * Regardless of when the promise was or will be resolved or rejected, then calls one of the success or error callbacks asynchronously as soon as the result is available. The callbacks are called with a single argument: the result or rejection reason. Additionally, the notify callback may be called zero or more times to provide a progress indication, before the promise is resolved or rejected.
+         * The successCallBack may return IPromise<void> for when a $q.reject() needs to be returned
+         * This method returns a new promise which is resolved or rejected via the return value of the successCallback, errorCallback. It also notifies via the return value of the notifyCallback method. The promise can not be resolved or rejected from the notifyCallback method.
+         */
+        then<TResult>(successCallback: (promiseValue: T) => IPromise<TResult>|TResult, errorCallback?: (reason: any) => any, notifyCallback?: (state: any) => any): IPromise<TResult>;
+
+        /**
+         * Shorthand for promise.then(null, errorCallback)
+         */
+        catch<TResult>(onRejected: (reason: any) => IPromise<TResult>|TResult): IPromise<TResult>;
+
+        /**
+         * Allows you to observe either the fulfillment or rejection of a promise, but to do so without modifying the final value. This is useful to release resources or do some clean-up that needs to be done whether the promise was rejected or resolved. See the full specification for more information.
+         *
+         * Because finally is a reserved word in JavaScript and reserved keywords are not supported as property names by ES3, you'll need to invoke the method like promise['finally'](callback) to make your code IE8 and Android 2.x compatible.
+         */
+        finally(finallyCallback: () => any): IPromise<T>;
+    }
+
+    interface IDeferred<T> {
+        resolve(value?: T|IPromise<T>): void;
+        reject(reason?: any): void;
+        notify(state?: any): void;
+        promise: IPromise<T>;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // AnchorScrollService
+    // see http://docs.angularjs.org/api/ng.$anchorScroll
+    ///////////////////////////////////////////////////////////////////////////
+    interface IAnchorScrollService {
+        (): void;
+        (hash: string): void;
+        yOffset: any;
+    }
+
+    interface IAnchorScrollProvider extends IServiceProvider {
+        disableAutoScrolling(): void;
+    }
+
+    /**
+     * $cacheFactory - service in module ng
+     *
+     * Factory that constructs Cache objects and gives access to them.
+     *
+     * see https://docs.angularjs.org/api/ng/service/$cacheFactory
+     */
+    interface ICacheFactoryService {
+        /**
+         * Factory that constructs Cache objects and gives access to them.
+         *
+         * @param cacheId Name or id of the newly created cache.
+         * @param optionsMap Options object that specifies the cache behavior. Properties:
+         *
+         * capacity — turns the cache into LRU cache.
+         */
+        (cacheId: string, optionsMap?: { capacity?: number; }): ICacheObject;
+
+        /**
+         * Get information about all the caches that have been created.
+         * @returns key-value map of cacheId to the result of calling cache#info
+         */
+        info(): any;
+
+        /**
+         * Get access to a cache object by the cacheId used when it was created.
+         *
+         * @param cacheId Name or id of a cache to access.
+         */
+        get(cacheId: string): ICacheObject;
+    }
+
+    /**
+     * $cacheFactory.Cache - type in module ng
+     *
+     * A cache object used to store and retrieve data, primarily used by $http and the script directive to cache templates and other data.
+     *
+     * see https://docs.angularjs.org/api/ng/type/$cacheFactory.Cache
+     */
+    interface ICacheObject {
+        /**
+         * Retrieve information regarding a particular Cache.
+         */
+        info(): {
+            /**
+             * the id of the cache instance
+             */
+            id: string;
+
+            /**
+             * the number of entries kept in the cache instance
+             */
+            size: number;
+
+            //...: any additional properties from the options object when creating the cache.
+        };
+
+        /**
+         * Inserts a named entry into the Cache object to be retrieved later, and incrementing the size of the cache if the key was not already present in the cache. If behaving like an LRU cache, it will also remove stale entries from the set.
+         *
+         * It will not insert undefined values into the cache.
+         *
+         * @param key the key under which the cached data is stored.
+         * @param value the value to store alongside the key. If it is undefined, the key will not be stored.
+         */
+        put<T>(key: string, value?: T): T;
+
+        /**
+         * Retrieves named data stored in the Cache object.
+         *
+         * @param key the key of the data to be retrieved
+         */
+        get<T>(key: string): T;
+
+        /**
+         * Removes an entry from the Cache object.
+         *
+         * @param key the key of the entry to be removed
+         */
+        remove(key: string): void;
+
+        /**
+         * Clears the cache object of any entries.
+         */
+        removeAll(): void;
+
+        /**
+         * Destroys the Cache object entirely, removing it from the $cacheFactory set.
+         */
+        destroy(): void;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // CompileService
+    // see http://docs.angularjs.org/api/ng.$compile
+    // see http://docs.angularjs.org/api/ng.$compileProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface ICompileService {
+        (element: string, transclude?: ITranscludeFunction, maxPriority?: number): ITemplateLinkingFunction;
+        (element: Element, transclude?: ITranscludeFunction, maxPriority?: number): ITemplateLinkingFunction;
+        (element: JQuery, transclude?: ITranscludeFunction, maxPriority?: number): ITemplateLinkingFunction;
+    }
+
+    interface ICompileProvider extends IServiceProvider {
+        directive(name: string, directiveFactory: Function): ICompileProvider;
+        directive(directivesMap: Object, directiveFactory: Function): ICompileProvider;
+        directive(name: string, inlineAnnotatedFunction: any[]): ICompileProvider;
+        directive(directivesMap: Object, inlineAnnotatedFunction: any[]): ICompileProvider;
+
+        // Undocumented, but it is there...
+        directive(directivesMap: any): ICompileProvider;
+
+        component(name: string, options: IComponentOptions): ICompileProvider;
+
+        aHrefSanitizationWhitelist(): RegExp;
+        aHrefSanitizationWhitelist(regexp: RegExp): ICompileProvider;
+
+        imgSrcSanitizationWhitelist(): RegExp;
+        imgSrcSanitizationWhitelist(regexp: RegExp): ICompileProvider;
+
+        debugInfoEnabled(enabled?: boolean): any;
+    }
+
+    interface ICloneAttachFunction {
+        // Let's hint but not force cloneAttachFn's signature
+        (clonedElement?: JQuery, scope?: IScope): any;
+    }
+
+    // This corresponds to the "publicLinkFn" returned by $compile.
+    interface ITemplateLinkingFunction {
+        (scope: IScope, cloneAttachFn?: ICloneAttachFunction): IAugmentedJQuery;
+    }
+
+    // This corresponds to $transclude (and also the transclude function passed to link).
+    interface ITranscludeFunction {
+        // If the scope is provided, then the cloneAttachFn must be as well.
+        (scope: IScope, cloneAttachFn: ICloneAttachFunction): IAugmentedJQuery;
+        // If one argument is provided, then it's assumed to be the cloneAttachFn.
+        (cloneAttachFn?: ICloneAttachFunction): IAugmentedJQuery;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // ControllerService
+    // see http://docs.angularjs.org/api/ng.$controller
+    // see http://docs.angularjs.org/api/ng.$controllerProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface IControllerService {
+        // Although the documentation doesn't state this, locals are optional
+        <T>(controllerConstructor: new (...args: any[]) => T, locals?: any, later?: boolean, ident?: string): T;
+        <T>(controllerConstructor: Function, locals?: any, later?: boolean, ident?: string): T;
+        <T>(controllerName: string, locals?: any, later?: boolean, ident?: string): T;
+    }
+
+    interface IControllerProvider extends IServiceProvider {
+        register(name: string, controllerConstructor: Function): void;
+        register(name: string, dependencyAnnotatedConstructor: any[]): void;
+        allowGlobals(): void;
+    }
+
+    /**
+     * xhrFactory
+     * Replace or decorate this service to create your own custom XMLHttpRequest objects.
+     * see https://docs.angularjs.org/api/ng/service/$xhrFactory
+     */
+    interface IXhrFactory<T> {
+        (method: string, url: string): T;
+    }
+
+    /**
+     * HttpService
+     * see http://docs.angularjs.org/api/ng/service/$http
+     */
+    interface IHttpService {
+        /**
+         * Object describing the request to be made and how it should be processed.
+         */
+        <T>(config: IRequestConfig): IHttpPromise<T>;
+
+        /**
+         * Shortcut method to perform GET request.
+         *
+         * @param url Relative or absolute URL specifying the destination of the request
+         * @param config Optional configuration object
+         */
+        get<T>(url: string, config?: IRequestShortcutConfig): IHttpPromise<T>;
+
+        /**
+         * Shortcut method to perform DELETE request.
+         *
+         * @param url Relative or absolute URL specifying the destination of the request
+         * @param config Optional configuration object
+         */
+        delete<T>(url: string, config?: IRequestShortcutConfig): IHttpPromise<T>;
+
+        /**
+         * Shortcut method to perform HEAD request.
+         *
+         * @param url Relative or absolute URL specifying the destination of the request
+         * @param config Optional configuration object
+         */
+        head<T>(url: string, config?: IRequestShortcutConfig): IHttpPromise<T>;
+
+        /**
+         * Shortcut method to perform JSONP request.
+         *
+         * @param url Relative or absolute URL specifying the destination of the request
+         * @param config Optional configuration object
+         */
+        jsonp<T>(url: string, config?: IRequestShortcutConfig): IHttpPromise<T>;
+
+        /**
+         * Shortcut method to perform POST request.
+         *
+         * @param url Relative or absolute URL specifying the destination of the request
+         * @param data Request content
+         * @param config Optional configuration object
+         */
+        post<T>(url: string, data: any, config?: IRequestShortcutConfig): IHttpPromise<T>;
+
+        /**
+         * Shortcut method to perform PUT request.
+         *
+         * @param url Relative or absolute URL specifying the destination of the request
+         * @param data Request content
+         * @param config Optional configuration object
+         */
+        put<T>(url: string, data: any, config?: IRequestShortcutConfig): IHttpPromise<T>;
+
+        /**
+         * Shortcut method to perform PATCH request.
+         *
+         * @param url Relative or absolute URL specifying the destination of the request
+         * @param data Request content
+         * @param config Optional configuration object
+         */
+        patch<T>(url: string, data: any, config?: IRequestShortcutConfig): IHttpPromise<T>;
+
+        /**
+         * Runtime equivalent of the $httpProvider.defaults property. Allows configuration of default headers, withCredentials as well as request and response transformations.
+         */
+        defaults: IHttpProviderDefaults;
+
+        /**
+         * Array of config objects for currently pending requests. This is primarily meant to be used for debugging purposes.
+         */
+        pendingRequests: IRequestConfig[];
+    }
+
+    /**
+     * Object describing the request to be made and how it should be processed.
+     * see http://docs.angularjs.org/api/ng/service/$http#usage
+     */
+    interface IRequestShortcutConfig extends IHttpProviderDefaults {
+        /**
+         * {Object.<string|Object>}
+         * Map of strings or objects which will be turned to ?key1=value1&key2=value2 after the url. If the value is not a string, it will be JSONified.
+         */
+        params?: any;
+
+        /**
+         * {string|Object}
+         * Data to be sent as the request message data.
+         */
+        data?: any;
+
+        /**
+         * Timeout in milliseconds, or promise that should abort the request when resolved.
+         */
+        timeout?: number|IPromise<any>;
+
+        /**
+         * See [XMLHttpRequest.responseType]https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest#xmlhttprequest-responsetype
+         */
+        responseType?: string;
+    }
+
+    /**
+     * Object describing the request to be made and how it should be processed.
+     * see http://docs.angularjs.org/api/ng/service/$http#usage
+     */
+    interface IRequestConfig extends IRequestShortcutConfig {
+        /**
+         * HTTP method (e.g. 'GET', 'POST', etc)
+         */
+        method: string;
+        /**
+         * Absolute or relative URL of the resource that is being requested.
+         */
+        url: string;
+    }
+
+    interface IHttpHeadersGetter {
+        (): { [name: string]: string; };
+        (headerName: string): string;
+    }
+
+    interface IHttpPromiseCallback<T> {
+        (data: T, status: number, headers: IHttpHeadersGetter, config: IRequestConfig): void;
+    }
+
+    interface IHttpPromiseCallbackArg<T> {
+        data?: T;
+        status?: number;
+        headers?: IHttpHeadersGetter;
+        config?: IRequestConfig;
+        statusText?: string;
+    }
+
+    interface IHttpPromise<T> extends IPromise<IHttpPromiseCallbackArg<T>> {
+        /**
+         * The $http legacy promise methods success and error have been deprecated. Use the standard then method instead.
+         * If $httpProvider.useLegacyPromiseExtensions is set to false then these methods will throw $http/legacy error.
+         * @deprecated
+         */
+        success?(callback: IHttpPromiseCallback<T>): IHttpPromise<T>;
+        /**
+         * The $http legacy promise methods success and error have been deprecated. Use the standard then method instead.
+         * If $httpProvider.useLegacyPromiseExtensions is set to false then these methods will throw $http/legacy error.
+         * @deprecated
+         */
+        error?(callback: IHttpPromiseCallback<any>): IHttpPromise<T>;
+    }
+
+    // See the jsdoc for transformData() at https://github.com/angular/angular.js/blob/master/src/ng/http.js#L228
+    interface IHttpRequestTransformer {
+        (data: any, headersGetter: IHttpHeadersGetter): any;
+    }
+
+    // The definition of fields are the same as IHttpPromiseCallbackArg
+    interface IHttpResponseTransformer {
+        (data: any, headersGetter: IHttpHeadersGetter, status: number): any;
+    }
+
+    type HttpHeaderType = {[requestType: string]:string|((config:IRequestConfig) => string)};
+
+    interface IHttpRequestConfigHeaders {
+        [requestType: string]: any;
+        common?: any;
+        get?: any;
+        post?: any;
+        put?: any;
+        patch?: any;
+    }
+
+    /**
+    * Object that controls the defaults for $http provider. Not all fields of IRequestShortcutConfig can be configured
+    * via defaults and the docs do not say which. The following is based on the inspection of the source code.
+    * https://docs.angularjs.org/api/ng/service/$http#defaults
+    * https://docs.angularjs.org/api/ng/service/$http#usage
+    * https://docs.angularjs.org/api/ng/provider/$httpProvider The properties section
+    */
+    interface IHttpProviderDefaults {
+        /**
+         * {boolean|Cache}
+         * If true, a default $http cache will be used to cache the GET request, otherwise if a cache instance built with $cacheFactory, this cache will be used for caching.
+         */
+        cache?: any;
+
+        /**
+         * Transform function or an array of such functions. The transform function takes the http request body and
+         * headers and returns its transformed (typically serialized) version.
+         * @see {@link https://docs.angularjs.org/api/ng/service/$http#transforming-requests-and-responses}
+         */
+        transformRequest?: IHttpRequestTransformer |IHttpRequestTransformer[];
+
+        /**
+         * Transform function or an array of such functions. The transform function takes the http response body and
+         * headers and returns its transformed (typically deserialized) version.
+         */
+        transformResponse?: IHttpResponseTransformer | IHttpResponseTransformer[];
+
+        /**
+         * Map of strings or functions which return strings representing HTTP headers to send to the server. If the
+         * return value of a function is null, the header will not be sent.
+         * The key of the map is the request verb in lower case. The "common" key applies to all requests.
+         * @see {@link https://docs.angularjs.org/api/ng/service/$http#setting-http-headers}
+         */
+        headers?: IHttpRequestConfigHeaders;
+
+        /** Name of HTTP header to populate with the XSRF token. */
+        xsrfHeaderName?: string;
+
+        /** Name of cookie containing the XSRF token. */
+        xsrfCookieName?: string;
+
+        /**
+         * whether to to set the withCredentials flag on the XHR object. See [requests with credentials]https://developer.mozilla.org/en/http_access_control#section_5 for more information.
+         */
+        withCredentials?: boolean;
+
+        /**
+        * A function used to the prepare string representation of request parameters (specified as an object). If
+        * specified as string, it is interpreted as a function registered with the $injector. Defaults to
+        * $httpParamSerializer.
+        */
+        paramSerializer?: string | ((obj: any) => string);
+    }
+
+    interface IHttpInterceptor {
+        request?: (config: IRequestConfig) => IRequestConfig|IPromise<IRequestConfig>;
+        requestError?: (rejection: any) => any;
+        response?: <T>(response: IHttpPromiseCallbackArg<T>) => IPromise<IHttpPromiseCallbackArg<T>>|IHttpPromiseCallbackArg<T>;
+        responseError?: (rejection: any) => any;
+    }
+
+    interface IHttpInterceptorFactory {
+        (...args: any[]): IHttpInterceptor;
+    }
+
+    interface IHttpProvider extends IServiceProvider {
+        defaults: IHttpProviderDefaults;
+
+        /**
+         * Register service factories (names or implementations) for interceptors which are called before and after
+         * each request.
+         */
+        interceptors: (string|IHttpInterceptorFactory|(string|IHttpInterceptorFactory)[])[];
+        useApplyAsync(): boolean;
+        useApplyAsync(value: boolean): IHttpProvider;
+
+        /**
+         *
+         * @param {boolean=} value If true, `$http` will return a normal promise without the `success` and `error` methods.
+         * @returns {boolean|Object} If a value is specified, returns the $httpProvider for chaining.
+         *    otherwise, returns the current configured value.
+         */
+        useLegacyPromiseExtensions(value:boolean) : boolean | IHttpProvider;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // HttpBackendService
+    // see http://docs.angularjs.org/api/ng.$httpBackend
+    // You should never need to use this service directly.
+    ///////////////////////////////////////////////////////////////////////////
+    interface IHttpBackendService {
+        // XXX Perhaps define callback signature in the future
+        (method: string, url: string, post?: any, callback?: Function, headers?: any, timeout?: number, withCredentials?: boolean): void;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // InterpolateService
+    // see http://docs.angularjs.org/api/ng.$interpolate
+    // see http://docs.angularjs.org/api/ng.$interpolateProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface IInterpolateService {
+        (text: string, mustHaveExpression?: boolean, trustedContext?: string, allOrNothing?: boolean): IInterpolationFunction;
+        endSymbol(): string;
+        startSymbol(): string;
+    }
+
+    interface IInterpolationFunction {
+        (context: any): string;
+    }
+
+    interface IInterpolateProvider extends IServiceProvider {
+        startSymbol(): string;
+        startSymbol(value: string): IInterpolateProvider;
+        endSymbol(): string;
+        endSymbol(value: string): IInterpolateProvider;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // TemplateCacheService
+    // see http://docs.angularjs.org/api/ng.$templateCache
+    ///////////////////////////////////////////////////////////////////////////
+    interface ITemplateCacheService extends ICacheObject {}
+
+    ///////////////////////////////////////////////////////////////////////////
+    // SCEService
+    // see http://docs.angularjs.org/api/ng.$sce
+    ///////////////////////////////////////////////////////////////////////////
+    interface ISCEService {
+        getTrusted(type: string, mayBeTrusted: any): any;
+        getTrustedCss(value: any): any;
+        getTrustedHtml(value: any): any;
+        getTrustedJs(value: any): any;
+        getTrustedResourceUrl(value: any): any;
+        getTrustedUrl(value: any): any;
+        parse(type: string, expression: string): (context: any, locals: any) => any;
+        parseAsCss(expression: string): (context: any, locals: any) => any;
+        parseAsHtml(expression: string): (context: any, locals: any) => any;
+        parseAsJs(expression: string): (context: any, locals: any) => any;
+        parseAsResourceUrl(expression: string): (context: any, locals: any) => any;
+        parseAsUrl(expression: string): (context: any, locals: any) => any;
+        trustAs(type: string, value: any): any;
+        trustAsHtml(value: any): any;
+        trustAsJs(value: any): any;
+        trustAsResourceUrl(value: any): any;
+        trustAsUrl(value: any): any;
+        isEnabled(): boolean;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // SCEProvider
+    // see http://docs.angularjs.org/api/ng.$sceProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface ISCEProvider extends IServiceProvider {
+        enabled(value: boolean): void;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // SCEDelegateService
+    // see http://docs.angularjs.org/api/ng.$sceDelegate
+    ///////////////////////////////////////////////////////////////////////////
+    interface ISCEDelegateService {
+        getTrusted(type: string, mayBeTrusted: any): any;
+        trustAs(type: string, value: any): any;
+        valueOf(value: any): any;
+    }
+
+
+    ///////////////////////////////////////////////////////////////////////////
+    // SCEDelegateProvider
+    // see http://docs.angularjs.org/api/ng.$sceDelegateProvider
+    ///////////////////////////////////////////////////////////////////////////
+    interface ISCEDelegateProvider extends IServiceProvider {
+        resourceUrlBlacklist(blacklist: any[]): void;
+        resourceUrlWhitelist(whitelist: any[]): void;
+        resourceUrlBlacklist(): any[];
+        resourceUrlWhitelist(): any[];
+    }
+
+    /**
+     * $templateRequest service
+     * see http://docs.angularjs.org/api/ng/service/$templateRequest
+     */
+    interface ITemplateRequestService {
+        /**
+         * Downloads a template using $http and, upon success, stores the
+         * contents inside of $templateCache.
+         *
+         * If the HTTP request fails or the response data of the HTTP request is
+         * empty then a $compile error will be thrown (unless
+         * {ignoreRequestError} is set to true).
+         *
+         * @param tpl                  The template URL.
+         * @param ignoreRequestError   Whether or not to ignore the exception
+         *                             when the request fails or the template is
+         *                             empty.
+         *
+         * @return   A promise whose value is the template content.
+         */
+        (tpl: string, ignoreRequestError?: boolean): IPromise<string>;
+        /**
+         * total amount of pending template requests being downloaded.
+         * @type {number}
+         */
+        totalPendingRequests: number;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // Component
+    // see http://angularjs.blogspot.com.br/2015/11/angularjs-15-beta2-and-14-releases.html
+    // and http://toddmotto.com/exploring-the-angular-1-5-component-method/
+    ///////////////////////////////////////////////////////////////////////////
+    /**
+     * Runtime representation a type that a Component or other object is instances of.
+     *
+     * An example of a `Type` is `MyCustomComponent` class, which in JavaScript is be represented by
+     * the `MyCustomComponent` constructor function.
+     */
+    interface Type extends Function {
+    }
+
+    /**
+     * `RouteDefinition` defines a route within a {@link RouteConfig} decorator.
+     *
+     * Supported keys:
+     * - `path` or `aux` (requires exactly one of these)
+     * - `component`, `loader`,  `redirectTo` (requires exactly one of these)
+     * - `name` or `as` (optional) (requires exactly one of these)
+     * - `data` (optional)
+     *
+     * See also {@link Route}, {@link AsyncRoute}, {@link AuxRoute}, and {@link Redirect}.
+     */
+    interface RouteDefinition {
+        path?: string;
+        aux?: string;
+        component?: Type | ComponentDefinition | string;
+        loader?: Function;
+        redirectTo?: any[];
+        as?: string;
+        name?: string;
+        data?: any;
+        useAsDefault?: boolean;
+    }
+
+    /**
+     * Represents either a component type (`type` is `component`) or a loader function
+     * (`type` is `loader`).
+     *
+     * See also {@link RouteDefinition}.
+     */
+    interface ComponentDefinition {
+        type: string;
+        loader?: Function;
+        component?: Type;
+    }
+
+    /**
+     * Component definition object (a simplified directive definition object)
+     */
+    interface IComponentOptions {
+        /**
+         * Controller constructor function that should be associated with newly created scope or the name of a registered
+         * controller if passed as a string. Empty function by default.
+         * Use the array form to define dependencies (necessary if strictDi is enabled and you require dependency injection)
+         */
+        controller?: string | Function | (string | Function)[];
+        /**
+         * An identifier name for a reference to the controller. If present, the controller will be published to scope under
+         * the controllerAs name. If not present, this will default to be the same as the component name.
+         * @default "$ctrl"
+         */
+        controllerAs?: string;
+        /**
+         * html template as a string or a function that returns an html template as a string which should be used as the
+         * contents of this component. Empty string by default.
+         * If template is a function, then it is injected with the following locals:
+         * $element - Current element
+         * $attrs - Current attributes object for the element
+         * Use the array form to define dependencies (necessary if strictDi is enabled and you require dependency injection)
+         */
+        template?: string | Function | (string | Function)[];
+        /**
+         * path or function that returns a path to an html template that should be used as the contents of this component.
+         * If templateUrl is a function, then it is injected with the following locals:
+         * $element - Current element
+         * $attrs - Current attributes object for the element
+         * Use the array form to define dependencies (necessary if strictDi is enabled and you require dependency injection)
+         */
+        templateUrl?: string | Function | (string | Function)[];
+        /**
+         * Define DOM attribute binding to component properties. Component properties are always bound to the component
+         * controller and not to the scope.
+         */
+        bindings?: {[binding: string]: string};
+        /**
+         * Whether transclusion is enabled. Enabled by default.
+         */
+        transclude?: boolean | string | {[slot: string]: string};
+        require?: string | string[] | {[controller: string]: string};
+    }
+
+    interface IComponentTemplateFn {
+        ( $element?: IAugmentedJQuery, $attrs?: IAttributes ): string;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // Directive
+    // see http://docs.angularjs.org/api/ng.$compileProvider#directive
+    // and http://docs.angularjs.org/guide/directive
+    ///////////////////////////////////////////////////////////////////////////
+
+    interface IDirectiveFactory {
+        (...args: any[]): IDirective;
+    }
+
+    interface IDirectiveLinkFn {
+        (
+            scope: IScope,
+            instanceElement: IAugmentedJQuery,
+            instanceAttributes: IAttributes,
+            controller: {},
+            transclude: ITranscludeFunction
+        ): void;
+    }
+
+    interface IDirectivePrePost {
+        pre?: IDirectiveLinkFn;
+        post?: IDirectiveLinkFn;
+    }
+
+    interface IDirectiveCompileFn {
+        (
+            templateElement: IAugmentedJQuery,
+            templateAttributes: IAttributes,
+            /**
+             * @deprecated
+             * Note: The transclude function that is passed to the compile function is deprecated,
+             * as it e.g. does not know about the right outer scope. Please use the transclude function
+             * that is passed to the link function instead.
+             */
+            transclude: ITranscludeFunction
+        ): IDirectivePrePost;
+    }
+
+    interface IDirective {
+        compile?: IDirectiveCompileFn;
+        controller?: any;
+        controllerAs?: string;
+        /**
+         * @deprecated
+         * Deprecation warning: although bindings for non-ES6 class controllers are currently bound to this before
+         * the controller constructor is called, this use is now deprecated. Please place initialization code that
+         * relies upon bindings inside a $onInit method on the controller, instead.
+         */
+        bindToController?: boolean | Object;
+        link?: IDirectiveLinkFn | IDirectivePrePost;
+        multiElement?: boolean;
+        name?: string;
+        priority?: number;
+        /**
+         * @deprecated
+         */
+        replace?: boolean;
+        require?: string | string[] | {[controller: string]: string};
+        restrict?: string;
+        scope?: boolean | Object;
+        template?: string | Function;
+        templateNamespace?: string;
+        templateUrl?: string | Function;
+        terminal?: boolean;
+        transclude?: boolean | string | {[slot: string]: string};
+    }
+
+    /**
+     * angular.element
+     * when calling angular.element, angular returns a jQuery object,
+     * augmented with additional methods like e.g. scope.
+     * see: http://docs.angularjs.org/api/angular.element
+     */
+    interface IAugmentedJQueryStatic extends JQueryStatic {
+        (selector: string, context?: any): IAugmentedJQuery;
+        (element: Element): IAugmentedJQuery;
+        (object: {}): IAugmentedJQuery;
+        (elementArray: Element[]): IAugmentedJQuery;
+        (object: JQuery): IAugmentedJQuery;
+        (func: Function): IAugmentedJQuery;
+        (array: any[]): IAugmentedJQuery;
+        (): IAugmentedJQuery;
+    }
+
+    interface IAugmentedJQuery extends JQuery {
+        // TODO: events, how to define?
+        //$destroy
+
+        find(selector: string): IAugmentedJQuery;
+        find(element: any): IAugmentedJQuery;
+        find(obj: JQuery): IAugmentedJQuery;
+        controller(): any;
+        controller(name: string): any;
+        injector(): any;
+        scope(): IScope;
+
+        /**
+        *   Overload for custom scope interfaces
+        */
+        scope<T extends IScope>(): T;
+        isolateScope(): IScope;
+
+        inheritedData(key: string, value: any): JQuery;
+        inheritedData(obj: { [key: string]: any; }): JQuery;
+        inheritedData(key?: string): any;
+    }
+
+    ///////////////////////////////////////////////////////////////////////////
+    // AUTO module (angular.js)
+    ///////////////////////////////////////////////////////////////////////////
+    export module auto {
+
+        ///////////////////////////////////////////////////////////////////////
+        // InjectorService
+        // see http://docs.angularjs.org/api/AUTO.$injector
+        ///////////////////////////////////////////////////////////////////////
+        interface IInjectorService {
+            annotate(fn: Function, strictDi?: boolean): string[];
+            annotate(inlineAnnotatedFunction: any[]): string[];
+            get<T>(name: string, caller?: string): T;
+            get(name: '$anchorScroll'): IAnchorScrollService
+            get(name: '$cacheFactory'): ICacheFactoryService
+            get(name: '$compile'): ICompileService
+            get(name: '$controller'): IControllerService
+            get(name: '$document'): IDocumentService
+            get(name: '$exceptionHandler'): IExceptionHandlerService
+            get(name: '$filter'): IFilterService
+            get(name: '$http'): IHttpService
+            get(name: '$httpBackend'): IHttpBackendService
+            get(name: '$httpParamSerializer'): IHttpParamSerializer
+            get(name: '$httpParamSerializerJQLike'): IHttpParamSerializer
+            get(name: '$interpolate'): IInterpolateService
+            get(name: '$interval'): IIntervalService
+            get(name: '$locale'): ILocaleService
+            get(name: '$location'): ILocationService
+            get(name: '$log'): ILogService
+            get(name: '$parse'): IParseService
+            get(name: '$q'): IQService
+            get(name: '$rootElement'): IRootElementService
+            get(name: '$rootScope'): IRootScopeService
+            get(name: '$sce'): ISCEService
+            get(name: '$sceDelegate'): ISCEDelegateService
+            get(name: '$templateCache'): ITemplateCacheService
+            get(name: '$templateRequest'): ITemplateRequestService
+            get(name: '$timeout'): ITimeoutService
+            get(name: '$window'): IWindowService
+            get<T>(name: '$xhrFactory'): IXhrFactory<T>
+            has(name: string): boolean;
+            instantiate<T>(typeConstructor: Function, locals?: any): T;
+            invoke(inlineAnnotatedFunction: any[]): any;
+            invoke(func: Function, context?: any, locals?: any): any;
+            strictDi: boolean;
+        }
+
+        ///////////////////////////////////////////////////////////////////////
+        // ProvideService
+        // see http://docs.angularjs.org/api/AUTO.$provide
+        ///////////////////////////////////////////////////////////////////////
+        interface IProvideService {
+            // Documentation says it returns the registered instance, but actual
+            // implementation does not return anything.
+            // constant(name: string, value: any): any;
+            /**
+             * Register a constant service, such as a string, a number, an array, an object or a function, with the $injector. Unlike value it can be injected into a module configuration function (see config) and it cannot be overridden by an Angular decorator.
+             *
+             * @param name The name of the constant.
+             * @param value The constant value.
+             */
+            constant(name: string, value: any): void;
+
+            /**
+             * Register a service decorator with the $injector. A service decorator intercepts the creation of a service, allowing it to override or modify the behaviour of the service. The object returned by the decorator may be the original service, or a new service object which replaces or wraps and delegates to the original service.
+             *
+             * @param name The name of the service to decorate.
+             * @param decorator This function will be invoked when the service needs to be instantiated and should return the decorated service instance. The function is called using the injector.invoke method and is therefore fully injectable. Local injection arguments:
+             *
+             * $delegate - The original service instance, which can be monkey patched, configured, decorated or delegated to.
+             */
+            decorator(name: string, decorator: Function): void;
+            /**
+             * Register a service decorator with the $injector. A service decorator intercepts the creation of a service, allowing it to override or modify the behaviour of the service. The object returned by the decorator may be the original service, or a new service object which replaces or wraps and delegates to the original service.
+             *
+             * @param name The name of the service to decorate.
+             * @param inlineAnnotatedFunction This function will be invoked when the service needs to be instantiated and should return the decorated service instance. The function is called using the injector.invoke method and is therefore fully injectable. Local injection arguments:
+             *
+             * $delegate - The original service instance, which can be monkey patched, configured, decorated or delegated to.
+             */
+            decorator(name: string, inlineAnnotatedFunction: any[]): void;
+            factory(name: string, serviceFactoryFunction: Function): IServiceProvider;
+            factory(name: string, inlineAnnotatedFunction: any[]): IServiceProvider;
+            provider(name: string, provider: IServiceProvider): IServiceProvider;
+            provider(name: string, serviceProviderConstructor: Function): IServiceProvider;
+            service(name: string, constructor: Function): IServiceProvider;
+            service(name: string, inlineAnnotatedFunction: any[]): IServiceProvider;
+            value(name: string, value: any): IServiceProvider;
+        }
+
+    }
+
+    /**
+     * $http params serializer that converts objects to strings
+     * see https://docs.angularjs.org/api/ng/service/$httpParamSerializer
+     */
+    interface IHttpParamSerializer {
+        (obj: Object): string;
+    }
+}
\ No newline at end of file
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular/typings.json b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular/typings.json
new file mode 100644
index 0000000000..c974311fa7
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/angular/typings.json
@@ -0,0 +1,8 @@
+{
+  "resolution": "main",
+  "tree": {
+    "src": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/b76dd8a7f95b71696982befbb7589940d27e940b/angularjs/angular.d.ts",
+    "raw": "registry:dt/angular#1.5.0+20160517064839",
+    "typings": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/b76dd8a7f95b71696982befbb7589940d27e940b/angularjs/angular.d.ts"
+  }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/jquery/index.d.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/jquery/index.d.ts
new file mode 100644
index 0000000000..b4208b3b82
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/jquery/index.d.ts
@@ -0,0 +1,3199 @@
+// Generated by typings
+// Source: https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/4cdfbe96b666eec5e1defbb519a62abf04e96764/jquery/jquery.d.ts
+interface JQueryAjaxSettings {
+    /**
+     * The content type sent in the request header that tells the server what kind of response it will accept in return. If the accepts setting needs modification, it is recommended to do so once in the $.ajaxSetup() method.
+     */
+    accepts?: any;
+    /**
+     * By default, all requests are sent asynchronously (i.e. this is set to true by default). If you need synchronous requests, set this option to false. Cross-domain requests and dataType: "jsonp" requests do not support synchronous operation. Note that synchronous requests may temporarily lock the browser, disabling any actions while the request is active. As of jQuery 1.8, the use of async: false with jqXHR ($.Deferred) is deprecated; you must use the success/error/complete callback options instead of the corresponding methods of the jqXHR object such as jqXHR.done() or the deprecated jqXHR.success().
+     */
+    async?: boolean;
+    /**
+     * A pre-request callback function that can be used to modify the jqXHR (in jQuery 1.4.x, XMLHTTPRequest) object before it is sent. Use this to set custom headers, etc. The jqXHR and settings objects are passed as arguments. This is an Ajax Event. Returning false in the beforeSend function will cancel the request. As of jQuery 1.5, the beforeSend option will be called regardless of the type of request.
+     */
+    beforeSend? (jqXHR: JQueryXHR, settings: JQueryAjaxSettings): any;
+    /**
+     * If set to false, it will force requested pages not to be cached by the browser. Note: Setting cache to false will only work correctly with HEAD and GET requests. It works by appending "_={timestamp}" to the GET parameters. The parameter is not needed for other types of requests, except in IE8 when a POST is made to a URL that has already been requested by a GET.
+     */
+    cache?: boolean;
+    /**
+     * A function to be called when the request finishes (after success and error callbacks are executed). The function gets passed two arguments: The jqXHR (in jQuery 1.4.x, XMLHTTPRequest) object and a string categorizing the status of the request ("success", "notmodified", "error", "timeout", "abort", or "parsererror"). As of jQuery 1.5, the complete setting can accept an array of functions. Each function will be called in turn. This is an Ajax Event.
+     */
+    complete? (jqXHR: JQueryXHR, textStatus: string): any;
+    /**
+     * An object of string/regular-expression pairs that determine how jQuery will parse the response, given its content type. (version added: 1.5)
+     */
+    contents?: { [key: string]: any; };
+    //According to jQuery.ajax source code, ajax's option actually allows contentType to set to "false"
+    // https://github.com/DefinitelyTyped/DefinitelyTyped/issues/742
+    /**
+     * When sending data to the server, use this content type. Default is "application/x-www-form-urlencoded; charset=UTF-8", which is fine for most cases. If you explicitly pass in a content-type to $.ajax(), then it is always sent to the server (even if no data is sent). The W3C XMLHttpRequest specification dictates that the charset is always UTF-8; specifying another charset will not force the browser to change the encoding.
+     */
+    contentType?: any;
+    /**
+     * This object will be made the context of all Ajax-related callbacks. By default, the context is an object that represents the ajax settings used in the call ($.ajaxSettings merged with the settings passed to $.ajax).
+     */
+    context?: any;
+    /**
+     * An object containing dataType-to-dataType converters. Each converter's value is a function that returns the transformed value of the response. (version added: 1.5)
+     */
+    converters?: { [key: string]: any; };
+    /**
+     * If you wish to force a crossDomain request (such as JSONP) on the same domain, set the value of crossDomain to true. This allows, for example, server-side redirection to another domain. (version added: 1.5)
+     */
+    crossDomain?: boolean;
+    /**
+     * Data to be sent to the server. It is converted to a query string, if not already a string. It's appended to the url for GET-requests. See processData option to prevent this automatic processing. Object must be Key/Value pairs. If value is an Array, jQuery serializes multiple values with same key based on the value of the traditional setting (described below).
+     */
+    data?: any;
+    /**
+     * A function to be used to handle the raw response data of XMLHttpRequest.This is a pre-filtering function to sanitize the response. You should return the sanitized data. The function accepts two arguments: The raw data returned from the server and the 'dataType' parameter.
+     */
+    dataFilter? (data: any, ty: any): any;
+    /**
+     * The type of data that you're expecting back from the server. If none is specified, jQuery will try to infer it based on the MIME type of the response (an XML MIME type will yield XML, in 1.4 JSON will yield a JavaScript object, in 1.4 script will execute the script, and anything else will be returned as a string). 
+     */
+    dataType?: string;
+    /**
+     * A function to be called if the request fails. The function receives three arguments: The jqXHR (in jQuery 1.4.x, XMLHttpRequest) object, a string describing the type of error that occurred and an optional exception object, if one occurred. Possible values for the second argument (besides null) are "timeout", "error", "abort", and "parsererror". When an HTTP error occurs, errorThrown receives the textual portion of the HTTP status, such as "Not Found" or "Internal Server Error." As of jQuery 1.5, the error setting can accept an array of functions. Each function will be called in turn. Note: This handler is not called for cross-domain script and cross-domain JSONP requests. This is an Ajax Event.
+     */
+    error? (jqXHR: JQueryXHR, textStatus: string, errorThrown: string): any;
+    /**
+     * Whether to trigger global Ajax event handlers for this request. The default is true. Set to false to prevent the global handlers like ajaxStart or ajaxStop from being triggered. This can be used to control various Ajax Events.
+     */
+    global?: boolean;
+    /**
+     * An object of additional header key/value pairs to send along with requests using the XMLHttpRequest transport. The header X-Requested-With: XMLHttpRequest is always added, but its default XMLHttpRequest value can be changed here. Values in the headers setting can also be overwritten from within the beforeSend function. (version added: 1.5)
+     */
+    headers?: { [key: string]: any; };
+    /**
+     * Allow the request to be successful only if the response has changed since the last request. This is done by checking the Last-Modified header. Default value is false, ignoring the header. In jQuery 1.4 this technique also checks the 'etag' specified by the server to catch unmodified data.
+     */
+    ifModified?: boolean;
+    /**
+     * Allow the current environment to be recognized as "local," (e.g. the filesystem), even if jQuery does not recognize it as such by default. The following protocols are currently recognized as local: file, *-extension, and widget. If the isLocal setting needs modification, it is recommended to do so once in the $.ajaxSetup() method. (version added: 1.5.1)
+     */
+    isLocal?: boolean;
+    /**
+     * Override the callback function name in a jsonp request. This value will be used instead of 'callback' in the 'callback=?' part of the query string in the url. So {jsonp:'onJSONPLoad'} would result in 'onJSONPLoad=?' passed to the server. As of jQuery 1.5, setting the jsonp option to false prevents jQuery from adding the "?callback" string to the URL or attempting to use "=?" for transformation. In this case, you should also explicitly set the jsonpCallback setting. For example, { jsonp: false, jsonpCallback: "callbackName" }
+     */
+    jsonp?: any;
+    /**
+     * Specify the callback function name for a JSONP request. This value will be used instead of the random name automatically generated by jQuery. It is preferable to let jQuery generate a unique name as it'll make it easier to manage the requests and provide callbacks and error handling. You may want to specify the callback when you want to enable better browser caching of GET requests. As of jQuery 1.5, you can also use a function for this setting, in which case the value of jsonpCallback is set to the return value of that function.
+     */
+    jsonpCallback?: any;
+    /**
+     * The HTTP method to use for the request (e.g. "POST", "GET", "PUT"). (version added: 1.9.0)
+     */
+    method?: string;
+    /**
+     * A mime type to override the XHR mime type. (version added: 1.5.1)
+     */
+    mimeType?: string;
+    /**
+     * A password to be used with XMLHttpRequest in response to an HTTP access authentication request.
+     */
+    password?: string;
+    /**
+     * By default, data passed in to the data option as an object (technically, anything other than a string) will be processed and transformed into a query string, fitting to the default content-type "application/x-www-form-urlencoded". If you want to send a DOMDocument, or other non-processed data, set this option to false.
+     */
+    processData?: boolean;
+    /**
+     * Only applies when the "script" transport is used (e.g., cross-domain requests with "jsonp" or "script" dataType and "GET" type). Sets the charset attribute on the script tag used in the request. Used when the character set on the local page is not the same as the one on the remote script.
+     */
+    scriptCharset?: string;
+    /**
+     * An object of numeric HTTP codes and functions to be called when the response has the corresponding code. f the request is successful, the status code functions take the same parameters as the success callback; if it results in an error (including 3xx redirect), they take the same parameters as the error callback. (version added: 1.5)
+     */
+    statusCode?: { [key: string]: any; };
+    /**
+     * A function to be called if the request succeeds. The function gets passed three arguments: The data returned from the server, formatted according to the dataType parameter; a string describing the status; and the jqXHR (in jQuery 1.4.x, XMLHttpRequest) object. As of jQuery 1.5, the success setting can accept an array of functions. Each function will be called in turn. This is an Ajax Event.
+     */
+    success? (data: any, textStatus: string, jqXHR: JQueryXHR): any;
+    /**
+     * Set a timeout (in milliseconds) for the request. This will override any global timeout set with $.ajaxSetup(). The timeout period starts at the point the $.ajax call is made; if several other requests are in progress and the browser has no connections available, it is possible for a request to time out before it can be sent. In jQuery 1.4.x and below, the XMLHttpRequest object will be in an invalid state if the request times out; accessing any object members may throw an exception. In Firefox 3.0+ only, script and JSONP requests cannot be cancelled by a timeout; the script will run even if it arrives after the timeout period.
+     */
+    timeout?: number;
+    /**
+     * Set this to true if you wish to use the traditional style of param serialization.
+     */
+    traditional?: boolean;
+    /**
+     * The type of request to make ("POST" or "GET"), default is "GET". Note: Other HTTP request methods, such as PUT and DELETE, can also be used here, but they are not supported by all browsers.
+     */
+    type?: string;
+    /**
+     * A string containing the URL to which the request is sent.
+     */
+    url?: string;
+    /**
+     * A username to be used with XMLHttpRequest in response to an HTTP access authentication request.
+     */
+    username?: string;
+    /**
+     * Callback for creating the XMLHttpRequest object. Defaults to the ActiveXObject when available (IE), the XMLHttpRequest otherwise. Override to provide your own implementation for XMLHttpRequest or enhancements to the factory.
+     */
+    xhr?: any;
+    /**
+     * An object of fieldName-fieldValue pairs to set on the native XHR object. For example, you can use it to set withCredentials to true for cross-domain requests if needed. In jQuery 1.5, the withCredentials property was not propagated to the native XHR and thus CORS requests requiring it would ignore this flag. For this reason, we recommend using jQuery 1.5.1+ should you require the use of it. (version added: 1.5.1)
+     */
+    xhrFields?: { [key: string]: any; };
+}
+
+/**
+ * Interface for the jqXHR object
+ */
+interface JQueryXHR extends XMLHttpRequest, JQueryPromise<any> {
+    /**
+     * The .overrideMimeType() method may be used in the beforeSend() callback function, for example, to modify the response content-type header. As of jQuery 1.5.1, the jqXHR object also contains the overrideMimeType() method (it was available in jQuery 1.4.x, as well, but was temporarily removed in jQuery 1.5). 
+     */
+    overrideMimeType(mimeType: string): any;
+    /**
+     * Cancel the request. 
+     *
+     * @param statusText A string passed as the textStatus parameter for the done callback. Default value: "canceled"
+     */
+    abort(statusText?: string): void;
+    /**
+     * Incorporates the functionality of the .done() and .fail() methods, allowing (as of jQuery 1.8) the underlying Promise to be manipulated. Refer to deferred.then() for implementation details.
+     */
+    then<R>(doneCallback: (data: any, textStatus: string, jqXHR: JQueryXHR) => R, failCallback?: (jqXHR: JQueryXHR, textStatus: string, errorThrown: any) => void): JQueryPromise<R>;
+    /**
+     * Property containing the parsed response if the response Content-Type is json
+     */
+    responseJSON?: any;
+    /**
+     * A function to be called if the request fails.
+     */
+    error(xhr: JQueryXHR, textStatus: string, errorThrown: string): void;
+}
+
+/**
+ * Interface for the JQuery callback
+ */
+interface JQueryCallback {
+    /**
+     * Add a callback or a collection of callbacks to a callback list.
+     * 
+     * @param callbacks A function, or array of functions, that are to be added to the callback list.
+     */
+    add(callbacks: Function): JQueryCallback;
+    /**
+     * Add a callback or a collection of callbacks to a callback list.
+     * 
+     * @param callbacks A function, or array of functions, that are to be added to the callback list.
+     */
+    add(callbacks: Function[]): JQueryCallback;
+
+    /**
+     * Disable a callback list from doing anything more.
+     */
+    disable(): JQueryCallback;
+
+    /**
+     * Determine if the callbacks list has been disabled.
+     */
+    disabled(): boolean;
+
+    /**
+     * Remove all of the callbacks from a list.
+     */
+    empty(): JQueryCallback;
+
+    /**
+     * Call all of the callbacks with the given arguments
+     * 
+     * @param arguments The argument or list of arguments to pass back to the callback list.
+     */
+    fire(...arguments: any[]): JQueryCallback;
+
+    /**
+     * Determine if the callbacks have already been called at least once.
+     */
+    fired(): boolean;
+
+    /**
+     * Call all callbacks in a list with the given context and arguments.
+     * 
+     * @param context A reference to the context in which the callbacks in the list should be fired.
+     * @param arguments An argument, or array of arguments, to pass to the callbacks in the list.
+     */
+    fireWith(context?: any, args?: any[]): JQueryCallback;
+
+    /**
+     * Determine whether a supplied callback is in a list
+     * 
+     * @param callback The callback to search for.
+     */
+    has(callback: Function): boolean;
+
+    /**
+     * Lock a callback list in its current state.
+     */
+    lock(): JQueryCallback;
+
+    /**
+     * Determine if the callbacks list has been locked.
+     */
+    locked(): boolean;
+
+    /**
+     * Remove a callback or a collection of callbacks from a callback list.
+     * 
+     * @param callbacks A function, or array of functions, that are to be removed from the callback list.
+     */
+    remove(callbacks: Function): JQueryCallback;
+    /**
+     * Remove a callback or a collection of callbacks from a callback list.
+     * 
+     * @param callbacks A function, or array of functions, that are to be removed from the callback list.
+     */
+    remove(callbacks: Function[]): JQueryCallback;
+}
+
+/**
+ * Allows jQuery Promises to interop with non-jQuery promises
+ */
+interface JQueryGenericPromise<T> {
+    /**
+     * Add handlers to be called when the Deferred object is resolved, rejected, or still in progress.
+     * 
+     * @param doneFilter A function that is called when the Deferred is resolved.
+     * @param failFilter An optional function that is called when the Deferred is rejected.
+     */
+    then<U>(doneFilter: (value?: T, ...values: any[]) => U|JQueryPromise<U>, failFilter?: (...reasons: any[]) => any, progressFilter?: (...progression: any[]) => any): JQueryPromise<U>;
+
+    /**
+     * Add handlers to be called when the Deferred object is resolved, rejected, or still in progress.
+     * 
+     * @param doneFilter A function that is called when the Deferred is resolved.
+     * @param failFilter An optional function that is called when the Deferred is rejected.
+     */
+    then(doneFilter: (value?: T, ...values: any[]) => void, failFilter?: (...reasons: any[]) => any, progressFilter?: (...progression: any[]) => any): JQueryPromise<void>;
+}
+
+/**
+ * Interface for the JQuery promise/deferred callbacks
+ */
+interface JQueryPromiseCallback<T> {
+    (value?: T, ...args: any[]): void;
+}
+
+interface JQueryPromiseOperator<T, U> {
+    (callback1: JQueryPromiseCallback<T>|JQueryPromiseCallback<T>[], ...callbacksN: Array<JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[]>): JQueryPromise<U>;
+}
+
+/**
+ * Interface for the JQuery promise, part of callbacks
+ */
+interface JQueryPromise<T> extends JQueryGenericPromise<T> {
+    /**
+     * Determine the current state of a Deferred object.
+     */
+    state(): string;
+    /**
+     * Add handlers to be called when the Deferred object is either resolved or rejected.
+     * 
+     * @param alwaysCallbacks1 A function, or array of functions, that is called when the Deferred is resolved or rejected.
+     * @param alwaysCallbacks2 Optional additional functions, or arrays of functions, that are called when the Deferred is resolved or rejected.
+     */
+    always(alwaysCallback1?: JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[], ...alwaysCallbacksN: Array<JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[]>): JQueryPromise<T>;
+    /**
+     * Add handlers to be called when the Deferred object is resolved.
+     * 
+     * @param doneCallbacks1 A function, or array of functions, that are called when the Deferred is resolved.
+     * @param doneCallbacks2 Optional additional functions, or arrays of functions, that are called when the Deferred is resolved.
+     */
+    done(doneCallback1?: JQueryPromiseCallback<T>|JQueryPromiseCallback<T>[], ...doneCallbackN: Array<JQueryPromiseCallback<T>|JQueryPromiseCallback<T>[]>): JQueryPromise<T>;
+    /**
+     * Add handlers to be called when the Deferred object is rejected.
+     * 
+     * @param failCallbacks1 A function, or array of functions, that are called when the Deferred is rejected.
+     * @param failCallbacks2 Optional additional functions, or arrays of functions, that are called when the Deferred is rejected.
+     */
+    fail(failCallback1?: JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[], ...failCallbacksN: Array<JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[]>): JQueryPromise<T>;
+    /**
+     * Add handlers to be called when the Deferred object generates progress notifications.
+     * 
+     * @param progressCallbacks A function, or array of functions, to be called when the Deferred generates progress notifications.
+     */
+    progress(progressCallback1?: JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[], ...progressCallbackN: Array<JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[]>): JQueryPromise<T>;
+
+    // Deprecated - given no typings
+    pipe(doneFilter?: (x: any) => any, failFilter?: (x: any) => any, progressFilter?: (x: any) => any): JQueryPromise<any>;
+}
+
+/**
+ * Interface for the JQuery deferred, part of callbacks
+ */
+interface JQueryDeferred<T> extends JQueryGenericPromise<T> {
+    /**
+     * Determine the current state of a Deferred object.
+     */
+    state(): string;
+    /**
+     * Add handlers to be called when the Deferred object is either resolved or rejected.
+     * 
+     * @param alwaysCallbacks1 A function, or array of functions, that is called when the Deferred is resolved or rejected.
+     * @param alwaysCallbacks2 Optional additional functions, or arrays of functions, that are called when the Deferred is resolved or rejected.
+     */
+    always(alwaysCallback1?: JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[], ...alwaysCallbacksN: Array<JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[]>): JQueryDeferred<T>;
+    /**
+     * Add handlers to be called when the Deferred object is resolved.
+     * 
+     * @param doneCallbacks1 A function, or array of functions, that are called when the Deferred is resolved.
+     * @param doneCallbacks2 Optional additional functions, or arrays of functions, that are called when the Deferred is resolved.
+     */
+    done(doneCallback1?: JQueryPromiseCallback<T>|JQueryPromiseCallback<T>[], ...doneCallbackN: Array<JQueryPromiseCallback<T>|JQueryPromiseCallback<T>[]>): JQueryDeferred<T>;
+    /**
+     * Add handlers to be called when the Deferred object is rejected.
+     * 
+     * @param failCallbacks1 A function, or array of functions, that are called when the Deferred is rejected.
+     * @param failCallbacks2 Optional additional functions, or arrays of functions, that are called when the Deferred is rejected.
+     */
+    fail(failCallback1?: JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[], ...failCallbacksN: Array<JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[]>): JQueryDeferred<T>;
+    /**
+     * Add handlers to be called when the Deferred object generates progress notifications.
+     * 
+     * @param progressCallbacks A function, or array of functions, to be called when the Deferred generates progress notifications.
+     */
+    progress(progressCallback1?: JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[], ...progressCallbackN: Array<JQueryPromiseCallback<any>|JQueryPromiseCallback<any>[]>): JQueryDeferred<T>;
+
+    /**
+     * Call the progressCallbacks on a Deferred object with the given args.
+     * 
+     * @param args Optional arguments that are passed to the progressCallbacks.
+     */
+    notify(value?: any, ...args: any[]): JQueryDeferred<T>;
+
+    /**
+     * Call the progressCallbacks on a Deferred object with the given context and args.
+     * 
+     * @param context Context passed to the progressCallbacks as the this object.
+     * @param args Optional arguments that are passed to the progressCallbacks.
+     */
+    notifyWith(context: any, value?: any[]): JQueryDeferred<T>;
+
+    /**
+     * Reject a Deferred object and call any failCallbacks with the given args.
+     * 
+     * @param args Optional arguments that are passed to the failCallbacks.
+     */
+    reject(value?: any, ...args: any[]): JQueryDeferred<T>;
+    /**
+     * Reject a Deferred object and call any failCallbacks with the given context and args.
+     * 
+     * @param context Context passed to the failCallbacks as the this object.
+     * @param args An optional array of arguments that are passed to the failCallbacks.
+     */
+    rejectWith(context: any, value?: any[]): JQueryDeferred<T>;
+
+    /**
+     * Resolve a Deferred object and call any doneCallbacks with the given args.
+     * 
+     * @param value First argument passed to doneCallbacks.
+     * @param args Optional subsequent arguments that are passed to the doneCallbacks.
+     */
+    resolve(value?: T, ...args: any[]): JQueryDeferred<T>;
+
+    /**
+     * Resolve a Deferred object and call any doneCallbacks with the given context and args.
+     * 
+     * @param context Context passed to the doneCallbacks as the this object.
+     * @param args An optional array of arguments that are passed to the doneCallbacks.
+     */
+    resolveWith(context: any, value?: T[]): JQueryDeferred<T>;
+
+    /**
+     * Return a Deferred's Promise object.
+     * 
+     * @param target Object onto which the promise methods have to be attached
+     */
+    promise(target?: any): JQueryPromise<T>;
+
+    // Deprecated - given no typings
+    pipe(doneFilter?: (x: any) => any, failFilter?: (x: any) => any, progressFilter?: (x: any) => any): JQueryPromise<any>;
+}
+
+/**
+ * Interface of the JQuery extension of the W3C event object
+ */
+interface BaseJQueryEventObject extends Event {
+    data: any;
+    delegateTarget: Element;
+    isDefaultPrevented(): boolean;
+    isImmediatePropagationStopped(): boolean;
+    isPropagationStopped(): boolean;
+    namespace: string;
+    originalEvent: Event;
+    preventDefault(): any;
+    relatedTarget: Element;
+    result: any;
+    stopImmediatePropagation(): void;
+    stopPropagation(): void;
+    target: Element;
+    pageX: number;
+    pageY: number;
+    which: number;
+    metaKey: boolean;
+}
+
+interface JQueryInputEventObject extends BaseJQueryEventObject {
+    altKey: boolean;
+    ctrlKey: boolean;
+    metaKey: boolean;
+    shiftKey: boolean;
+}
+
+interface JQueryMouseEventObject extends JQueryInputEventObject {
+    button: number;
+    clientX: number;
+    clientY: number;
+    offsetX: number;
+    offsetY: number;
+    pageX: number;
+    pageY: number;
+    screenX: number;
+    screenY: number;
+}
+
+interface JQueryKeyEventObject extends JQueryInputEventObject {
+    char: any;
+    charCode: number;
+    key: any;
+    keyCode: number;
+}
+
+interface JQueryEventObject extends BaseJQueryEventObject, JQueryInputEventObject, JQueryMouseEventObject, JQueryKeyEventObject{
+}
+
+/*
+    Collection of properties of the current browser
+*/
+
+interface JQuerySupport {
+    ajax?: boolean;
+    boxModel?: boolean;
+    changeBubbles?: boolean;
+    checkClone?: boolean;
+    checkOn?: boolean;
+    cors?: boolean;
+    cssFloat?: boolean;
+    hrefNormalized?: boolean;
+    htmlSerialize?: boolean;
+    leadingWhitespace?: boolean;
+    noCloneChecked?: boolean;
+    noCloneEvent?: boolean;
+    opacity?: boolean;
+    optDisabled?: boolean;
+    optSelected?: boolean;
+    scriptEval? (): boolean;
+    style?: boolean;
+    submitBubbles?: boolean;
+    tbody?: boolean;
+}
+
+interface JQueryParam {
+    /**
+     * Create a serialized representation of an array or object, suitable for use in a URL query string or Ajax request.
+     * 
+     * @param obj An array or object to serialize.
+     */
+    (obj: any): string;
+
+    /**
+     * Create a serialized representation of an array or object, suitable for use in a URL query string or Ajax request.
+     * 
+     * @param obj An array or object to serialize.
+     * @param traditional A Boolean indicating whether to perform a traditional "shallow" serialization.
+     */
+    (obj: any, traditional: boolean): string;
+}
+
+/**
+ * The interface used to construct jQuery events (with $.Event). It is
+ * defined separately instead of inline in JQueryStatic to allow
+ * overriding the construction function with specific strings
+ * returning specific event objects.
+ */
+interface JQueryEventConstructor {
+    (name: string, eventProperties?: any): JQueryEventObject;
+    new (name: string, eventProperties?: any): JQueryEventObject;
+}
+
+/**
+ * The interface used to specify coordinates.
+ */
+interface JQueryCoordinates {
+    left: number;
+    top: number;
+}
+
+/**
+ * Elements in the array returned by serializeArray()
+ */
+interface JQuerySerializeArrayElement {
+    name: string;
+    value: string;
+}
+
+interface JQueryAnimationOptions { 
+    /**
+     * A string or number determining how long the animation will run.
+     */
+    duration?: any; 
+    /**
+     * A string indicating which easing function to use for the transition.
+     */
+    easing?: string; 
+    /**
+     * A function to call once the animation is complete.
+     */
+    complete?: Function; 
+    /**
+     * A function to be called for each animated property of each animated element. This function provides an opportunity to modify the Tween object to change the value of the property before it is set.
+     */
+    step?: (now: number, tween: any) => any; 
+    /**
+     * A function to be called after each step of the animation, only once per animated element regardless of the number of animated properties. (version added: 1.8)
+     */
+    progress?: (animation: JQueryPromise<any>, progress: number, remainingMs: number) => any; 
+    /**
+     * A function to call when the animation begins. (version added: 1.8)
+     */
+    start?: (animation: JQueryPromise<any>) => any; 
+    /**
+     * A function to be called when the animation completes (its Promise object is resolved). (version added: 1.8)
+     */
+    done?: (animation: JQueryPromise<any>, jumpedToEnd: boolean) => any; 
+    /**
+     * A function to be called when the animation fails to complete (its Promise object is rejected). (version added: 1.8)
+     */
+    fail?: (animation: JQueryPromise<any>, jumpedToEnd: boolean) => any; 
+    /**
+     * A function to be called when the animation completes or stops without completing (its Promise object is either resolved or rejected). (version added: 1.8)
+     */
+    always?: (animation: JQueryPromise<any>, jumpedToEnd: boolean) => any; 
+    /**
+     * A Boolean indicating whether to place the animation in the effects queue. If false, the animation will begin immediately. As of jQuery 1.7, the queue option can also accept a string, in which case the animation is added to the queue represented by that string. When a custom queue name is used the animation does not automatically start; you must call .dequeue("queuename") to start it.
+     */
+    queue?: any; 
+    /**
+     * A map of one or more of the CSS properties defined by the properties argument and their corresponding easing functions. (version added: 1.4)
+     */
+    specialEasing?: Object;
+}
+
+interface JQueryEasingFunction {
+    ( percent: number ): number;
+}
+
+interface JQueryEasingFunctions {
+    [ name: string ]: JQueryEasingFunction;
+    linear: JQueryEasingFunction;
+    swing: JQueryEasingFunction;
+}
+
+/**
+ * Static members of jQuery (those on $ and jQuery themselves)
+ */
+interface JQueryStatic {
+
+    /**
+     * Perform an asynchronous HTTP (Ajax) request.
+     *
+     * @param settings A set of key/value pairs that configure the Ajax request. All settings are optional. A default can be set for any option with $.ajaxSetup().
+     */
+    ajax(settings: JQueryAjaxSettings): JQueryXHR;
+    /**
+     * Perform an asynchronous HTTP (Ajax) request.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param settings A set of key/value pairs that configure the Ajax request. All settings are optional. A default can be set for any option with $.ajaxSetup().
+     */
+    ajax(url: string, settings?: JQueryAjaxSettings): JQueryXHR;
+
+    /**
+     * Handle custom Ajax options or modify existing options before each request is sent and before they are processed by $.ajax().
+     *
+     * @param dataTypes An optional string containing one or more space-separated dataTypes
+     * @param handler A handler to set default values for future Ajax requests.
+     */
+    ajaxPrefilter(dataTypes: string, handler: (opts: any, originalOpts: JQueryAjaxSettings, jqXHR: JQueryXHR) => any): void;
+    /**
+     * Handle custom Ajax options or modify existing options before each request is sent and before they are processed by $.ajax().
+     *
+     * @param handler A handler to set default values for future Ajax requests.
+     */
+    ajaxPrefilter(handler: (opts: any, originalOpts: JQueryAjaxSettings, jqXHR: JQueryXHR) => any): void;
+
+    ajaxSettings: JQueryAjaxSettings;
+
+     /**
+      * Set default values for future Ajax requests. Its use is not recommended.
+      *
+      * @param options A set of key/value pairs that configure the default Ajax request. All options are optional.
+      */
+    ajaxSetup(options: JQueryAjaxSettings): void;
+
+    /**
+     * Load data from the server using a HTTP GET request.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param success A callback function that is executed if the request succeeds.
+     * @param dataType The type of data expected from the server. Default: Intelligent Guess (xml, json, script, or html).
+     */
+    get(url: string, success?: (data: any, textStatus: string, jqXHR: JQueryXHR) => any, dataType?: string): JQueryXHR;
+    /**
+     * Load data from the server using a HTTP GET request.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param data A plain object or string that is sent to the server with the request.
+     * @param success A callback function that is executed if the request succeeds.
+     * @param dataType The type of data expected from the server. Default: Intelligent Guess (xml, json, script, or html).
+     */
+    get(url: string, data?: Object|string, success?: (data: any, textStatus: string, jqXHR: JQueryXHR) => any, dataType?: string): JQueryXHR;
+    /**
+     * Load data from the server using a HTTP GET request.
+     *
+     * @param settings The JQueryAjaxSettings to be used for the request
+     */
+    get(settings : JQueryAjaxSettings): JQueryXHR;
+    /**
+     * Load JSON-encoded data from the server using a GET HTTP request.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param success A callback function that is executed if the request succeeds.
+     */
+    getJSON(url: string, success?: (data: any, textStatus: string, jqXHR: JQueryXHR) => any): JQueryXHR;
+    /**
+     * Load JSON-encoded data from the server using a GET HTTP request.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param data A plain object or string that is sent to the server with the request.
+     * @param success A callback function that is executed if the request succeeds.
+     */
+    getJSON(url: string, data?: Object|string, success?: (data: any, textStatus: string, jqXHR: JQueryXHR) => any): JQueryXHR;
+    /**
+     * Load a JavaScript file from the server using a GET HTTP request, then execute it.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param success A callback function that is executed if the request succeeds.
+     */
+    getScript(url: string, success?: (script: string, textStatus: string, jqXHR: JQueryXHR) => any): JQueryXHR;
+
+    /**
+     * Create a serialized representation of an array or object, suitable for use in a URL query string or Ajax request.
+     */
+    param: JQueryParam;
+
+    /**
+     * Load data from the server using a HTTP POST request.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param success A callback function that is executed if the request succeeds. Required if dataType is provided, but can be null in that case.
+     * @param dataType The type of data expected from the server. Default: Intelligent Guess (xml, json, script, text, html).
+     */
+    post(url: string, success?: (data: any, textStatus: string, jqXHR: JQueryXHR) => any, dataType?: string): JQueryXHR;
+    /**
+     * Load data from the server using a HTTP POST request.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param data A plain object or string that is sent to the server with the request.
+     * @param success A callback function that is executed if the request succeeds. Required if dataType is provided, but can be null in that case.
+     * @param dataType The type of data expected from the server. Default: Intelligent Guess (xml, json, script, text, html).
+     */
+    post(url: string, data?: Object|string, success?: (data: any, textStatus: string, jqXHR: JQueryXHR) => any, dataType?: string): JQueryXHR;
+    /**
+     * Load data from the server using a HTTP POST request.
+     *
+     * @param settings The JQueryAjaxSettings to be used for the request
+     */
+    post(settings : JQueryAjaxSettings): JQueryXHR;
+    /**
+     * A multi-purpose callbacks list object that provides a powerful way to manage callback lists.
+     *
+     * @param flags An optional list of space-separated flags that change how the callback list behaves.
+     */
+    Callbacks(flags?: string): JQueryCallback;
+
+    /**
+     * Holds or releases the execution of jQuery's ready event.
+     *
+     * @param hold Indicates whether the ready hold is being requested or released
+     */
+    holdReady(hold: boolean): void;
+
+    /**
+     * Accepts a string containing a CSS selector which is then used to match a set of elements.
+     *
+     * @param selector A string containing a selector expression
+     * @param context A DOM Element, Document, or jQuery to use as context
+     */
+    (selector: string, context?: Element|JQuery): JQuery;
+
+    /**
+     * Accepts a string containing a CSS selector which is then used to match a set of elements.
+     *
+     * @param element A DOM element to wrap in a jQuery object.
+     */
+    (element: Element): JQuery;
+
+    /**
+     * Accepts a string containing a CSS selector which is then used to match a set of elements.
+     *
+     * @param elementArray An array containing a set of DOM elements to wrap in a jQuery object.
+     */
+    (elementArray: Element[]): JQuery;
+
+    /**
+     * Binds a function to be executed when the DOM has finished loading.
+     *
+     * @param callback A function to execute after the DOM is ready.
+     */
+    (callback: (jQueryAlias?: JQueryStatic) => any): JQuery;
+
+    /**
+     * Accepts a string containing a CSS selector which is then used to match a set of elements.
+     *
+     * @param object A plain object to wrap in a jQuery object.
+     */
+    (object: {}): JQuery;
+
+    /**
+     * Accepts a string containing a CSS selector which is then used to match a set of elements.
+     *
+     * @param object An existing jQuery object to clone.
+     */
+    (object: JQuery): JQuery;
+
+    /**
+     * Specify a function to execute when the DOM is fully loaded.
+     */
+    (): JQuery;
+
+    /**
+     * Creates DOM elements on the fly from the provided string of raw HTML.
+     *
+     * @param html A string of HTML to create on the fly. Note that this parses HTML, not XML.
+     * @param ownerDocument A document in which the new elements will be created.
+     */
+    (html: string, ownerDocument?: Document): JQuery;
+
+    /**
+     * Creates DOM elements on the fly from the provided string of raw HTML.
+     *
+     * @param html A string defining a single, standalone, HTML element (e.g. <div/> or <div></div>).
+     * @param attributes An object of attributes, events, and methods to call on the newly-created element.
+     */
+    (html: string, attributes: Object): JQuery;
+
+    /**
+     * Relinquish jQuery's control of the $ variable.
+     *
+     * @param removeAll A Boolean indicating whether to remove all jQuery variables from the global scope (including jQuery itself).
+     */
+    noConflict(removeAll?: boolean): JQueryStatic;
+
+    /**
+     * Provides a way to execute callback functions based on one or more objects, usually Deferred objects that represent asynchronous events.
+     *
+     * @param deferreds One or more Deferred objects, or plain JavaScript objects.
+     */
+    when<T>(...deferreds: Array<T|JQueryPromise<T>/* as JQueryDeferred<T> */>): JQueryPromise<T>;
+
+    /**
+     * Hook directly into jQuery to override how particular CSS properties are retrieved or set, normalize CSS property naming, or create custom properties.
+     */
+    cssHooks: { [key: string]: any; };
+    cssNumber: any;
+
+    /**
+     * Store arbitrary data associated with the specified element. Returns the value that was set.
+     *
+     * @param element The DOM element to associate with the data.
+     * @param key A string naming the piece of data to set.
+     * @param value The new data value.
+     */
+    data<T>(element: Element, key: string, value: T): T;
+    /**
+     * Returns value at named data store for the element, as set by jQuery.data(element, name, value), or the full data store for the element.
+     *
+     * @param element The DOM element to associate with the data.
+     * @param key A string naming the piece of data to set.
+     */
+    data(element: Element, key: string): any;
+    /**
+     * Returns value at named data store for the element, as set by jQuery.data(element, name, value), or the full data store for the element.
+     *
+     * @param element The DOM element to associate with the data.
+     */
+    data(element: Element): any;
+
+    /**
+     * Execute the next function on the queue for the matched element.
+     *
+     * @param element A DOM element from which to remove and execute a queued function.
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     */
+    dequeue(element: Element, queueName?: string): void;
+
+    /**
+     * Determine whether an element has any jQuery data associated with it.
+     *
+     * @param element A DOM element to be checked for data.
+     */
+    hasData(element: Element): boolean;
+
+    /**
+     * Show the queue of functions to be executed on the matched element.
+     *
+     * @param element A DOM element to inspect for an attached queue.
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     */
+    queue(element: Element, queueName?: string): any[];
+    /**
+     * Manipulate the queue of functions to be executed on the matched element.
+     *
+     * @param element A DOM element where the array of queued functions is attached.
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     * @param newQueue An array of functions to replace the current queue contents.
+     */
+    queue(element: Element, queueName: string, newQueue: Function[]): JQuery;
+    /**
+     * Manipulate the queue of functions to be executed on the matched element.
+     *
+     * @param element A DOM element on which to add a queued function.
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     * @param callback The new function to add to the queue.
+     */
+    queue(element: Element, queueName: string, callback: Function): JQuery;
+
+    /**
+     * Remove a previously-stored piece of data.
+     *
+     * @param element A DOM element from which to remove data.
+     * @param name A string naming the piece of data to remove.
+     */
+    removeData(element: Element, name?: string): JQuery;
+
+    /**
+     * A constructor function that returns a chainable utility object with methods to register multiple callbacks into callback queues, invoke callback queues, and relay the success or failure state of any synchronous or asynchronous function.
+     *
+     * @param beforeStart A function that is called just before the constructor returns.
+     */
+    Deferred<T>(beforeStart?: (deferred: JQueryDeferred<T>) => any): JQueryDeferred<T>;
+
+    /**
+     * Effects
+     */
+
+    easing: JQueryEasingFunctions;
+
+    fx: {
+        tick: () => void;
+        /**
+         * The rate (in milliseconds) at which animations fire.
+         */
+        interval: number;
+        stop: () => void;
+        speeds: { slow: number; fast: number; };
+        /**
+         * Globally disable all animations.
+         */
+        off: boolean;
+        step: any;
+    };
+
+    /**
+     * Takes a function and returns a new one that will always have a particular context.
+     *
+     * @param fnction The function whose context will be changed.
+     * @param context The object to which the context (this) of the function should be set.
+     * @param additionalArguments Any number of arguments to be passed to the function referenced in the function argument.
+     */
+    proxy(fnction: (...args: any[]) => any, context: Object, ...additionalArguments: any[]): any;
+    /**
+     * Takes a function and returns a new one that will always have a particular context.
+     *
+     * @param context The object to which the context (this) of the function should be set.
+     * @param name The name of the function whose context will be changed (should be a property of the context object).
+     * @param additionalArguments Any number of arguments to be passed to the function named in the name argument.
+     */
+    proxy(context: Object, name: string, ...additionalArguments: any[]): any;
+
+    Event: JQueryEventConstructor;
+
+    /**
+     * Takes a string and throws an exception containing it.
+     *
+     * @param message The message to send out.
+     */
+    error(message: any): JQuery;
+
+    expr: any;
+    fn: any;  //TODO: Decide how we want to type this
+
+    isReady: boolean;
+
+    // Properties
+    support: JQuerySupport;
+
+    /**
+     * Check to see if a DOM element is a descendant of another DOM element.
+     * 
+     * @param container The DOM element that may contain the other element.
+     * @param contained The DOM element that may be contained by (a descendant of) the other element.
+     */
+    contains(container: Element, contained: Element): boolean;
+
+    /**
+     * A generic iterator function, which can be used to seamlessly iterate over both objects and arrays. Arrays and array-like objects with a length property (such as a function's arguments object) are iterated by numeric index, from 0 to length-1. Other objects are iterated via their named properties.
+     * 
+     * @param collection The object or array to iterate over.
+     * @param callback The function that will be executed on every object.
+     */
+    each<T>(
+        collection: T[],
+        callback: (indexInArray: number, valueOfElement: T) => any
+        ): any;
+
+    /**
+     * A generic iterator function, which can be used to seamlessly iterate over both objects and arrays. Arrays and array-like objects with a length property (such as a function's arguments object) are iterated by numeric index, from 0 to length-1. Other objects are iterated via their named properties.
+     * 
+     * @param collection The object or array to iterate over.
+     * @param callback The function that will be executed on every object.
+     */
+    each(
+        collection: any,
+        callback: (indexInArray: any, valueOfElement: any) => any
+        ): any;
+
+    /**
+     * Merge the contents of two or more objects together into the first object.
+     *
+     * @param target An object that will receive the new properties if additional objects are passed in or that will extend the jQuery namespace if it is the sole argument.
+     * @param object1 An object containing additional properties to merge in.
+     * @param objectN Additional objects containing properties to merge in.
+     */
+    extend(target: any, object1?: any, ...objectN: any[]): any;
+    /**
+     * Merge the contents of two or more objects together into the first object.
+     *
+     * @param deep If true, the merge becomes recursive (aka. deep copy).
+     * @param target The object to extend. It will receive the new properties.
+     * @param object1 An object containing additional properties to merge in.
+     * @param objectN Additional objects containing properties to merge in.
+     */
+    extend(deep: boolean, target: any, object1?: any, ...objectN: any[]): any;
+
+    /**
+     * Execute some JavaScript code globally.
+     *
+     * @param code The JavaScript code to execute.
+     */
+    globalEval(code: string): any;
+
+    /**
+     * Finds the elements of an array which satisfy a filter function. The original array is not affected.
+     *
+     * @param array The array to search through.
+     * @param func The function to process each item against. The first argument to the function is the item, and the second argument is the index. The function should return a Boolean value.  this will be the global window object.
+     * @param invert If "invert" is false, or not provided, then the function returns an array consisting of all elements for which "callback" returns true. If "invert" is true, then the function returns an array consisting of all elements for which "callback" returns false.
+     */
+    grep<T>(array: T[], func: (elementOfArray: T, indexInArray: number) => boolean, invert?: boolean): T[];
+
+    /**
+     * Search for a specified value within an array and return its index (or -1 if not found).
+     *
+     * @param value The value to search for.
+     * @param array An array through which to search.
+     * @param fromIndex he index of the array at which to begin the search. The default is 0, which will search the whole array.
+     */
+    inArray<T>(value: T, array: T[], fromIndex?: number): number;
+
+    /**
+     * Determine whether the argument is an array.
+     *
+     * @param obj Object to test whether or not it is an array.
+     */
+    isArray(obj: any): boolean;
+    /**
+     * Check to see if an object is empty (contains no enumerable properties).
+     *
+     * @param obj The object that will be checked to see if it's empty.
+     */
+    isEmptyObject(obj: any): boolean;
+    /**
+     * Determine if the argument passed is a Javascript function object.
+     *
+     * @param obj Object to test whether or not it is a function.
+     */
+    isFunction(obj: any): boolean;
+    /**
+     * Determines whether its argument is a number.
+     *
+     * @param obj The value to be tested.
+     */
+    isNumeric(value: any): boolean;
+    /**
+     * Check to see if an object is a plain object (created using "{}" or "new Object").
+     *
+     * @param obj The object that will be checked to see if it's a plain object.
+     */
+    isPlainObject(obj: any): boolean;
+    /**
+     * Determine whether the argument is a window.
+     *
+     * @param obj Object to test whether or not it is a window.
+     */
+    isWindow(obj: any): boolean;
+    /**
+     * Check to see if a DOM node is within an XML document (or is an XML document).
+     *
+     * @param node he DOM node that will be checked to see if it's in an XML document.
+     */
+    isXMLDoc(node: Node): boolean;
+
+    /**
+     * Convert an array-like object into a true JavaScript array.
+     * 
+     * @param obj Any object to turn into a native Array.
+     */
+    makeArray(obj: any): any[];
+
+    /**
+     * Translate all items in an array or object to new array of items.
+     * 
+     * @param array The Array to translate.
+     * @param callback The function to process each item against. The first argument to the function is the array item, the second argument is the index in array The function can return any value. Within the function, this refers to the global (window) object.
+     */
+    map<T, U>(array: T[], callback: (elementOfArray: T, indexInArray: number) => U): U[];
+    /**
+     * Translate all items in an array or object to new array of items.
+     * 
+     * @param arrayOrObject The Array or Object to translate.
+     * @param callback The function to process each item against. The first argument to the function is the value; the second argument is the index or key of the array or object property. The function can return any value to add to the array. A returned array will be flattened into the resulting array. Within the function, this refers to the global (window) object.
+     */
+    map(arrayOrObject: any, callback: (value: any, indexOrKey: any) => any): any;
+
+    /**
+     * Merge the contents of two arrays together into the first array.
+     * 
+     * @param first The first array to merge, the elements of second added.
+     * @param second The second array to merge into the first, unaltered.
+     */
+    merge<T>(first: T[], second: T[]): T[];
+
+    /**
+     * An empty function.
+     */
+    noop(): any;
+
+    /**
+     * Return a number representing the current time.
+     */
+    now(): number;
+
+    /**
+     * Takes a well-formed JSON string and returns the resulting JavaScript object.
+     * 
+     * @param json The JSON string to parse.
+     */
+    parseJSON(json: string): any;
+
+    /**
+     * Parses a string into an XML document.
+     *
+     * @param data a well-formed XML string to be parsed
+     */
+    parseXML(data: string): XMLDocument;
+
+    /**
+     * Remove the whitespace from the beginning and end of a string.
+     * 
+     * @param str Remove the whitespace from the beginning and end of a string.
+     */
+    trim(str: string): string;
+
+    /**
+     * Determine the internal JavaScript [[Class]] of an object.
+     * 
+     * @param obj Object to get the internal JavaScript [[Class]] of.
+     */
+    type(obj: any): string;
+
+    /**
+     * Sorts an array of DOM elements, in place, with the duplicates removed. Note that this only works on arrays of DOM elements, not strings or numbers.
+     * 
+     * @param array The Array of DOM elements.
+     */
+    unique(array: Element[]): Element[];
+
+    /**
+     * Parses a string into an array of DOM nodes.
+     *
+     * @param data HTML string to be parsed
+     * @param context DOM element to serve as the context in which the HTML fragment will be created
+     * @param keepScripts A Boolean indicating whether to include scripts passed in the HTML string
+     */
+    parseHTML(data: string, context?: HTMLElement, keepScripts?: boolean): any[];
+
+    /**
+     * Parses a string into an array of DOM nodes.
+     *
+     * @param data HTML string to be parsed
+     * @param context DOM element to serve as the context in which the HTML fragment will be created
+     * @param keepScripts A Boolean indicating whether to include scripts passed in the HTML string
+     */
+    parseHTML(data: string, context?: Document, keepScripts?: boolean): any[];
+}
+
+/**
+ * The jQuery instance members
+ */
+interface JQuery {
+    /**
+     * Register a handler to be called when Ajax requests complete. This is an AjaxEvent.
+     *
+     * @param handler The function to be invoked.
+     */
+    ajaxComplete(handler: (event: JQueryEventObject, XMLHttpRequest: XMLHttpRequest, ajaxOptions: any) => any): JQuery;
+    /**
+     * Register a handler to be called when Ajax requests complete with an error. This is an Ajax Event.
+     *
+     * @param handler The function to be invoked.
+     */
+    ajaxError(handler: (event: JQueryEventObject, jqXHR: JQueryXHR, ajaxSettings: JQueryAjaxSettings, thrownError: any) => any): JQuery;
+    /**
+     * Attach a function to be executed before an Ajax request is sent. This is an Ajax Event.
+     *
+     * @param handler The function to be invoked.
+     */
+    ajaxSend(handler: (event: JQueryEventObject, jqXHR: JQueryXHR, ajaxOptions: JQueryAjaxSettings) => any): JQuery;
+    /**
+     * Register a handler to be called when the first Ajax request begins. This is an Ajax Event.
+     *
+     * @param handler The function to be invoked.
+     */
+    ajaxStart(handler: () => any): JQuery;
+    /**
+     * Register a handler to be called when all Ajax requests have completed. This is an Ajax Event.
+     *
+     * @param handler The function to be invoked.
+     */
+    ajaxStop(handler: () => any): JQuery;
+    /**
+     * Attach a function to be executed whenever an Ajax request completes successfully. This is an Ajax Event.
+     *
+     * @param handler The function to be invoked.
+     */
+    ajaxSuccess(handler: (event: JQueryEventObject, XMLHttpRequest: XMLHttpRequest, ajaxOptions: JQueryAjaxSettings) => any): JQuery;
+
+    /**
+     * Load data from the server and place the returned HTML into the matched element.
+     *
+     * @param url A string containing the URL to which the request is sent.
+     * @param data A plain object or string that is sent to the server with the request.
+     * @param complete A callback function that is executed when the request completes.
+     */
+    load(url: string, data?: string|Object, complete?: (responseText: string, textStatus: string, XMLHttpRequest: XMLHttpRequest) => any): JQuery;
+
+    /**
+     * Encode a set of form elements as a string for submission.
+     */
+    serialize(): string;
+    /**
+     * Encode a set of form elements as an array of names and values.
+     */
+    serializeArray(): JQuerySerializeArrayElement[];
+
+    /**
+     * Adds the specified class(es) to each of the set of matched elements.
+     *
+     * @param className One or more space-separated classes to be added to the class attribute of each matched element.
+     */
+    addClass(className: string): JQuery;
+    /**
+     * Adds the specified class(es) to each of the set of matched elements.
+     *
+     * @param function A function returning one or more space-separated class names to be added to the existing class name(s). Receives the index position of the element in the set and the existing class name(s) as arguments. Within the function, this refers to the current element in the set.
+     */
+    addClass(func: (index: number, className: string) => string): JQuery;
+
+    /**
+     * Add the previous set of elements on the stack to the current set, optionally filtered by a selector.
+     */
+    addBack(selector?: string): JQuery;
+
+    /**
+     * Get the value of an attribute for the first element in the set of matched elements.
+     *
+     * @param attributeName The name of the attribute to get.
+     */
+    attr(attributeName: string): string;
+    /**
+     * Set one or more attributes for the set of matched elements.
+     *
+     * @param attributeName The name of the attribute to set.
+     * @param value A value to set for the attribute.
+     */
+    attr(attributeName: string, value: string|number): JQuery;
+    /**
+     * Set one or more attributes for the set of matched elements.
+     *
+     * @param attributeName The name of the attribute to set.
+     * @param func A function returning the value to set. this is the current element. Receives the index position of the element in the set and the old attribute value as arguments.
+     */
+    attr(attributeName: string, func: (index: number, attr: string) => string|number): JQuery;
+    /**
+     * Set one or more attributes for the set of matched elements.
+     *
+     * @param attributes An object of attribute-value pairs to set.
+     */
+    attr(attributes: Object): JQuery;
+    
+    /**
+     * Determine whether any of the matched elements are assigned the given class.
+     *
+     * @param className The class name to search for.
+     */
+    hasClass(className: string): boolean;
+
+    /**
+     * Get the HTML contents of the first element in the set of matched elements.
+     */
+    html(): string;
+    /**
+     * Set the HTML contents of each element in the set of matched elements.
+     *
+     * @param htmlString A string of HTML to set as the content of each matched element.
+     */
+    html(htmlString: string): JQuery;
+    /**
+     * Set the HTML contents of each element in the set of matched elements.
+     *
+     * @param func A function returning the HTML content to set. Receives the index position of the element in the set and the old HTML value as arguments. jQuery empties the element before calling the function; use the oldhtml argument to reference the previous content. Within the function, this refers to the current element in the set.
+     */
+    html(func: (index: number, oldhtml: string) => string): JQuery;
+    /**
+     * Set the HTML contents of each element in the set of matched elements.
+     *
+     * @param func A function returning the HTML content to set. Receives the index position of the element in the set and the old HTML value as arguments. jQuery empties the element before calling the function; use the oldhtml argument to reference the previous content. Within the function, this refers to the current element in the set.
+     */
+
+    /**
+     * Get the value of a property for the first element in the set of matched elements.
+     *
+     * @param propertyName The name of the property to get.
+     */
+    prop(propertyName: string): any;
+    /**
+     * Set one or more properties for the set of matched elements.
+     *
+     * @param propertyName The name of the property to set.
+     * @param value A value to set for the property.
+     */
+    prop(propertyName: string, value: string|number|boolean): JQuery;
+    /**
+     * Set one or more properties for the set of matched elements.
+     *
+     * @param properties An object of property-value pairs to set.
+     */
+    prop(properties: Object): JQuery;
+    /**
+     * Set one or more properties for the set of matched elements.
+     *
+     * @param propertyName The name of the property to set.
+     * @param func A function returning the value to set. Receives the index position of the element in the set and the old property value as arguments. Within the function, the keyword this refers to the current element.
+     */
+    prop(propertyName: string, func: (index: number, oldPropertyValue: any) => any): JQuery;
+
+    /**
+     * Remove an attribute from each element in the set of matched elements.
+     *
+     * @param attributeName An attribute to remove; as of version 1.7, it can be a space-separated list of attributes.
+     */
+    removeAttr(attributeName: string): JQuery;
+
+    /**
+     * Remove a single class, multiple classes, or all classes from each element in the set of matched elements.
+     *
+     * @param className One or more space-separated classes to be removed from the class attribute of each matched element.
+     */
+    removeClass(className?: string): JQuery;
+    /**
+     * Remove a single class, multiple classes, or all classes from each element in the set of matched elements.
+     *
+     * @param function A function returning one or more space-separated class names to be removed. Receives the index position of the element in the set and the old class value as arguments.
+     */
+    removeClass(func: (index: number, className: string) => string): JQuery;
+
+    /**
+     * Remove a property for the set of matched elements.
+     *
+     * @param propertyName The name of the property to remove.
+     */
+    removeProp(propertyName: string): JQuery;
+
+    /**
+     * Add or remove one or more classes from each element in the set of matched elements, depending on either the class's presence or the value of the switch argument.
+     *
+     * @param className One or more class names (separated by spaces) to be toggled for each element in the matched set.
+     * @param swtch A Boolean (not just truthy/falsy) value to determine whether the class should be added or removed.
+     */
+    toggleClass(className: string, swtch?: boolean): JQuery;
+    /**
+     * Add or remove one or more classes from each element in the set of matched elements, depending on either the class's presence or the value of the switch argument.
+     *
+     * @param swtch A boolean value to determine whether the class should be added or removed.
+     */
+    toggleClass(swtch?: boolean): JQuery;
+    /**
+     * Add or remove one or more classes from each element in the set of matched elements, depending on either the class's presence or the value of the switch argument.
+     *
+     * @param func A function that returns class names to be toggled in the class attribute of each element in the matched set. Receives the index position of the element in the set, the old class value, and the switch as arguments.
+     * @param swtch A boolean value to determine whether the class should be added or removed.
+     */
+    toggleClass(func: (index: number, className: string, swtch: boolean) => string, swtch?: boolean): JQuery;
+
+    /**
+     * Get the current value of the first element in the set of matched elements.
+     */
+    val(): any;
+    /**
+     * Set the value of each element in the set of matched elements.
+     *
+     * @param value A string of text, an array of strings or number corresponding to the value of each matched element to set as selected/checked.
+     */
+    val(value: string|string[]|number): JQuery;
+    /**
+     * Set the value of each element in the set of matched elements.
+     *
+     * @param func A function returning the value to set. this is the current element. Receives the index position of the element in the set and the old value as arguments.
+     */
+    val(func: (index: number, value: string) => string): JQuery;
+
+
+    /**
+     * Get the value of style properties for the first element in the set of matched elements.
+     *
+     * @param propertyName A CSS property.
+     */
+    css(propertyName: string): string;
+    /**
+     * Set one or more CSS properties for the set of matched elements.
+     *
+     * @param propertyName A CSS property name.
+     * @param value A value to set for the property.
+     */
+    css(propertyName: string, value: string|number): JQuery;
+    /**
+     * Set one or more CSS properties for the set of matched elements.
+     *
+     * @param propertyName A CSS property name.
+     * @param value A function returning the value to set. this is the current element. Receives the index position of the element in the set and the old value as arguments.
+     */
+    css(propertyName: string, value: (index: number, value: string) => string|number): JQuery;
+    /**
+     * Set one or more CSS properties for the set of matched elements.
+     *
+     * @param properties An object of property-value pairs to set.
+     */
+    css(properties: Object): JQuery;
+
+    /**
+     * Get the current computed height for the first element in the set of matched elements.
+     */
+    height(): number;
+    /**
+     * Set the CSS height of every matched element.
+     *
+     * @param value An integer representing the number of pixels, or an integer with an optional unit of measure appended (as a string).
+     */
+    height(value: number|string): JQuery;
+    /**
+     * Set the CSS height of every matched element.
+     *
+     * @param func A function returning the height to set. Receives the index position of the element in the set and the old height as arguments. Within the function, this refers to the current element in the set.
+     */
+    height(func: (index: number, height: number) => number|string): JQuery;
+
+    /**
+     * Get the current computed height for the first element in the set of matched elements, including padding but not border.
+     */
+    innerHeight(): number;
+
+    /**
+     * Sets the inner height on elements in the set of matched elements, including padding but not border.
+     *
+     * @param value An integer representing the number of pixels, or an integer along with an optional unit of measure appended (as a string).
+     */
+    innerHeight(height: number|string): JQuery;
+    
+    /**
+     * Get the current computed width for the first element in the set of matched elements, including padding but not border.
+     */
+    innerWidth(): number;
+
+    /**
+     * Sets the inner width on elements in the set of matched elements, including padding but not border.
+     *
+     * @param value An integer representing the number of pixels, or an integer along with an optional unit of measure appended (as a string).
+     */
+    innerWidth(width: number|string): JQuery;
+    
+    /**
+     * Get the current coordinates of the first element in the set of matched elements, relative to the document.
+     */
+    offset(): JQueryCoordinates;
+    /**
+     * An object containing the properties top and left, which are integers indicating the new top and left coordinates for the elements.
+     *
+     * @param coordinates An object containing the properties top and left, which are integers indicating the new top and left coordinates for the elements.
+     */
+    offset(coordinates: JQueryCoordinates): JQuery;
+    /**
+     * An object containing the properties top and left, which are integers indicating the new top and left coordinates for the elements.
+     *
+     * @param func A function to return the coordinates to set. Receives the index of the element in the collection as the first argument and the current coordinates as the second argument. The function should return an object with the new top and left properties.
+     */
+    offset(func: (index: number, coords: JQueryCoordinates) => JQueryCoordinates): JQuery;
+
+    /**
+     * Get the current computed height for the first element in the set of matched elements, including padding, border, and optionally margin. Returns an integer (without "px") representation of the value or null if called on an empty set of elements.
+     *
+     * @param includeMargin A Boolean indicating whether to include the element's margin in the calculation.
+     */
+    outerHeight(includeMargin?: boolean): number;
+
+    /**
+     * Sets the outer height on elements in the set of matched elements, including padding and border.
+     *
+     * @param value An integer representing the number of pixels, or an integer along with an optional unit of measure appended (as a string).
+     */
+    outerHeight(height: number|string): JQuery;
+
+    /**
+     * Get the current computed width for the first element in the set of matched elements, including padding and border.
+     *
+     * @param includeMargin A Boolean indicating whether to include the element's margin in the calculation.
+     */
+    outerWidth(includeMargin?: boolean): number;
+
+    /**
+     * Sets the outer width on elements in the set of matched elements, including padding and border.
+     *
+     * @param value An integer representing the number of pixels, or an integer along with an optional unit of measure appended (as a string).
+     */
+    outerWidth(width: number|string): JQuery;
+
+    /**
+     * Get the current coordinates of the first element in the set of matched elements, relative to the offset parent.
+     */
+    position(): JQueryCoordinates;
+
+    /**
+     * Get the current horizontal position of the scroll bar for the first element in the set of matched elements or set the horizontal position of the scroll bar for every matched element.
+     */
+    scrollLeft(): number;
+    /**
+     * Set the current horizontal position of the scroll bar for each of the set of matched elements.
+     *
+     * @param value An integer indicating the new position to set the scroll bar to.
+     */
+    scrollLeft(value: number): JQuery;
+
+    /**
+     * Get the current vertical position of the scroll bar for the first element in the set of matched elements or set the vertical position of the scroll bar for every matched element.
+     */
+    scrollTop(): number;
+    /**
+     * Set the current vertical position of the scroll bar for each of the set of matched elements.
+     *
+     * @param value An integer indicating the new position to set the scroll bar to.
+     */
+    scrollTop(value: number): JQuery;
+
+    /**
+     * Get the current computed width for the first element in the set of matched elements.
+     */
+    width(): number;
+    /**
+     * Set the CSS width of each element in the set of matched elements.
+     *
+     * @param value An integer representing the number of pixels, or an integer along with an optional unit of measure appended (as a string).
+     */
+    width(value: number|string): JQuery;
+    /**
+     * Set the CSS width of each element in the set of matched elements.
+     *
+     * @param func A function returning the width to set. Receives the index position of the element in the set and the old width as arguments. Within the function, this refers to the current element in the set.
+     */
+    width(func: (index: number, width: number) => number|string): JQuery;
+
+    /**
+     * Remove from the queue all items that have not yet been run.
+     *
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     */
+    clearQueue(queueName?: string): JQuery;
+
+    /**
+     * Store arbitrary data associated with the matched elements.
+     *
+     * @param key A string naming the piece of data to set.
+     * @param value The new data value; it can be any Javascript type including Array or Object.
+     */
+    data(key: string, value: any): JQuery;
+    /**
+     * Return the value at the named data store for the first element in the jQuery collection, as set by data(name, value) or by an HTML5 data-* attribute.
+     *
+     * @param key Name of the data stored.
+     */
+    data(key: string): any;
+    /**
+     * Store arbitrary data associated with the matched elements.
+     *
+     * @param obj An object of key-value pairs of data to update.
+     */
+    data(obj: { [key: string]: any; }): JQuery;
+    /**
+     * Return the value at the named data store for the first element in the jQuery collection, as set by data(name, value) or by an HTML5 data-* attribute.
+     */
+    data(): any;
+
+    /**
+     * Execute the next function on the queue for the matched elements.
+     *
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     */
+    dequeue(queueName?: string): JQuery;
+
+    /**
+     * Remove a previously-stored piece of data.
+     *
+     * @param name A string naming the piece of data to delete or space-separated string naming the pieces of data to delete.
+     */
+    removeData(name: string): JQuery;
+    /**
+     * Remove a previously-stored piece of data.
+     *
+     * @param list An array of strings naming the pieces of data to delete.
+     */
+    removeData(list: string[]): JQuery;
+    /**
+     * Remove all previously-stored piece of data.
+     */
+    removeData(): JQuery;
+
+    /**
+     * Return a Promise object to observe when all actions of a certain type bound to the collection, queued or not, have finished.
+     *
+     * @param type The type of queue that needs to be observed. (default: fx)
+     * @param target Object onto which the promise methods have to be attached
+     */
+    promise(type?: string, target?: Object): JQueryPromise<any>;
+
+    /**
+     * Perform a custom animation of a set of CSS properties.
+     *
+     * @param properties An object of CSS properties and values that the animation will move toward.
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    animate(properties: Object, duration?: string|number, complete?: Function): JQuery;
+    /**
+     * Perform a custom animation of a set of CSS properties.
+     *
+     * @param properties An object of CSS properties and values that the animation will move toward.
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition. (default: swing)
+     * @param complete A function to call once the animation is complete.
+     */
+    animate(properties: Object, duration?: string|number, easing?: string, complete?: Function): JQuery;
+    /**
+     * Perform a custom animation of a set of CSS properties.
+     *
+     * @param properties An object of CSS properties and values that the animation will move toward.
+     * @param options A map of additional options to pass to the method.
+     */
+    animate(properties: Object, options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Set a timer to delay execution of subsequent items in the queue.
+     *
+     * @param duration An integer indicating the number of milliseconds to delay execution of the next item in the queue.
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     */
+    delay(duration: number, queueName?: string): JQuery;
+
+    /**
+     * Display the matched elements by fading them to opaque.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    fadeIn(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Display the matched elements by fading them to opaque.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    fadeIn(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Display the matched elements by fading them to opaque.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    fadeIn(options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Hide the matched elements by fading them to transparent.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    fadeOut(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Hide the matched elements by fading them to transparent.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    fadeOut(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Hide the matched elements by fading them to transparent.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    fadeOut(options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Adjust the opacity of the matched elements.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param opacity A number between 0 and 1 denoting the target opacity.
+     * @param complete A function to call once the animation is complete.
+     */
+    fadeTo(duration: string|number, opacity: number, complete?: Function): JQuery;
+    /**
+     * Adjust the opacity of the matched elements.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param opacity A number between 0 and 1 denoting the target opacity.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    fadeTo(duration: string|number, opacity: number, easing?: string, complete?: Function): JQuery;
+
+    /**
+     * Display or hide the matched elements by animating their opacity.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    fadeToggle(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Display or hide the matched elements by animating their opacity.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    fadeToggle(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Display or hide the matched elements by animating their opacity.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    fadeToggle(options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Stop the currently-running animation, remove all queued animations, and complete all animations for the matched elements.
+     *
+     * @param queue The name of the queue in which to stop animations.
+     */
+    finish(queue?: string): JQuery;
+
+    /**
+     * Hide the matched elements.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    hide(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Hide the matched elements.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    hide(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Hide the matched elements.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    hide(options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Display the matched elements.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    show(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Display the matched elements.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    show(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Display the matched elements.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    show(options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Display the matched elements with a sliding motion.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    slideDown(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Display the matched elements with a sliding motion.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    slideDown(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Display the matched elements with a sliding motion.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    slideDown(options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Display or hide the matched elements with a sliding motion.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    slideToggle(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Display or hide the matched elements with a sliding motion.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    slideToggle(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Display or hide the matched elements with a sliding motion.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    slideToggle(options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Hide the matched elements with a sliding motion.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    slideUp(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Hide the matched elements with a sliding motion.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    slideUp(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Hide the matched elements with a sliding motion.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    slideUp(options: JQueryAnimationOptions): JQuery;
+
+    /**
+     * Stop the currently-running animation on the matched elements.
+     *
+     * @param clearQueue A Boolean indicating whether to remove queued animation as well. Defaults to false.
+     * @param jumpToEnd A Boolean indicating whether to complete the current animation immediately. Defaults to false.
+     */
+    stop(clearQueue?: boolean, jumpToEnd?: boolean): JQuery;
+    /**
+     * Stop the currently-running animation on the matched elements.
+     *
+     * @param queue The name of the queue in which to stop animations.
+     * @param clearQueue A Boolean indicating whether to remove queued animation as well. Defaults to false.
+     * @param jumpToEnd A Boolean indicating whether to complete the current animation immediately. Defaults to false.
+     */
+    stop(queue?: string, clearQueue?: boolean, jumpToEnd?: boolean): JQuery;
+
+    /**
+     * Display or hide the matched elements.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param complete A function to call once the animation is complete.
+     */
+    toggle(duration?: number|string, complete?: Function): JQuery;
+    /**
+     * Display or hide the matched elements.
+     *
+     * @param duration A string or number determining how long the animation will run.
+     * @param easing A string indicating which easing function to use for the transition.
+     * @param complete A function to call once the animation is complete.
+     */
+    toggle(duration?: number|string, easing?: string, complete?: Function): JQuery;
+    /**
+     * Display or hide the matched elements.
+     *
+     * @param options A map of additional options to pass to the method.
+     */
+    toggle(options: JQueryAnimationOptions): JQuery;
+    /**
+     * Display or hide the matched elements.
+     *
+     * @param showOrHide A Boolean indicating whether to show or hide the elements.
+     */
+    toggle(showOrHide: boolean): JQuery;
+
+    /**
+     * Attach a handler to an event for the elements.
+     * 
+     * @param eventType A string containing one or more DOM event types, such as "click" or "submit," or custom event names.
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    bind(eventType: string, eventData: any, handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Attach a handler to an event for the elements.
+     * 
+     * @param eventType A string containing one or more DOM event types, such as "click" or "submit," or custom event names.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    bind(eventType: string, handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Attach a handler to an event for the elements.
+     * 
+     * @param eventType A string containing one or more DOM event types, such as "click" or "submit," or custom event names.
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param preventBubble Setting the third argument to false will attach a function that prevents the default action from occurring and stops the event from bubbling. The default is true.
+     */
+    bind(eventType: string, eventData: any, preventBubble: boolean): JQuery;
+    /**
+     * Attach a handler to an event for the elements.
+     * 
+     * @param eventType A string containing one or more DOM event types, such as "click" or "submit," or custom event names.
+     * @param preventBubble Setting the third argument to false will attach a function that prevents the default action from occurring and stops the event from bubbling. The default is true.
+     */
+    bind(eventType: string, preventBubble: boolean): JQuery;
+    /**
+     * Attach a handler to an event for the elements.
+     * 
+     * @param events An object containing one or more DOM event types and functions to execute for them.
+     */
+    bind(events: any): JQuery;
+
+    /**
+     * Trigger the "blur" event on an element
+     */
+    blur(): JQuery;
+    /**
+     * Bind an event handler to the "blur" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    blur(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "blur" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    blur(eventData?: any, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "change" event on an element.
+     */
+    change(): JQuery;
+    /**
+     * Bind an event handler to the "change" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    change(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "change" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    change(eventData?: any, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "click" event on an element.
+     */
+    click(): JQuery;
+    /**
+     * Bind an event handler to the "click" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     */
+    click(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "click" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    click(eventData?: any, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "dblclick" event on an element.
+     */
+    dblclick(): JQuery;
+    /**
+     * Bind an event handler to the "dblclick" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    dblclick(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "dblclick" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    dblclick(eventData?: any, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+
+    delegate(selector: any, eventType: string, handler: (eventObject: JQueryEventObject) => any): JQuery;
+    delegate(selector: any, eventType: string, eventData: any, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "focus" event on an element.
+     */
+    focus(): JQuery;
+    /**
+     * Bind an event handler to the "focus" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    focus(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "focus" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    focus(eventData?: any, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "focusin" event on an element.
+     */
+    focusin(): JQuery;
+    /**
+     * Bind an event handler to the "focusin" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    focusin(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "focusin" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    focusin(eventData: Object, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "focusout" event on an element.
+     */
+    focusout(): JQuery;
+    /**
+     * Bind an event handler to the "focusout" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    focusout(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "focusout" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    focusout(eventData: Object, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Bind two handlers to the matched elements, to be executed when the mouse pointer enters and leaves the elements.
+     *
+     * @param handlerIn A function to execute when the mouse pointer enters the element.
+     * @param handlerOut A function to execute when the mouse pointer leaves the element.
+     */
+    hover(handlerIn: (eventObject: JQueryEventObject) => any, handlerOut: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind a single handler to the matched elements, to be executed when the mouse pointer enters or leaves the elements.
+     *
+     * @param handlerInOut A function to execute when the mouse pointer enters or leaves the element.
+     */
+    hover(handlerInOut: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "keydown" event on an element.
+     */
+    keydown(): JQuery;
+    /**
+     * Bind an event handler to the "keydown" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    keydown(handler: (eventObject: JQueryKeyEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "keydown" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    keydown(eventData?: any, handler?: (eventObject: JQueryKeyEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "keypress" event on an element.
+     */
+    keypress(): JQuery;
+    /**
+     * Bind an event handler to the "keypress" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    keypress(handler: (eventObject: JQueryKeyEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "keypress" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    keypress(eventData?: any, handler?: (eventObject: JQueryKeyEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "keyup" event on an element.
+     */
+    keyup(): JQuery;
+    /**
+     * Bind an event handler to the "keyup" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    keyup(handler: (eventObject: JQueryKeyEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "keyup" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    keyup(eventData?: any, handler?: (eventObject: JQueryKeyEventObject) => any): JQuery;
+
+    /**
+     * Bind an event handler to the "load" JavaScript event.
+     *
+     * @param handler A function to execute when the event is triggered.
+     */
+    load(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "load" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    load(eventData?: any, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "mousedown" event on an element.
+     */
+    mousedown(): JQuery;
+    /**
+     * Bind an event handler to the "mousedown" JavaScript event.
+     *
+     * @param handler A function to execute when the event is triggered.
+     */
+    mousedown(handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "mousedown" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    mousedown(eventData: Object, handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "mouseenter" event on an element.
+     */
+    mouseenter(): JQuery;
+    /**
+     * Bind an event handler to be fired when the mouse enters an element.
+     *
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseenter(handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to be fired when the mouse enters an element.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseenter(eventData: Object, handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "mouseleave" event on an element.
+     */
+    mouseleave(): JQuery;
+    /**
+     * Bind an event handler to be fired when the mouse leaves an element.
+     *
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseleave(handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to be fired when the mouse leaves an element.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseleave(eventData: Object, handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "mousemove" event on an element.
+     */
+    mousemove(): JQuery;
+    /**
+     * Bind an event handler to the "mousemove" JavaScript event.
+     *
+     * @param handler A function to execute when the event is triggered.
+     */
+    mousemove(handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "mousemove" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    mousemove(eventData: Object, handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "mouseout" event on an element.
+     */
+    mouseout(): JQuery;
+    /**
+     * Bind an event handler to the "mouseout" JavaScript event.
+     *
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseout(handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "mouseout" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseout(eventData: Object, handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "mouseover" event on an element.
+     */
+    mouseover(): JQuery;
+    /**
+     * Bind an event handler to the "mouseover" JavaScript event.
+     *
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseover(handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "mouseover" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseover(eventData: Object, handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "mouseup" event on an element.
+     */
+    mouseup(): JQuery;
+    /**
+     * Bind an event handler to the "mouseup" JavaScript event.
+     *
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseup(handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "mouseup" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    mouseup(eventData: Object, handler: (eventObject: JQueryMouseEventObject) => any): JQuery;
+
+    /**
+     * Remove an event handler.
+     */
+    off(): JQuery;
+    /**
+     * Remove an event handler.
+     *
+     * @param events One or more space-separated event types and optional namespaces, or just namespaces, such as "click", "keydown.myPlugin", or ".myPlugin".
+     * @param selector A selector which should match the one originally passed to .on() when attaching event handlers.
+     * @param handler A handler function previously attached for the event(s), or the special value false.
+     */
+    off(events: string, selector?: string, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Remove an event handler.
+     *
+     * @param events One or more space-separated event types and optional namespaces, or just namespaces, such as "click", "keydown.myPlugin", or ".myPlugin".
+     * @param handler A handler function previously attached for the event(s), or the special value false. Takes handler with extra args that can be attached with on().
+     */
+    off(events: string, handler: (eventObject: JQueryEventObject, ...args: any[]) => any): JQuery;
+    /**
+     * Remove an event handler.
+     *
+     * @param events One or more space-separated event types and optional namespaces, or just namespaces, such as "click", "keydown.myPlugin", or ".myPlugin".
+     * @param handler A handler function previously attached for the event(s), or the special value false.
+     */
+    off(events: string, handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Remove an event handler.
+     *
+     * @param events An object where the string keys represent one or more space-separated event types and optional namespaces, and the values represent handler functions previously attached for the event(s).
+     * @param selector A selector which should match the one originally passed to .on() when attaching event handlers.
+     */
+    off(events: { [key: string]: any; }, selector?: string): JQuery;
+
+    /**
+     * Attach an event handler function for one or more events to the selected elements.
+     *
+     * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin".
+     * @param handler A function to execute when the event is triggered. The value false is also allowed as a shorthand for a function that simply does return false. Rest parameter args is for optional parameters passed to jQuery.trigger(). Note that the actual parameters on the event handler function must be marked as optional (? syntax).
+     */
+    on(events: string, handler: (eventObject: JQueryEventObject, ...args: any[]) => any): JQuery;
+    /**
+     * Attach an event handler function for one or more events to the selected elements.
+     *
+     * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin".
+     * @param data Data to be passed to the handler in event.data when an event is triggered.
+     * @param handler A function to execute when the event is triggered. The value false is also allowed as a shorthand for a function that simply does return false.
+    */
+    on(events: string, data : any, handler: (eventObject: JQueryEventObject, ...args: any[]) => any): JQuery;
+    /**
+     * Attach an event handler function for one or more events to the selected elements.
+     *
+     * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin".
+     * @param selector A selector string to filter the descendants of the selected elements that trigger the event. If the selector is null or omitted, the event is always triggered when it reaches the selected element.
+     * @param handler A function to execute when the event is triggered. The value false is also allowed as a shorthand for a function that simply does return false.
+     */
+    on(events: string, selector: string, handler: (eventObject: JQueryEventObject, ...eventData: any[]) => any): JQuery;
+    /**
+     * Attach an event handler function for one or more events to the selected elements.
+     *
+     * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin".
+     * @param selector A selector string to filter the descendants of the selected elements that trigger the event. If the selector is null or omitted, the event is always triggered when it reaches the selected element.
+     * @param data Data to be passed to the handler in event.data when an event is triggered.
+     * @param handler A function to execute when the event is triggered. The value false is also allowed as a shorthand for a function that simply does return false.
+     */
+    on(events: string, selector: string, data: any, handler: (eventObject: JQueryEventObject, ...eventData: any[]) => any): JQuery;
+    /**
+     * Attach an event handler function for one or more events to the selected elements.
+     *
+     * @param events An object in which the string keys represent one or more space-separated event types and optional namespaces, and the values represent a handler function to be called for the event(s).
+     * @param selector A selector string to filter the descendants of the selected elements that will call the handler. If the selector is null or omitted, the handler is always called when it reaches the selected element.
+     * @param data Data to be passed to the handler in event.data when an event occurs.
+     */
+    on(events: { [key: string]: any; }, selector?: string, data?: any): JQuery;
+    /**
+     * Attach an event handler function for one or more events to the selected elements.
+     *
+     * @param events An object in which the string keys represent one or more space-separated event types and optional namespaces, and the values represent a handler function to be called for the event(s).
+     * @param data Data to be passed to the handler in event.data when an event occurs.
+     */
+    on(events: { [key: string]: any; }, data?: any): JQuery;
+
+    /**
+     * Attach a handler to an event for the elements. The handler is executed at most once per element per event type.
+     *
+     * @param events A string containing one or more JavaScript event types, such as "click" or "submit," or custom event names.
+     * @param handler A function to execute at the time the event is triggered.
+     */
+    one(events: string, handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Attach a handler to an event for the elements. The handler is executed at most once per element per event type.
+     *
+     * @param events A string containing one or more JavaScript event types, such as "click" or "submit," or custom event names.
+     * @param data An object containing data that will be passed to the event handler.
+     * @param handler A function to execute at the time the event is triggered.
+     */
+    one(events: string, data: Object, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Attach a handler to an event for the elements. The handler is executed at most once per element per event type.
+     *
+     * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin".
+     * @param selector A selector string to filter the descendants of the selected elements that trigger the event. If the selector is null or omitted, the event is always triggered when it reaches the selected element.
+     * @param handler A function to execute when the event is triggered. The value false is also allowed as a shorthand for a function that simply does return false.
+     */
+    one(events: string, selector: string, handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Attach a handler to an event for the elements. The handler is executed at most once per element per event type.
+     *
+     * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin".
+     * @param selector A selector string to filter the descendants of the selected elements that trigger the event. If the selector is null or omitted, the event is always triggered when it reaches the selected element.
+     * @param data Data to be passed to the handler in event.data when an event is triggered.
+     * @param handler A function to execute when the event is triggered. The value false is also allowed as a shorthand for a function that simply does return false.
+     */
+    one(events: string, selector: string, data: any, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Attach a handler to an event for the elements. The handler is executed at most once per element per event type.
+     *
+     * @param events An object in which the string keys represent one or more space-separated event types and optional namespaces, and the values represent a handler function to be called for the event(s).
+     * @param selector A selector string to filter the descendants of the selected elements that will call the handler. If the selector is null or omitted, the handler is always called when it reaches the selected element.
+     * @param data Data to be passed to the handler in event.data when an event occurs.
+     */
+    one(events: { [key: string]: any; }, selector?: string, data?: any): JQuery;
+
+    /**
+     * Attach a handler to an event for the elements. The handler is executed at most once per element per event type.
+     *
+     * @param events An object in which the string keys represent one or more space-separated event types and optional namespaces, and the values represent a handler function to be called for the event(s).
+     * @param data Data to be passed to the handler in event.data when an event occurs.
+     */
+    one(events: { [key: string]: any; }, data?: any): JQuery;
+
+
+    /**
+     * Specify a function to execute when the DOM is fully loaded.
+     *
+     * @param handler A function to execute after the DOM is ready.
+     */
+    ready(handler: (jQueryAlias?: JQueryStatic) => any): JQuery;
+
+    /**
+     * Trigger the "resize" event on an element.
+     */
+    resize(): JQuery;
+    /**
+     * Bind an event handler to the "resize" JavaScript event.
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    resize(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "resize" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    resize(eventData: Object, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "scroll" event on an element.
+     */
+    scroll(): JQuery;
+    /**
+     * Bind an event handler to the "scroll" JavaScript event.
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    scroll(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "scroll" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    scroll(eventData: Object, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "select" event on an element.
+     */
+    select(): JQuery;
+    /**
+     * Bind an event handler to the "select" JavaScript event.
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    select(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "select" JavaScript event.
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    select(eventData: Object, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Trigger the "submit" event on an element.
+     */
+    submit(): JQuery;
+    /**
+     * Bind an event handler to the "submit" JavaScript event
+     *
+     * @param handler A function to execute each time the event is triggered.
+     */
+    submit(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "submit" JavaScript event
+     *
+     * @param eventData An object containing data that will be passed to the event handler.
+     * @param handler A function to execute each time the event is triggered.
+     */
+    submit(eventData?: any, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Execute all handlers and behaviors attached to the matched elements for the given event type.
+     * 
+     * @param eventType A string containing a JavaScript event type, such as click or submit.
+     * @param extraParameters Additional parameters to pass along to the event handler.
+     */
+    trigger(eventType: string, extraParameters?: any[]|Object): JQuery;
+    /**
+     * Execute all handlers and behaviors attached to the matched elements for the given event type.
+     * 
+     * @param event A jQuery.Event object.
+     * @param extraParameters Additional parameters to pass along to the event handler.
+     */
+    trigger(event: JQueryEventObject, extraParameters?: any[]|Object): JQuery;
+
+    /**
+     * Execute all handlers attached to an element for an event.
+     * 
+     * @param eventType A string containing a JavaScript event type, such as click or submit.
+     * @param extraParameters An array of additional parameters to pass along to the event handler.
+     */
+    triggerHandler(eventType: string, ...extraParameters: any[]): Object;
+
+    /**
+     * Execute all handlers attached to an element for an event.
+     * 
+     * @param event A jQuery.Event object.
+     * @param extraParameters An array of additional parameters to pass along to the event handler.
+     */
+    triggerHandler(event: JQueryEventObject, ...extraParameters: any[]): Object;
+
+    /**
+     * Remove a previously-attached event handler from the elements.
+     * 
+     * @param eventType A string containing a JavaScript event type, such as click or submit.
+     * @param handler The function that is to be no longer executed.
+     */
+    unbind(eventType?: string, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Remove a previously-attached event handler from the elements.
+     * 
+     * @param eventType A string containing a JavaScript event type, such as click or submit.
+     * @param fls Unbinds the corresponding 'return false' function that was bound using .bind( eventType, false ).
+     */
+    unbind(eventType: string, fls: boolean): JQuery;
+    /**
+     * Remove a previously-attached event handler from the elements.
+     * 
+     * @param evt A JavaScript event object as passed to an event handler.
+     */
+    unbind(evt: any): JQuery;
+
+    /**
+     * Remove a handler from the event for all elements which match the current selector, based upon a specific set of root elements.
+     */
+    undelegate(): JQuery;
+    /**
+     * Remove a handler from the event for all elements which match the current selector, based upon a specific set of root elements.
+     * 
+     * @param selector A selector which will be used to filter the event results.
+     * @param eventType A string containing a JavaScript event type, such as "click" or "keydown"
+     * @param handler A function to execute at the time the event is triggered.
+     */
+    undelegate(selector: string, eventType: string, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Remove a handler from the event for all elements which match the current selector, based upon a specific set of root elements.
+     * 
+     * @param selector A selector which will be used to filter the event results.
+     * @param events An object of one or more event types and previously bound functions to unbind from them.
+     */
+    undelegate(selector: string, events: Object): JQuery;
+    /**
+     * Remove a handler from the event for all elements which match the current selector, based upon a specific set of root elements.
+     * 
+     * @param namespace A string containing a namespace to unbind all events from.
+     */
+    undelegate(namespace: string): JQuery;
+
+    /**
+     * Bind an event handler to the "unload" JavaScript event. (DEPRECATED from v1.8)
+     * 
+     * @param handler A function to execute when the event is triggered.
+     */
+    unload(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "unload" JavaScript event. (DEPRECATED from v1.8)
+     * 
+     * @param eventData A plain object of data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    unload(eventData?: any, handler?: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * The DOM node context originally passed to jQuery(); if none was passed then context will likely be the document. (DEPRECATED from v1.10)
+     */
+    context: Element;
+
+    jquery: string;
+
+    /**
+     * Bind an event handler to the "error" JavaScript event. (DEPRECATED from v1.8)
+     * 
+     * @param handler A function to execute when the event is triggered.
+     */
+    error(handler: (eventObject: JQueryEventObject) => any): JQuery;
+    /**
+     * Bind an event handler to the "error" JavaScript event. (DEPRECATED from v1.8)
+     * 
+     * @param eventData A plain object of data that will be passed to the event handler.
+     * @param handler A function to execute when the event is triggered.
+     */
+    error(eventData: any, handler: (eventObject: JQueryEventObject) => any): JQuery;
+
+    /**
+     * Add a collection of DOM elements onto the jQuery stack.
+     * 
+     * @param elements An array of elements to push onto the stack and make into a new jQuery object.
+     */
+    pushStack(elements: any[]): JQuery;
+    /**
+     * Add a collection of DOM elements onto the jQuery stack.
+     * 
+     * @param elements An array of elements to push onto the stack and make into a new jQuery object.
+     * @param name The name of a jQuery method that generated the array of elements.
+     * @param arguments The arguments that were passed in to the jQuery method (for serialization).
+     */
+    pushStack(elements: any[], name: string, arguments: any[]): JQuery;
+
+    /**
+     * Insert content, specified by the parameter, after each element in the set of matched elements.
+     * 
+     * param content1 HTML string, DOM element, array of elements, or jQuery object to insert after each element in the set of matched elements.
+     * param content2 One or more additional DOM elements, arrays of elements, HTML strings, or jQuery objects to insert after each element in the set of matched elements.
+     */
+    after(content1: JQuery|any[]|Element|Text|string, ...content2: any[]): JQuery;
+    /**
+     * Insert content, specified by the parameter, after each element in the set of matched elements.
+     * 
+     * param func A function that returns an HTML string, DOM element(s), or jQuery object to insert after each element in the set of matched elements. Receives the index position of the element in the set as an argument. Within the function, this refers to the current element in the set.
+     */
+    after(func: (index: number, html: string) => string|Element|JQuery): JQuery;
+
+    /**
+     * Insert content, specified by the parameter, to the end of each element in the set of matched elements.
+     * 
+     * param content1 DOM element, array of elements, HTML string, or jQuery object to insert at the end of each element in the set of matched elements.
+     * param content2 One or more additional DOM elements, arrays of elements, HTML strings, or jQuery objects to insert at the end of each element in the set of matched elements.
+     */
+    append(content1: JQuery|any[]|Element|Text|string, ...content2: any[]): JQuery;
+    /**
+     * Insert content, specified by the parameter, to the end of each element in the set of matched elements.
+     * 
+     * param func A function that returns an HTML string, DOM element(s), or jQuery object to insert at the end of each element in the set of matched elements. Receives the index position of the element in the set and the old HTML value of the element as arguments. Within the function, this refers to the current element in the set.
+     */
+    append(func: (index: number, html: string) => string|Element|JQuery): JQuery;
+
+    /**
+     * Insert every element in the set of matched elements to the end of the target.
+     * 
+     * @param target A selector, element, HTML string, array of elements, or jQuery object; the matched set of elements will be inserted at the end of the element(s) specified by this parameter.
+     */
+    appendTo(target: JQuery|any[]|Element|string): JQuery;
+
+    /**
+     * Insert content, specified by the parameter, before each element in the set of matched elements.
+     * 
+     * param content1 HTML string, DOM element, array of elements, or jQuery object to insert before each element in the set of matched elements.
+     * param content2 One or more additional DOM elements, arrays of elements, HTML strings, or jQuery objects to insert before each element in the set of matched elements.
+     */
+    before(content1: JQuery|any[]|Element|Text|string, ...content2: any[]): JQuery;
+    /**
+     * Insert content, specified by the parameter, before each element in the set of matched elements.
+     * 
+     * param func A function that returns an HTML string, DOM element(s), or jQuery object to insert before each element in the set of matched elements. Receives the index position of the element in the set as an argument. Within the function, this refers to the current element in the set.
+     */
+    before(func: (index: number, html: string) => string|Element|JQuery): JQuery;
+
+    /**
+     * Create a deep copy of the set of matched elements.
+     * 
+     * param withDataAndEvents A Boolean indicating whether event handlers and data should be copied along with the elements. The default value is false.
+     * param deepWithDataAndEvents A Boolean indicating whether event handlers and data for all children of the cloned element should be copied. By default its value matches the first argument's value (which defaults to false).
+     */
+    clone(withDataAndEvents?: boolean, deepWithDataAndEvents?: boolean): JQuery;
+
+    /**
+     * Remove the set of matched elements from the DOM.
+     * 
+     * param selector A selector expression that filters the set of matched elements to be removed.
+     */
+    detach(selector?: string): JQuery;
+
+    /**
+     * Remove all child nodes of the set of matched elements from the DOM.
+     */
+    empty(): JQuery;
+
+    /**
+     * Insert every element in the set of matched elements after the target.
+     * 
+     * param target A selector, element, array of elements, HTML string, or jQuery object; the matched set of elements will be inserted after the element(s) specified by this parameter.
+     */
+    insertAfter(target: JQuery|any[]|Element|Text|string): JQuery;
+
+    /**
+     * Insert every element in the set of matched elements before the target.
+     * 
+     * param target A selector, element, array of elements, HTML string, or jQuery object; the matched set of elements will be inserted before the element(s) specified by this parameter.
+     */
+    insertBefore(target: JQuery|any[]|Element|Text|string): JQuery;
+
+    /**
+     * Insert content, specified by the parameter, to the beginning of each element in the set of matched elements.
+     * 
+     * param content1 DOM element, array of elements, HTML string, or jQuery object to insert at the beginning of each element in the set of matched elements.
+     * param content2 One or more additional DOM elements, arrays of elements, HTML strings, or jQuery objects to insert at the beginning of each element in the set of matched elements.
+     */
+    prepend(content1: JQuery|any[]|Element|Text|string, ...content2: any[]): JQuery;
+    /**
+     * Insert content, specified by the parameter, to the beginning of each element in the set of matched elements.
+     * 
+     * param func A function that returns an HTML string, DOM element(s), or jQuery object to insert at the beginning of each element in the set of matched elements. Receives the index position of the element in the set and the old HTML value of the element as arguments. Within the function, this refers to the current element in the set.
+     */
+    prepend(func: (index: number, html: string) => string|Element|JQuery): JQuery;
+
+    /**
+     * Insert every element in the set of matched elements to the beginning of the target.
+     * 
+     * @param target A selector, element, HTML string, array of elements, or jQuery object; the matched set of elements will be inserted at the beginning of the element(s) specified by this parameter.
+     */
+    prependTo(target: JQuery|any[]|Element|string): JQuery;
+
+    /**
+     * Remove the set of matched elements from the DOM.
+     * 
+     * @param selector A selector expression that filters the set of matched elements to be removed.
+     */
+    remove(selector?: string): JQuery;
+
+    /**
+     * Replace each target element with the set of matched elements.
+     * 
+     * @param target A selector string, jQuery object, DOM element, or array of elements indicating which element(s) to replace.
+     */
+    replaceAll(target: JQuery|any[]|Element|string): JQuery;
+
+    /**
+     * Replace each element in the set of matched elements with the provided new content and return the set of elements that was removed.
+     * 
+     * param newContent The content to insert. May be an HTML string, DOM element, array of DOM elements, or jQuery object.
+     */
+    replaceWith(newContent: JQuery|any[]|Element|Text|string): JQuery;
+    /**
+     * Replace each element in the set of matched elements with the provided new content and return the set of elements that was removed.
+     * 
+     * param func A function that returns content with which to replace the set of matched elements.
+     */
+    replaceWith(func: () => Element|JQuery): JQuery;
+
+    /**
+     * Get the combined text contents of each element in the set of matched elements, including their descendants.
+     */
+    text(): string;
+    /**
+     * Set the content of each element in the set of matched elements to the specified text.
+     * 
+     * @param text The text to set as the content of each matched element. When Number or Boolean is supplied, it will be converted to a String representation.
+     */
+    text(text: string|number|boolean): JQuery;
+    /**
+     * Set the content of each element in the set of matched elements to the specified text.
+     * 
+     * @param func A function returning the text content to set. Receives the index position of the element in the set and the old text value as arguments.
+     */
+    text(func: (index: number, text: string) => string): JQuery;
+
+    /**
+     * Retrieve all the elements contained in the jQuery set, as an array.
+     */
+    toArray(): any[];
+
+    /**
+     * Remove the parents of the set of matched elements from the DOM, leaving the matched elements in their place.
+     */
+    unwrap(): JQuery;
+
+    /**
+     * Wrap an HTML structure around each element in the set of matched elements.
+     * 
+     * @param wrappingElement A selector, element, HTML string, or jQuery object specifying the structure to wrap around the matched elements.
+     */
+    wrap(wrappingElement: JQuery|Element|string): JQuery;
+    /**
+     * Wrap an HTML structure around each element in the set of matched elements.
+     * 
+     * @param func A callback function returning the HTML content or jQuery object to wrap around the matched elements. Receives the index position of the element in the set as an argument. Within the function, this refers to the current element in the set.
+     */
+    wrap(func: (index: number) => string|JQuery): JQuery;
+
+    /**
+     * Wrap an HTML structure around all elements in the set of matched elements.
+     * 
+     * @param wrappingElement A selector, element, HTML string, or jQuery object specifying the structure to wrap around the matched elements.
+     */
+    wrapAll(wrappingElement: JQuery|Element|string): JQuery;
+    wrapAll(func: (index: number) => string): JQuery;
+
+    /**
+     * Wrap an HTML structure around the content of each element in the set of matched elements.
+     * 
+     * @param wrappingElement An HTML snippet, selector expression, jQuery object, or DOM element specifying the structure to wrap around the content of the matched elements.
+     */
+    wrapInner(wrappingElement: JQuery|Element|string): JQuery;
+    /**
+     * Wrap an HTML structure around the content of each element in the set of matched elements.
+     * 
+     * @param func A callback function which generates a structure to wrap around the content of the matched elements. Receives the index position of the element in the set as an argument. Within the function, this refers to the current element in the set.
+     */
+    wrapInner(func: (index: number) => string): JQuery;
+
+    /**
+     * Iterate over a jQuery object, executing a function for each matched element.
+     * 
+     * @param func A function to execute for each matched element.
+     */
+    each(func: (index: number, elem: Element) => any): JQuery;
+
+    /**
+     * Retrieve one of the elements matched by the jQuery object.
+     * 
+     * @param index A zero-based integer indicating which element to retrieve.
+     */
+    get(index: number): HTMLElement;
+    /**
+     * Retrieve the elements matched by the jQuery object.
+     */
+    get(): any[];
+
+    /**
+     * Search for a given element from among the matched elements.
+     */
+    index(): number;
+    /**
+     * Search for a given element from among the matched elements.
+     * 
+     * @param selector A selector representing a jQuery collection in which to look for an element.
+     */
+    index(selector: string|JQuery|Element): number;
+
+    /**
+     * The number of elements in the jQuery object.
+     */
+    length: number;
+    /**
+     * A selector representing selector passed to jQuery(), if any, when creating the original set.
+     * version deprecated: 1.7, removed: 1.9
+     */
+    selector: string;
+    [index: string]: any;
+    [index: number]: HTMLElement;
+
+    /**
+     * Add elements to the set of matched elements.
+     * 
+     * @param selector A string representing a selector expression to find additional elements to add to the set of matched elements.
+     * @param context The point in the document at which the selector should begin matching; similar to the context argument of the $(selector, context) method.
+     */
+    add(selector: string, context?: Element): JQuery;
+    /**
+     * Add elements to the set of matched elements.
+     * 
+     * @param elements One or more elements to add to the set of matched elements.
+     */
+    add(...elements: Element[]): JQuery;
+    /**
+     * Add elements to the set of matched elements.
+     * 
+     * @param html An HTML fragment to add to the set of matched elements.
+     */
+    add(html: string): JQuery;
+    /**
+     * Add elements to the set of matched elements.
+     * 
+     * @param obj An existing jQuery object to add to the set of matched elements.
+     */
+    add(obj: JQuery): JQuery;
+
+    /**
+     * Get the children of each element in the set of matched elements, optionally filtered by a selector.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    children(selector?: string): JQuery;
+
+    /**
+     * For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    closest(selector: string): JQuery;
+    /**
+     * For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     * @param context A DOM element within which a matching element may be found. If no context is passed in then the context of the jQuery set will be used instead.
+     */
+    closest(selector: string, context?: Element): JQuery;
+    /**
+     * For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.
+     * 
+     * @param obj A jQuery object to match elements against.
+     */
+    closest(obj: JQuery): JQuery;
+    /**
+     * For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.
+     * 
+     * @param element An element to match elements against.
+     */
+    closest(element: Element): JQuery;
+
+    /**
+     * Get an array of all the elements and selectors matched against the current element up through the DOM tree.
+     * 
+     * @param selectors An array or string containing a selector expression to match elements against (can also be a jQuery object).
+     * @param context A DOM element within which a matching element may be found. If no context is passed in then the context of the jQuery set will be used instead.
+     */
+    closest(selectors: any, context?: Element): any[];
+
+    /**
+     * Get the children of each element in the set of matched elements, including text and comment nodes.
+     */
+    contents(): JQuery;
+
+    /**
+     * End the most recent filtering operation in the current chain and return the set of matched elements to its previous state.
+     */
+    end(): JQuery;
+
+    /**
+     * Reduce the set of matched elements to the one at the specified index.
+     * 
+     * @param index An integer indicating the 0-based position of the element. OR An integer indicating the position of the element, counting backwards from the last element in the set.
+     *  
+     */
+    eq(index: number): JQuery;
+
+    /**
+     * Reduce the set of matched elements to those that match the selector or pass the function's test.
+     * 
+     * @param selector A string containing a selector expression to match the current set of elements against.
+     */
+    filter(selector: string): JQuery;
+    /**
+     * Reduce the set of matched elements to those that match the selector or pass the function's test.
+     * 
+     * @param func A function used as a test for each element in the set. this is the current DOM element.
+     */
+    filter(func: (index: number, element: Element) => any): JQuery;
+    /**
+     * Reduce the set of matched elements to those that match the selector or pass the function's test.
+     * 
+     * @param element An element to match the current set of elements against.
+     */
+    filter(element: Element): JQuery;
+    /**
+     * Reduce the set of matched elements to those that match the selector or pass the function's test.
+     * 
+     * @param obj An existing jQuery object to match the current set of elements against.
+     */
+    filter(obj: JQuery): JQuery;
+
+    /**
+     * Get the descendants of each element in the current set of matched elements, filtered by a selector, jQuery object, or element.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    find(selector: string): JQuery;
+    /**
+     * Get the descendants of each element in the current set of matched elements, filtered by a selector, jQuery object, or element.
+     * 
+     * @param element An element to match elements against.
+     */
+    find(element: Element): JQuery;
+    /**
+     * Get the descendants of each element in the current set of matched elements, filtered by a selector, jQuery object, or element.
+     * 
+     * @param obj A jQuery object to match elements against.
+     */
+    find(obj: JQuery): JQuery;
+
+    /**
+     * Reduce the set of matched elements to the first in the set.
+     */
+    first(): JQuery;
+
+    /**
+     * Reduce the set of matched elements to those that have a descendant that matches the selector or DOM element.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    has(selector: string): JQuery;
+    /**
+     * Reduce the set of matched elements to those that have a descendant that matches the selector or DOM element.
+     * 
+     * @param contained A DOM element to match elements against.
+     */
+    has(contained: Element): JQuery;
+
+    /**
+     * Check the current matched set of elements against a selector, element, or jQuery object and return true if at least one of these elements matches the given arguments.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    is(selector: string): boolean;
+    /**
+     * Check the current matched set of elements against a selector, element, or jQuery object and return true if at least one of these elements matches the given arguments.
+     * 
+     * @param func A function used as a test for the set of elements. It accepts one argument, index, which is the element's index in the jQuery collection.Within the function, this refers to the current DOM element.
+     */
+    is(func: (index: number, element: Element) => boolean): boolean;
+    /**
+     * Check the current matched set of elements against a selector, element, or jQuery object and return true if at least one of these elements matches the given arguments.
+     * 
+     * @param obj An existing jQuery object to match the current set of elements against.
+     */
+    is(obj: JQuery): boolean;
+    /**
+     * Check the current matched set of elements against a selector, element, or jQuery object and return true if at least one of these elements matches the given arguments.
+     * 
+     * @param elements One or more elements to match the current set of elements against.
+     */
+    is(elements: any): boolean;
+
+    /**
+     * Reduce the set of matched elements to the final one in the set.
+     */
+    last(): JQuery;
+
+    /**
+     * Pass each element in the current matched set through a function, producing a new jQuery object containing the return values.
+     * 
+     * @param callback A function object that will be invoked for each element in the current set.
+     */
+    map(callback: (index: number, domElement: Element) => any): JQuery;
+
+    /**
+     * Get the immediately following sibling of each element in the set of matched elements. If a selector is provided, it retrieves the next sibling only if it matches that selector.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    next(selector?: string): JQuery;
+
+    /**
+     * Get all following siblings of each element in the set of matched elements, optionally filtered by a selector.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    nextAll(selector?: string): JQuery;
+
+    /**
+     * Get all following siblings of each element up to but not including the element matched by the selector, DOM node, or jQuery object passed.
+     * 
+     * @param selector A string containing a selector expression to indicate where to stop matching following sibling elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    nextUntil(selector?: string, filter?: string): JQuery;
+    /**
+     * Get all following siblings of each element up to but not including the element matched by the selector, DOM node, or jQuery object passed.
+     * 
+     * @param element A DOM node or jQuery object indicating where to stop matching following sibling elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    nextUntil(element?: Element, filter?: string): JQuery;
+    /**
+     * Get all following siblings of each element up to but not including the element matched by the selector, DOM node, or jQuery object passed.
+     * 
+     * @param obj A DOM node or jQuery object indicating where to stop matching following sibling elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    nextUntil(obj?: JQuery, filter?: string): JQuery;
+
+    /**
+     * Remove elements from the set of matched elements.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    not(selector: string): JQuery;
+    /**
+     * Remove elements from the set of matched elements.
+     * 
+     * @param func A function used as a test for each element in the set. this is the current DOM element.
+     */
+    not(func: (index: number, element: Element) => boolean): JQuery;
+    /**
+     * Remove elements from the set of matched elements.
+     * 
+     * @param elements One or more DOM elements to remove from the matched set.
+     */
+    not(elements: Element|Element[]): JQuery;
+    /**
+     * Remove elements from the set of matched elements.
+     * 
+     * @param obj An existing jQuery object to match the current set of elements against.
+     */
+    not(obj: JQuery): JQuery;
+
+    /**
+     * Get the closest ancestor element that is positioned.
+     */
+    offsetParent(): JQuery;
+
+    /**
+     * Get the parent of each element in the current set of matched elements, optionally filtered by a selector.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    parent(selector?: string): JQuery;
+
+    /**
+     * Get the ancestors of each element in the current set of matched elements, optionally filtered by a selector.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    parents(selector?: string): JQuery;
+
+    /**
+     * Get the ancestors of each element in the current set of matched elements, up to but not including the element matched by the selector, DOM node, or jQuery object.
+     * 
+     * @param selector A string containing a selector expression to indicate where to stop matching ancestor elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    parentsUntil(selector?: string, filter?: string): JQuery;
+    /**
+     * Get the ancestors of each element in the current set of matched elements, up to but not including the element matched by the selector, DOM node, or jQuery object.
+     * 
+     * @param element A DOM node or jQuery object indicating where to stop matching ancestor elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    parentsUntil(element?: Element, filter?: string): JQuery;
+    /**
+     * Get the ancestors of each element in the current set of matched elements, up to but not including the element matched by the selector, DOM node, or jQuery object.
+     * 
+     * @param obj A DOM node or jQuery object indicating where to stop matching ancestor elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    parentsUntil(obj?: JQuery, filter?: string): JQuery;
+
+    /**
+     * Get the immediately preceding sibling of each element in the set of matched elements, optionally filtered by a selector.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    prev(selector?: string): JQuery;
+
+    /**
+     * Get all preceding siblings of each element in the set of matched elements, optionally filtered by a selector.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    prevAll(selector?: string): JQuery;
+
+    /**
+     * Get all preceding siblings of each element up to but not including the element matched by the selector, DOM node, or jQuery object.
+     * 
+     * @param selector A string containing a selector expression to indicate where to stop matching preceding sibling elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    prevUntil(selector?: string, filter?: string): JQuery;
+    /**
+     * Get all preceding siblings of each element up to but not including the element matched by the selector, DOM node, or jQuery object.
+     * 
+     * @param element A DOM node or jQuery object indicating where to stop matching preceding sibling elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    prevUntil(element?: Element, filter?: string): JQuery;
+    /**
+     * Get all preceding siblings of each element up to but not including the element matched by the selector, DOM node, or jQuery object.
+     * 
+     * @param obj A DOM node or jQuery object indicating where to stop matching preceding sibling elements.
+     * @param filter A string containing a selector expression to match elements against.
+     */
+    prevUntil(obj?: JQuery, filter?: string): JQuery;
+
+    /**
+     * Get the siblings of each element in the set of matched elements, optionally filtered by a selector.
+     * 
+     * @param selector A string containing a selector expression to match elements against.
+     */
+    siblings(selector?: string): JQuery;
+
+    /**
+     * Reduce the set of matched elements to a subset specified by a range of indices.
+     * 
+     * @param start An integer indicating the 0-based position at which the elements begin to be selected. If negative, it indicates an offset from the end of the set.
+     * @param end An integer indicating the 0-based position at which the elements stop being selected. If negative, it indicates an offset from the end of the set. If omitted, the range continues until the end of the set.
+     */
+    slice(start: number, end?: number): JQuery;
+
+    /**
+     * Show the queue of functions to be executed on the matched elements.
+     * 
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     */
+    queue(queueName?: string): any[];
+    /**
+     * Manipulate the queue of functions to be executed, once for each matched element.
+     * 
+     * @param newQueue An array of functions to replace the current queue contents.
+     */
+    queue(newQueue: Function[]): JQuery;
+    /**
+     * Manipulate the queue of functions to be executed, once for each matched element.
+     * 
+     * @param callback The new function to add to the queue, with a function to call that will dequeue the next item.
+     */
+    queue(callback: Function): JQuery;
+    /**
+     * Manipulate the queue of functions to be executed, once for each matched element.
+     * 
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     * @param newQueue An array of functions to replace the current queue contents.
+     */
+    queue(queueName: string, newQueue: Function[]): JQuery;
+    /**
+     * Manipulate the queue of functions to be executed, once for each matched element.
+     * 
+     * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.
+     * @param callback The new function to add to the queue, with a function to call that will dequeue the next item.
+     */
+    queue(queueName: string, callback: Function): JQuery;
+}
+declare module "jquery" {
+    export = $;
+}
+declare var jQuery: JQueryStatic;
+declare var $: JQueryStatic;
\ No newline at end of file
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/jquery/typings.json b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/jquery/typings.json
new file mode 100644
index 0000000000..0af7c54b42
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/globals/jquery/typings.json
@@ -0,0 +1,8 @@
+{
+  "resolution": "main",
+  "tree": {
+    "src": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/4cdfbe96b666eec5e1defbb519a62abf04e96764/jquery/jquery.d.ts",
+    "raw": "registry:dt/jquery#1.10.0+20160417213236",
+    "typings": "https://raw.githubusercontent.com/DefinitelyTyped/DefinitelyTyped/4cdfbe96b666eec5e1defbb519a62abf04e96764/jquery/jquery.d.ts"
+  }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/index.d.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/index.d.ts
new file mode 100644
index 0000000000..7b1af70fde
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/typings-ng1/index.d.ts
@@ -0,0 +1,6 @@
+/// <reference path="globals/angular-animate/index.d.ts" />
+/// <reference path="globals/angular-mocks/index.d.ts" />
+/// <reference path="globals/angular-resource/index.d.ts" />
+/// <reference path="globals/angular-route/index.d.ts" />
+/// <reference path="globals/angular/index.d.ts" />
+/// <reference path="globals/jquery/index.d.ts" />
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/README.md b/public/docs/_examples/upgrade-phonecat-3-final/README.md
new file mode 100644
index 0000000000..7448da44e6
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/README.md
@@ -0,0 +1,24 @@
+This is the Angular Phonecat application adjusted to fit our boilerplate project
+structure.
+
+The following changes from vanilla Phonecat are applied:
+
+* Karma config for unit tests is in karma.conf.ng1.js because the boilerplate
+  Karma config is not compatible with the way tests in this project need to be run.
+  The shell script run-unit-tests.sh can be used to run the unit tests.
+* E2E tests have been moved to the parent directory, where `run-e2e-tests` can
+  discover and run them along with all the other examples.
+* Most of the phone JSON and image data removed in the interest of keeping
+  repo weight down. Keeping enough to retain testability of the app.
+
+## Running the app
+
+Start like any example
+
+    npm run start
+
+## Running E2E tests
+
+Like for any example (at the project root):
+
+    gulp run-e2e-tests --filter=phonecat-3
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/e2e-spec.js b/public/docs/_examples/upgrade-phonecat-3-final/e2e-spec.js
new file mode 100644
index 0000000000..6b1f78bb9a
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/e2e-spec.js
@@ -0,0 +1,111 @@
+'use strict';
+
+// Angular E2E Testing Guide:
+// https://docs.angularjs.org/guide/e2e-testing
+
+describe('PhoneCat Application', function() {
+
+  // #docregion redirect
+  it('should redirect `index.html` to `index.html#!/phones', function() {
+    browser.get('index.html');
+    browser.waitForAngular();
+    browser.getCurrentUrl().then(function(url) {
+      expect(url.endsWith('/phones')).toBe(true);
+    });
+  });
+  // #enddocregion redirect
+
+  describe('View: Phone list', function() {
+
+    beforeEach(function() {
+      browser.get('index.html#!/phones');
+    });
+
+    it('should filter the phone list as a user types into the search box', function() {
+      var phoneList = element.all(by.css('.phones li'));
+      var query = element(by.css('input'));
+
+      expect(phoneList.count()).toBe(20);
+
+      sendKeys(query, 'nexus');
+      expect(phoneList.count()).toBe(1);
+
+      query.clear();
+      sendKeys(query, 'motorola');
+      expect(phoneList.count()).toBe(8);
+    });
+
+    it('should be possible to control phone order via the drop-down menu', function() {
+      var queryField = element(by.css('input'));
+      var orderSelect = element(by.css('select'));
+      var nameOption = orderSelect.element(by.css('option[value="name"]'));
+      var phoneNameColumn = element.all(by.css('.phones .name'));
+
+      function getNames() {
+        return phoneNameColumn.map(function(elem) {
+          return elem.getText();
+        });
+      }
+
+      sendKeys(queryField, 'tablet');   // Let's narrow the dataset to make the assertions shorter
+
+      expect(getNames()).toEqual([
+        'Motorola XOOM\u2122 with Wi-Fi',
+        'MOTOROLA XOOM\u2122'
+      ]);
+
+      nameOption.click();
+
+      expect(getNames()).toEqual([
+        'MOTOROLA XOOM\u2122',
+        'Motorola XOOM\u2122 with Wi-Fi'
+      ]);
+    });
+
+    // #docregion links
+    it('should render phone specific links', function() {
+      var query = element(by.css('input'));
+      // https://github.com/angular/protractor/issues/2019
+      var str = 'nexus';
+      for (var i = 0; i < str.length; i++) {
+        query.sendKeys(str.charAt(i));
+      }
+      element.all(by.css('.phones li a')).first().click();
+      browser.getCurrentUrl().then(function(url) {
+        expect(url.endsWith('/phones/nexus-s')).toBe(true);
+      });
+    });
+    // #enddocregion links
+
+  });
+
+  describe('View: Phone detail', function() {
+
+    beforeEach(function() {
+      browser.get('index.html#!/phones/nexus-s');
+    });
+
+    it('should display the `nexus-s` page', function() {
+      expect(element(by.css('h1')).getText()).toBe('Nexus S');
+    });
+
+    it('should display the first phone image as the main phone image', function() {
+      var mainImage = element(by.css('img.phone.selected'));
+
+      expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/);
+    });
+
+    it('should swap the main image when clicking on a thumbnail image', function() {
+      var mainImage = element(by.css('img.phone.selected'));
+      var thumbnails = element.all(by.css('.phone-thumbs img'));
+
+      thumbnails.get(2).click();
+      expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.2.jpg/);
+
+      thumbnails.get(0).click();
+      expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/);
+    });
+
+  });
+
+});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/app.component.ts b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/app.component.ts
similarity index 55%
rename from public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/app.component.ts
rename to public/docs/_examples/upgrade-phonecat-3-final/ts/app/app.component.ts
index f572854fc0..8f7ebd2ef4 100644
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/app.component.ts
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/app.component.ts
@@ -1,19 +1,18 @@
 // #docregion
 import { Component } from '@angular/core';
 import { RouteConfig, ROUTER_DIRECTIVES } from '@angular/router-deprecated';
-
-import PhoneList from './phone_list/phone_list.component';
-import PhoneDetail from './phone_detail/phone_detail.component';
+import { PhoneListComponent } from './phone-list/phone-list.component';
+import { PhoneDetailComponent } from './phone-detail/phone-detail.component';
 
 @RouteConfig([
-  {path:'/phones', name: 'Phones', component: PhoneList},
-  {path:'/phones/:phoneId', name: 'Phone', component: PhoneDetail},
+  {path:'/phones', name: 'Phones', component: PhoneListComponent},
+  {path:'/phones/:phoneId', name: 'Phone', component: PhoneDetailComponent},
   {path:'/', redirectTo: ['Phones']}
 ])
 @Component({
-  selector: 'pc-app',
+  selector: 'phonecat-app',
   template: '<router-outlet></router-outlet>',
   directives: [ROUTER_DIRECTIVES]
 })
-export default class AppComponent {
+export class AppComponent {
 }
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/css/app.css b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/app.css
similarity index 78%
rename from public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/css/app.css
rename to public/docs/_examples/upgrade-phonecat-3-final/ts/app/app.css
index f41c420776..f4b45b02a5 100644
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/css/app.css
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/app.css
@@ -1,99 +1,93 @@
-/* app css stylesheet */
-
 body {
-  padding-top: 20px;
+  padding: 20px;
 }
 
-
-.phone-images {
-  background-color: white;
-  width: 450px;
-  height: 450px;
-  overflow: hidden;
-  position: relative;
-  float: left;
+h1 {
+  border-bottom: 1px solid gray;
+  margin-top: 0;
 }
 
+/* View: Phone list */
 .phones {
   list-style: none;
 }
 
-.thumb {
-  float: left;
-  margin: -0.5em 1em 1.5em 0;
-  padding-bottom: 1em;
-  height: 100px;
-  width: 100px;
-}
-
 .phones li {
   clear: both;
   height: 115px;
   padding-top: 15px;
 }
 
-/** Detail View **/
-img.phone {
+.thumb {
   float: left;
-  margin-right: 3em;
-  margin-bottom: 2em;
-  background-color: white;
-  padding: 2em;
-  height: 400px;
-  width: 400px;
-  display: none;
+  height: 100px;
+  margin: -0.5em 1em 1.5em 0;
+  padding-bottom: 1em;
+  width: 100px;
 }
 
-img.phone:first-of-type {
+/* View: Phone detail */
+.phone {
+  background-color: white;
+  display: none;
+  float: left;
+  height: 400px;
+  margin-bottom: 2em;
+  margin-right: 3em;
+  padding: 2em;
+  width: 400px;
+}
+
+.phone:first-child {
   display: block;
 }
 
-
-ul.phone-thumbs {
-  margin: 0;
-  list-style: none;
+.phone-images {
+  background-color: white;
+  float: left;
+  height: 450px;
+  overflow: hidden;
+  position: relative;
+  width: 450px;
 }
 
-ul.phone-thumbs li {
+.phone-thumbs {
+  list-style: none;
+  margin: 0;
+}
+
+.phone-thumbs img {
+  height: 100px;
+  padding: 1em;
+  width: 100px;
+}
+
+.phone-thumbs li {
+  background-color: white;
   border: 1px solid black;
+  cursor: pointer;
   display: inline-block;
   margin: 1em;
-  background-color: white;
 }
 
-ul.phone-thumbs img {
-  height: 100px;
-  width: 100px;
-  padding: 1em;
-}
-
-ul.phone-thumbs img:hover {
-  cursor: pointer;
-}
-
-
-ul.specs {
+.specs {
   clear: both;
+  list-style: none;
   margin: 0;
   padding: 0;
-  list-style: none;
 }
 
-ul.specs > li{
+.specs dt {
+  font-weight: bold;
+}
+
+.specs > li {
   display: inline-block;
-  width: 200px;
   vertical-align: top;
+  width: 200px;
 }
 
-ul.specs > li > span{
-  font-weight: bold;
+.specs > li > span {
   font-size: 1.2em;
-}
-
-ul.specs dt {
   font-weight: bold;
 }
-
-h1 {
-  border-bottom: 1px solid gray;
-}
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/core/checkmark/checkmark.pipe.spec.ts b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/core/checkmark/checkmark.pipe.spec.ts
new file mode 100644
index 0000000000..b3a1c59a8d
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/core/checkmark/checkmark.pipe.spec.ts
@@ -0,0 +1,21 @@
+import {
+  describe,
+  beforeEachProviders,
+  it,
+  inject,
+  expect
+} from '@angular/core/testing';
+import { CheckmarkPipe } from './checkmark.pipe';
+
+describe('CheckmarkPipe', function() {
+
+  beforeEachProviders(() => [CheckmarkPipe]);
+
+  it('should convert boolean values to unicode checkmark or cross',
+    inject([CheckmarkPipe], function(checkmarkPipe: CheckmarkPipe) {
+      expect(checkmarkPipe.transform(true)).toBe('\u2713');
+      expect(checkmarkPipe.transform(false)).toBe('\u2718');
+    })
+  );
+
+});
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/core/checkmark/checkmark.pipe.ts b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/core/checkmark/checkmark.pipe.ts
new file mode 100644
index 0000000000..e79b99fc80
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/core/checkmark/checkmark.pipe.ts
@@ -0,0 +1,11 @@
+// #docregion
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({name: 'checkmark'})
+export class CheckmarkPipe implements PipeTransform {
+
+  transform(input: boolean) {
+    return input ? '\u2713' : '\u2718';
+  }
+
+}
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/core/phone/phone.service.spec.ts b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/core/phone/phone.service.spec.ts
new file mode 100644
index 0000000000..54521ddfc5
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/core/phone/phone.service.spec.ts
@@ -0,0 +1,52 @@
+import { provide } from '@angular/core';
+import {
+  describe,
+  beforeEach,
+  beforeEachProviders,
+  it,
+  inject
+} from '@angular/core/testing';
+import {
+  Http,
+  BaseRequestOptions,
+  ResponseOptions,
+  Response
+} from '@angular/http';
+import { MockBackend, MockConnection } from '@angular/http/testing';
+import { Phone, PhoneData } from './phone.service';
+
+describe('Phone', function() {
+  let phone:Phone;
+  let phonesData:PhoneData[] = [
+    {name: 'Phone X', snippet: '', images: []},
+    {name: 'Phone Y', snippet: '', images: []},
+    {name: 'Phone Z', snippet: '', images: []}
+  ];
+  let mockBackend:MockBackend;
+  
+  beforeEachProviders(() => [
+    Phone,
+    MockBackend,
+    BaseRequestOptions,
+    provide(Http, {
+      useFactory: (backend: MockBackend, options: BaseRequestOptions) => new Http(backend, options),
+      deps: [MockBackend, BaseRequestOptions]
+    })
+  ]);
+
+  beforeEach(inject([MockBackend, Phone], (_mockBackend_:MockBackend, _phone_:Phone) => {
+    mockBackend = _mockBackend_;
+    phone = _phone_;
+  }));
+
+  it('should fetch the phones data from `/phones/phones.json`', (done: () => void) => {
+    mockBackend.connections.subscribe((conn: MockConnection) => {
+      conn.mockRespond(new Response(new ResponseOptions({body: JSON.stringify(phonesData)})));
+    });
+    phone.query().subscribe(result => {
+      expect(result).toEqual(phonesData);
+      done();
+    });
+  });
+
+});
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/core/phone/phone.service.ts b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/core/phone/phone.service.ts
new file mode 100644
index 0000000000..b19eea598d
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/core/phone/phone.service.ts
@@ -0,0 +1,33 @@
+// #docregion
+import { Injectable } from '@angular/core';
+import { Http, Response } from '@angular/http';
+import { Observable } from 'rxjs/Rx';
+
+import 'rxjs/add/operator/map';
+
+// #docregion phonedata-interface
+export interface PhoneData {
+  name: string;
+  snippet: string;
+  images: string[];
+}
+// #enddocregion phonedata-interface
+
+// #docregion fullclass
+// #docregion classdef
+@Injectable()
+export class Phone {
+// #enddocregion classdef
+  constructor(private http: Http) { }
+  query(): Observable<PhoneData[]> {
+    return this.http.get(`phones/phones.json`)
+      .map((res: Response) => res.json());
+  }
+  get(id: string): Observable<PhoneData> {
+    return this.http.get(`phones/${id}.json`)
+      .map((res: Response) => res.json());
+  }
+// #docregion classdef
+}
+// #enddocregion classdef
+// #enddocregion fullclass
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/css/.gitkeep b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/.gitkeep
similarity index 100%
rename from public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/css/.gitkeep
rename to public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/.gitkeep
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/dell-streak-7.0.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/dell-streak-7.0.jpg
new file mode 100644
index 0000000000..7ce0dce4ee
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/dell-streak-7.0.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/dell-streak-7.1.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/dell-streak-7.1.jpg
new file mode 100644
index 0000000000..ed8cad89fb
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/dell-streak-7.1.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/dell-streak-7.2.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/dell-streak-7.2.jpg
new file mode 100644
index 0000000000..c83529e0f9
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/dell-streak-7.2.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/dell-streak-7.3.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/dell-streak-7.3.jpg
new file mode 100644
index 0000000000..cd2c30280d
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/dell-streak-7.3.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/dell-streak-7.4.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/dell-streak-7.4.jpg
new file mode 100644
index 0000000000..b4d8472da8
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/dell-streak-7.4.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-atrix-4g.0.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-atrix-4g.0.jpg
new file mode 100644
index 0000000000..2446159e93
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-atrix-4g.0.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-atrix-4g.1.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-atrix-4g.1.jpg
new file mode 100644
index 0000000000..867f207459
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-atrix-4g.1.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-atrix-4g.2.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-atrix-4g.2.jpg
new file mode 100644
index 0000000000..27d78338c4
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-atrix-4g.2.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-atrix-4g.3.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-atrix-4g.3.jpg
new file mode 100644
index 0000000000..29459a68a4
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-atrix-4g.3.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.0.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.0.jpg
new file mode 100644
index 0000000000..a6c993291e
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.0.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.1.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.1.jpg
new file mode 100644
index 0000000000..400b89e2df
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.1.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.2.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.2.jpg
new file mode 100644
index 0000000000..86b55d28dd
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.2.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.3.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.3.jpg
new file mode 100644
index 0000000000..85ec293ae5
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.3.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.4.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.4.jpg
new file mode 100644
index 0000000000..75ef1464cb
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.4.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.5.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.5.jpg
new file mode 100644
index 0000000000..4d42db4330
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom-with-wi-fi.5.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom.0.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom.0.jpg
new file mode 100644
index 0000000000..bf6954bbd5
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom.0.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom.1.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom.1.jpg
new file mode 100644
index 0000000000..659688a47d
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom.1.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom.2.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom.2.jpg
new file mode 100644
index 0000000000..ce0ff1002e
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/motorola-xoom.2.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/nexus-s.0.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/nexus-s.0.jpg
new file mode 100644
index 0000000000..0952bc79c2
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/nexus-s.0.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/nexus-s.1.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/nexus-s.1.jpg
new file mode 100644
index 0000000000..f33004dd7f
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/nexus-s.1.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/nexus-s.2.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/nexus-s.2.jpg
new file mode 100644
index 0000000000..c5c63621f1
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/nexus-s.2.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/nexus-s.3.jpg b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/nexus-s.3.jpg
new file mode 100644
index 0000000000..e51f75b0ed
Binary files /dev/null and b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/img/phones/nexus-s.3.jpg differ
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/main.ts b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/main.ts
new file mode 100644
index 0000000000..48edd80f40
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/main.ts
@@ -0,0 +1,24 @@
+// #docregion
+// #docregion imports
+import { provide } from '@angular/core';
+import {
+  LocationStrategy,
+  HashLocationStrategy,
+  APP_BASE_HREF
+} from '@angular/common';
+import { bootstrap } from '@angular/platform-browser-dynamic';
+import { HTTP_PROVIDERS } from '@angular/http';
+import { ROUTER_PROVIDERS } from '@angular/router-deprecated';
+import { Phone } from './core/phone/phone.service';
+import { AppComponent } from './app.component';
+// #enddocregion imports
+
+// #docregion bootstrap
+bootstrap(AppComponent, [
+  HTTP_PROVIDERS,
+  ROUTER_PROVIDERS,
+  provide(APP_BASE_HREF, {useValue: '!'}),
+  provide(LocationStrategy, {useClass: HashLocationStrategy}),
+  Phone
+]);
+// #enddocregion bootstrap
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/phone_detail.component.spec.ts b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-detail/phone-detail.component.spec.ts
similarity index 55%
rename from public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/phone_detail.component.spec.ts
rename to public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-detail/phone-detail.component.spec.ts
index c8751add62..32e86a2134 100644
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/phone_detail.component.spec.ts
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-detail/phone-detail.component.spec.ts
@@ -1,9 +1,12 @@
+// #docregion
 import { provide } from '@angular/core';
+import { HTTP_PROVIDERS } from '@angular/http';
 // #docregion routeparams
 import { RouteParams } from '@angular/router-deprecated';
+
 // #enddocregion routeparams
-import { HTTP_PROVIDERS } from '@angular/http';
 import { Observable } from 'rxjs/Rx';
+
 import {
   describe,
   beforeEachProviders,
@@ -11,12 +14,15 @@ import {
   it,
   expect
 } from '@angular/core/testing';
-import { TestComponentBuilder } from '@angular/compiler/testing';
+import {
+  TestComponentBuilder,
+  ComponentFixture
+} from '@angular/compiler/testing';
 
-import PhoneDetail from '../../app/js/phone_detail/phone_detail.component';
-import { Phones, Phone } from '../../app/js/core/phones.service';
+import { PhoneDetailComponent } from './phone-detail.component';
+import { Phone, PhoneData } from '../core/phone/phone.service';
 
-function xyzPhoneData():Phone {
+function xyzPhoneData():PhoneData {
   return {
     name: 'phone xyz',
     snippet: '',
@@ -24,27 +30,29 @@ function xyzPhoneData():Phone {
   }
 }
 
-class MockPhones extends Phones {
-  get(id):Observable<Phone> {
+class MockPhone extends Phone {
+  get(id: string):Observable<PhoneData> {
     return Observable.of(xyzPhoneData());
   }
 }
 
-// #docregion routeparams
-describe('PhoneDetail', () => {
+describe('PhoneDetailComponent', () => {
+
+  // #docregion routeparams
 
   beforeEachProviders(() => [
-    provide(Phones, {useClass: MockPhones}),
+    provide(Phone, {useClass: MockPhone}),
     provide(RouteParams, {useValue: new RouteParams({phoneId: 'xyz'})}),
     HTTP_PROVIDERS
   ]);
   // #enddocregion routeparams
 
-  it('should fetch phone detail', inject([TestComponentBuilder], (tcb) => {
-    return tcb.createAsync(PhoneDetail).then((fixture) => {
+  it('should fetch phone detail',
+      inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    return tcb.createAsync(PhoneDetailComponent)
+        .then((fixture: ComponentFixture<PhoneDetailComponent>) => {
       fixture.detectChanges();
       let compiled = fixture.debugElement.nativeElement;
-
       expect(compiled.querySelector('h1')).toHaveText(xyzPhoneData().name);
     });
   }));
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-detail/phone-detail.component.ts b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-detail/phone-detail.component.ts
new file mode 100644
index 0000000000..5e29057023
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-detail/phone-detail.component.ts
@@ -0,0 +1,27 @@
+// #docplaster
+// #docregion
+import { Component } from '@angular/core';
+import { RouteParams } from '@angular/router-deprecated';
+import { Phone, PhoneData } from '../core/phone/phone.service';
+import { CheckmarkPipe } from '../core/checkmark/checkmark.pipe';
+
+@Component({
+  selector: 'phone-detail',
+  templateUrl: 'phone-detail/phone-detail.template.html',
+  pipes: [ CheckmarkPipe ]
+})
+export class PhoneDetailComponent{
+  phone: PhoneData;
+  mainImageUrl: string;
+
+  constructor(routeParams: RouteParams, phone: Phone) {
+    phone.get(routeParams.get('phoneId')).subscribe(phone => {
+      this.phone = phone;
+      this.setImage(phone.images[0]);
+    });
+  }
+
+  setImage(imageUrl: string) {
+    this.mainImageUrl = imageUrl;
+  }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-detail/phone-detail.template.html b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-detail/phone-detail.template.html
new file mode 100644
index 0000000000..46a96d66c3
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-detail/phone-detail.template.html
@@ -0,0 +1,120 @@
+<!-- #docregion -->
+<div *ngIf="phone">
+  <div class="phone-images">
+    <img [src]="img" class="phone"
+        [ngClass]="{selected: img === mainImageUrl}"
+        *ngFor="let img of phone.images" />
+  </div>
+
+  <h1>{{phone.name}}</h1>
+
+  <p>{{phone.description}}</p>
+
+  <ul class="phone-thumbs">
+    <li *ngFor="let img of phone.images">
+      <img [src]="img" (click)="setImage(img)" />
+    </li>
+  </ul>
+
+  <ul class="specs">
+    <li>
+      <span>Availability and Networks</span>
+      <dl>
+        <dt>Availability</dt>
+        <dd *ngFor="let availability of phone.availability">{{availability}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Battery</span>
+      <dl>
+        <dt>Type</dt>
+        <dd>{{phone.battery?.type}}</dd>
+        <dt>Talk Time</dt>
+        <dd>{{phone.battery?.talkTime}}</dd>
+        <dt>Standby time (max)</dt>
+        <dd>{{phone.battery?.standbyTime}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Storage and Memory</span>
+      <dl>
+        <dt>RAM</dt>
+        <dd>{{phone.storage?.ram}}</dd>
+        <dt>Internal Storage</dt>
+        <dd>{{phone.storage?.flash}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Connectivity</span>
+      <dl>
+        <dt>Network Support</dt>
+        <dd>{{phone.connectivity?.cell}}</dd>
+        <dt>WiFi</dt>
+        <dd>{{phone.connectivity?.wifi}}</dd>
+        <dt>Bluetooth</dt>
+        <dd>{{phone.connectivity?.bluetooth}}</dd>
+        <dt>Infrared</dt>
+        <dd>{{phone.connectivity?.infrared | checkmark}}</dd>
+        <dt>GPS</dt>
+        <dd>{{phone.connectivity?.gps | checkmark}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Android</span>
+      <dl>
+        <dt>OS Version</dt>
+        <dd>{{phone.android?.os}}</dd>
+        <dt>UI</dt>
+        <dd>{{phone.android?.ui}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Size and Weight</span>
+      <dl>
+        <dt>Dimensions</dt>
+        <dd *ngFor="let dim of phone.sizeAndWeight?.dimensions">{{dim}}</dd>
+        <dt>Weight</dt>
+        <dd>{{phone.sizeAndWeight?.weight}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Display</span>
+      <dl>
+        <dt>Screen size</dt>
+        <dd>{{phone.display?.screenSize}}</dd>
+        <dt>Screen resolution</dt>
+        <dd>{{phone.display?.screenResolution}}</dd>
+        <dt>Touch screen</dt>
+        <dd>{{phone.display?.touchScreen | checkmark}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Hardware</span>
+      <dl>
+        <dt>CPU</dt>
+        <dd>{{phone.hardware?.cpu}}</dd>
+        <dt>USB</dt>
+        <dd>{{phone.hardware?.usb}}</dd>
+        <dt>Audio / headphone jack</dt>
+        <dd>{{phone.hardware?.audioJack}}</dd>
+        <dt>FM Radio</dt>
+        <dd>{{phone.hardware?.fmRadio | checkmark}}</dd>
+        <dt>Accelerometer</dt>
+        <dd>{{phone.hardware?.accelerometer | checkmark}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Camera</span>
+      <dl>
+        <dt>Primary</dt>
+        <dd>{{phone.camera?.primary}}</dd>
+        <dt>Features</dt>
+        <dd>{{phone.camera?.features?.join(', ')}}</dd>
+      </dl>
+    </li>
+    <li>
+      <span>Additional Features</span>
+      <dd>{{phone.additionalFeatures}}</dd>
+    </li>
+  </ul>
+</div>
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-list/phone-list.component.spec.ts b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-list/phone-list.component.spec.ts
new file mode 100644
index 0000000000..e8949d9463
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-list/phone-list.component.spec.ts
@@ -0,0 +1,82 @@
+// #docregion routestuff
+import { provide, ApplicationRef } from '@angular/core';
+import { LocationStrategy, HashLocationStrategy } from '@angular/common';
+import { HTTP_PROVIDERS } from '@angular/http';
+import {
+  ROUTER_PROVIDERS,
+  ROUTER_PRIMARY_COMPONENT
+} from '@angular/router-deprecated';
+import { Observable } from 'rxjs/Rx';
+import {
+  describe,
+  beforeEachProviders,
+  inject,
+  it,
+  expect,
+  MockApplicationRef
+} from '@angular/core/testing';
+import { MockLocationStrategy } from '@angular/common/testing';
+import {
+  TestComponentBuilder,
+  ComponentFixture
+} from '@angular/compiler/testing';
+
+import { AppComponent } from '../app.component';
+import { PhoneListComponent } from './phone-list.component';
+import { Phone, PhoneData } from '../core/phone/phone.service';
+
+// #enddocregion routestuff
+
+
+class MockPhone extends Phone {
+  query():Observable<PhoneData[]> {
+    return Observable.of([
+      {name: 'Nexus S', snippet: '', images: []},
+      {name: 'Motorola DROID', snippet: '', images: []}
+    ])
+  }
+}
+
+describe('PhoneList', () => {
+
+  // #docregion routestuff
+  
+  beforeEachProviders(() => [
+    provide(Phone, {useClass: MockPhone}),
+    HTTP_PROVIDERS,
+    ROUTER_PROVIDERS,
+    provide(ApplicationRef, {useClass: MockApplicationRef}),
+    provide(ROUTER_PRIMARY_COMPONENT, {useValue: AppComponent}),
+    provide(LocationStrategy, {useClass: MockLocationStrategy}),
+  ]);
+  // #enddocregion routestuff
+
+  it('should create "phones" model with 2 phones fetched from xhr',
+      inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    return tcb.createAsync(PhoneListComponent)
+        .then((fixture: ComponentFixture<PhoneListComponent>) => {
+      fixture.detectChanges();
+      let compiled = fixture.debugElement.nativeElement;
+      expect(compiled.querySelectorAll('.phone-list-item').length).toBe(2);
+      expect(
+        compiled.querySelector('.phone-list-item:nth-child(1)').textContent
+      ).toContain('Motorola DROID');
+      expect(
+        compiled.querySelector('.phone-list-item:nth-child(2)').textContent
+      ).toContain('Nexus S');
+    });
+  }));
+
+  it('should set the default value of orderProp model',
+      inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    return tcb.createAsync(PhoneListComponent)
+        .then((fixture: ComponentFixture<PhoneListComponent>) => {
+      fixture.detectChanges();
+      let compiled = fixture.debugElement.nativeElement;
+      expect(
+        compiled.querySelector('select option:last-child').selected
+      ).toBe(true);
+    });
+  }));
+
+});
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-list/phone-list.component.ts b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-list/phone-list.component.ts
new file mode 100644
index 0000000000..1ea6219031
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-list/phone-list.component.ts
@@ -0,0 +1,61 @@
+// #docplaster
+// #docregion top
+import { Component } from '@angular/core';
+import { RouterLink } from '@angular/router-deprecated';
+import { Phone, PhoneData } from '../core/phone/phone.service';
+
+@Component({
+  selector: 'phone-list',
+  templateUrl: 'phone-list/phone-list.template.html',
+  directives: [ RouterLink ]
+})
+// #enddocregion top
+export class PhoneListComponent {
+  phones: PhoneData[];
+  query:string;
+  orderProp: string;
+
+  constructor(phone: Phone) {
+    phone.query().subscribe(phones => {
+      this.phones = phones;
+    });
+    this.orderProp = 'age';
+  }
+  // #enddocregion initialclass
+
+  // #docregion getphones
+  getPhones():PhoneData[] {
+    return this.sortPhones(this.filterPhones(this.phones));
+  }
+
+  private filterPhones(phones: PhoneData[]) {
+    if (phones && this.query) {
+      return phones.filter(phone => {
+        let name = phone.name.toLowerCase();
+        let snippet = phone.snippet.toLowerCase();
+        return name.indexOf(this.query) >= 0 || snippet.indexOf(this.query) >= 0;
+      });
+    }
+    return phones;
+  }
+
+  private sortPhones(phones: PhoneData[]) {
+      if (phones && this.orderProp) {
+          return phones
+            .slice(0) // Make a copy
+            .sort((a, b) => {
+               if (a[this.orderProp] < b[this.orderProp]) {
+                 return -1;
+               } else if ([b[this.orderProp] < a[this.orderProp]]) {
+                 return 1;
+               } else {
+                 return 0;
+               }
+            });
+      }
+      return phones;
+  }
+  // #enddocregion getphones
+  // #docregion initialclass
+}
+// #enddocregion initialclass
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_list/phone_list.html b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-list/phone-list.template.html
similarity index 56%
rename from public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_list/phone_list.html
rename to public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-list/phone-list.template.html
index e88b4662aa..9846664768 100644
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_list/phone_list.html
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-list/phone-list.template.html
@@ -4,12 +4,18 @@
       <!--Sidebar content-->
 
       <!-- #docregion controls -->
-      Search: <input [(ngModel)]="query">
-      Sort by:
-      <select [(ngModel)]="orderProp">
-        <option value="name">Alphabetical</option>
-        <option value="age">Newest</option>
-      </select>
+      <p>
+        Search:
+        <input [(ngModel)]="query" />
+      </p>
+
+      <p>
+        Sort by:
+        <select [(ngModel)]="orderProp">
+          <option value="name">Alphabetical</option>
+          <option value="age">Newest</option>
+        </select>
+      </p>
       <!-- #enddocregion controls -->
 
     </div>
@@ -18,9 +24,11 @@
 
       <!-- #docregion list -->
       <ul class="phones">
-        <li *ngFor="let phone of phones | async | phoneFilter:query | orderBy:orderProp"
-            class="thumbnail phone-listing">
-          <a [routerLink]="['/Phone', {phoneId: phone.id}]" class="thumb"><img [src]="phone.imageUrl"></a>
+        <li *ngFor="let phone of getPhones()"
+            class="thumbnail phone-list-item">
+          <a [routerLink]="['/Phone', {phoneId: phone.id}]" class="thumb">
+            <img [src]="phone.imageUrl" [alt]="phone.name" />
+          </a>
           <a [routerLink]="['/Phone', {phoneId: phone.id}]" class="name">{{phone.name}}</a>
           <p>{{phone.snippet}}</p>
         </li>
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/dell-streak-7.json b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/dell-streak-7.json
new file mode 100644
index 0000000000..a32eb6ff98
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/dell-streak-7.json
@@ -0,0 +1,64 @@
+{
+    "additionalFeatures": "Front Facing 1.3MP Camera", 
+    "android": {
+        "os": "Android 2.2", 
+        "ui": "Dell Stage"
+    }, 
+    "availability": [
+        "T-Mobile"
+    ], 
+    "battery": {
+        "standbyTime": "", 
+        "talkTime": "", 
+        "type": "Lithium Ion (Li-Ion) (2780 mAH)"
+    }, 
+    "camera": {
+        "features": [
+            "Flash", 
+            "Video"
+        ], 
+        "primary": "5.0 megapixels"
+    }, 
+    "connectivity": {
+        "bluetooth": "Bluetooth 2.1", 
+        "cell": "T-mobile HSPA+ @ 2100/1900/AWS/850 MHz", 
+        "gps": true, 
+        "infrared": false, 
+        "wifi": "802.11 b/g"
+    }, 
+    "description": "Introducing Dell\u2122 Streak 7. Share photos, videos and movies together. It\u2019s small enough to carry around, big enough to gather around. Android\u2122 2.2-based tablet with over-the-air upgrade capability for future OS releases.  A vibrant 7-inch, multitouch display with full Adobe\u00ae Flash 10.1 pre-installed.  Includes a 1.3 MP front-facing camera for face-to-face chats on popular services such as Qik or Skype.  16 GB of internal storage, plus Wi-Fi, Bluetooth and built-in GPS keeps you in touch with the world around you.  Connect on your terms. Save with 2-year contract or flexibility with prepaid pay-as-you-go plans", 
+    "display": {
+        "screenResolution": "WVGA (800 x 480)", 
+        "screenSize": "7.0 inches", 
+        "touchScreen": true
+    }, 
+    "hardware": {
+        "accelerometer": true, 
+        "audioJack": "3.5mm", 
+        "cpu": "nVidia Tegra T20", 
+        "fmRadio": false, 
+        "physicalKeyboard": false, 
+        "usb": "USB 2.0"
+    }, 
+    "id": "dell-streak-7", 
+    "images": [
+        "img/phones/dell-streak-7.0.jpg", 
+        "img/phones/dell-streak-7.1.jpg", 
+        "img/phones/dell-streak-7.2.jpg", 
+        "img/phones/dell-streak-7.3.jpg", 
+        "img/phones/dell-streak-7.4.jpg"
+    ], 
+    "name": "Dell Streak 7", 
+    "sizeAndWeight": {
+        "dimensions": [
+            "199.9 mm (w)", 
+            "119.8 mm (h)", 
+            "12.4 mm (d)"
+        ], 
+        "weight": "450.0 grams"
+    }, 
+    "storage": {
+        "flash": "16000MB", 
+        "ram": "512MB"
+    }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/motorola-atrix-4g.json b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/motorola-atrix-4g.json
new file mode 100644
index 0000000000..ccca00e3b2
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/motorola-atrix-4g.json
@@ -0,0 +1,62 @@
+{
+    "additionalFeatures": "", 
+    "android": {
+        "os": "Android 2.2", 
+        "ui": "MOTOBLUR"
+    }, 
+    "availability": [
+        "AT&T"
+    ], 
+    "battery": {
+        "standbyTime": "400 hours", 
+        "talkTime": "5 hours", 
+        "type": "Lithium Ion (Li-Ion) (1930 mAH)"
+    }, 
+    "camera": {
+        "features": [
+            ""
+        ], 
+        "primary": ""
+    }, 
+    "connectivity": {
+        "bluetooth": "Bluetooth 2.1", 
+        "cell": "WCDMA 850/1900/2100, GSM 850/900/1800/1900, HSDPA 14Mbps (Category 10) Edge Class 12, GPRS Class 12, eCompass, AGPS", 
+        "gps": true, 
+        "infrared": false, 
+        "wifi": "802.11 a/b/g/n"
+    }, 
+    "description": "MOTOROLA ATRIX 4G gives you dual-core processing power and the revolutionary webtop application. With webtop and a compatible Motorola docking station, sold separately, you can surf the Internet with a full Firefox browser, create and edit docs, or access multimedia on a large screen almost anywhere.", 
+    "display": {
+        "screenResolution": "QHD (960 x 540)", 
+        "screenSize": "4.0 inches", 
+        "touchScreen": true
+    }, 
+    "hardware": {
+        "accelerometer": true, 
+        "audioJack": "3.5mm", 
+        "cpu": "1 GHz Dual Core", 
+        "fmRadio": false, 
+        "physicalKeyboard": false, 
+        "usb": "USB 2.0"
+    }, 
+    "id": "motorola-atrix-4g", 
+    "images": [
+        "img/phones/motorola-atrix-4g.0.jpg", 
+        "img/phones/motorola-atrix-4g.1.jpg", 
+        "img/phones/motorola-atrix-4g.2.jpg", 
+        "img/phones/motorola-atrix-4g.3.jpg"
+    ], 
+    "name": "MOTOROLA ATRIX\u2122 4G", 
+    "sizeAndWeight": {
+        "dimensions": [
+            "63.5 mm (w)", 
+            "117.75 mm (h)", 
+            "10.95 mm (d)"
+        ], 
+        "weight": "135.0 grams"
+    }, 
+    "storage": {
+        "flash": "", 
+        "ram": ""
+    }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/motorola-xoom-with-wi-fi.json b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/motorola-xoom-with-wi-fi.json
new file mode 100644
index 0000000000..4ba9c8d5b5
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/motorola-xoom-with-wi-fi.json
@@ -0,0 +1,65 @@
+{
+    "additionalFeatures": "Sensors: proximity, ambient light, barometer, gyroscope", 
+    "android": {
+        "os": "Android 3.0", 
+        "ui": "Honeycomb"
+    }, 
+    "availability": [
+        ""
+    ], 
+    "battery": {
+        "standbyTime": "336 hours", 
+        "talkTime": "24 hours", 
+        "type": "Other ( mAH)"
+    }, 
+    "camera": {
+        "features": [
+            "Flash", 
+            "Video"
+        ], 
+        "primary": "5.0 megapixels"
+    }, 
+    "connectivity": {
+        "bluetooth": "Bluetooth 2.1", 
+        "cell": "", 
+        "gps": true, 
+        "infrared": false, 
+        "wifi": "802.11 b/g/n"
+    }, 
+    "description": "Motorola XOOM with Wi-Fi has a super-powerful dual-core processor and Android\u2122 3.0 (Honeycomb) \u2014 the Android platform designed specifically for tablets. With its 10.1-inch HD widescreen display, you\u2019ll enjoy HD video in a thin, light, powerful and upgradeable tablet.", 
+    "display": {
+        "screenResolution": "WXGA (1200 x 800)", 
+        "screenSize": "10.1 inches", 
+        "touchScreen": true
+    }, 
+    "hardware": {
+        "accelerometer": true, 
+        "audioJack": "3.5mm", 
+        "cpu": "1 GHz Dual Core Tegra 2", 
+        "fmRadio": false, 
+        "physicalKeyboard": false, 
+        "usb": "USB 2.0"
+    }, 
+    "id": "motorola-xoom-with-wi-fi", 
+    "images": [
+        "img/phones/motorola-xoom-with-wi-fi.0.jpg", 
+        "img/phones/motorola-xoom-with-wi-fi.1.jpg", 
+        "img/phones/motorola-xoom-with-wi-fi.2.jpg", 
+        "img/phones/motorola-xoom-with-wi-fi.3.jpg", 
+        "img/phones/motorola-xoom-with-wi-fi.4.jpg", 
+        "img/phones/motorola-xoom-with-wi-fi.5.jpg"
+    ], 
+    "name": "Motorola XOOM\u2122 with Wi-Fi", 
+    "sizeAndWeight": {
+        "dimensions": [
+            "249.1 mm (w)", 
+            "167.8 mm (h)", 
+            "12.9 mm (d)"
+        ], 
+        "weight": "708.0 grams"
+    }, 
+    "storage": {
+        "flash": "32000MB", 
+        "ram": "1000MB"
+    }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/motorola-xoom.json b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/motorola-xoom.json
new file mode 100644
index 0000000000..f0f0c8711d
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/motorola-xoom.json
@@ -0,0 +1,62 @@
+{
+    "additionalFeatures": "Front-facing camera. Sensors: proximity, ambient light, barometer, gyroscope.", 
+    "android": {
+        "os": "Android 3.0", 
+        "ui": "Android"
+    }, 
+    "availability": [
+        "Verizon"
+    ], 
+    "battery": {
+        "standbyTime": "336 hours", 
+        "talkTime": "24 hours", 
+        "type": "Other (3250 mAH)"
+    }, 
+    "camera": {
+        "features": [
+            "Flash", 
+            "Video"
+        ], 
+        "primary": "5.0 megapixels"
+    }, 
+    "connectivity": {
+        "bluetooth": "Bluetooth 2.1", 
+        "cell": "CDMA 800 /1900 LTE 700, Rx diversity in all bands", 
+        "gps": true, 
+        "infrared": false, 
+        "wifi": "802.11 a/b/g/n"
+    }, 
+    "description": "MOTOROLA XOOM has a super-powerful dual-core processor and Android\u2122 3.0 (Honeycomb) \u2014 the Android platform designed specifically for tablets. With its 10.1-inch HD widescreen display, you\u2019ll enjoy HD video in a thin, light, powerful and upgradeable tablet.", 
+    "display": {
+        "screenResolution": "WXGA (1200 x 800)", 
+        "screenSize": "10.1 inches", 
+        "touchScreen": true
+    }, 
+    "hardware": {
+        "accelerometer": true, 
+        "audioJack": "3.5mm", 
+        "cpu": "1 GHz Dual Core Tegra 2", 
+        "fmRadio": false, 
+        "physicalKeyboard": false, 
+        "usb": "USB 2.0"
+    }, 
+    "id": "motorola-xoom", 
+    "images": [
+        "img/phones/motorola-xoom.0.jpg", 
+        "img/phones/motorola-xoom.1.jpg", 
+        "img/phones/motorola-xoom.2.jpg"
+    ], 
+    "name": "MOTOROLA XOOM\u2122", 
+    "sizeAndWeight": {
+        "dimensions": [
+            "249.0 mm (w)", 
+            "168.0 mm (h)", 
+            "12.7 mm (d)"
+        ], 
+        "weight": "726.0 grams"
+    }, 
+    "storage": {
+        "flash": "32000MB", 
+        "ram": "1000MB"
+    }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/nexus-s.json b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/nexus-s.json
new file mode 100644
index 0000000000..5e712e2ff8
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/nexus-s.json
@@ -0,0 +1,69 @@
+{
+    "additionalFeatures": "Contour Display, Near Field Communications (NFC), Three-axis gyroscope, Anti-fingerprint display coating, Internet Calling support (VoIP/SIP)", 
+    "android": {
+        "os": "Android 2.3", 
+        "ui": "Android"
+    }, 
+    "availability": [
+        "M1,", 
+        "O2,", 
+        "Orange,", 
+        "Singtel,", 
+        "StarHub,", 
+        "T-Mobile,", 
+        "Vodafone"
+    ], 
+    "battery": {
+        "standbyTime": "428 hours", 
+        "talkTime": "6 hours", 
+        "type": "Lithium Ion (Li-Ion) (1500 mAH)"
+    }, 
+    "camera": {
+        "features": [
+            "Flash", 
+            "Video"
+        ], 
+        "primary": "5.0 megapixels"
+    }, 
+    "connectivity": {
+        "bluetooth": "Bluetooth 2.1", 
+        "cell": "Quad-band GSM: 850, 900, 1800, 1900\r\nTri-band HSPA: 900, 2100, 1700\r\nHSPA type: HSDPA (7.2Mbps) HSUPA (5.76Mbps)", 
+        "gps": true, 
+        "infrared": false, 
+        "wifi": "802.11 b/g/n"
+    }, 
+    "description": "Nexus S is the next generation of Nexus devices, co-developed by Google and Samsung. The latest Android platform (Gingerbread), paired with a 1 GHz Hummingbird processor and 16GB of memory, makes Nexus S one of the fastest phones on the market. It comes pre-installed with the best of Google apps and enabled with new and popular features like true multi-tasking, Wi-Fi hotspot, Internet Calling, NFC support, and full web browsing. With this device, users will also be the first to receive software upgrades and new Google mobile apps as soon as they become available. For more details, visit http://www.google.com/nexus.", 
+    "display": {
+        "screenResolution": "WVGA (800 x 480)", 
+        "screenSize": "4.0 inches", 
+        "touchScreen": true
+    }, 
+    "hardware": {
+        "accelerometer": true, 
+        "audioJack": "3.5mm", 
+        "cpu": "1GHz Cortex A8 (Hummingbird) processor", 
+        "fmRadio": false, 
+        "physicalKeyboard": false, 
+        "usb": "USB 2.0"
+    }, 
+    "id": "nexus-s", 
+    "images": [
+        "img/phones/nexus-s.0.jpg", 
+        "img/phones/nexus-s.1.jpg", 
+        "img/phones/nexus-s.2.jpg", 
+        "img/phones/nexus-s.3.jpg"
+    ], 
+    "name": "Nexus S", 
+    "sizeAndWeight": {
+        "dimensions": [
+            "63.0 mm (w)", 
+            "123.9 mm (h)", 
+            "10.88 mm (d)"
+        ], 
+        "weight": "129.0 grams"
+    }, 
+    "storage": {
+        "flash": "16384MB", 
+        "ram": "512MB"
+    }
+}
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/phones.json b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/phones.json
new file mode 100644
index 0000000000..339b94fbb5
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phones/phones.json
@@ -0,0 +1,155 @@
+[
+    {
+        "age": 0, 
+        "id": "motorola-xoom-with-wi-fi", 
+        "imageUrl": "img/phones/motorola-xoom-with-wi-fi.0.jpg", 
+        "name": "Motorola XOOM\u2122 with Wi-Fi", 
+        "snippet": "The Next, Next Generation\r\n\r\nExperience the future with Motorola XOOM with Wi-Fi, the world's first tablet powered by Android 3.0 (Honeycomb)."
+    }, 
+    {
+        "age": 1, 
+        "id": "motorola-xoom", 
+        "imageUrl": "img/phones/motorola-xoom.0.jpg", 
+        "name": "MOTOROLA XOOM\u2122", 
+        "snippet": "The Next, Next Generation\n\nExperience the future with MOTOROLA XOOM, the world's first tablet powered by Android 3.0 (Honeycomb)."
+    }, 
+    {
+        "age": 2, 
+        "carrier": "AT&T", 
+        "id": "motorola-atrix-4g", 
+        "imageUrl": "img/phones/motorola-atrix-4g.0.jpg", 
+        "name": "MOTOROLA ATRIX\u2122 4G", 
+        "snippet": "MOTOROLA ATRIX 4G the world's most powerful smartphone."
+    }, 
+    {
+        "age": 3, 
+        "id": "dell-streak-7", 
+        "imageUrl": "img/phones/dell-streak-7.0.jpg", 
+        "name": "Dell Streak 7", 
+        "snippet": "Introducing Dell\u2122 Streak 7. Share photos, videos and movies together. It\u2019s small enough to carry around, big enough to gather around."
+    }, 
+    {
+        "age": 4, 
+        "carrier": "Cellular South", 
+        "id": "samsung-gem", 
+        "imageUrl": "img/phones/samsung-gem.0.jpg", 
+        "name": "Samsung Gem\u2122", 
+        "snippet": "The Samsung Gem\u2122 brings you everything that you would expect and more from a touch display smart phone \u2013 more apps, more features and a more affordable price."
+    }, 
+    {
+        "age": 5, 
+        "carrier": "Dell", 
+        "id": "dell-venue", 
+        "imageUrl": "img/phones/dell-venue.0.jpg", 
+        "name": "Dell Venue", 
+        "snippet": "The Dell Venue; Your Personal Express Lane to Everything"
+    }, 
+    {
+        "age": 6, 
+        "carrier": "Best Buy", 
+        "id": "nexus-s", 
+        "imageUrl": "img/phones/nexus-s.0.jpg", 
+        "name": "Nexus S", 
+        "snippet": "Fast just got faster with Nexus S. A pure Google experience, Nexus S is the first phone to run Gingerbread (Android 2.3), the fastest version of Android yet."
+    }, 
+    {
+        "age": 7, 
+        "carrier": "Cellular South", 
+        "id": "lg-axis", 
+        "imageUrl": "img/phones/lg-axis.0.jpg", 
+        "name": "LG Axis", 
+        "snippet": "Android Powered, Google Maps Navigation, 5 Customizable Home Screens"
+    }, 
+    {
+        "age": 8, 
+        "id": "samsung-galaxy-tab", 
+        "imageUrl": "img/phones/samsung-galaxy-tab.0.jpg", 
+        "name": "Samsung Galaxy Tab\u2122", 
+        "snippet": "Feel Free to Tab\u2122. The Samsung Galaxy Tab\u2122 brings you an ultra-mobile entertainment experience through its 7\u201d display, high-power processor and Adobe\u00ae Flash\u00ae Player compatibility."
+    }, 
+    {
+        "age": 9, 
+        "carrier": "Cellular South", 
+        "id": "samsung-showcase-a-galaxy-s-phone", 
+        "imageUrl": "img/phones/samsung-showcase-a-galaxy-s-phone.0.jpg", 
+        "name": "Samsung Showcase\u2122 a Galaxy S\u2122 phone", 
+        "snippet": "The Samsung Showcase\u2122 delivers a cinema quality experience like you\u2019ve never seen before. Its innovative 4\u201d touch display technology provides rich picture brilliance, even outdoors"
+    }, 
+    {
+        "age": 10, 
+        "carrier": "Verizon", 
+        "id": "droid-2-global-by-motorola", 
+        "imageUrl": "img/phones/droid-2-global-by-motorola.0.jpg", 
+        "name": "DROID\u2122 2 Global by Motorola", 
+        "snippet": "The first smartphone with a 1.2 GHz processor and global capabilities."
+    }, 
+    {
+        "age": 11, 
+        "carrier": "Verizon", 
+        "id": "droid-pro-by-motorola", 
+        "imageUrl": "img/phones/droid-pro-by-motorola.0.jpg", 
+        "name": "DROID\u2122 Pro by Motorola", 
+        "snippet": "The next generation of DOES."
+    }, 
+    {
+        "age": 12, 
+        "carrier": "AT&T", 
+        "id": "motorola-bravo-with-motoblur", 
+        "imageUrl": "img/phones/motorola-bravo-with-motoblur.0.jpg", 
+        "name": "MOTOROLA BRAVO\u2122 with MOTOBLUR\u2122", 
+        "snippet": "An experience to cheer about."
+    }, 
+    {
+        "age": 13, 
+        "carrier": "T-Mobile", 
+        "id": "motorola-defy-with-motoblur", 
+        "imageUrl": "img/phones/motorola-defy-with-motoblur.0.jpg", 
+        "name": "Motorola DEFY\u2122 with MOTOBLUR\u2122", 
+        "snippet": "Are you ready for everything life throws your way?"
+    }, 
+    {
+        "age": 14, 
+        "carrier": "T-Mobile", 
+        "id": "t-mobile-mytouch-4g", 
+        "imageUrl": "img/phones/t-mobile-mytouch-4g.0.jpg", 
+        "name": "T-Mobile myTouch 4G", 
+        "snippet": "The T-Mobile myTouch 4G is a premium smartphone designed to deliver blazing fast 4G speeds so that you can video chat from practically anywhere, with or without Wi-Fi."
+    }, 
+    {
+        "age": 15, 
+        "carrier": "US Cellular", 
+        "id": "samsung-mesmerize-a-galaxy-s-phone", 
+        "imageUrl": "img/phones/samsung-mesmerize-a-galaxy-s-phone.0.jpg", 
+        "name": "Samsung Mesmerize\u2122 a Galaxy S\u2122 phone", 
+        "snippet": "The Samsung Mesmerize\u2122 delivers a cinema quality experience like you\u2019ve never seen before. Its innovative 4\u201d touch display technology provides rich picture brilliance,even outdoors"
+    }, 
+    {
+        "age": 16, 
+        "carrier": "Sprint", 
+        "id": "sanyo-zio", 
+        "imageUrl": "img/phones/sanyo-zio.0.jpg", 
+        "name": "SANYO ZIO", 
+        "snippet": "The Sanyo Zio by Kyocera is an Android smartphone with a combination of ultra-sleek styling, strong performance and unprecedented value."
+    }, 
+    {
+        "age": 17, 
+        "id": "samsung-transform", 
+        "imageUrl": "img/phones/samsung-transform.0.jpg", 
+        "name": "Samsung Transform\u2122", 
+        "snippet": "The Samsung Transform\u2122 brings you a fun way to customize your Android powered touch screen phone to just the way you like it through your favorite themed \u201cSprint ID Service Pack\u201d."
+    }, 
+    {
+        "age": 18, 
+        "id": "t-mobile-g2", 
+        "imageUrl": "img/phones/t-mobile-g2.0.jpg", 
+        "name": "T-Mobile G2", 
+        "snippet": "The T-Mobile G2 with Google is the first smartphone built for 4G speeds on T-Mobile's new network. Get the information you need, faster than you ever thought possible."
+    }, 
+    {
+        "age": 19, 
+        "id": "motorola-charm-with-motoblur", 
+        "imageUrl": "img/phones/motorola-charm-with-motoblur.0.jpg", 
+        "name": "Motorola CHARM\u2122 with MOTOBLUR\u2122", 
+        "snippet": "Motorola CHARM fits easily in your pocket or palm.  Includes MOTOBLUR service."
+    }
+]
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/img/.gitkeep b/public/docs/_examples/upgrade-phonecat-3-final/ts/example-config.json
similarity index 100%
rename from public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/img/.gitkeep
rename to public/docs/_examples/upgrade-phonecat-3-final/ts/example-config.json
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/index.html b/public/docs/_examples/upgrade-phonecat-3-final/ts/index.html
new file mode 100644
index 0000000000..1b4174131e
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/index.html
@@ -0,0 +1,37 @@
+<!-- #docplaster -->
+<!-- #docregion full -->
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <!-- #docregion base -->
+    <base href="/app/">
+    <!-- #enddocregion base -->
+    <title>Google Phone Gallery</title>
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
+    <link rel="stylesheet" href="app.css" />
+
+    <script src="/node_modules/core-js/client/shim.min.js"></script>
+    <script src="/node_modules/zone.js/dist/zone.js"></script>
+    <script src="/node_modules/reflect-metadata/Reflect.js"></script>
+    <script src="/node_modules/systemjs/dist/system.src.js"></script>
+    <!-- #enddocregion full -->
+    <script src="/systemjs.config.1.js"></script>
+    <!-- #docregion full
+    <script src="/systemjs.config.js"></script>
+    <script>
+      System.import('/app');
+    </script>
+    <!-- #enddocregion full -->
+    <script>
+      System.import('/app');
+    </script>
+    <!-- #docregion full -->
+  </head>
+  <!-- #docregion appcomponent -->
+  <body>
+    <phonecat-app></phonecat-app>
+  </body>
+  <!-- #docregion appcomponent -->
+</html>
+<!-- #enddocregion full -->
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/karma.conf.ng1.js b/public/docs/_examples/upgrade-phonecat-3-final/ts/karma.conf.ng1.js
new file mode 100644
index 0000000000..7156e025ce
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/karma.conf.ng1.js
@@ -0,0 +1,72 @@
+//jshint strict: false
+module.exports = function(config) {
+  config.set({
+
+    // #docregion basepath
+    basePath: './',
+    // #enddocregion basepath
+
+    files: [
+      'https://code.angularjs.org/1.5.5/angular.js',
+      'https://code.angularjs.org/1.5.5/angular-animate.js',
+      'https://code.angularjs.org/1.5.5/angular-resource.js',
+      'https://code.angularjs.org/1.5.5/angular-route.js',
+      'https://code.angularjs.org/1.5.5/angular-mocks.js',
+
+      // #docregion files
+      // System.js for module loading
+      'node_modules/systemjs/dist/system.src.js',
+
+      // Polyfills
+      'node_modules/core-js/client/shim.js',
+
+      // Reflect and Zone.js
+      'node_modules/reflect-metadata/Reflect.js',
+      'node_modules/zone.js/dist/zone.js',
+      'node_modules/zone.js/dist/jasmine-patch.js',
+      'node_modules/zone.js/dist/async-test.js',
+      'node_modules/zone.js/dist/fake-async-test.js',
+
+      // RxJs.
+      { pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false },
+      { pattern: 'node_modules/rxjs/**/*.js.map', included: false, watched: false },
+
+      // Angular 2 itself and the testing library
+      {pattern: 'node_modules/@angular/**/*.js', included: false, watched: false},
+      {pattern: 'node_modules/@angular/**/*.js.map', included: false, watched: false},
+
+      {pattern: 'systemjs.config.js', included: false, watched: false},
+      'karma-test-shim.js',
+
+      {pattern: 'app/**/*.module.js', included: false, watched: true},
+      {pattern: 'app/*!(.module|.spec).js', included: false, watched: true},
+      {pattern: 'app/!(bower_components)/**/*!(.module|.spec).js', included: false, watched: true},
+      {pattern: 'app/**/*.spec.js', included: false, watched: true},
+
+      {pattern: '**/*.html', included: false, watched: true},
+      // #enddocregion files
+    ],
+
+    // #docregion html
+    // proxied base paths for loading assets
+    proxies: {
+      // required for component assets fetched by Angular's compiler
+      "/phone-detail": '/base/app/phone-detail',
+      "/phone-list": '/base/app/phone-list'
+    },
+    // #enddocregion html
+
+    autoWatch: true,
+
+    frameworks: ['jasmine'],
+
+    browsers: ['Chrome', 'Firefox'],
+
+    plugins: [
+      'karma-chrome-launcher',
+      'karma-firefox-launcher',
+      'karma-jasmine'
+    ]
+
+  });
+};
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/run-unit-tests.sh b/public/docs/_examples/upgrade-phonecat-3-final/ts/run-unit-tests.sh
new file mode 100755
index 0000000000..00a5abb7bc
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/run-unit-tests.sh
@@ -0,0 +1,7 @@
+## The boilerplate Karma configuration won't work with Angular 1 tests since
+## a specific loading configuration is needed for them.
+## We keep one in karma.conf.ng1.js. This scripts runs the ng1 tests with
+## that config.
+
+PATH=$(npm bin):$PATH
+tsc && karma start karma.conf.ng1.js
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/systemjs.config.1.js b/public/docs/_examples/upgrade-phonecat-3-final/ts/systemjs.config.1.js
new file mode 100644
index 0000000000..3a455980bb
--- /dev/null
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/systemjs.config.1.js
@@ -0,0 +1,58 @@
+/**
+ * System configuration for Angular 2 samples
+ * Adjust as necessary for your application needs.
+ */
+(function(global) {
+
+  // map tells the System loader where to look for things
+  // #docregion paths
+  var map = {
+    'app':                        '/app', // 'dist',
+
+    '@angular':                   '/node_modules/@angular',
+    'angular2-in-memory-web-api': '/node_modules/angular2-in-memory-web-api',
+    'rxjs':                       '/node_modules/rxjs'
+  };
+
+  var packages = {
+    '/app':                       { main: 'main.js',  defaultExtension: 'js' },
+    'rxjs':                       { defaultExtension: 'js' },
+    'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' },
+  };
+  // #enddocregion paths
+
+  var ngPackageNames = [
+    'common',
+    'compiler',
+    'core',
+    'http',
+    'platform-browser',
+    'platform-browser-dynamic',
+    'router',
+    'router-deprecated',
+    'upgrade',
+  ];
+
+  // Individual files (~300 requests):
+  function packIndex(pkgName) {
+    packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' };
+  }
+
+  // Bundled (~40 requests):
+  function packUmd(pkgName) {
+    packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' };
+  };
+
+  var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
+
+  // Add package entries for angular packages
+  ngPackageNames.forEach(setPackageConfig);
+
+  var config = {
+    map: map,
+    packages: packages
+  }
+
+  System.config(config);
+
+})(this);
diff --git a/public/docs/_examples/upgrade-phonecat/README.md b/public/docs/_examples/upgrade-phonecat/README.md
deleted file mode 100644
index 507c99f2b7..0000000000
--- a/public/docs/_examples/upgrade-phonecat/README.md
+++ /dev/null
@@ -1,6 +0,0 @@
-Each subdirectory here is a version of the PhoneCat app.
-
-Each version is fully functional, but omits the JSON data and image
-files in the interest of keeping things clean. To run each app
-in its full form, copy the `img` and `phones` directories from
-https://github.com/angular/angular-phonecat/tree/master/app under `app`.
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/.bowerrc b/public/docs/_examples/upgrade-phonecat/ts/classes/.bowerrc
deleted file mode 100644
index 5773025bf9..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/.bowerrc
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "directory": "app/bower_components"
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/.gitignore b/public/docs/_examples/upgrade-phonecat/ts/classes/.gitignore
deleted file mode 100644
index 63d5d99a52..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/.gitignore
+++ /dev/null
@@ -1,4 +0,0 @@
-app/**/*.js
-app/**/*.js.map
-test/unit/**/*.js
-test/unit/**/*.js.map
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/css/animations.css b/public/docs/_examples/upgrade-phonecat/ts/classes/app/css/animations.css
deleted file mode 100644
index 46f3da6ecb..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/app/css/animations.css
+++ /dev/null
@@ -1,97 +0,0 @@
-/*
- * animations css stylesheet
- */
-
-/* animate ngRepeat in phone listing */
-
-.phone-listing.ng-enter,
-.phone-listing.ng-leave,
-.phone-listing.ng-move {
-  -webkit-transition: 0.5s linear all;
-  -moz-transition: 0.5s linear all;
-  -o-transition: 0.5s linear all;
-  transition: 0.5s linear all;
-}
-
-.phone-listing.ng-enter,
-.phone-listing.ng-move {
-  opacity: 0;
-  height: 0;
-  overflow: hidden;
-}
-
-.phone-listing.ng-move.ng-move-active,
-.phone-listing.ng-enter.ng-enter-active {
-  opacity: 1;
-  height: 120px;
-}
-
-.phone-listing.ng-leave {
-  opacity: 1;
-  overflow: hidden;
-}
-
-.phone-listing.ng-leave.ng-leave-active {
-  opacity: 0;
-  height: 0;
-  padding-top: 0;
-  padding-bottom: 0;
-}
-
-/* cross fading between routes with ngView */
-
-.view-container {
-  position: relative;
-}
-
-.view-frame.ng-enter,
-.view-frame.ng-leave {
-  background: white;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-}
-
-.view-frame.ng-enter {
-  -webkit-animation: 0.5s fade-in;
-  -moz-animation: 0.5s fade-in;
-  -o-animation: 0.5s fade-in;
-  animation: 0.5s fade-in;
-  z-index: 100;
-}
-
-.view-frame.ng-leave {
-  -webkit-animation: 0.5s fade-out;
-  -moz-animation: 0.5s fade-out;
-  -o-animation: 0.5s fade-out;
-  animation: 0.5s fade-out;
-  z-index: 99;
-}
-
-@keyframes fade-in {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-@-moz-keyframes fade-in {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-@-webkit-keyframes fade-in {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-
-@keyframes fade-out {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-@-moz-keyframes fade-out {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-@-webkit-keyframes fade-out {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/img/glyphicons-halflings-white.png b/public/docs/_examples/upgrade-phonecat/ts/classes/app/img/glyphicons-halflings-white.png
deleted file mode 100644
index 3bf6484a29..0000000000
Binary files a/public/docs/_examples/upgrade-phonecat/ts/classes/app/img/glyphicons-halflings-white.png and /dev/null differ
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/img/glyphicons-halflings.png b/public/docs/_examples/upgrade-phonecat/ts/classes/app/img/glyphicons-halflings.png
deleted file mode 100644
index 5b67ffda5f..0000000000
Binary files a/public/docs/_examples/upgrade-phonecat/ts/classes/app/img/glyphicons-halflings.png and /dev/null differ
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/index.html b/public/docs/_examples/upgrade-phonecat/ts/classes/app/index.html
deleted file mode 100644
index db01afac1c..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/app/index.html
+++ /dev/null
@@ -1,29 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-  <meta charset="utf-8">
-  <title>Google Phone Gallery</title>
-  <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">
-  <link rel="stylesheet" href="css/app.css">
-  <link rel="stylesheet" href="css/animations.css">
-  <!-- #docregion scripts -->
-  <script src="../node_modules/systemjs/dist/system.src.js"></script>
-  <script src="bower_components/jquery/dist/jquery.js"></script>
-  <script src="bower_components/angular/angular.js"></script>
-  <script src="bower_components/angular-animate/angular-animate.js"></script>
-  <script src="bower_components/angular-route/angular-route.js"></script>
-  <script src="bower_components/angular-resource/angular-resource.js"></script>
-  <script src="systemjs.config.js"></script>
-  <script>
-    System.import('js/app.module');
-  </script>
-  <!-- #enddocregion scripts -->
-</head>
-<body>
-
-  <div class="view-container">
-    <div ng-view class="view-frame"></div>
-  </div>
-
-</body>
-</html>
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/app.module.ts b/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/app.module.ts
deleted file mode 100644
index 01e3328c1e..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/app.module.ts
+++ /dev/null
@@ -1,35 +0,0 @@
-// #docregion pre-bootstrap
-
-import core from './core/core.module';
-import phoneList from './phone_list/phone_list.module';
-import phoneDetail from './phone_detail/phone_detail.module';
-
-angular.module('phonecatApp', [
-  'ngRoute',
-  core.name,
-  phoneList.name,
-  phoneDetail.name
-]).config(configure);
-
-configure.$inject = ['$routeProvider'];
-
-function configure($routeProvider) {
-  $routeProvider.
-    when('/phones', {
-      templateUrl: 'js/phone_list/phone_list.html',
-      controller: 'PhoneListCtrl',
-      controllerAs: 'vm'
-    }).
-    when('/phones/:phoneId', {
-      templateUrl: 'js/phone_detail/phone_detail.html',
-      controller: 'PhoneDetailCtrl',
-      controllerAs: 'vm'
-    }).
-    otherwise({
-      redirectTo: '/phones'
-    });
-}
-// #enddocregion pre-bootstrap
-// #docregion bootstrap
-angular.bootstrap(document.documentElement, ['phonecatApp']);
-// #enddocregion bootstrap
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/core/checkmark.filter.ts b/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/core/checkmark.filter.ts
deleted file mode 100644
index cd0215064f..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/core/checkmark.filter.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-// #docregion
-export default function checkmarkFilter() {
-  return function(input:boolean):string {
-    return input ? '\u2713' : '\u2718';
-  };
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/core/core.module.ts b/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/core/core.module.ts
deleted file mode 100644
index c20ce33683..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/core/core.module.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-// #docregion
-import Phone from './phone.factory';
-import checkmarkFilter from './checkmark.filter';
-
-export default angular.module('phonecat.core', [
-    'ngResource'
-  ])
-  .factory('Phone', Phone)
-  .filter('checkmark', checkmarkFilter);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/core/phone.factory.ts b/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/core/phone.factory.ts
deleted file mode 100644
index a8492b29fc..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/core/phone.factory.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-// #docregion
-Phone.$inject = ['$resource'];
-
-function Phone($resource) {
-  return $resource('phones/:phoneId.json', {}, {
-    query: {method:'GET', params:{phoneId:'phones'}, isArray:true}
-  });
-}
-
-export default Phone;
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_detail/phone_detail.controller.ts b/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_detail/phone_detail.controller.ts
deleted file mode 100644
index c5b96b6f08..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_detail/phone_detail.controller.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-// #docregion
-interface PhoneRouteParams {
-  phoneId: string
-}
-
-class PhoneDetailCtrl {
-  phone:any;
-  mainImageUrl:string;
-  constructor($routeParams:PhoneRouteParams, Phone) {
-    this.phone = Phone.get({phoneId: $routeParams.phoneId}, (phone) =>
-      this.mainImageUrl = phone.images[0]
-    );
-  }
-
-  setImage(url:string) {
-    this.mainImageUrl = url;
-  }
-}
-
-PhoneDetailCtrl.$inject = ['$routeParams', 'Phone'];
-
-export default PhoneDetailCtrl;
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_detail/phone_detail.html b/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_detail/phone_detail.html
deleted file mode 100644
index 954c65c2cd..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_detail/phone_detail.html
+++ /dev/null
@@ -1,118 +0,0 @@
-<div class="phone-images">
-  <img ng-src="{{img}}"
-       class="phone"
-       ng-repeat="img in vm.phone.images"
-       ng-class="{active: vm.mainImageUrl==img}">
-</div>
-
-<h1>{{vm.phone.name}}</h1>
-
-<p>{{vm.phone.description}}</p>
-
-<ul class="phone-thumbs">
-  <li ng-repeat="img in vm.phone.images">
-    <img ng-src="{{img}}" ng-click="vm.setImage(img)">
-  </li>
-</ul>
-
-<ul class="specs">
-  <li>
-    <span>Availability and Networks</span>
-    <dl>
-      <dt>Availability</dt>
-      <dd ng-repeat="availability in vm.phone.availability">{{availability}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Battery</span>
-    <dl>
-      <dt>Type</dt>
-      <dd>{{vm.phone.battery.type}}</dd>
-      <dt>Talk Time</dt>
-      <dd>{{vm.phone.battery.talkTime}}</dd>
-      <dt>Standby time (max)</dt>
-      <dd>{{vm.phone.battery.standbyTime}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Storage and Memory</span>
-    <dl>
-      <dt>RAM</dt>
-      <dd>{{vm.phone.storage.ram}}</dd>
-      <dt>Internal Storage</dt>
-      <dd>{{vm.phone.storage.flash}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Connectivity</span>
-    <dl>
-      <dt>Network Support</dt>
-      <dd>{{vm.phone.connectivity.cell}}</dd>
-      <dt>WiFi</dt>
-      <dd>{{vm.phone.connectivity.wifi}}</dd>
-      <dt>Bluetooth</dt>
-      <dd>{{vm.phone.connectivity.bluetooth}}</dd>
-      <dt>Infrared</dt>
-      <dd>{{vm.phone.connectivity.infrared | checkmark}}</dd>
-      <dt>GPS</dt>
-      <dd>{{vm.phone.connectivity.gps | checkmark}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Android</span>
-    <dl>
-      <dt>OS Version</dt>
-      <dd>{{vm.phone.android.os}}</dd>
-      <dt>UI</dt>
-      <dd>{{vm.phone.android.ui}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Size and Weight</span>
-    <dl>
-      <dt>Dimensions</dt>
-      <dd ng-repeat="dim in vm.phone.sizeAndWeight.dimensions">{{dim}}</dd>
-      <dt>Weight</dt>
-      <dd>{{vm.phone.sizeAndWeight.weight}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Display</span>
-    <dl>
-      <dt>Screen size</dt>
-      <dd>{{vm.phone.display.screenSize}}</dd>
-      <dt>Screen resolution</dt>
-      <dd>{{vm.phone.display.screenResolution}}</dd>
-      <dt>Touch screen</dt>
-      <dd>{{vm.phone.display.touchScreen | checkmark}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Hardware</span>
-    <dl>
-      <dt>CPU</dt>
-      <dd>{{vm.phone.hardware.cpu}}</dd>
-      <dt>USB</dt>
-      <dd>{{vm.phone.hardware.usb}}</dd>
-      <dt>Audio / headphone jack</dt>
-      <dd>{{vm.phone.hardware.audioJack}}</dd>
-      <dt>FM Radio</dt>
-      <dd>{{vm.phone.hardware.fmRadio | checkmark}}</dd>
-      <dt>Accelerometer</dt>
-      <dd>{{vm.phone.hardware.accelerometer | checkmark}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Camera</span>
-    <dl>
-      <dt>Primary</dt>
-      <dd>{{vm.phone.camera.primary}}</dd>
-      <dt>Features</dt>
-      <dd>{{vm.phone.camera.features.join(', ')}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Additional Features</span>
-    <dd>{{vm.phone.additionalFeatures}}</dd>
-  </li>
-</ul>
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_detail/phone_detail.module.ts b/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_detail/phone_detail.module.ts
deleted file mode 100644
index 16e7ac0baf..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_detail/phone_detail.module.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-// #docregion
-import PhoneDetailCtrl from './phone_detail.controller';
-
-export default angular.module('phonecat.detail', [
-    'ngRoute',
-    'phonecat.core'
-  ])
-  .controller('PhoneDetailCtrl', PhoneDetailCtrl);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_list/phone_list.controller.ts b/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_list/phone_list.controller.ts
deleted file mode 100644
index f1a5beb808..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_list/phone_list.controller.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-// #docregion
-class PhoneListCtrl {
-  phones:any[];
-  orderProp:string;
-  query:string;
-  constructor(Phone) {
-    this.phones = Phone.query();
-    this.orderProp = 'age';
-  }
-}
-
-PhoneListCtrl.$inject = ['Phone'];
-
-export default PhoneListCtrl;
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_list/phone_list.html b/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_list/phone_list.html
deleted file mode 100644
index 471f474e89..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_list/phone_list.html
+++ /dev/null
@@ -1,28 +0,0 @@
-<div class="container-fluid">
-  <div class="row">
-    <div class="col-md-2">
-      <!--Sidebar content-->
-
-      Search: <input ng-model="vm.query">
-      Sort by:
-      <select ng-model="vm.orderProp">
-        <option value="name">Alphabetical</option>
-        <option value="age">Newest</option>
-      </select>
-
-    </div>
-    <div class="col-md-10">
-      <!--Body content-->
-
-      <ul class="phones">
-        <li ng-repeat="phone in vm.phones | filter:vm.query | orderBy:vm.orderProp"
-            class="thumbnail phone-listing">
-          <a href="#/phones/{{phone.id}}" class="thumb"><img ng-src="{{phone.imageUrl}}"></a>
-          <a href="#/phones/{{phone.id}}">{{phone.name}}</a>
-          <p>{{phone.snippet}}</p>
-        </li>
-      </ul>
-
-    </div>
-  </div>
-</div>
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_list/phone_list.module.ts b/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_list/phone_list.module.ts
deleted file mode 100644
index 758b937927..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/app/js/phone_list/phone_list.module.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-// #docregion
-import PhoneListCtrl from './phone_list.controller';
-
-export default angular.module('phonecat.list', ['phonecat.core'])
-  .controller('PhoneListCtrl', PhoneListCtrl);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/app/systemjs.config.js b/public/docs/_examples/upgrade-phonecat/ts/classes/app/systemjs.config.js
deleted file mode 100644
index 9a46070388..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/app/systemjs.config.js
+++ /dev/null
@@ -1,12 +0,0 @@
-// #docregion
-(function(global) {
-
-// Use global packagePath if defined
-var pkgPath =  global.packagePath || '../node_modules/'; // path to packages
-System.config({
-  packages: {
-    'js': { defaultExtension: 'js' },
-  }
-});
-
-})(this);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/bower.json b/public/docs/_examples/upgrade-phonecat/ts/classes/bower.json
deleted file mode 100644
index 0179178b02..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/bower.json
+++ /dev/null
@@ -1,20 +0,0 @@
-{
-  "name": "angular-phonecat",
-  "description": "A starter project for AngularJS",
-  "version": "0.0.0",
-  "homepage": "https://github.com/angular/angular-phonecat",
-  "license": "MIT",
-  "private": true,
-  "dependencies": {
-    "angular": "1.5.3",
-    "angular-mocks": "1.5.3",
-    "jquery": "~2.1.1",
-    "bootstrap": "~3.1.1",
-    "angular-route": "1.5.3",
-    "angular-resource": "1.5.3",
-    "angular-animate": "1.5.3"
-  },
-  "resolutions": {
-    "angular": "1.5.3"
-  }
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/package.1.json b/public/docs/_examples/upgrade-phonecat/ts/classes/package.1.json
deleted file mode 100644
index 0b7b72bf3e..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/package.1.json
+++ /dev/null
@@ -1,43 +0,0 @@
-{
-  "version": "0.0.0",
-  "private": true,
-  "name": "angular-phonecat",
-  "description": "A tutorial application for AngularJS",
-  "repository": "https://github.com/angular/angular-phonecat",
-  "license": "MIT",
-  "dependencies": {
-    "systemjs": "0.19.25"
-  },
-  "devDependencies": {
-    "karma": "^0.12.16",
-    "karma-chrome-launcher": "^0.1.4",
-    "karma-firefox-launcher": "^0.1.3",
-    "karma-jasmine": "~0.3.7",
-    "protractor": "^3.0.0",
-    "http-server": "^0.6.1",
-    "tmp": "0.0.23",
-    "bower": "^1.3.1",
-    "shelljs": "^0.2.6",
-    "typescript": "1.8.9",
-    "typings": "^0.7.12"
-  },
-  "scripts": {
-    "postinstall": "bower install",
-
-    "prestart": "npm install",
-    "start": "http-server -a 0.0.0.0 -p 8000",
-
-    "pretest": "npm install",
-    "test": "node node_modules/karma/bin/karma start test/karma.conf.js",
-    "test-single-run": "node node_modules/karma/bin/karma start test/karma.conf.js  --single-run",
-
-    "preupdate-webdriver": "npm install",
-    "update-webdriver": "webdriver-manager update",
-
-    "preprotractor": "npm run update-webdriver",
-    "protractor": "protractor test/protractor-conf.js",
-
-    "typings": "typings",
-    "tsc": "tsc -p . -w"
-  }
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/test/e2e/scenarios.js b/public/docs/_examples/upgrade-phonecat/ts/classes/test/e2e/scenarios.js
deleted file mode 100644
index 5a505b5dae..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/test/e2e/scenarios.js
+++ /dev/null
@@ -1,100 +0,0 @@
-'use strict';
-
-/* http://docs.angularjs.org/guide/dev_guide.e2e-testing */
-
-describe('PhoneCat App', function() {
-
-  it('should redirect index.html to index.html#/phones', function() {
-    browser.get('app/index.html');
-    browser.getLocationAbsUrl().then(function(url) {
-        expect(url).toEqual('/phones');
-      });
-  });
-
-
-  describe('Phone list view', function() {
-
-    beforeEach(function() {
-      browser.get('app/index.html#/phones');
-    });
-
-
-    it('should filter the phone list as a user types into the search box', function() {
-      var phoneList = element.all(by.repeater('phone in vm.phones'));
-      var query = element(by.model('vm.query'));
-
-      expect(phoneList.count()).toBe(20);
-
-      query.sendKeys('nexus');
-      expect(phoneList.count()).toBe(1);
-
-      query.clear();
-      query.sendKeys('motorola');
-      expect(phoneList.count()).toBe(8);
-    });
-
-
-    it('should be possible to control phone order via the drop down select box', function() {
-
-      var phoneNameColumn = element.all(by.repeater('phone in vm.phones').column('phone.name'));
-      var query = element(by.model('vm.query'));
-
-      function getNames() {
-        return phoneNameColumn.map(function(elm) {
-          return elm.getText();
-        });
-      }
-
-      query.sendKeys('tablet'); //let's narrow the dataset to make the test assertions shorter
-
-      expect(getNames()).toEqual([
-        "Motorola XOOM\u2122 with Wi-Fi",
-        "MOTOROLA XOOM\u2122"
-      ]);
-
-      element(by.model('vm.orderProp')).element(by.css('option[value="name"]')).click();
-
-      expect(getNames()).toEqual([
-        "MOTOROLA XOOM\u2122",
-        "Motorola XOOM\u2122 with Wi-Fi"
-      ]);
-    });
-
-
-    it('should render phone specific links', function() {
-      var query = element(by.model('vm.query'));
-      query.sendKeys('nexus');
-      element.all(by.css('.phones li a')).first().click();
-      browser.getLocationAbsUrl().then(function(url) {
-        expect(url).toEqual('/phones/nexus-s');
-      });
-    });
-  });
-
-
-  describe('Phone detail view', function() {
-
-    beforeEach(function() {
-      browser.get('app/index.html#/phones/nexus-s');
-    });
-
-
-    it('should display nexus-s page', function() {
-      expect(element(by.binding('vm.phone.name')).getText()).toBe('Nexus S');
-    });
-
-
-    it('should display the first phone image as the main phone image', function() {
-      expect(element(by.css('img.phone.active')).getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/);
-    });
-
-
-    it('should swap main image if a thumbnail image is clicked on', function() {
-      element(by.css('.phone-thumbs li:nth-child(3) img')).click();
-      expect(element(by.css('img.phone.active')).getAttribute('src')).toMatch(/img\/phones\/nexus-s.2.jpg/);
-
-      element(by.css('.phone-thumbs li:nth-child(1) img')).click();
-      expect(element(by.css('img.phone.active')).getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/);
-    });
-  });
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/test/jasmine_matchers.d.ts b/public/docs/_examples/upgrade-phonecat/ts/classes/test/jasmine_matchers.d.ts
deleted file mode 100644
index 6d24879775..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/test/jasmine_matchers.d.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-// #docregion
-declare module jasmine {
-  interface Matchers {
-    toEqualData(expected: any):boolean;
-  }
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/test/karma.conf.1.js b/public/docs/_examples/upgrade-phonecat/ts/classes/test/karma.conf.1.js
deleted file mode 100644
index 8f2e7d178f..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/test/karma.conf.1.js
+++ /dev/null
@@ -1,38 +0,0 @@
-module.exports = function(config){
-  config.set({
-
-    basePath : '..',
-
-    // #docregion files
-    files : [
-      'app/bower_components/angular/angular.js',
-      'app/bower_components/angular-route/angular-route.js',
-      'app/bower_components/angular-resource/angular-resource.js',
-      'app/bower_components/angular-animate/angular-animate.js',
-      'app/bower_components/angular-mocks/angular-mocks.js',
-      'node_modules/systemjs/dist/system.src.js',
-      'test/karma_test_shim.js',
-      {pattern: 'app/js/**/*.js', included: false, watched: true},
-      {pattern: 'test/unit/**/*.js', included: false, watched: true}
-    ],
-    // #enddocregion files
-
-    autoWatch : true,
-
-    frameworks: ['jasmine'],
-
-    browsers : ['Chrome', 'Firefox'],
-
-    plugins : [
-      'karma-chrome-launcher',
-      'karma-firefox-launcher',
-      'karma-jasmine'
-    ],
-
-    junitReporter : {
-      outputFile: 'test_out/unit.xml',
-      suite: 'unit'
-    }
-
-  });
-};
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/test/karma_test_shim.js b/public/docs/_examples/upgrade-phonecat/ts/classes/test/karma_test_shim.js
deleted file mode 100644
index 15cbee5d7d..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/test/karma_test_shim.js
+++ /dev/null
@@ -1,44 +0,0 @@
-// #docregion
-// Cancel Karma's synchronous start,
-// we will call `__karma__.start()` later, once all the specs are loaded.
-__karma__.loaded = function() {};
-
-System.config({
-  packages: {
-    'base/app/js': {
-      defaultExtension: false,
-      format: 'register',
-      map: Object.keys(window.__karma__.files).
-            filter(onlyAppFiles).
-            reduce(function createPathRecords(pathsMapping, appPath) {
-              // creates local module name mapping to global path with karma's fingerprint in path, e.g.:
-              // './hero.service': '/base/src/app/hero.service.js?f4523daf879cfb7310ef6242682ccf10b2041b3e'
-              var moduleName = appPath.replace(/^\/base\/app\/js\//, './').replace(/\.js$/, '');
-              pathsMapping[moduleName] = appPath + '?' + window.__karma__.files[appPath]
-              return pathsMapping;
-            }, {})
-
-      }
-    }
-});
-
-Promise.all(
-  Object.keys(window.__karma__.files) // All files served by Karma.
-  .filter(onlySpecFiles)
-  .map(function(moduleName) {
-    // loads all spec files via their global module names
-    return System.import(moduleName);
-}))
-.then(function() {
-  __karma__.start();
-}, function(error) {
-  __karma__.error(error.stack || error);
-});
-
-function onlyAppFiles(filePath) {
-  return /^\/base\/app\/js\/.*\.js$/.test(filePath)
-}
-
-function onlySpecFiles(path) {
-  return /\.spec\.js$/.test(path);
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/test/protractor-conf.js b/public/docs/_examples/upgrade-phonecat/ts/classes/test/protractor-conf.js
deleted file mode 100644
index 118c7b9ec2..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/test/protractor-conf.js
+++ /dev/null
@@ -1,21 +0,0 @@
-exports.config = {
-  allScriptsTimeout: 11000,
-
-  specs: [
-    'e2e/*.js'
-  ],
-
-  capabilities: {
-    'browserName': 'chrome'
-  },
-
-  chromeOnly: true,
-
-  baseUrl: 'http://localhost:8000/',
-
-  framework: 'jasmine',
-
-  jasmineNodeOpts: {
-    defaultTimeoutInterval: 30000
-  }
-};
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/test/unit/checkmark.filter.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/classes/test/unit/checkmark.filter.spec.ts
deleted file mode 100644
index bae35e6875..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/test/unit/checkmark.filter.spec.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-// #docregion top
-import '../../app/js/core/core.module';
-// #enddocregion top
-
-describe('checkmarkFilter', function() {
-
-  beforeEach(angular.mock.module('phonecat.core'));
-
-  it('should convert boolean values to unicode checkmark or cross',
-      inject(function(checkmarkFilter) {
-    expect(checkmarkFilter(true)).toBe('\u2713');
-    expect(checkmarkFilter(false)).toBe('\u2718');
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/test/unit/phone.factory.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/classes/test/unit/phone.factory.spec.ts
deleted file mode 100644
index d7c95d347e..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/test/unit/phone.factory.spec.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-// #docregion top
-import '../../app/js/core/core.module';
-// #enddocregion top
-
-describe('phoneFactory', function() {
-
-  // load modules
-  beforeEach(angular.mock.module('phonecat.core'));
-
-  // Test service availability
-  it('check the existence of Phone factory', inject(function(Phone) {
-    expect(Phone).toBeDefined();
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/test/unit/phone_detail.controller.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/classes/test/unit/phone_detail.controller.spec.ts
deleted file mode 100644
index 02a3e20240..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/test/unit/phone_detail.controller.spec.ts
+++ /dev/null
@@ -1,44 +0,0 @@
-// #docregion top
-import '../../app/js/phone_detail/phone_detail.module';
-// #enddocregion top
-
-describe('PhoneDetailCtrl', function(){
-  var scope, $httpBackend, ctrl,
-      xyzPhoneData = function() {
-        return {
-          name: 'phone xyz',
-          images: ['image/url1.png', 'image/url2.png']
-        }
-      };
-
-  beforeEach(angular.mock.module('phonecat.detail'));
-
-  beforeEach(function(){
-    jasmine.addMatchers({
-      toEqualData: function(util, customEqualityTesters) {
-        return {
-          compare: function(actual, expected) {
-            return {pass: angular.equals(actual, expected)};
-          }
-        };
-      }
-    });
-  });
-
-  beforeEach(inject(function(_$httpBackend_, $rootScope, $routeParams, $controller) {
-    $httpBackend = _$httpBackend_;
-    $httpBackend.expectGET('phones/xyz.json').respond(xyzPhoneData());
-
-    $routeParams.phoneId = 'xyz';
-    scope = $rootScope.$new();
-    ctrl = $controller('PhoneDetailCtrl', {$scope: scope});
-  }));
-
-
-  it('should fetch phone detail', function() {
-    expect(ctrl.phone).toEqualData({});
-    $httpBackend.flush();
-
-    expect(ctrl.phone).toEqualData(xyzPhoneData());
-  });
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/test/unit/phone_list.controller.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/classes/test/unit/phone_list.controller.spec.ts
deleted file mode 100644
index efec5d5f08..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/test/unit/phone_list.controller.spec.ts
+++ /dev/null
@@ -1,44 +0,0 @@
-// #docregion top
-import '../../app/js/phone_list/phone_list.module';
-// #enddocregion top
-
-describe('PhoneListCtrl', function(){
-  var scope, ctrl, $httpBackend;
-
-  beforeEach(angular.mock.module('phonecat.list'));
-
-  beforeEach(function(){
-    jasmine.addMatchers({
-      toEqualData: function(util, customEqualityTesters) {
-        return {
-          compare: function(actual, expected) {
-            return {pass: angular.equals(actual, expected)};
-          }
-        };
-      }
-    });
-  });
-
-  beforeEach(inject(function(_$httpBackend_, $rootScope, $controller) {
-    $httpBackend = _$httpBackend_;
-    $httpBackend.expectGET('phones/phones.json').
-        respond([{name: 'Nexus S'}, {name: 'Motorola DROID'}]);
-
-    scope = $rootScope.$new();
-    ctrl = $controller('PhoneListCtrl', {$scope: scope});
-  }));
-
-
-  it('should create "phones" model with 2 phones fetched from xhr', function() {
-    expect(ctrl.phones).toEqualData([]);
-    $httpBackend.flush();
-
-    expect(ctrl.phones).toEqualData(
-        [{name: 'Nexus S'}, {name: 'Motorola DROID'}]);
-  });
-
-
-  it('should set the default value of orderProp model', function() {
-    expect(ctrl.orderProp).toBe('age');
-  });
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/classes/tsconfig.1.json b/public/docs/_examples/upgrade-phonecat/ts/classes/tsconfig.1.json
deleted file mode 100644
index c3cf6bcddb..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/classes/tsconfig.1.json
+++ /dev/null
@@ -1,15 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES5",
-    "module": "system",
-    "sourceMap": true,
-    "emitDecoratorMetadata": true,
-    "experimentalDecorators": true,
-    "removeComments": false
-  },
-  "exclude": [
-    "node_modules",
-    "typings/main.d.ts",
-    "typings/main"
-  ]
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/.bowerrc b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/.bowerrc
deleted file mode 100644
index 5773025bf9..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/.bowerrc
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "directory": "app/bower_components"
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/.gitignore b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/.gitignore
deleted file mode 100644
index 63d5d99a52..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/.gitignore
+++ /dev/null
@@ -1,4 +0,0 @@
-app/**/*.js
-app/**/*.js.map
-test/unit/**/*.js
-test/unit/**/*.js.map
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/css/animations.css b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/css/animations.css
deleted file mode 100644
index 46f3da6ecb..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/css/animations.css
+++ /dev/null
@@ -1,97 +0,0 @@
-/*
- * animations css stylesheet
- */
-
-/* animate ngRepeat in phone listing */
-
-.phone-listing.ng-enter,
-.phone-listing.ng-leave,
-.phone-listing.ng-move {
-  -webkit-transition: 0.5s linear all;
-  -moz-transition: 0.5s linear all;
-  -o-transition: 0.5s linear all;
-  transition: 0.5s linear all;
-}
-
-.phone-listing.ng-enter,
-.phone-listing.ng-move {
-  opacity: 0;
-  height: 0;
-  overflow: hidden;
-}
-
-.phone-listing.ng-move.ng-move-active,
-.phone-listing.ng-enter.ng-enter-active {
-  opacity: 1;
-  height: 120px;
-}
-
-.phone-listing.ng-leave {
-  opacity: 1;
-  overflow: hidden;
-}
-
-.phone-listing.ng-leave.ng-leave-active {
-  opacity: 0;
-  height: 0;
-  padding-top: 0;
-  padding-bottom: 0;
-}
-
-/* cross fading between routes with ngView */
-
-.view-container {
-  position: relative;
-}
-
-.view-frame.ng-enter,
-.view-frame.ng-leave {
-  background: white;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-}
-
-.view-frame.ng-enter {
-  -webkit-animation: 0.5s fade-in;
-  -moz-animation: 0.5s fade-in;
-  -o-animation: 0.5s fade-in;
-  animation: 0.5s fade-in;
-  z-index: 100;
-}
-
-.view-frame.ng-leave {
-  -webkit-animation: 0.5s fade-out;
-  -moz-animation: 0.5s fade-out;
-  -o-animation: 0.5s fade-out;
-  animation: 0.5s fade-out;
-  z-index: 99;
-}
-
-@keyframes fade-in {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-@-moz-keyframes fade-in {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-@-webkit-keyframes fade-in {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-
-@keyframes fade-out {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-@-moz-keyframes fade-out {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-@-webkit-keyframes fade-out {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/img/glyphicons-halflings-white.png b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/img/glyphicons-halflings-white.png
deleted file mode 100644
index 3bf6484a29..0000000000
Binary files a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/img/glyphicons-halflings-white.png and /dev/null differ
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/img/glyphicons-halflings.png b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/img/glyphicons-halflings.png
deleted file mode 100644
index 5b67ffda5f..0000000000
Binary files a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/img/glyphicons-halflings.png and /dev/null differ
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/index.html b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/index.html
deleted file mode 100644
index 34fe7f5f48..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/index.html
+++ /dev/null
@@ -1,31 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-  <meta charset="utf-8">
-  <title>Google Phone Gallery</title>
-  <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">
-  <link rel="stylesheet" href="css/app.css">
-  <link rel="stylesheet" href="css/animations.css">
-  <script src="../node_modules/systemjs/dist/system.src.js"></script>
-  <script src="bower_components/jquery/dist/jquery.js"></script>
-  <script src="bower_components/angular/angular.js"></script>
-  <script src="bower_components/angular-animate/angular-animate.js"></script>
-  <script src="bower_components/angular-route/angular-route.js"></script>
-  <script src="bower_components/angular-resource/angular-resource.js"></script>
-  <script src="../node_modules/core-js/client/shim.min.js"></script>
-  <script src="../node_modules/zone.js/dist/zone.js"></script>
-  <script src="../node_modules/reflect-metadata/Reflect.js"></script>
-  <script src="../node_modules/systemjs/dist/system.src.js"></script>
-  <script src="systemjs.config.js"></script>
-  <script>
-    System.import('js/app.module');
-  </script>
-</head>
-<body>
-
-  <div class="view-container">
-    <div ng-view class="view-frame"></div>
-  </div>
-
-</body>
-</html>
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/app.module.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/app.module.ts
deleted file mode 100644
index 3718b9250f..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/app.module.ts
+++ /dev/null
@@ -1,46 +0,0 @@
-// #docregion adapter-import
-import { UpgradeAdapter } from '@angular/upgrade';
-// #enddocregion adapter-import
-// #docregion adapter-state-import
-import upgradeAdapter from './core/upgrade_adapter';
-// #enddocregion adapter-state-import
-// #docregion http-import
-import { HTTP_PROVIDERS } from '@angular/http';
-// #enddocregion http-import
-import core from './core/core.module';
-import phoneList from './phone_list/phone_list.module';
-import phoneDetail from './phone_detail/phone_detail.module';
-
-upgradeAdapter.addProvider(HTTP_PROVIDERS);
-// #docregion upgrade-route-params
-upgradeAdapter.upgradeNg1Provider('$routeParams');
-// #enddocregion
-angular.module('phonecatApp', [
-  'ngRoute',
-  core.name,
-  phoneList.name,
-  phoneDetail.name
-]).config(configure);
-
-configure.$inject = ['$routeProvider'];
-
-function configure($routeProvider) {
-  // #docregion list-route
-  $routeProvider.
-    when('/phones', {
-      template: '<pc-phone-list></pc-phone-list>'
-    }).
-  // #enddocregion list-route
-  // #docregion detail-route
-    when('/phones/:phoneId', {
-      template: '<pc-phone-detail></pc-phone-detail>'
-    }).
-  // #enddocregion detail-route
-    otherwise({
-      redirectTo: '/phones'
-    });
-}
-
-// #docregion app-bootstrap
-upgradeAdapter.bootstrap(document.documentElement, ['phonecatApp']);
-// #enddocregion app-bootstrap
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/core/checkmark.pipe.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/core/checkmark.pipe.ts
deleted file mode 100644
index d129a44e50..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/core/checkmark.pipe.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-// #docregion
-import { Pipe } from '@angular/core';
-
-@Pipe({name: 'checkmark'})
-export class CheckmarkPipe {
-  transform(input:string): string {
-    return input ? '\u2713' : '\u2718';
-  }
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/core/core.module.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/core/core.module.ts
deleted file mode 100644
index c3e1ba514b..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/core/core.module.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-// #docregion
-import { Phones } from './phones.service';
-import upgradeAdapter from './upgrade_adapter';
-
-upgradeAdapter.addProvider(Phones);
-
-export default angular.module('phonecat.core', [])
-  .factory('phones', upgradeAdapter.downgradeNg2Provider(Phones));
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/core/phones.service.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/core/phones.service.ts
deleted file mode 100644
index d292bc54ee..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/core/phones.service.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-// #docregion full
-import { Injectable } from '@angular/core';
-import { Http, Response } from '@angular/http';
-import { Observable } from 'rxjs/Rx';
-import 'rxjs/add/operator/map';
-
-// #docregion phone-interface
-export interface Phone {
-  name: string;
-  snippet?: string;
-  images?: string[];
-}
-// #enddocregion phone-interface
-
-// #docregion fullclass
-// #docregion class
-@Injectable()
-export class Phones {
-// #enddocregion class
-
-  constructor(private http: Http) { }
-
-  query():Observable<Phone[]> {
-    return this.http.get(`phones/phones.json`)
-      .map((res:Response) => res.json());
-  }
-
-  get(id: string):Observable<Phone> {
-    return this.http.get(`phones/${id}.json`)
-      .map((res:Response) => res.json());
-  }
-
-// #docregion class
-}
-// #enddocregion class
-// #enddocregion fullclass
-// #docregion full
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/core/upgrade_adapter.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/core/upgrade_adapter.ts
deleted file mode 100644
index f1ad63012a..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/core/upgrade_adapter.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-// #docregion full
-import { UpgradeAdapter } from '@angular/upgrade';
-
-// #docregion adapter-init
-const upgradeAdapter = new UpgradeAdapter();
-// #enddocregion adapter-init
-
-export default upgradeAdapter;
-// #enddocregion full
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_detail/phone_detail.component.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_detail/phone_detail.component.ts
deleted file mode 100644
index dc6c1ff4fd..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_detail/phone_detail.component.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-// #docregion
-// #docregion top
-import { Component, Inject } from '@angular/core';
-import { Phones, Phone } from '../core/phones.service';
-import { CheckmarkPipe } from '../core/checkmark.pipe';
-
-interface PhoneRouteParams {
-  phoneId: string
-}
-
-@Component({
-  selector: 'pc-phone-detail',
-  templateUrl: 'js/phone_detail/phone_detail.html',
-  pipes: [CheckmarkPipe]
-})
-class PhoneDetail {
-// #enddocregion top
-  phone:Phone = undefined;
-  mainImageUrl:string;
-  constructor(@Inject('$routeParams') $routeParams:PhoneRouteParams,
-              phones:Phones) {
-    phones.get($routeParams.phoneId)
-      .subscribe(phone => {
-        this.phone = phone;
-        this.mainImageUrl = phone.images[0];
-      });
-  }
-
-  setImage(url:string) {
-    this.mainImageUrl = url;
-  }
-}
-export default PhoneDetail;
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_detail/phone_detail.html b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_detail/phone_detail.html
deleted file mode 100644
index 7565b22776..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_detail/phone_detail.html
+++ /dev/null
@@ -1,115 +0,0 @@
-<!-- #docregion -->
-<div class="phone-images">
-  <img [src]="img"
-       class="phone"
-       *ngFor="let img of phone?.images"
-       [ngClass]="{active: mainImageUrl==img}">
-</div>
-<h1>{{phone?.name}}</h1>
-<p>{{phone?.description}}</p>
-<ul class="phone-thumbs">
-  <li *ngFor="let img of phone?.images">
-    <img [src]="img" (click)="setImage(img)">
-  </li>
-</ul>
-<ul class="specs">
-  <li>
-    <span>Availability and Networks</span>
-    <dl>
-      <dt>Availability</dt>
-      <dd *ngFor="let availability of phone?.availability">{{availability}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Battery</span>
-    <dl>
-      <dt>Type</dt>
-      <dd>{{phone?.battery?.type}}</dd>
-      <dt>Talk Time</dt>
-      <dd>{{phone?.battery?.talkTime}}</dd>
-      <dt>Standby time (max)</dt>
-      <dd>{{phone?.battery?.standbyTime}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Storage and Memory</span>
-    <dl>
-      <dt>RAM</dt>
-      <dd>{{phone?.storage?.ram}}</dd>
-      <dt>Internal Storage</dt>
-      <dd>{{phone?.storage?.flash}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Connectivity</span>
-    <dl>
-      <dt>Network Support</dt>
-      <dd>{{phone?.connectivity?.cell}}</dd>
-      <dt>WiFi</dt>
-      <dd>{{phone?.connectivity?.wifi}}</dd>
-      <dt>Bluetooth</dt>
-      <dd>{{phone?.connectivity?.bluetooth}}</dd>
-      <dt>Infrared</dt>
-      <dd>{{phone?.connectivity?.infrared | checkmark}}</dd>
-      <dt>GPS</dt>
-      <dd>{{phone?.connectivity?.gps | checkmark}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Android</span>
-    <dl>
-      <dt>OS Version</dt>
-      <dd>{{phone?.android?.os}}</dd>
-      <dt>UI</dt>
-      <dd>{{phone?.android?.ui}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Size and Weight</span>
-    <dl>
-      <dt>Dimensions</dt>
-      <dd *ngFor="let dim of phone?.sizeAndWeight?.dimensions">{{dim}}</dd>
-      <dt>Weight</dt>
-      <dd>{{phone?.sizeAndWeight?.weight}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Display</span>
-    <dl>
-      <dt>Screen size</dt>
-      <dd>{{phone?.display?.screenSize}}</dd>
-      <dt>Screen resolution</dt>
-      <dd>{{phone?.display?.screenResolution}}</dd>
-      <dt>Touch screen</dt>
-      <dd>{{phone?.display?.touchScreen | checkmark}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Hardware</span>
-    <dl>
-      <dt>CPU</dt>
-      <dd>{{phone?.hardware?.cpu}}</dd>
-      <dt>USB</dt>
-      <dd>{{phone?.hardware?.usb}}</dd>
-      <dt>Audio / headphone jack</dt>
-      <dd>{{phone?.hardware?.audioJack}}</dd>
-      <dt>FM Radio</dt>
-      <dd>{{phone?.hardware?.fmRadio | checkmark}}</dd>
-      <dt>Accelerometer</dt>
-      <dd>{{phone?.hardware?.accelerometer | checkmark}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Camera</span>
-    <dl>
-      <dt>Primary</dt>
-      <dd>{{phone?.camera?.primary}}</dd>
-      <dt>Features</dt>
-      <dd>{{phone?.camera?.features?.join(', ')}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Additional Features</span>
-    <dd>{{phone?.additionalFeatures}}</dd>
-  </li>
-</ul>
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_detail/phone_detail.module.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_detail/phone_detail.module.ts
deleted file mode 100644
index 2a31fb503d..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_detail/phone_detail.module.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-// #docregion
-import PhoneDetail from './phone_detail.component';
-import upgradeAdapter from '../core/upgrade_adapter';
-
-export default angular.module('phonecat.detail', [
-    'ngRoute',
-    'phonecat.core'
-  ])
-  .directive('pcPhoneDetail',
-    <angular.IDirectiveFactory>upgradeAdapter.downgradeNg2Component(PhoneDetail))
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_detail/phone_detail_without_pipes.component.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_detail/phone_detail_without_pipes.component.ts
deleted file mode 100644
index 0926ffeb84..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_detail/phone_detail_without_pipes.component.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-// #docregion
-import { Component, Inject } from '@angular/core';
-import { Phone, Phones } from '../core/phones.service';
-
-interface PhoneRouteParams {
-  phoneId: string
-}
-
-@Component({
-  selector: 'pc-phone-detail',
-  templateUrl: 'js/phone_detail/phone_detail.html'
-})
-class PhoneDetail {
-  phone:Phone = undefined;
-  mainImageUrl:string;
-  constructor(@Inject('$routeParams') $routeParams:PhoneRouteParams,
-              phones:Phones) {
-    phones.get($routeParams.phoneId)
-      .subscribe(phone => {
-        this.phone = phone;
-        this.mainImageUrl = phone.images[0];
-      });
-  }
-
-  setImage(url:string) {
-    this.mainImageUrl = url;
-  }
-}
-export default PhoneDetail;
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/order_by.pipe.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/order_by.pipe.ts
deleted file mode 100644
index 162b91cf60..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/order_by.pipe.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-// #docregion
-import { Pipe } from '@angular/core';
-
-@Pipe({name: 'orderBy'})
-export default class OrderByPipe {
-
-  transform<T>(input:T[], property:string): T[] {
-    if (input) {
-      return input.slice().sort((a, b) => {
-        if (a[property] < b[property]) {
-          return -1;
-        } else if (b[property] < a[property]) {
-          return 1;
-        } else {
-          return 0;
-        }
-      });
-    } else {
-      return input;
-    }
-  }
-
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_filter.pipe.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_filter.pipe.ts
deleted file mode 100644
index 9f38608e8f..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_filter.pipe.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// #docregion
-import { Pipe } from '@angular/core';
-import { Phone } from '../core/phones.service';
-
-@Pipe({name: 'phoneFilter'})
-export default class PhoneFilterPipe {
-
-  transform(input:Phone[], query:string = ''): Phone[] {
-    if (input) {
-      query = query.toLowerCase();
-      return input.filter((phone) => {
-        const name = phone.name.toLowerCase();
-        const snippet = phone.snippet.toLowerCase();
-        return name.indexOf(query) >= 0 || snippet.indexOf(query) >= 0;
-      });
-    } else {
-      return input;
-    }
-  }
-
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list.component.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list.component.ts
deleted file mode 100644
index d876e28861..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list.component.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-// #docregion full
-// #docregion top
-import { Component } from '@angular/core';
-import { Observable } from 'rxjs';
-import { Phones, Phone } from '../core/phones.service';
-import PhoneFilterPipe from './phone_filter.pipe';
-import OrderByPipe from './order_by.pipe';
-
-@Component({
-  selector: 'pc-phone-list',
-  templateUrl: 'js/phone_list/phone_list.html',
-  pipes: [PhoneFilterPipe, OrderByPipe],
-})
-class PhoneList {
-// #enddocregion top
-
-  phones:Observable<Phone[]>;
-  orderProp:string;
-  query:string;
-  constructor(phones:Phones) {
-    this.phones = phones.query();
-    this.orderProp = 'age';
-  }
-}
-
-export default PhoneList;
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list.html b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list.html
deleted file mode 100644
index 7934a38283..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list.html
+++ /dev/null
@@ -1,32 +0,0 @@
-<div class="container-fluid">
-  <div class="row">
-    <div class="col-md-2">
-      <!--Sidebar content-->
-
-      <!-- #docregion controls -->
-      Search: <input [(ngModel)]="query">
-      Sort by:
-      <select [(ngModel)]="orderProp">
-        <option value="name">Alphabetical</option>
-        <option value="age">Newest</option>
-      </select>
-      <!-- #enddocregion controls -->
-
-    </div>
-    <div class="col-md-10">
-      <!--Body content-->
-
-      <!-- #docregion list -->
-      <ul class="phones">
-        <li *ngFor="let phone of phones | async | phoneFilter:query | orderBy:orderProp"
-            class="thumbnail phone-listing">
-          <a href="#/phones/{{phone.id}}" class="thumb"><img [src]="phone.imageUrl"></a>
-          <a href="#/phones/{{phone.id}}" class="name">{{phone.name}}</a>
-          <p>{{phone.snippet}}</p>
-        </li>
-      </ul>
-      <!-- #enddocregion list -->
-
-    </div>
-  </div>
-</div>
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list.module.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list.module.ts
deleted file mode 100644
index 4632cc90f5..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list.module.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-// #docregion
-import PhoneList from './phone_list.component';
-import upgradeAdapter from '../core/upgrade_adapter';
-
-export default angular.module('phonecat.list', [
-    'phonecat.core'
-  ])
-  .directive('pcPhoneList',
-    <angular.IDirectiveFactory>upgradeAdapter.downgradeNg2Component(PhoneList));
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list_without_async.html b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list_without_async.html
deleted file mode 100644
index c77090c96c..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list_without_async.html
+++ /dev/null
@@ -1,32 +0,0 @@
-<div class="container-fluid">
-  <div class="row">
-    <div class="col-md-2">
-      <!--Sidebar content-->
-
-      <!-- #docregion controls -->
-      Search: <input [(ngModel)]="query">
-      Sort by:
-      <select [(ngModel)]="orderProp">
-        <option value="name">Alphabetical</option>
-        <option value="age">Newest</option>
-      </select>
-      <!-- #enddocregion controls -->
-
-    </div>
-    <div class="col-md-10">
-      <!--Body content-->
-
-      <!-- #docregion list -->
-      <ul class="phones">
-        <li *ngFor="let phone of phones | phoneFilter:query | orderBy:orderProp"
-            class="thumbnail phone-listing">
-          <a href="#/phones/{{phone.id}}" class="thumb"><img [src]="phone.imageUrl"></a>
-          <a href="#/phones/{{phone.id}}" class="name">{{phone.name}}</a>
-          <p>{{phone.snippet}}</p>
-        </li>
-      </ul>
-      <!-- #enddocregion list -->
-
-    </div>
-  </div>
-</div>
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list_without_pipes.component.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list_without_pipes.component.ts
deleted file mode 100644
index d967ce464e..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list_without_pipes.component.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-// #docregion top
-import { Component } from '@angular/core';
-import { Observable } from 'rxjs';
-import { Phone, Phones } from '../core/phones.service';
-
-@Component({
-  selector: 'pc-phone-list',
-  templateUrl: 'js/phone_list/phone_list.html'
-})
-class PhoneList {
-// #enddocregion top
-
-  phones:Observable<Phone[]>;
-  orderProp:string;
-  query:string;
-  constructor(phones:Phones) {
-    this.phones = phones.query();
-    this.orderProp = 'age';
-  }
-}
-
-export default PhoneList;
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list_without_pipes.html b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list_without_pipes.html
deleted file mode 100644
index 1a9d3fefb3..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list_without_pipes.html
+++ /dev/null
@@ -1,32 +0,0 @@
-<div class="container-fluid">
-  <div class="row">
-    <div class="col-md-2">
-      <!--Sidebar content-->
-
-      <!-- #docregion controls -->
-      Search: <input [(ngModel)]="query">
-      Sort by:
-      <select [(ngModel)]="orderProp">
-        <option value="name">Alphabetical</option>
-        <option value="age">Newest</option>
-      </select>
-      <!-- #enddocregion controls -->
-
-    </div>
-    <div class="col-md-10">
-      <!--Body content-->
-
-      <!-- #docregion list -->
-      <ul class="phones">
-        <li *ngFor="let phone of phones | filter:query | orderBy:orderProp"
-            class="thumbnail phone-listing">
-          <a href="#/phones/{{phone.id}}" class="thumb"><img [src]="phone.imageUrl"></a>
-          <a href="#/phones/{{phone.id}}" class="name">{{phone.name}}</a>
-          <p>{{phone.snippet}}</p>
-        </li>
-      </ul>
-      <!-- #enddocregion list -->
-
-    </div>
-  </div>
-</div>
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/systemjs.config.js b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/systemjs.config.js
deleted file mode 100644
index d7510ce7c6..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/app/systemjs.config.js
+++ /dev/null
@@ -1,28 +0,0 @@
-(function(global) {
-
-// Use global packagePath if defined
-var pkgPath =  global.packagePath || '../node_modules/'; // path to packages
-System.config({
-  map: {
-    'rxjs':                       pkgPath + 'rxjs',
-    '@angular':                   pkgPath + '@angular'
-  },
-  packages: {
-    'js':                                { defaultExtension: 'js' },
-
-    '@angular/common':                   { main: 'index.js', defaultExtension: 'js' },
-    '@angular/compiler':                 { main: 'index.js', defaultExtension: 'js' },
-    '@angular/core':                     { main: 'index.js', defaultExtension: 'js' },
-    '@angular/http':                     { main: 'index.js', defaultExtension: 'js' },
-    '@angular/platform-browser':         { main: 'index.js', defaultExtension: 'js' },
-    '@angular/platform-browser-dynamic': { main: 'index.js', defaultExtension: 'js' },
-    '@angular/router':                   { main: 'index.js', defaultExtension: 'js' },
-    '@angular/router-deprecated':        { main: 'index.js', defaultExtension: 'js' },
-    '@angular/upgrade':                  { main: 'index.js', defaultExtension: 'js' },
-    'rxjs':                              { defaultExtension: 'js' }
-
-  }
-});
-
-
-})(this);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/bower.json b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/bower.json
deleted file mode 100644
index 0179178b02..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/bower.json
+++ /dev/null
@@ -1,20 +0,0 @@
-{
-  "name": "angular-phonecat",
-  "description": "A starter project for AngularJS",
-  "version": "0.0.0",
-  "homepage": "https://github.com/angular/angular-phonecat",
-  "license": "MIT",
-  "private": true,
-  "dependencies": {
-    "angular": "1.5.3",
-    "angular-mocks": "1.5.3",
-    "jquery": "~2.1.1",
-    "bootstrap": "~3.1.1",
-    "angular-route": "1.5.3",
-    "angular-resource": "1.5.3",
-    "angular-animate": "1.5.3"
-  },
-  "resolutions": {
-    "angular": "1.5.3"
-  }
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/package.1.json b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/package.1.json
deleted file mode 100644
index 8b44d8c13c..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/package.1.json
+++ /dev/null
@@ -1,56 +0,0 @@
-{
-  "version": "0.0.0",
-  "private": true,
-  "name": "angular-phonecat",
-  "description": "A tutorial application for AngularJS",
-  "repository": "https://github.com/angular/angular-phonecat",
-  "license": "MIT",
-  "dependencies": {
-    "@angular/common":  "2.0.0-rc.1",
-    "@angular/compiler":  "2.0.0-rc.1",
-    "@angular/core":  "2.0.0-rc.1",
-    "@angular/http":  "2.0.0-rc.1",
-    "@angular/platform-browser":  "2.0.0-rc.1",
-    "@angular/platform-browser-dynamic":  "2.0.0-rc.1",
-    "@angular/router":  "2.0.0-rc.1",
-    "@angular/router-deprecated":  "2.0.0-rc.1",
-    "@angular/upgrade":  "2.0.0-rc.1",
-
-    "core-js": "^2.4.0",
-    "reflect-metadata": "0.1.3",
-    "rxjs": "5.0.0-beta.6",
-    "zone.js": "0.6.12",
-    "systemjs": "0.19.26"
-  },
-  "devDependencies": {
-    "karma": "^0.13.22",
-    "karma-chrome-launcher": "^0.1.4",
-    "karma-firefox-launcher": "^0.1.3",
-    "karma-jasmine": "~0.3.7",
-    "protractor": "^3.0.0",
-    "http-server": "^0.6.1",
-    "tmp": "0.0.23",
-    "bower": "^1.3.1",
-    "shelljs": "^0.2.6",
-    "typescript": "1.8.10",
-    "typings": "^0.7.12"
-  },
-  "scripts": {
-    "postinstall": "bower install",
-
-    "prestart": "npm install",
-    "start": "http-server -a 0.0.0.0 -p 8000",
-
-    "test": "node node_modules/karma/bin/karma start test/karma.conf.js",
-    "test-single-run": "node node_modules/karma/bin/karma start test/karma.conf.js  --single-run",
-
-    "preupdate-webdriver": "npm install",
-    "update-webdriver": "webdriver-manager update",
-
-    "preprotractor": "npm run update-webdriver",
-    "protractor": "protractor test/protractor-conf.js",
-
-    "typings": "typings",
-    "tsc": "tsc -p . -w"
-  }
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/e2e/scenarios.js b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/e2e/scenarios.js
deleted file mode 100644
index 1da0896c0d..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/e2e/scenarios.js
+++ /dev/null
@@ -1,112 +0,0 @@
-'use strict';
-
-/* http://docs.angularjs.org/guide/dev_guide.e2e-testing */
-
-describe('PhoneCat App', function() {
-
-  it('should redirect index.html to index.html#/phones', function() {
-    browser.get('app/index.html');
-    browser.getLocationAbsUrl().then(function(url) {
-        expect(url).toEqual('/phones');
-      });
-  });
-
-
-  describe('Phone list view', function() {
-
-    beforeEach(function() {
-      browser.get('app/index.html#/phones');
-    });
-
-    it('should filter the phone list as a user types into the search box', function() {
-      var phoneList = element.all(by.css('.phones li'));
-      var query = element(by.css('input'));
-
-      expect(phoneList.count()).toBe(20);
-
-      query.sendKeys('nexus');
-      expect(phoneList.count()).toBe(1);
-
-      query.clear();
-      // https://github.com/angular/protractor/issues/2019
-      var str = 'motorola';
-      for (var i = 0; i < str.length; i++) {
-        query.sendKeys(str.charAt(i));
-      }
-
-      expect(phoneList.count()).toBe(8);
-    });
-
-
-    it('should be possible to control phone order via the drop down select box', function() {
-      var phoneNameColumn = element.all(by.css('.phones .name'));
-      var query = element(by.css('input'));
-
-      function getNames() {
-        return phoneNameColumn.map(function(elm) {
-          return elm.getText();
-        });
-      }
-
-      //let's narrow the dataset to make the test assertions shorter
-      // https://github.com/angular/protractor/issues/2019
-      var str = 'tablet';
-      for (var i = 0; i < str.length; i++) {
-        query.sendKeys(str.charAt(i));
-      }
-
-      expect(getNames()).toEqual([
-        "Motorola XOOM\u2122 with Wi-Fi",
-        "MOTOROLA XOOM\u2122"
-      ]);
-
-      element(by.css('select')).element(by.css('option[value="name"]')).click();
-
-      expect(getNames()).toEqual([
-        "MOTOROLA XOOM\u2122",
-        "Motorola XOOM\u2122 with Wi-Fi"
-      ]);
-    });
-
-
-    it('should render phone specific links', function() {
-      var query = element(by.css('input'));
-      // https://github.com/angular/protractor/issues/2019
-      var str = 'nexus';
-      for (var i = 0; i < str.length; i++) {
-        query.sendKeys(str.charAt(i));
-      }
-      element.all(by.css('.phones li a')).first().click();
-      browser.getLocationAbsUrl().then(function(url) {
-        expect(url).toEqual('/phones/nexus-s');
-      });
-    });
-  });
-
-
-  describe('Phone detail view', function() {
-
-    beforeEach(function() {
-      browser.get('app/index.html#/phones/nexus-s');
-    });
-
-
-    it('should display nexus-s page', function() {
-      expect(element(by.css('h1')).getText()).toBe('Nexus S');
-    });
-
-
-    it('should display the first phone image as the main phone image', function() {
-      expect(element(by.css('img.phone.active')).getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/);
-    });
-
-
-    it('should swap main image if a thumbnail image is clicked on', function() {
-      element(by.css('.phone-thumbs li:nth-of-type(3) img')).click();
-      expect(element(by.css('img.phone.active')).getAttribute('src')).toMatch(/img\/phones\/nexus-s.2.jpg/);
-
-      element(by.css('.phone-thumbs li:nth-of-type(1) img')).click();
-      expect(element(by.css('img.phone.active')).getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/);
-    });
-  });
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/karma.conf.1.js b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/karma.conf.1.js
deleted file mode 100644
index 82ad80971b..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/karma.conf.1.js
+++ /dev/null
@@ -1,52 +0,0 @@
-module.exports = function(config){
-  config.set({
-
-    basePath : '..',
-
-    // #docregion html
-    files : [
-    // #enddocregion html
-      'app/bower_components/angular/angular.js',
-      'app/bower_components/angular-route/angular-route.js',
-      'app/bower_components/angular-resource/angular-resource.js',
-      'app/bower_components/angular-animate/angular-animate.js',
-      'app/bower_components/angular-mocks/angular-mocks.js',
-      'node_modules/systemjs/dist/system-polyfills.js',
-      'node_modules/core-js/client/shim.min.js',
-      'node_modules/zone.js/dist/zone.js',
-      'node_modules/reflect-metadata/Reflect.js',
-      'node_modules/systemjs/dist/system.src.js',
-      {pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false},
-      {pattern: 'node_modules/@angular/**/*.js', included: false, watched: false},
-      'test/karma_test_shim.js',
-      {pattern: 'app/js/**/*.js', included: false, watched: true},
-      {pattern: 'test/unit/**/*.js', included: false, watched: true},
-      // #docregion html
-      {pattern: 'app/js/**/*.html', included: false, watched: true}
-    ],
-
-    proxies: {
-      // required for component assests fetched by Angular's compiler
-      "/js": "/base/app/js"
-    },
-    // #enddocregion html
-
-    autoWatch : true,
-
-    frameworks: ['jasmine'],
-
-    browsers : ['Chrome', 'Firefox'],
-
-    plugins : [
-      'karma-chrome-launcher',
-      'karma-firefox-launcher',
-      'karma-jasmine'
-    ],
-
-    junitReporter : {
-      outputFile: 'test_out/unit.xml',
-      suite: 'unit'
-    }
-
-  });
-};
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/karma_test_shim.js b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/karma_test_shim.js
deleted file mode 100644
index 26075e973d..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/karma_test_shim.js
+++ /dev/null
@@ -1,65 +0,0 @@
-// #docregion
-// Cancel Karma's synchronous start,
-// we will call `__karma__.start()` later, once all the specs are loaded.
-__karma__.loaded = function() {};
-
-System.config({
-  map: {
-    'rxjs': 'base/node_modules/rxjs',
-    '@angular': 'base/node_modules/@angular'
-  },
-  packages: {
-    'base/app/js': {
-      defaultExtension: false,
-      format: 'register',
-      map: Object.keys(window.__karma__.files).
-            filter(onlyAppFiles).
-            reduce(function createPathRecords(pathsMapping, appPath) {
-              // creates local module name mapping to global path with karma's fingerprint in path, e.g.:
-              // './hero.service': '/base/src/app/hero.service.js?f4523daf879cfb7310ef6242682ccf10b2041b3e'
-              var moduleName = appPath.replace(/^\/base\/app\/js\//, './').replace(/\.js$/, '');
-              pathsMapping[moduleName] = appPath + '?' + window.__karma__.files[appPath]
-              return pathsMapping;
-            }, {})
-    },
-    '@angular/common':                   { main: 'index.js', defaultExtension: 'js' },
-    '@angular/compiler':                 { main: 'index.js', defaultExtension: 'js' },
-    '@angular/core':                     { main: 'index.js', defaultExtension: 'js' },
-    '@angular/http':                     { main: 'index.js', defaultExtension: 'js' },
-    '@angular/platform-browser':         { main: 'index.js', defaultExtension: 'js' },
-    '@angular/platform-browser-dynamic': { main: 'index.js', defaultExtension: 'js' },
-    '@angular/router':                   { main: 'index.js', defaultExtension: 'js' },
-    '@angular/router-deprecated':        { main: 'index.js', defaultExtension: 'js' },
-    '@angular/upgrade':                  { main: 'index.js', defaultExtension: 'js' },
-    'rxjs':                              { defaultExtension: 'js' }
-  }
-});
-
-// #docregion ng2
-System.import('@angular/core/testing').then(function(testing) {
-  return System.import('@angular/platform-browser-dynamic/testing').then(function(browserTesting) {
-    testing.setBaseTestProviders(browserTesting.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
-                                 browserTesting.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS);
-  });
-}).then(function() {
-  return Promise.all(
-    Object.keys(window.__karma__.files) // All files served by Karma.
-    .filter(onlySpecFiles)
-    .map(function(moduleName) {
-      // loads all spec files via their global module names
-      return System.import(moduleName);
-  }));
-}).then(function() {
-  __karma__.start();
-}, function(error) {
-  __karma__.error(error.stack || error);
-});
-// #enddocregion ng2
-
-function onlyAppFiles(filePath) {
-  return /^\/base\/app\/js\/.*\.js$/.test(filePath)
-}
-
-function onlySpecFiles(path) {
-  return /\.spec\.js$/.test(path);
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/protractor-conf.js b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/protractor-conf.js
deleted file mode 100644
index 490e9bd078..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/protractor-conf.js
+++ /dev/null
@@ -1,21 +0,0 @@
-exports.config = {
-  allScriptsTimeout: 11000,
-
-  specs: [
-    'e2e/*.js'
-  ],
-
-  capabilities: {
-    'browserName': 'chrome'
-  },
-
-  directConnect: true,
-
-  baseUrl: 'http://localhost:8000/',
-
-  framework: 'jasmine',
-
-  jasmineNodeOpts: {
-    defaultTimeoutInterval: 30000
-  }
-};
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/checkmark.pipe.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/checkmark.pipe.spec.ts
deleted file mode 100644
index c1794fd7c0..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/checkmark.pipe.spec.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-// #docregion
-import {describe, beforeEachProviders, it, inject, expect} from '@angular/core/testing';
-import {CheckmarkPipe} from '../../app/js/core/checkmark.pipe';
-
-describe('CheckmarkPipe', function() {
-
-  beforeEachProviders(() => [CheckmarkPipe]);
-
-  it('should convert boolean values to unicode checkmark or cross',
-      inject([CheckmarkPipe], (checkmarkPipe) => {
-    expect(checkmarkPipe.transform(true)).toBe('\u2713');
-    expect(checkmarkPipe.transform(false)).toBe('\u2718');
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/order_by.pipe.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/order_by.pipe.spec.ts
deleted file mode 100644
index f8a8401b7f..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/order_by.pipe.spec.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-// #docregion
-import {describe, beforeEachProviders, it, inject} from '@angular/core/testing';
-
-import OrderByPipe from '../../app/js/phone_list/order_by.pipe';
-
-describe('OrderByPipe', function() {
-
-  let input:any[] = [
-    {name: 'Nexus S', snippet: 'The Nexus S Phone', images: []},
-    {name: 'Motorola DROID', snippet: 'An Android-for-business smartphone', images: []}
-  ];
-
-  beforeEachProviders(() => [OrderByPipe]);
-
-  it('should order by the given property', inject([OrderByPipe], (orderByPipe) => {
-    expect(orderByPipe.transform(input, 'name')).toEqual([input[1], input[0]]);
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/phone_detail.component.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/phone_detail.component.spec.ts
deleted file mode 100644
index a94a28f055..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/phone_detail.component.spec.ts
+++ /dev/null
@@ -1,48 +0,0 @@
-// #docregion
-import {provide} from '@angular/core';
-import {HTTP_PROVIDERS} from '@angular/http';
-import {Observable} from 'rxjs/Rx';
-import {
-  describe,
-  beforeEachProviders,
-  inject,
-  it,
-  expect
-} from '@angular/core/testing';
-import {TestComponentBuilder} from '@angular/compiler/testing';
-
-import PhoneDetail from '../../app/js/phone_detail/phone_detail.component';
-import {Phones, Phone} from '../../app/js/core/phones.service';
-
-function xyzPhoneData():Phone {
-  return {
-    name: 'phone xyz',
-    snippet: '',
-    images: ['image/url1.png', 'image/url2.png']
-  }
-}
-
-class MockPhones extends Phones {
-  get(id):Observable<Phone> {
-    return Observable.of(xyzPhoneData());
-  }
-}
-
-describe('PhoneDetail', () => {
-
-  beforeEachProviders(() => [
-    provide(Phones, {useClass: MockPhones}),
-    provide('$routeParams', {useValue: {phoneId: 'xyz'}}),
-    HTTP_PROVIDERS
-  ]);
-
-  it('should fetch phone detail', inject([TestComponentBuilder], (tcb) => {
-    return tcb.createAsync(PhoneDetail).then((fixture) => {
-      fixture.detectChanges();
-      let compiled = fixture.debugElement.nativeElement;
-
-      expect(compiled.querySelector('h1')).toHaveText(xyzPhoneData().name);
-    });
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/phone_filter.pipe.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/phone_filter.pipe.spec.ts
deleted file mode 100644
index 78747b0aa0..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/phone_filter.pipe.spec.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-// #docregion
-import {describe, beforeEachProviders, it, inject} from '@angular/core/testing';
-
-import PhoneFilterPipe from '../../app/js/phone_list/phone_filter.pipe';
-import {Phone} from '../../app/js/core/phones.service';
-
-describe('PhoneFilterPipe', function() {
-
-  let phones:Phone[] = [
-    {name: 'Nexus S', snippet: 'The Nexus S Phone', images: []},
-    {name: 'Motorola DROID', snippet: 'an Android-for-business smartphone', images: []}
-  ];
-
-  beforeEachProviders(() => [PhoneFilterPipe]);
-
-  it('should return input when no query', inject([PhoneFilterPipe], (phoneFilterPipe) => {
-    expect(phoneFilterPipe.transform(phones)).toEqual(phones);
-  }));
-
-  it('should match based on name', inject([PhoneFilterPipe], (phoneFilterPipe) => {
-    expect(phoneFilterPipe.transform(phones, 'nexus')).toEqual([phones[0]]);
-  }));
-
-  it('should match based on snippet', inject([PhoneFilterPipe], (phoneFilterPipe) => {
-    expect(phoneFilterPipe.transform(phones, 'android')).toEqual([phones[1]]);
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/phone_list.component.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/phone_list.component.spec.ts
deleted file mode 100644
index d3d87f2a6f..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/phone_list.component.spec.ts
+++ /dev/null
@@ -1,56 +0,0 @@
-// #docregion
-import {provide} from '@angular/core';
-import {HTTP_PROVIDERS} from '@angular/http';
-import {Observable} from 'rxjs/Rx';
-import {
-  describe,
-  beforeEachProviders,
-  inject,
-  it,
-  expect
-} from '@angular/core/testing';
-import {TestComponentBuilder} from '@angular/compiler/testing';
-
-import PhoneList from '../../app/js/phone_list/phone_list.component';
-import {Phones, Phone} from '../../app/js/core/phones.service';
-
-class MockPhones extends Phones {
-  query():Observable<Phone[]> {
-    return Observable.of(
-      [{name: 'Nexus S', snippet: ''}, {name: 'Motorola DROID', snippet: ''}]
-    )
-  }
-}
-
-describe('PhoneList', () => {
-
-  beforeEachProviders(() => [
-    provide(Phones, {useClass: MockPhones}),
-    HTTP_PROVIDERS
-  ]);
-
-
-  it('should create "phones" model with 2 phones fetched from xhr',
-      inject([TestComponentBuilder], (tcb) => {
-    return tcb.createAsync(PhoneList).then((fixture) => {
-      fixture.detectChanges();
-
-      let compiled = fixture.debugElement.nativeElement;
-
-      expect(compiled.querySelectorAll('.phone-listing').length).toBe(2);
-      expect(compiled.querySelector('.phone-listing:nth-child(1)').textContent).toContain('Nexus S');
-      expect(compiled.querySelector('.phone-listing:nth-child(2)').textContent).toContain('Motorola DROID');
-    });
-  }));
-
-
-  it('should set the default value of orderProp model',
-      inject([TestComponentBuilder], (tcb) => {
-    return tcb.createAsync(PhoneList).then((fixture) => {
-      fixture.detectChanges();
-      let compiled = fixture.debugElement.nativeElement;
-      expect(compiled.querySelector('select option:last-child').selected).toBe(true);
-    });
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/phones.service.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/phones.service.spec.ts
deleted file mode 100644
index c70f25c5ca..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/test/unit/phones.service.spec.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-// #docregion
-import {describe, beforeEachProviders, it, inject} from '@angular/core/testing';
-import {HTTP_PROVIDERS} from '@angular/http';
-import {Phones} from '../../app/js/core/phones.service';
-
-describe('Phones', function() {
-
-  // load providers
-  beforeEachProviders(() => [Phones, HTTP_PROVIDERS]);
-
-  // Test service availability
-  it('check the existence of Phones', inject([Phones], (phones) => {
-    expect(phones).toBeDefined();
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/tsconfig.1.json b/public/docs/_examples/upgrade-phonecat/ts/ng2_components/tsconfig.1.json
deleted file mode 100644
index eef7e2be89..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_components/tsconfig.1.json
+++ /dev/null
@@ -1,16 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES5",
-    "module": "system",
-    "moduleResolution": "node",
-    "sourceMap": true,
-    "emitDecoratorMetadata": true,
-    "experimentalDecorators": true,
-    "removeComments": false
-  },
-  "exclude": [
-    "node_modules",
-    "typings/main.d.ts",
-    "typings/main"
-  ]
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/.bowerrc b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/.bowerrc
deleted file mode 100644
index 5773025bf9..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/.bowerrc
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "directory": "app/bower_components"
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/.gitignore b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/.gitignore
deleted file mode 100644
index 63d5d99a52..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/.gitignore
+++ /dev/null
@@ -1,4 +0,0 @@
-app/**/*.js
-app/**/*.js.map
-test/unit/**/*.js
-test/unit/**/*.js.map
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/css/animations.css b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/css/animations.css
deleted file mode 100644
index 46f3da6ecb..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/css/animations.css
+++ /dev/null
@@ -1,97 +0,0 @@
-/*
- * animations css stylesheet
- */
-
-/* animate ngRepeat in phone listing */
-
-.phone-listing.ng-enter,
-.phone-listing.ng-leave,
-.phone-listing.ng-move {
-  -webkit-transition: 0.5s linear all;
-  -moz-transition: 0.5s linear all;
-  -o-transition: 0.5s linear all;
-  transition: 0.5s linear all;
-}
-
-.phone-listing.ng-enter,
-.phone-listing.ng-move {
-  opacity: 0;
-  height: 0;
-  overflow: hidden;
-}
-
-.phone-listing.ng-move.ng-move-active,
-.phone-listing.ng-enter.ng-enter-active {
-  opacity: 1;
-  height: 120px;
-}
-
-.phone-listing.ng-leave {
-  opacity: 1;
-  overflow: hidden;
-}
-
-.phone-listing.ng-leave.ng-leave-active {
-  opacity: 0;
-  height: 0;
-  padding-top: 0;
-  padding-bottom: 0;
-}
-
-/* cross fading between routes with ngView */
-
-.view-container {
-  position: relative;
-}
-
-.view-frame.ng-enter,
-.view-frame.ng-leave {
-  background: white;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-}
-
-.view-frame.ng-enter {
-  -webkit-animation: 0.5s fade-in;
-  -moz-animation: 0.5s fade-in;
-  -o-animation: 0.5s fade-in;
-  animation: 0.5s fade-in;
-  z-index: 100;
-}
-
-.view-frame.ng-leave {
-  -webkit-animation: 0.5s fade-out;
-  -moz-animation: 0.5s fade-out;
-  -o-animation: 0.5s fade-out;
-  animation: 0.5s fade-out;
-  z-index: 99;
-}
-
-@keyframes fade-in {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-@-moz-keyframes fade-in {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-@-webkit-keyframes fade-in {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-
-@keyframes fade-out {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-@-moz-keyframes fade-out {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-@-webkit-keyframes fade-out {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/css/app.css b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/css/app.css
deleted file mode 100644
index f41c420776..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/css/app.css
+++ /dev/null
@@ -1,99 +0,0 @@
-/* app css stylesheet */
-
-body {
-  padding-top: 20px;
-}
-
-
-.phone-images {
-  background-color: white;
-  width: 450px;
-  height: 450px;
-  overflow: hidden;
-  position: relative;
-  float: left;
-}
-
-.phones {
-  list-style: none;
-}
-
-.thumb {
-  float: left;
-  margin: -0.5em 1em 1.5em 0;
-  padding-bottom: 1em;
-  height: 100px;
-  width: 100px;
-}
-
-.phones li {
-  clear: both;
-  height: 115px;
-  padding-top: 15px;
-}
-
-/** Detail View **/
-img.phone {
-  float: left;
-  margin-right: 3em;
-  margin-bottom: 2em;
-  background-color: white;
-  padding: 2em;
-  height: 400px;
-  width: 400px;
-  display: none;
-}
-
-img.phone:first-of-type {
-  display: block;
-}
-
-
-ul.phone-thumbs {
-  margin: 0;
-  list-style: none;
-}
-
-ul.phone-thumbs li {
-  border: 1px solid black;
-  display: inline-block;
-  margin: 1em;
-  background-color: white;
-}
-
-ul.phone-thumbs img {
-  height: 100px;
-  width: 100px;
-  padding: 1em;
-}
-
-ul.phone-thumbs img:hover {
-  cursor: pointer;
-}
-
-
-ul.specs {
-  clear: both;
-  margin: 0;
-  padding: 0;
-  list-style: none;
-}
-
-ul.specs > li{
-  display: inline-block;
-  width: 200px;
-  vertical-align: top;
-}
-
-ul.specs > li > span{
-  font-weight: bold;
-  font-size: 1.2em;
-}
-
-ul.specs dt {
-  font-weight: bold;
-}
-
-h1 {
-  border-bottom: 1px solid gray;
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/img/glyphicons-halflings-white.png b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/img/glyphicons-halflings-white.png
deleted file mode 100644
index 3bf6484a29..0000000000
Binary files a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/img/glyphicons-halflings-white.png and /dev/null differ
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/img/glyphicons-halflings.png b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/img/glyphicons-halflings.png
deleted file mode 100644
index 5b67ffda5f..0000000000
Binary files a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/img/glyphicons-halflings.png and /dev/null differ
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/index.html b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/index.html
deleted file mode 100644
index e556aa9208..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/index.html
+++ /dev/null
@@ -1,26 +0,0 @@
-<!-- #docregion -->
-<!doctype html>
-<html lang="en">
-<head>
-  <meta charset="utf-8">
-  <title>Google Phone Gallery</title>
-  <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">
-  <link rel="stylesheet" href="css/app.css">
-  <link rel="stylesheet" href="css/animations.css">
-  <!-- #docregion scripts -->
-  <script src="../node_modules/core-js/client/shim.min.js"></script>
-  <script src="../node_modules/zone.js/dist/zone.js"></script>
-  <script src="../node_modules/reflect-metadata/Reflect.js"></script>
-  <script src="../node_modules/systemjs/dist/system.src.js"></script>
-  <script src="systemjs.config.js"></script>
-  <script>
-    System.import('js/main');
-  </script>
-  <!-- #enddocregion scripts -->
-</head>
-<!-- #docregion body -->
-<body>
-  <pc-app></pc-app>
-</body>
-<!-- #enddocregion body -->
-</html>
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/core/checkmark.pipe.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/core/checkmark.pipe.ts
deleted file mode 100644
index d129a44e50..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/core/checkmark.pipe.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-// #docregion
-import { Pipe } from '@angular/core';
-
-@Pipe({name: 'checkmark'})
-export class CheckmarkPipe {
-  transform(input:string): string {
-    return input ? '\u2713' : '\u2718';
-  }
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/core/phones.service.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/core/phones.service.ts
deleted file mode 100644
index d292bc54ee..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/core/phones.service.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-// #docregion full
-import { Injectable } from '@angular/core';
-import { Http, Response } from '@angular/http';
-import { Observable } from 'rxjs/Rx';
-import 'rxjs/add/operator/map';
-
-// #docregion phone-interface
-export interface Phone {
-  name: string;
-  snippet?: string;
-  images?: string[];
-}
-// #enddocregion phone-interface
-
-// #docregion fullclass
-// #docregion class
-@Injectable()
-export class Phones {
-// #enddocregion class
-
-  constructor(private http: Http) { }
-
-  query():Observable<Phone[]> {
-    return this.http.get(`phones/phones.json`)
-      .map((res:Response) => res.json());
-  }
-
-  get(id: string):Observable<Phone> {
-    return this.http.get(`phones/${id}.json`)
-      .map((res:Response) => res.json());
-  }
-
-// #docregion class
-}
-// #enddocregion class
-// #enddocregion fullclass
-// #docregion full
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/core/upgrade_adapter.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/core/upgrade_adapter.ts
deleted file mode 100644
index f1ad63012a..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/core/upgrade_adapter.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-// #docregion full
-import { UpgradeAdapter } from '@angular/upgrade';
-
-// #docregion adapter-init
-const upgradeAdapter = new UpgradeAdapter();
-// #enddocregion adapter-init
-
-export default upgradeAdapter;
-// #enddocregion full
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/main.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/main.ts
deleted file mode 100644
index 40ccfa0aac..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/main.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-// #docregion
-// #docregion importbootstrap
-import { provide } from '@angular/core';
-import { LocationStrategy, HashLocationStrategy } from '@angular/common';
-import { bootstrap } from '@angular/platform-browser-dynamic';
-import { ROUTER_PROVIDERS } from '@angular/router-deprecated';
-
-import { Phones } from './core/phones.service';
-import AppComponent from './app.component';
-// #enddocregion importbootstrap
-
-// #docregion http-import
-import { HTTP_PROVIDERS } from '@angular/http';
-// #enddocregion http-import
-
-// #docregion bootstrap
-bootstrap(AppComponent, [
-  HTTP_PROVIDERS,
-  ROUTER_PROVIDERS,
-  provide(LocationStrategy, {useClass: HashLocationStrategy}),
-  Phones
-]);
-// #enddocregion bootstrap
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_detail/phone_detail.component.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_detail/phone_detail.component.ts
deleted file mode 100644
index a6d07f3773..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_detail/phone_detail.component.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-// #docregion
-// #docregion top
-import { Component, Inject } from '@angular/core';
-import { RouteParams } from '@angular/router-deprecated';
-
-import { Phones, Phone } from '../core/phones.service';
-import { CheckmarkPipe } from '../core/checkmark.pipe';
-
-@Component({
-  selector: 'pc-phone-detail',
-  templateUrl: 'js/phone_detail/phone_detail.html',
-  pipes: [CheckmarkPipe]
-})
-class PhoneDetail {
-// #enddocregion top
-  phone:Phone = undefined;
-  mainImageUrl:string;
-  constructor(params:RouteParams,
-              phones:Phones) {
-    phones.get(params.get('phoneId'))
-      .subscribe(phone => {
-        this.phone = phone;
-        this.mainImageUrl = phone.images[0];
-      });
-  }
-
-  setImage(url:string) {
-    this.mainImageUrl = url;
-  }
-}
-export default PhoneDetail;
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_detail/phone_detail.html b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_detail/phone_detail.html
deleted file mode 100644
index 7565b22776..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_detail/phone_detail.html
+++ /dev/null
@@ -1,115 +0,0 @@
-<!-- #docregion -->
-<div class="phone-images">
-  <img [src]="img"
-       class="phone"
-       *ngFor="let img of phone?.images"
-       [ngClass]="{active: mainImageUrl==img}">
-</div>
-<h1>{{phone?.name}}</h1>
-<p>{{phone?.description}}</p>
-<ul class="phone-thumbs">
-  <li *ngFor="let img of phone?.images">
-    <img [src]="img" (click)="setImage(img)">
-  </li>
-</ul>
-<ul class="specs">
-  <li>
-    <span>Availability and Networks</span>
-    <dl>
-      <dt>Availability</dt>
-      <dd *ngFor="let availability of phone?.availability">{{availability}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Battery</span>
-    <dl>
-      <dt>Type</dt>
-      <dd>{{phone?.battery?.type}}</dd>
-      <dt>Talk Time</dt>
-      <dd>{{phone?.battery?.talkTime}}</dd>
-      <dt>Standby time (max)</dt>
-      <dd>{{phone?.battery?.standbyTime}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Storage and Memory</span>
-    <dl>
-      <dt>RAM</dt>
-      <dd>{{phone?.storage?.ram}}</dd>
-      <dt>Internal Storage</dt>
-      <dd>{{phone?.storage?.flash}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Connectivity</span>
-    <dl>
-      <dt>Network Support</dt>
-      <dd>{{phone?.connectivity?.cell}}</dd>
-      <dt>WiFi</dt>
-      <dd>{{phone?.connectivity?.wifi}}</dd>
-      <dt>Bluetooth</dt>
-      <dd>{{phone?.connectivity?.bluetooth}}</dd>
-      <dt>Infrared</dt>
-      <dd>{{phone?.connectivity?.infrared | checkmark}}</dd>
-      <dt>GPS</dt>
-      <dd>{{phone?.connectivity?.gps | checkmark}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Android</span>
-    <dl>
-      <dt>OS Version</dt>
-      <dd>{{phone?.android?.os}}</dd>
-      <dt>UI</dt>
-      <dd>{{phone?.android?.ui}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Size and Weight</span>
-    <dl>
-      <dt>Dimensions</dt>
-      <dd *ngFor="let dim of phone?.sizeAndWeight?.dimensions">{{dim}}</dd>
-      <dt>Weight</dt>
-      <dd>{{phone?.sizeAndWeight?.weight}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Display</span>
-    <dl>
-      <dt>Screen size</dt>
-      <dd>{{phone?.display?.screenSize}}</dd>
-      <dt>Screen resolution</dt>
-      <dd>{{phone?.display?.screenResolution}}</dd>
-      <dt>Touch screen</dt>
-      <dd>{{phone?.display?.touchScreen | checkmark}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Hardware</span>
-    <dl>
-      <dt>CPU</dt>
-      <dd>{{phone?.hardware?.cpu}}</dd>
-      <dt>USB</dt>
-      <dd>{{phone?.hardware?.usb}}</dd>
-      <dt>Audio / headphone jack</dt>
-      <dd>{{phone?.hardware?.audioJack}}</dd>
-      <dt>FM Radio</dt>
-      <dd>{{phone?.hardware?.fmRadio | checkmark}}</dd>
-      <dt>Accelerometer</dt>
-      <dd>{{phone?.hardware?.accelerometer | checkmark}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Camera</span>
-    <dl>
-      <dt>Primary</dt>
-      <dd>{{phone?.camera?.primary}}</dd>
-      <dt>Features</dt>
-      <dd>{{phone?.camera?.features?.join(', ')}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Additional Features</span>
-    <dd>{{phone?.additionalFeatures}}</dd>
-  </li>
-</ul>
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_list/order_by.pipe.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_list/order_by.pipe.ts
deleted file mode 100644
index 162b91cf60..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_list/order_by.pipe.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-// #docregion
-import { Pipe } from '@angular/core';
-
-@Pipe({name: 'orderBy'})
-export default class OrderByPipe {
-
-  transform<T>(input:T[], property:string): T[] {
-    if (input) {
-      return input.slice().sort((a, b) => {
-        if (a[property] < b[property]) {
-          return -1;
-        } else if (b[property] < a[property]) {
-          return 1;
-        } else {
-          return 0;
-        }
-      });
-    } else {
-      return input;
-    }
-  }
-
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_list/phone_filter.pipe.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_list/phone_filter.pipe.ts
deleted file mode 100644
index 9f38608e8f..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_list/phone_filter.pipe.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// #docregion
-import { Pipe } from '@angular/core';
-import { Phone } from '../core/phones.service';
-
-@Pipe({name: 'phoneFilter'})
-export default class PhoneFilterPipe {
-
-  transform(input:Phone[], query:string = ''): Phone[] {
-    if (input) {
-      query = query.toLowerCase();
-      return input.filter((phone) => {
-        const name = phone.name.toLowerCase();
-        const snippet = phone.snippet.toLowerCase();
-        return name.indexOf(query) >= 0 || snippet.indexOf(query) >= 0;
-      });
-    } else {
-      return input;
-    }
-  }
-
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_list/phone_list.component.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_list/phone_list.component.ts
deleted file mode 100644
index f87aa62efc..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/js/phone_list/phone_list.component.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-// #docregion full
-// #docregion top
-import { Component } from '@angular/core';
-import { RouterLink } from '@angular/router-deprecated';
-import { Observable } from 'rxjs';
-
-import { Phones, Phone } from '../core/phones.service';
-import PhoneFilterPipe from './phone_filter.pipe';
-import OrderByPipe from './order_by.pipe';
-
-@Component({
-  selector: 'pc-phone-list',
-  templateUrl: 'js/phone_list/phone_list.html',
-  pipes: [PhoneFilterPipe, OrderByPipe],
-  directives: [RouterLink]
-})
-class PhoneList {
-// #enddocregion top
-
-  phones:Observable<Phone[]>;
-  orderProp:string;
-  query:string;
-  constructor(phones:Phones) {
-    this.phones = phones.query();
-    this.orderProp = 'age';
-  }
-}
-
-export default PhoneList;
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/systemjs.config.js b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/systemjs.config.js
deleted file mode 100644
index d7510ce7c6..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/app/systemjs.config.js
+++ /dev/null
@@ -1,28 +0,0 @@
-(function(global) {
-
-// Use global packagePath if defined
-var pkgPath =  global.packagePath || '../node_modules/'; // path to packages
-System.config({
-  map: {
-    'rxjs':                       pkgPath + 'rxjs',
-    '@angular':                   pkgPath + '@angular'
-  },
-  packages: {
-    'js':                                { defaultExtension: 'js' },
-
-    '@angular/common':                   { main: 'index.js', defaultExtension: 'js' },
-    '@angular/compiler':                 { main: 'index.js', defaultExtension: 'js' },
-    '@angular/core':                     { main: 'index.js', defaultExtension: 'js' },
-    '@angular/http':                     { main: 'index.js', defaultExtension: 'js' },
-    '@angular/platform-browser':         { main: 'index.js', defaultExtension: 'js' },
-    '@angular/platform-browser-dynamic': { main: 'index.js', defaultExtension: 'js' },
-    '@angular/router':                   { main: 'index.js', defaultExtension: 'js' },
-    '@angular/router-deprecated':        { main: 'index.js', defaultExtension: 'js' },
-    '@angular/upgrade':                  { main: 'index.js', defaultExtension: 'js' },
-    'rxjs':                              { defaultExtension: 'js' }
-
-  }
-});
-
-
-})(this);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/bower.json b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/bower.json
deleted file mode 100644
index 0179178b02..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/bower.json
+++ /dev/null
@@ -1,20 +0,0 @@
-{
-  "name": "angular-phonecat",
-  "description": "A starter project for AngularJS",
-  "version": "0.0.0",
-  "homepage": "https://github.com/angular/angular-phonecat",
-  "license": "MIT",
-  "private": true,
-  "dependencies": {
-    "angular": "1.5.3",
-    "angular-mocks": "1.5.3",
-    "jquery": "~2.1.1",
-    "bootstrap": "~3.1.1",
-    "angular-route": "1.5.3",
-    "angular-resource": "1.5.3",
-    "angular-animate": "1.5.3"
-  },
-  "resolutions": {
-    "angular": "1.5.3"
-  }
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/package.1.json b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/package.1.json
deleted file mode 100644
index 6dcaa62cbd..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/package.1.json
+++ /dev/null
@@ -1,55 +0,0 @@
-{
-  "version": "0.0.0",
-  "private": true,
-  "name": "angular-phonecat",
-  "description": "A tutorial application for AngularJS",
-  "repository": "https://github.com/angular/angular-phonecat",
-  "license": "MIT",
-  "dependencies": {
-    "@angular/common":  "2.0.0-rc.1",
-    "@angular/compiler":  "2.0.0-rc.1",
-    "@angular/core":  "2.0.0-rc.1",
-    "@angular/http":  "2.0.0-rc.1",
-    "@angular/platform-browser":  "2.0.0-rc.1",
-    "@angular/platform-browser-dynamic":  "2.0.0-rc.1",
-    "@angular/router":  "2.0.0-rc.1",
-    "@angular/router-deprecated":  "2.0.0-rc.1",
-    "@angular/upgrade":  "2.0.0-rc.1",
-
-    "core-js": "^2.4.0",
-    "reflect-metadata": "0.1.3",
-    "rxjs": "5.0.0-beta.6",
-    "zone.js": "0.6.12",
-    "systemjs": "0.19.26"
-  },
-  "devDependencies": {
-    "karma": "^0.13.22",
-    "karma-chrome-launcher": "^0.1.4",
-    "karma-firefox-launcher": "^0.1.3",
-    "karma-jasmine": "~0.3.7",
-    "protractor": "^3.0.0",
-    "http-server": "^0.6.1",
-    "tmp": "0.0.23",
-    "bower": "^1.3.1",
-    "shelljs": "^0.2.6",
-    "typescript": "1.8.10",
-    "typings": "^0.7.12"
-  },
-  "scripts": {
-    "postinstall": "bower install",
-
-    "start": "http-server -a 0.0.0.0 -p 8000",
-
-    "test": "node node_modules/karma/bin/karma start test/karma.conf.js",
-    "test-single-run": "node node_modules/karma/bin/karma start test/karma.conf.js  --single-run",
-
-    "preupdate-webdriver": "npm install",
-    "update-webdriver": "webdriver-manager update",
-
-    "preprotractor": "npm run update-webdriver",
-    "protractor": "protractor test/protractor-conf.js",
-
-    "typings": "typings",
-    "tsc": "tsc -p . -w"
-  }
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/e2e/scenarios.js b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/e2e/scenarios.js
deleted file mode 100644
index 2e4b884563..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/e2e/scenarios.js
+++ /dev/null
@@ -1,114 +0,0 @@
-'use strict';
-
-/* http://docs.angularjs.org/guide/dev_guide.e2e-testing */
-
-describe('PhoneCat App', function() {
-
-  // #docregion redirect
-  it('should redirect index.html to index.html#/phones', function() {
-    browser.get('app/index.html');
-    browser.waitForAngular();
-    browser.getCurrentUrl().then(function(url) {
-      expect(url.endsWith('/phones')).toBe(true);
-    });
-  });
-  // #enddocregion redirect
-
-  describe('Phone list view', function() {
-
-    beforeEach(function() {
-      browser.get('app/index.html#/phones');
-    });
-
-    it('should filter the phone list as a user types into the search box', function() {
-      var phoneList = element.all(by.css('.phones li'));
-      var query = element(by.css('input'));
-
-      expect(phoneList.count()).toBe(20);
-
-      query.sendKeys('nexus');
-      expect(phoneList.count()).toBe(1);
-
-      query.clear();
-      // https://github.com/angular/protractor/issues/2019
-      var str = 'motorola';
-      for (var i = 0; i < str.length; i++) {
-        query.sendKeys(str.charAt(i));
-      }
-
-      expect(phoneList.count()).toBe(8);
-    });
-
-
-    it('should be possible to control phone order via the drop down select box', function() {
-      var phoneNameColumn = element.all(by.css('.phones .name'));
-      var query = element(by.css('input'));
-
-      function getNames() {
-        return phoneNameColumn.map(function(elm) {
-          return elm.getText();
-        });
-      }
-
-      //let's narrow the dataset to make the test assertions shorter
-      // https://github.com/angular/protractor/issues/2019
-      var str = 'tablet';
-      for (var i = 0; i < str.length; i++) {
-        query.sendKeys(str.charAt(i));
-      }
-
-      expect(getNames()).toEqual([
-        "Motorola XOOM\u2122 with Wi-Fi",
-        "MOTOROLA XOOM\u2122"
-      ]);
-
-      element(by.css('select')).element(by.css('option[value="name"]')).click();
-      expect(getNames()).toEqual([
-        "MOTOROLA XOOM\u2122",
-        "Motorola XOOM\u2122 with Wi-Fi"
-      ]);
-    });
-
-
-    // #docregion links
-    it('should render phone specific links', function() {
-      var query = element(by.css('input'));
-      // https://github.com/angular/protractor/issues/2019
-      var str = 'nexus';
-      for (var i = 0; i < str.length; i++) {
-        query.sendKeys(str.charAt(i));
-      }
-      element.all(by.css('.phones li a')).first().click();
-      browser.getCurrentUrl().then(function(url) {
-        expect(url.endsWith('/phones/nexus-s')).toBe(true);
-      });
-    });
-  });
-  // #enddocregion links
-
-  describe('Phone detail view', function() {
-
-    beforeEach(function() {
-      browser.get('app/index.html#/phones/nexus-s');
-    });
-
-
-    it('should display nexus-s page', function() {
-      expect(element(by.css('h1')).getText()).toBe('Nexus S');
-    });
-
-
-    it('should display the first phone image as the main phone image', function() {
-      expect(element(by.css('img.phone.active')).getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/);
-    });
-
-
-    it('should swap main image if a thumbnail image is clicked on', function() {
-      element(by.css('.phone-thumbs li:nth-of-type(3) img')).click();
-      expect(element(by.css('img.phone.active')).getAttribute('src')).toMatch(/img\/phones\/nexus-s.2.jpg/);
-
-      element(by.css('.phone-thumbs li:nth-of-type(1) img')).click();
-      expect(element(by.css('img.phone.active')).getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/);
-    });
-  });
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/karma.conf.1.js b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/karma.conf.1.js
deleted file mode 100644
index 2a616cf55d..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/karma.conf.1.js
+++ /dev/null
@@ -1,46 +0,0 @@
-// #docregion
-module.exports = function(config){
-  config.set({
-
-    basePath : '..',
-
-    files : [
-      'node_modules/systemjs/dist/system-polyfills.js',
-      'node_modules/core-js/client/shim.min.js',
-      'node_modules/zone.js/dist/zone.js',
-      'node_modules/reflect-metadata/Reflect.js',
-      'node_modules/systemjs/dist/system.src.js',
-      {pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false},
-      {pattern: 'node_modules/@angular/**/*.js', included: false, watched: false},
-      'test/karma_test_shim.js',
-      {pattern: 'app/js/**/*.js', included: false, watched: true},
-      {pattern: 'test/unit/**/*.js', included: false, watched: true},
-      // #docregion html
-      {pattern: 'app/js/**/*.html', included: false, watched: true}
-    ],
-
-    proxies: {
-      // required for component assests fetched by Angular's compiler
-      "/js": "/base/app/js"
-    },
-    // #enddocregion html
-
-    autoWatch : true,
-
-    frameworks: ['jasmine'],
-
-    browsers : ['Chrome', 'Firefox'],
-
-    plugins : [
-      'karma-chrome-launcher',
-      'karma-firefox-launcher',
-      'karma-jasmine'
-    ],
-
-    junitReporter : {
-      outputFile: 'test_out/unit.xml',
-      suite: 'unit'
-    }
-
-  });
-};
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/karma_test_shim.js b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/karma_test_shim.js
deleted file mode 100644
index 26075e973d..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/karma_test_shim.js
+++ /dev/null
@@ -1,65 +0,0 @@
-// #docregion
-// Cancel Karma's synchronous start,
-// we will call `__karma__.start()` later, once all the specs are loaded.
-__karma__.loaded = function() {};
-
-System.config({
-  map: {
-    'rxjs': 'base/node_modules/rxjs',
-    '@angular': 'base/node_modules/@angular'
-  },
-  packages: {
-    'base/app/js': {
-      defaultExtension: false,
-      format: 'register',
-      map: Object.keys(window.__karma__.files).
-            filter(onlyAppFiles).
-            reduce(function createPathRecords(pathsMapping, appPath) {
-              // creates local module name mapping to global path with karma's fingerprint in path, e.g.:
-              // './hero.service': '/base/src/app/hero.service.js?f4523daf879cfb7310ef6242682ccf10b2041b3e'
-              var moduleName = appPath.replace(/^\/base\/app\/js\//, './').replace(/\.js$/, '');
-              pathsMapping[moduleName] = appPath + '?' + window.__karma__.files[appPath]
-              return pathsMapping;
-            }, {})
-    },
-    '@angular/common':                   { main: 'index.js', defaultExtension: 'js' },
-    '@angular/compiler':                 { main: 'index.js', defaultExtension: 'js' },
-    '@angular/core':                     { main: 'index.js', defaultExtension: 'js' },
-    '@angular/http':                     { main: 'index.js', defaultExtension: 'js' },
-    '@angular/platform-browser':         { main: 'index.js', defaultExtension: 'js' },
-    '@angular/platform-browser-dynamic': { main: 'index.js', defaultExtension: 'js' },
-    '@angular/router':                   { main: 'index.js', defaultExtension: 'js' },
-    '@angular/router-deprecated':        { main: 'index.js', defaultExtension: 'js' },
-    '@angular/upgrade':                  { main: 'index.js', defaultExtension: 'js' },
-    'rxjs':                              { defaultExtension: 'js' }
-  }
-});
-
-// #docregion ng2
-System.import('@angular/core/testing').then(function(testing) {
-  return System.import('@angular/platform-browser-dynamic/testing').then(function(browserTesting) {
-    testing.setBaseTestProviders(browserTesting.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
-                                 browserTesting.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS);
-  });
-}).then(function() {
-  return Promise.all(
-    Object.keys(window.__karma__.files) // All files served by Karma.
-    .filter(onlySpecFiles)
-    .map(function(moduleName) {
-      // loads all spec files via their global module names
-      return System.import(moduleName);
-  }));
-}).then(function() {
-  __karma__.start();
-}, function(error) {
-  __karma__.error(error.stack || error);
-});
-// #enddocregion ng2
-
-function onlyAppFiles(filePath) {
-  return /^\/base\/app\/js\/.*\.js$/.test(filePath)
-}
-
-function onlySpecFiles(path) {
-  return /\.spec\.js$/.test(path);
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/protractor-conf.js b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/protractor-conf.js
deleted file mode 100644
index a1ea324632..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/protractor-conf.js
+++ /dev/null
@@ -1,25 +0,0 @@
-exports.config = {
-  allScriptsTimeout: 11000,
-
-  specs: [
-    'e2e/*.js'
-  ],
-
-  capabilities: {
-    'browserName': 'chrome'
-  },
-
-  directConnect: true,
-
-  baseUrl: 'http://localhost:8000/',
-
-  framework: 'jasmine',
-
-  jasmineNodeOpts: {
-    defaultTimeoutInterval: 30000
-  },
-
-  // #docregion ng2
-  useAllAngular2AppRoots: true
-  // #enddocregion ng2
-};
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/checkmark.pipe.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/checkmark.pipe.spec.ts
deleted file mode 100644
index c9a1def071..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/checkmark.pipe.spec.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-// #docregion
-import { describe, beforeEachProviders, it, inject, expect } from '@angular/core/testing';
-
-import { CheckmarkPipe } from '../../app/js/core/checkmark.pipe';
-
-describe('CheckmarkPipe', () => {
-
-  beforeEachProviders(() => [CheckmarkPipe]);
-
-  it('should convert boolean values to unicode checkmark or cross',
-      inject([CheckmarkPipe], (checkmarkPipe) => {
-    expect(checkmarkPipe.transform(true)).toBe('\u2713');
-    expect(checkmarkPipe.transform(false)).toBe('\u2718');
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/order_by.pipe.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/order_by.pipe.spec.ts
deleted file mode 100644
index 416ca0797b..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/order_by.pipe.spec.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-// #docregion
-import { describe, beforeEachProviders, it, inject } from '@angular/core/testing';
-
-import OrderByPipe from '../../app/js/phone_list/order_by.pipe';
-
-describe('OrderByPipe', () => {
-
-  let input:any[] = [
-    {name: 'Nexus S', snippet: 'The Nexus S Phone', images: []},
-    {name: 'Motorola DROID', snippet: 'An Android-for-business smartphone', images: []}
-  ];
-
-  beforeEachProviders(() => [OrderByPipe]);
-
-  it('should order by the given property', inject([OrderByPipe], (orderByPipe) => {
-    expect(orderByPipe.transform(input, 'name')).toEqual([input[1], input[0]]);
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/phone_filter.pipe.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/phone_filter.pipe.spec.ts
deleted file mode 100644
index 6de1e5722d..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/phone_filter.pipe.spec.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-// #docregion
-import { describe, beforeEachProviders, it, inject } from '@angular/core/testing';
-
-import PhoneFilterPipe from '../../app/js/phone_list/phone_filter.pipe';
-import { Phone } from '../../app/js/core/phones.service';
-
-describe('PhoneFilterPipe', () => {
-
-  let phones:Phone[] = [
-    {name: 'Nexus S', snippet: 'The Nexus S Phone', images: []},
-    {name: 'Motorola DROID', snippet: 'an Android-for-business smartphone', images: []}
-  ];
-
-  beforeEachProviders(() => [PhoneFilterPipe]);
-
-  it('should return input when no query', inject([PhoneFilterPipe], (phoneFilterPipe) => {
-    expect(phoneFilterPipe.transform(phones)).toEqual(phones);
-  }));
-
-  it('should match based on name', inject([PhoneFilterPipe], (phoneFilterPipe) => {
-    expect(phoneFilterPipe.transform(phones, 'nexus')).toEqual([phones[0]]);
-  }));
-
-  it('should match based on snippet', inject([PhoneFilterPipe], (phoneFilterPipe) => {
-    expect(phoneFilterPipe.transform(phones, 'android')).toEqual([phones[1]]);
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/phone_list.component.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/phone_list.component.spec.ts
deleted file mode 100644
index f2a294e0e0..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/phone_list.component.spec.ts
+++ /dev/null
@@ -1,65 +0,0 @@
-// #docregion
-import { provide, ApplicationRef } from '@angular/core';
-import { LocationStrategy, HashLocationStrategy } from '@angular/common';
-import { HTTP_PROVIDERS } from '@angular/http';
-import { ROUTER_PROVIDERS, ROUTER_PRIMARY_COMPONENT } from '@angular/router-deprecated';
-import { Observable } from 'rxjs/Rx';
-import {
-  describe,
-  beforeEachProviders,
-  inject,
-  it,
-  expect,
-  MockApplicationRef
-} from '@angular/core/testing';
-import { MockLocationStrategy } from '@angular/common/testing';
-import { TestComponentBuilder } from '@angular/compiler/testing';
-
-import AppComponent from '../../app/js/app.component';
-import PhoneList from '../../app/js/phone_list/phone_list.component';
-import { Phones, Phone } from '../../app/js/core/phones.service';
-
-class MockPhones extends Phones {
-  query():Observable<Phone[]> {
-    return Observable.of(
-      [{name: 'Nexus S', snippet: ''}, {name: 'Motorola DROID', snippet: ''}]
-    )
-  }
-}
-
-describe('PhoneList', () => {
-
-  beforeEachProviders(() => [
-    HTTP_PROVIDERS,
-    ROUTER_PROVIDERS,
-    provide(ApplicationRef, {useClass: MockApplicationRef}),
-    provide(ROUTER_PRIMARY_COMPONENT, {useValue: AppComponent}),
-    provide(LocationStrategy, {useClass: MockLocationStrategy}),
-    provide(Phones, {useClass: MockPhones})
-  ]);
-
-
-  it('should create "phones" model with 2 phones fetched from xhr',
-      inject([TestComponentBuilder], (tcb) => {
-    return tcb.createAsync(PhoneList).then((fixture) => {
-      fixture.detectChanges();
-
-      let compiled = fixture.debugElement.nativeElement;
-
-      expect(compiled.querySelectorAll('.phone-listing').length).toBe(2);
-      expect(compiled.querySelector('.phone-listing:nth-child(1)').textContent).toContain('Nexus S');
-      expect(compiled.querySelector('.phone-listing:nth-child(2)').textContent).toContain('Motorola DROID');
-    });
-  }));
-
-
-  it('should set the default value of orderProp model',
-      inject([TestComponentBuilder], (tcb) => {
-    return tcb.createAsync(PhoneList).then((fixture) => {
-      fixture.detectChanges();
-      let compiled = fixture.debugElement.nativeElement;
-      expect(compiled.querySelector('select option:last-child').selected).toBe(true);
-    });
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/phones.service.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/phones.service.spec.ts
deleted file mode 100644
index 8d3fc5270f..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/test/unit/phones.service.spec.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-// #docregion
-import { describe, beforeEachProviders, it, inject } from '@angular/core/testing';
-import { HTTP_PROVIDERS } from '@angular/http';
-import { Phones } from '../../app/js/core/phones.service';
-
-describe('Phones', () => {
-
-  // load providers
-  beforeEachProviders(() => [Phones, HTTP_PROVIDERS]);
-
-  // Test service availability
-  it('check the existence of Phones', inject([Phones], (phones) => {
-    expect(phones).toBeDefined();
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/tsconfig.1.json b/public/docs/_examples/upgrade-phonecat/ts/ng2_final/tsconfig.1.json
deleted file mode 100644
index eef7e2be89..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_final/tsconfig.1.json
+++ /dev/null
@@ -1,16 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES5",
-    "module": "system",
-    "moduleResolution": "node",
-    "sourceMap": true,
-    "emitDecoratorMetadata": true,
-    "experimentalDecorators": true,
-    "removeComments": false
-  },
-  "exclude": [
-    "node_modules",
-    "typings/main.d.ts",
-    "typings/main"
-  ]
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/.bowerrc b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/.bowerrc
deleted file mode 100644
index 5773025bf9..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/.bowerrc
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "directory": "app/bower_components"
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/.gitignore b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/.gitignore
deleted file mode 100644
index 63d5d99a52..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/.gitignore
+++ /dev/null
@@ -1,4 +0,0 @@
-app/**/*.js
-app/**/*.js.map
-test/unit/**/*.js
-test/unit/**/*.js.map
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/css/.gitkeep b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/css/.gitkeep
deleted file mode 100644
index e69de29bb2..0000000000
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/css/animations.css b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/css/animations.css
deleted file mode 100644
index 46f3da6ecb..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/css/animations.css
+++ /dev/null
@@ -1,97 +0,0 @@
-/*
- * animations css stylesheet
- */
-
-/* animate ngRepeat in phone listing */
-
-.phone-listing.ng-enter,
-.phone-listing.ng-leave,
-.phone-listing.ng-move {
-  -webkit-transition: 0.5s linear all;
-  -moz-transition: 0.5s linear all;
-  -o-transition: 0.5s linear all;
-  transition: 0.5s linear all;
-}
-
-.phone-listing.ng-enter,
-.phone-listing.ng-move {
-  opacity: 0;
-  height: 0;
-  overflow: hidden;
-}
-
-.phone-listing.ng-move.ng-move-active,
-.phone-listing.ng-enter.ng-enter-active {
-  opacity: 1;
-  height: 120px;
-}
-
-.phone-listing.ng-leave {
-  opacity: 1;
-  overflow: hidden;
-}
-
-.phone-listing.ng-leave.ng-leave-active {
-  opacity: 0;
-  height: 0;
-  padding-top: 0;
-  padding-bottom: 0;
-}
-
-/* cross fading between routes with ngView */
-
-.view-container {
-  position: relative;
-}
-
-.view-frame.ng-enter,
-.view-frame.ng-leave {
-  background: white;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-}
-
-.view-frame.ng-enter {
-  -webkit-animation: 0.5s fade-in;
-  -moz-animation: 0.5s fade-in;
-  -o-animation: 0.5s fade-in;
-  animation: 0.5s fade-in;
-  z-index: 100;
-}
-
-.view-frame.ng-leave {
-  -webkit-animation: 0.5s fade-out;
-  -moz-animation: 0.5s fade-out;
-  -o-animation: 0.5s fade-out;
-  animation: 0.5s fade-out;
-  z-index: 99;
-}
-
-@keyframes fade-in {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-@-moz-keyframes fade-in {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-@-webkit-keyframes fade-in {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-
-@keyframes fade-out {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-@-moz-keyframes fade-out {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-@-webkit-keyframes fade-out {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/img/.gitkeep b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/img/.gitkeep
deleted file mode 100644
index e69de29bb2..0000000000
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/img/glyphicons-halflings-white.png b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/img/glyphicons-halflings-white.png
deleted file mode 100644
index 3bf6484a29..0000000000
Binary files a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/img/glyphicons-halflings-white.png and /dev/null differ
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/img/glyphicons-halflings.png b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/img/glyphicons-halflings.png
deleted file mode 100644
index 5b67ffda5f..0000000000
Binary files a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/img/glyphicons-halflings.png and /dev/null differ
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/index.html b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/index.html
deleted file mode 100644
index 772d06f554..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/index.html
+++ /dev/null
@@ -1,37 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-  <meta charset="utf-8">
-  <title>Google Phone Gallery</title>
-  <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">
-  <link rel="stylesheet" href="css/app.css">
-  <link rel="stylesheet" href="css/animations.css">
-  <!-- #docregion scripts -->
-  <script src="../node_modules/systemjs/dist/system.src.js"></script>
-  <script src="bower_components/jquery/dist/jquery.js"></script>
-  <script src="bower_components/angular/angular.js"></script>
-  <script src="bower_components/angular-animate/angular-animate.js"></script>
-  <script src="bower_components/angular-route/angular-route.js"></script>
-  <script src="bower_components/angular-resource/angular-resource.js"></script>
-  <!-- #docregion ng2 -->
-  <script src="../node_modules/core-js/client/shim.min.js"></script>
-  <script src="../node_modules/zone.js/dist/zone.js"></script>
-  <script src="../node_modules/reflect-metadata/Reflect.js"></script>
-  <!-- #enddocregion ng2 -->
-  <script src="../node_modules/systemjs/dist/system.src.js"></script>
-  <script src="systemjs.config.js"></script>
-  <!-- #docregion systemconfig -->
-  <script>
-    System.import('js/app.module');
-  </script>
-  <!-- #enddocregion systemconfig -->
-  <!-- #enddocregion scripts -->
-</head>
-<body>
-
-  <div class="view-container">
-    <div ng-view class="view-frame"></div>
-  </div>
-
-</body>
-</html>
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/app.module.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/app.module.ts
deleted file mode 100644
index 974836e396..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/app.module.ts
+++ /dev/null
@@ -1,46 +0,0 @@
-// #docregion adapter-import
-import { UpgradeAdapter } from '@angular/upgrade';
-// #enddocregion adapter-import
-// #docregion adapter-state-import
-import upgradeAdapter from './core/upgrade_adapter';
-// #enddocregion adapter-state-import
-// #docregion http-import
-import { HTTP_PROVIDERS } from '@angular/http';
-// #enddocregion http-import
-import core from './core/core.module';
-import phoneList from './phone_list/phone_list.module';
-import phoneDetail from './phone_detail/phone_detail.module';
-
-// #docregion add-http-providers
-upgradeAdapter.addProvider(HTTP_PROVIDERS);
-// #enddocregion add-http-providers
-
-angular.module('phonecatApp', [
-  'ngRoute',
-  core.name,
-  phoneList.name,
-  phoneDetail.name
-]).config(configure);
-
-configure.$inject = ['$routeProvider'];
-
-function configure($routeProvider) {
-  $routeProvider.
-    when('/phones', {
-      templateUrl: 'js/phone_list/phone_list.html',
-      controller: 'PhoneListCtrl',
-      controllerAs: 'vm'
-    }).
-    when('/phones/:phoneId', {
-      templateUrl: 'js/phone_detail/phone_detail.html',
-      controller: 'PhoneDetailCtrl',
-      controllerAs: 'vm'
-    }).
-    otherwise({
-      redirectTo: '/phones'
-    });
-}
-
-// #docregion bootstrap
-upgradeAdapter.bootstrap(document.documentElement, ['phonecatApp']);
-// #enddocregion bootstrap
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/core/checkmark.filter.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/core/checkmark.filter.ts
deleted file mode 100644
index 84544b80a1..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/core/checkmark.filter.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-// #docregion
-export default function checkmarkFilter() {
-  return function(input:string):string {
-    return input ? '\u2713' : '\u2718';
-  };
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/core/core.module.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/core/core.module.ts
deleted file mode 100644
index e02e7dcf1a..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/core/core.module.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-// #docregion
-import { Phones } from './phones.service';
-import checkmarkFilter from './checkmark.filter';
-import upgradeAdapter from './upgrade_adapter';
-
-upgradeAdapter.addProvider(Phones);
-
-export default angular.module('phonecat.core', [])
-  .factory('phones', upgradeAdapter.downgradeNg2Provider(Phones))
-  .filter('checkmark', checkmarkFilter);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/core/upgrade_adapter.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/core/upgrade_adapter.ts
deleted file mode 100644
index f1ad63012a..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/core/upgrade_adapter.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-// #docregion full
-import { UpgradeAdapter } from '@angular/upgrade';
-
-// #docregion adapter-init
-const upgradeAdapter = new UpgradeAdapter();
-// #enddocregion adapter-init
-
-export default upgradeAdapter;
-// #enddocregion full
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_detail/phone_detail.controller.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_detail/phone_detail.controller.ts
deleted file mode 100644
index ef24ac5814..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_detail/phone_detail.controller.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-// #docregion
-import { Phones, Phone } from '../core/phones.service';
-
-interface PhoneRouteParams {
-  phoneId: string
-}
-
-class PhoneDetailCtrl {
-  phone:Phone;
-  mainImageUrl:string;
-  constructor($routeParams:PhoneRouteParams, phones:Phones) {
-    phones.get($routeParams.phoneId)
-      .subscribe(phone => {
-        this.phone = phone;
-        this.mainImageUrl = phone.images[0];
-      });
-  }
-  setImage(url:string) {
-    this.mainImageUrl = url;
-  }
-}
-
-PhoneDetailCtrl.$inject = ['$routeParams', 'phones'];
-
-export default PhoneDetailCtrl;
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_detail/phone_detail.html b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_detail/phone_detail.html
deleted file mode 100644
index 954c65c2cd..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_detail/phone_detail.html
+++ /dev/null
@@ -1,118 +0,0 @@
-<div class="phone-images">
-  <img ng-src="{{img}}"
-       class="phone"
-       ng-repeat="img in vm.phone.images"
-       ng-class="{active: vm.mainImageUrl==img}">
-</div>
-
-<h1>{{vm.phone.name}}</h1>
-
-<p>{{vm.phone.description}}</p>
-
-<ul class="phone-thumbs">
-  <li ng-repeat="img in vm.phone.images">
-    <img ng-src="{{img}}" ng-click="vm.setImage(img)">
-  </li>
-</ul>
-
-<ul class="specs">
-  <li>
-    <span>Availability and Networks</span>
-    <dl>
-      <dt>Availability</dt>
-      <dd ng-repeat="availability in vm.phone.availability">{{availability}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Battery</span>
-    <dl>
-      <dt>Type</dt>
-      <dd>{{vm.phone.battery.type}}</dd>
-      <dt>Talk Time</dt>
-      <dd>{{vm.phone.battery.talkTime}}</dd>
-      <dt>Standby time (max)</dt>
-      <dd>{{vm.phone.battery.standbyTime}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Storage and Memory</span>
-    <dl>
-      <dt>RAM</dt>
-      <dd>{{vm.phone.storage.ram}}</dd>
-      <dt>Internal Storage</dt>
-      <dd>{{vm.phone.storage.flash}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Connectivity</span>
-    <dl>
-      <dt>Network Support</dt>
-      <dd>{{vm.phone.connectivity.cell}}</dd>
-      <dt>WiFi</dt>
-      <dd>{{vm.phone.connectivity.wifi}}</dd>
-      <dt>Bluetooth</dt>
-      <dd>{{vm.phone.connectivity.bluetooth}}</dd>
-      <dt>Infrared</dt>
-      <dd>{{vm.phone.connectivity.infrared | checkmark}}</dd>
-      <dt>GPS</dt>
-      <dd>{{vm.phone.connectivity.gps | checkmark}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Android</span>
-    <dl>
-      <dt>OS Version</dt>
-      <dd>{{vm.phone.android.os}}</dd>
-      <dt>UI</dt>
-      <dd>{{vm.phone.android.ui}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Size and Weight</span>
-    <dl>
-      <dt>Dimensions</dt>
-      <dd ng-repeat="dim in vm.phone.sizeAndWeight.dimensions">{{dim}}</dd>
-      <dt>Weight</dt>
-      <dd>{{vm.phone.sizeAndWeight.weight}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Display</span>
-    <dl>
-      <dt>Screen size</dt>
-      <dd>{{vm.phone.display.screenSize}}</dd>
-      <dt>Screen resolution</dt>
-      <dd>{{vm.phone.display.screenResolution}}</dd>
-      <dt>Touch screen</dt>
-      <dd>{{vm.phone.display.touchScreen | checkmark}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Hardware</span>
-    <dl>
-      <dt>CPU</dt>
-      <dd>{{vm.phone.hardware.cpu}}</dd>
-      <dt>USB</dt>
-      <dd>{{vm.phone.hardware.usb}}</dd>
-      <dt>Audio / headphone jack</dt>
-      <dd>{{vm.phone.hardware.audioJack}}</dd>
-      <dt>FM Radio</dt>
-      <dd>{{vm.phone.hardware.fmRadio | checkmark}}</dd>
-      <dt>Accelerometer</dt>
-      <dd>{{vm.phone.hardware.accelerometer | checkmark}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Camera</span>
-    <dl>
-      <dt>Primary</dt>
-      <dd>{{vm.phone.camera.primary}}</dd>
-      <dt>Features</dt>
-      <dd>{{vm.phone.camera.features.join(', ')}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Additional Features</span>
-    <dd>{{vm.phone.additionalFeatures}}</dd>
-  </li>
-</ul>
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_detail/phone_detail.module.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_detail/phone_detail.module.ts
deleted file mode 100644
index 16e7ac0baf..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_detail/phone_detail.module.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-// #docregion
-import PhoneDetailCtrl from './phone_detail.controller';
-
-export default angular.module('phonecat.detail', [
-    'ngRoute',
-    'phonecat.core'
-  ])
-  .controller('PhoneDetailCtrl', PhoneDetailCtrl);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_list/phone_list.controller.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_list/phone_list.controller.ts
deleted file mode 100644
index ae4c39b0c9..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_list/phone_list.controller.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-// #docregion
-import { Phones, Phone } from '../core/phones.service';
-
-class PhoneListCtrl {
-  phones:Phone[];
-  orderProp:string;
-  query:string;
-  constructor(phones:Phones) {
-    phones.query()
-      .subscribe(phones => this.phones = phones);
-    this.orderProp = 'age';
-  }
-}
-
-PhoneListCtrl.$inject = ['phones'];
-
-export default PhoneListCtrl;
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_list/phone_list.html b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_list/phone_list.html
deleted file mode 100644
index 471f474e89..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_list/phone_list.html
+++ /dev/null
@@ -1,28 +0,0 @@
-<div class="container-fluid">
-  <div class="row">
-    <div class="col-md-2">
-      <!--Sidebar content-->
-
-      Search: <input ng-model="vm.query">
-      Sort by:
-      <select ng-model="vm.orderProp">
-        <option value="name">Alphabetical</option>
-        <option value="age">Newest</option>
-      </select>
-
-    </div>
-    <div class="col-md-10">
-      <!--Body content-->
-
-      <ul class="phones">
-        <li ng-repeat="phone in vm.phones | filter:vm.query | orderBy:vm.orderProp"
-            class="thumbnail phone-listing">
-          <a href="#/phones/{{phone.id}}" class="thumb"><img ng-src="{{phone.imageUrl}}"></a>
-          <a href="#/phones/{{phone.id}}">{{phone.name}}</a>
-          <p>{{phone.snippet}}</p>
-        </li>
-      </ul>
-
-    </div>
-  </div>
-</div>
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_list/phone_list.module.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_list/phone_list.module.ts
deleted file mode 100644
index d2e7200778..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/js/phone_list/phone_list.module.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-// #docregion
-import PhoneListCtrl from './phone_list.controller';
-
-export default angular.module('phonecat.list', [])
-  .controller('PhoneListCtrl', PhoneListCtrl);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/systemjs.config.js b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/systemjs.config.js
deleted file mode 100644
index 2b0b854f6a..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/app/systemjs.config.js
+++ /dev/null
@@ -1,29 +0,0 @@
-// #docregion
-(function(global) {
-
-// Use global packagePath if defined
-var pkgPath =  global.packagePath || '../node_modules/'; // path to packages
-System.config({
-  map: {
-    'rxjs':                       pkgPath + 'rxjs',
-    '@angular':                   pkgPath + '@angular'
-  },
-  packages: {
-    'js':                                { defaultExtension: 'js' },
-
-    '@angular/common':                   { main: 'index.js', defaultExtension: 'js' },
-    '@angular/compiler':                 { main: 'index.js', defaultExtension: 'js' },
-    '@angular/core':                     { main: 'index.js', defaultExtension: 'js' },
-    '@angular/http':                     { main: 'index.js', defaultExtension: 'js' },
-    '@angular/platform-browser':         { main: 'index.js', defaultExtension: 'js' },
-    '@angular/platform-browser-dynamic': { main: 'index.js', defaultExtension: 'js' },
-    '@angular/router':                   { main: 'index.js', defaultExtension: 'js' },
-    '@angular/router-deprecated':        { main: 'index.js', defaultExtension: 'js' },
-    '@angular/upgrade':                  { main: 'index.js', defaultExtension: 'js' },
-    'rxjs':                              { defaultExtension: 'js' }
-
-  }
-});
-
-
-})(this);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/bower.json b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/bower.json
deleted file mode 100644
index 0179178b02..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/bower.json
+++ /dev/null
@@ -1,20 +0,0 @@
-{
-  "name": "angular-phonecat",
-  "description": "A starter project for AngularJS",
-  "version": "0.0.0",
-  "homepage": "https://github.com/angular/angular-phonecat",
-  "license": "MIT",
-  "private": true,
-  "dependencies": {
-    "angular": "1.5.3",
-    "angular-mocks": "1.5.3",
-    "jquery": "~2.1.1",
-    "bootstrap": "~3.1.1",
-    "angular-route": "1.5.3",
-    "angular-resource": "1.5.3",
-    "angular-animate": "1.5.3"
-  },
-  "resolutions": {
-    "angular": "1.5.3"
-  }
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/package.1.json b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/package.1.json
deleted file mode 100644
index 8b44d8c13c..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/package.1.json
+++ /dev/null
@@ -1,56 +0,0 @@
-{
-  "version": "0.0.0",
-  "private": true,
-  "name": "angular-phonecat",
-  "description": "A tutorial application for AngularJS",
-  "repository": "https://github.com/angular/angular-phonecat",
-  "license": "MIT",
-  "dependencies": {
-    "@angular/common":  "2.0.0-rc.1",
-    "@angular/compiler":  "2.0.0-rc.1",
-    "@angular/core":  "2.0.0-rc.1",
-    "@angular/http":  "2.0.0-rc.1",
-    "@angular/platform-browser":  "2.0.0-rc.1",
-    "@angular/platform-browser-dynamic":  "2.0.0-rc.1",
-    "@angular/router":  "2.0.0-rc.1",
-    "@angular/router-deprecated":  "2.0.0-rc.1",
-    "@angular/upgrade":  "2.0.0-rc.1",
-
-    "core-js": "^2.4.0",
-    "reflect-metadata": "0.1.3",
-    "rxjs": "5.0.0-beta.6",
-    "zone.js": "0.6.12",
-    "systemjs": "0.19.26"
-  },
-  "devDependencies": {
-    "karma": "^0.13.22",
-    "karma-chrome-launcher": "^0.1.4",
-    "karma-firefox-launcher": "^0.1.3",
-    "karma-jasmine": "~0.3.7",
-    "protractor": "^3.0.0",
-    "http-server": "^0.6.1",
-    "tmp": "0.0.23",
-    "bower": "^1.3.1",
-    "shelljs": "^0.2.6",
-    "typescript": "1.8.10",
-    "typings": "^0.7.12"
-  },
-  "scripts": {
-    "postinstall": "bower install",
-
-    "prestart": "npm install",
-    "start": "http-server -a 0.0.0.0 -p 8000",
-
-    "test": "node node_modules/karma/bin/karma start test/karma.conf.js",
-    "test-single-run": "node node_modules/karma/bin/karma start test/karma.conf.js  --single-run",
-
-    "preupdate-webdriver": "npm install",
-    "update-webdriver": "webdriver-manager update",
-
-    "preprotractor": "npm run update-webdriver",
-    "protractor": "protractor test/protractor-conf.js",
-
-    "typings": "typings",
-    "tsc": "tsc -p . -w"
-  }
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/e2e/scenarios.js b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/e2e/scenarios.js
deleted file mode 100644
index f20d0a294c..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/e2e/scenarios.js
+++ /dev/null
@@ -1,99 +0,0 @@
-'use strict';
-
-/* http://docs.angularjs.org/guide/dev_guide.e2e-testing */
-
-describe('PhoneCat App', function() {
-
-  it('should redirect index.html to index.html#/phones', function() {
-    browser.get('app/index.html');
-    browser.getLocationAbsUrl().then(function(url) {
-        expect(url).toEqual('/phones');
-      });
-  });
-
-
-  describe('Phone list view', function() {
-
-    beforeEach(function() {
-      browser.get('app/index.html#/phones');
-    });
-
-    it('should filter the phone list as a user types into the search box', function() {
-      var phoneList = element.all(by.repeater('phone in vm.phones'));
-      var query = element(by.model('vm.query'));
-
-      expect(phoneList.count()).toBe(20);
-
-      query.sendKeys('nexus');
-      expect(phoneList.count()).toBe(1);
-
-      query.clear();
-      query.sendKeys('motorola');
-      expect(phoneList.count()).toBe(8);
-    });
-
-
-    it('should be possible to control phone order via the drop down select box', function() {
-
-      var phoneNameColumn = element.all(by.repeater('phone in vm.phones').column(0));
-      var query = element(by.model('vm.query'));
-
-      function getNames() {
-        return phoneNameColumn.map(function(elm) {
-          return elm.getText();
-        });
-      }
-
-      query.sendKeys('tablet'); //let's narrow the dataset to make the test assertions shorter
-
-      expect(getNames()).toEqual([
-        "Motorola XOOM\u2122 with Wi-Fi",
-        "MOTOROLA XOOM\u2122"
-      ]);
-
-      element(by.model('vm.orderProp')).element(by.css('option[value="name"]')).click();
-
-      expect(getNames()).toEqual([
-        "MOTOROLA XOOM\u2122",
-        "Motorola XOOM\u2122 with Wi-Fi"
-      ]);
-    });
-
-
-    it('should render phone specific links', function() {
-      var query = element(by.model('vm.query'));
-      query.sendKeys('nexus');
-      element.all(by.css('.phones li a')).first().click();
-      browser.getLocationAbsUrl().then(function(url) {
-        expect(url).toEqual('/phones/nexus-s');
-      });
-    });
-  });
-
-
-  describe('Phone detail view', function() {
-
-    beforeEach(function() {
-      browser.get('app/index.html#/phones/nexus-s');
-    });
-
-
-    it('should display nexus-s page', function() {
-      expect(element(by.binding('vm.phone.name')).getText()).toBe('Nexus S');
-    });
-
-
-    it('should display the first phone image as the main phone image', function() {
-      expect(element(by.css('img.phone.active')).getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/);
-    });
-
-
-    it('should swap main image if a thumbnail image is clicked on', function() {
-      element(by.css('.phone-thumbs li:nth-child(3) img')).click();
-      expect(element(by.css('img.phone.active')).getAttribute('src')).toMatch(/img\/phones\/nexus-s.2.jpg/);
-
-      element(by.css('.phone-thumbs li:nth-child(1) img')).click();
-      expect(element(by.css('img.phone.active')).getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/);
-    });
-  });
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/karma.conf.1.js b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/karma.conf.1.js
deleted file mode 100644
index f4db40c3ab..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/karma.conf.1.js
+++ /dev/null
@@ -1,48 +0,0 @@
-module.exports = function(config){
-  config.set({
-
-    basePath : '..',
-
-    // #docregion ng2
-    files : [
-    // #enddocregion ng2
-      'app/bower_components/angular/angular.js',
-      'app/bower_components/angular-route/angular-route.js',
-      'app/bower_components/angular-resource/angular-resource.js',
-      'app/bower_components/angular-animate/angular-animate.js',
-      'app/bower_components/angular-mocks/angular-mocks.js',
-      'node_modules/systemjs/dist/system-polyfills.js',
-      'node_modules/systemjs/dist/system.src.js',
-      // #docregion ng2
-      'node_modules/core-js/client/shim.min.js',
-      'node_modules/zone.js/dist/zone.js',
-      'node_modules/reflect-metadata/Reflect.js',
-      {pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false},
-      {pattern: 'node_modules/@angular/**/*.js', included: false, watched: false},
-      // #enddocregion ng2
-      'test/karma_test_shim.js',
-      {pattern: 'app/js/**/*.js', included: false, watched: true},
-      {pattern: 'test/unit/**/*.js', included: false, watched: true}
-    // #docregion ng2
-    ],
-    // #enddocregion ng2
-
-    autoWatch : true,
-
-    frameworks: ['jasmine'],
-
-    browsers : ['Chrome', 'Firefox'],
-
-    plugins : [
-      'karma-chrome-launcher',
-      'karma-firefox-launcher',
-      'karma-jasmine'
-    ],
-
-    junitReporter : {
-      outputFile: 'test_out/unit.xml',
-      suite: 'unit'
-    }
-
-  });
-};
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/karma_test_shim.js b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/karma_test_shim.js
deleted file mode 100644
index 26075e973d..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/karma_test_shim.js
+++ /dev/null
@@ -1,65 +0,0 @@
-// #docregion
-// Cancel Karma's synchronous start,
-// we will call `__karma__.start()` later, once all the specs are loaded.
-__karma__.loaded = function() {};
-
-System.config({
-  map: {
-    'rxjs': 'base/node_modules/rxjs',
-    '@angular': 'base/node_modules/@angular'
-  },
-  packages: {
-    'base/app/js': {
-      defaultExtension: false,
-      format: 'register',
-      map: Object.keys(window.__karma__.files).
-            filter(onlyAppFiles).
-            reduce(function createPathRecords(pathsMapping, appPath) {
-              // creates local module name mapping to global path with karma's fingerprint in path, e.g.:
-              // './hero.service': '/base/src/app/hero.service.js?f4523daf879cfb7310ef6242682ccf10b2041b3e'
-              var moduleName = appPath.replace(/^\/base\/app\/js\//, './').replace(/\.js$/, '');
-              pathsMapping[moduleName] = appPath + '?' + window.__karma__.files[appPath]
-              return pathsMapping;
-            }, {})
-    },
-    '@angular/common':                   { main: 'index.js', defaultExtension: 'js' },
-    '@angular/compiler':                 { main: 'index.js', defaultExtension: 'js' },
-    '@angular/core':                     { main: 'index.js', defaultExtension: 'js' },
-    '@angular/http':                     { main: 'index.js', defaultExtension: 'js' },
-    '@angular/platform-browser':         { main: 'index.js', defaultExtension: 'js' },
-    '@angular/platform-browser-dynamic': { main: 'index.js', defaultExtension: 'js' },
-    '@angular/router':                   { main: 'index.js', defaultExtension: 'js' },
-    '@angular/router-deprecated':        { main: 'index.js', defaultExtension: 'js' },
-    '@angular/upgrade':                  { main: 'index.js', defaultExtension: 'js' },
-    'rxjs':                              { defaultExtension: 'js' }
-  }
-});
-
-// #docregion ng2
-System.import('@angular/core/testing').then(function(testing) {
-  return System.import('@angular/platform-browser-dynamic/testing').then(function(browserTesting) {
-    testing.setBaseTestProviders(browserTesting.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
-                                 browserTesting.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS);
-  });
-}).then(function() {
-  return Promise.all(
-    Object.keys(window.__karma__.files) // All files served by Karma.
-    .filter(onlySpecFiles)
-    .map(function(moduleName) {
-      // loads all spec files via their global module names
-      return System.import(moduleName);
-  }));
-}).then(function() {
-  __karma__.start();
-}, function(error) {
-  __karma__.error(error.stack || error);
-});
-// #enddocregion ng2
-
-function onlyAppFiles(filePath) {
-  return /^\/base\/app\/js\/.*\.js$/.test(filePath)
-}
-
-function onlySpecFiles(path) {
-  return /\.spec\.js$/.test(path);
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/protractor-conf.js b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/protractor-conf.js
deleted file mode 100644
index 118c7b9ec2..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/protractor-conf.js
+++ /dev/null
@@ -1,21 +0,0 @@
-exports.config = {
-  allScriptsTimeout: 11000,
-
-  specs: [
-    'e2e/*.js'
-  ],
-
-  capabilities: {
-    'browserName': 'chrome'
-  },
-
-  chromeOnly: true,
-
-  baseUrl: 'http://localhost:8000/',
-
-  framework: 'jasmine',
-
-  jasmineNodeOpts: {
-    defaultTimeoutInterval: 30000
-  }
-};
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/unit/checkmark.filter.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/unit/checkmark.filter.spec.ts
deleted file mode 100644
index bae35e6875..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/unit/checkmark.filter.spec.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-// #docregion top
-import '../../app/js/core/core.module';
-// #enddocregion top
-
-describe('checkmarkFilter', function() {
-
-  beforeEach(angular.mock.module('phonecat.core'));
-
-  it('should convert boolean values to unicode checkmark or cross',
-      inject(function(checkmarkFilter) {
-    expect(checkmarkFilter(true)).toBe('\u2713');
-    expect(checkmarkFilter(false)).toBe('\u2718');
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/unit/phone_detail.controller.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/unit/phone_detail.controller.spec.ts
deleted file mode 100644
index b28fc2d8c4..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/unit/phone_detail.controller.spec.ts
+++ /dev/null
@@ -1,41 +0,0 @@
-// #docregion
-import { Observable } from 'rxjs/Rx';
-import '../../app/js/phone_detail/phone_detail.module';
-import { Phones } from '../../app/js/core/phones.service';
-
-describe('PhoneDetailCtrl', () => {
-  var scope, phones, $controller,
-      xyzPhoneData = function() {
-        return {
-          name: 'phone xyz',
-          snippet: '',
-          images: ['image/url1.png', 'image/url2.png']
-        }
-      };
-
-  beforeEach(angular.mock.module('phonecat.detail'));
-
-  // Supply a hand-instantianted instance of the Phones service
-  beforeEach(angular.mock.module(function($provide) {
-    $provide.factory('phones', function() {
-      return new Phones(null);
-    });
-  }));
-
-  beforeEach(inject(function(_phones_, _$controller_, $rootScope, $routeParams) {
-    phones = _phones_;
-    $controller = _$controller_;
-    $routeParams.phoneId = 'xyz';
-    scope = $rootScope.$new();
-  }));
-
-
-  it('should fetch phone detail', function() {
-    spyOn(phones, 'get').and.returnValue(Observable.of(xyzPhoneData()));
-
-    let ctrl = $controller('PhoneDetailCtrl', {$scope: scope});
-
-    expect(phones.get).toHaveBeenCalledWith('xyz');
-    expect(ctrl.phone).toEqual(xyzPhoneData());
-  });
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/unit/phone_list.controller.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/unit/phone_list.controller.spec.ts
deleted file mode 100644
index 3df1418d9a..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/unit/phone_list.controller.spec.ts
+++ /dev/null
@@ -1,36 +0,0 @@
-// #docregion
-import { Observable } from 'rxjs/Rx';
-import '../../app/js/phone_list/phone_list.module';
-import { Phones } from '../../app/js/core/phones.service';
-
-describe('PhoneListCtrl', () => {
-  var scope, ctrl, $httpBackend;
-
-  beforeEach(angular.mock.module('phonecat.list'));
-
-  // Supply a hand-instantianted instance of the Phones service
-  beforeEach(angular.mock.module(function($provide) {
-    $provide.factory('phones', function() {
-      return new Phones(null);
-    });
-  }));
-
-  beforeEach(inject(function(phones, $rootScope, $controller) {
-    spyOn(phones, 'query').and.returnValue(Observable.of(
-      [{name: 'Nexus S'}, {name: 'Motorola DROID'}]
-    ));
-    scope = $rootScope.$new();
-    ctrl = $controller('PhoneListCtrl', {$scope: scope});
-  }));
-
-
-  it('should create "phones" model with 2 phones fetched from xhr', function() {
-    expect(ctrl.phones).toEqual(
-        [{name: 'Nexus S'}, {name: 'Motorola DROID'}]);
-  });
-
-
-  it('should set the default value of orderProp model', function() {
-    expect(ctrl.orderProp).toBe('age');
-  });
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/unit/phones.service.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/unit/phones.service.spec.ts
deleted file mode 100644
index 8d3fc5270f..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/test/unit/phones.service.spec.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-// #docregion
-import { describe, beforeEachProviders, it, inject } from '@angular/core/testing';
-import { HTTP_PROVIDERS } from '@angular/http';
-import { Phones } from '../../app/js/core/phones.service';
-
-describe('Phones', () => {
-
-  // load providers
-  beforeEachProviders(() => [Phones, HTTP_PROVIDERS]);
-
-  // Test service availability
-  it('check the existence of Phones', inject([Phones], (phones) => {
-    expect(phones).toBeDefined();
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/tsconfig.1.json b/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/tsconfig.1.json
deleted file mode 100644
index eef7e2be89..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/ng2_initial/tsconfig.1.json
+++ /dev/null
@@ -1,16 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES5",
-    "module": "system",
-    "moduleResolution": "node",
-    "sourceMap": true,
-    "emitDecoratorMetadata": true,
-    "experimentalDecorators": true,
-    "removeComments": false
-  },
-  "exclude": [
-    "node_modules",
-    "typings/main.d.ts",
-    "typings/main"
-  ]
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/.bowerrc b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/.bowerrc
deleted file mode 100644
index 5773025bf9..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/.bowerrc
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "directory": "app/bower_components"
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/.gitignore b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/.gitignore
deleted file mode 100644
index 63d5d99a52..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/.gitignore
+++ /dev/null
@@ -1,4 +0,0 @@
-app/**/*.js
-app/**/*.js.map
-test/unit/**/*.js
-test/unit/**/*.js.map
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/css/.gitkeep b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/css/.gitkeep
deleted file mode 100644
index e69de29bb2..0000000000
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/css/animations.css b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/css/animations.css
deleted file mode 100644
index 46f3da6ecb..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/css/animations.css
+++ /dev/null
@@ -1,97 +0,0 @@
-/*
- * animations css stylesheet
- */
-
-/* animate ngRepeat in phone listing */
-
-.phone-listing.ng-enter,
-.phone-listing.ng-leave,
-.phone-listing.ng-move {
-  -webkit-transition: 0.5s linear all;
-  -moz-transition: 0.5s linear all;
-  -o-transition: 0.5s linear all;
-  transition: 0.5s linear all;
-}
-
-.phone-listing.ng-enter,
-.phone-listing.ng-move {
-  opacity: 0;
-  height: 0;
-  overflow: hidden;
-}
-
-.phone-listing.ng-move.ng-move-active,
-.phone-listing.ng-enter.ng-enter-active {
-  opacity: 1;
-  height: 120px;
-}
-
-.phone-listing.ng-leave {
-  opacity: 1;
-  overflow: hidden;
-}
-
-.phone-listing.ng-leave.ng-leave-active {
-  opacity: 0;
-  height: 0;
-  padding-top: 0;
-  padding-bottom: 0;
-}
-
-/* cross fading between routes with ngView */
-
-.view-container {
-  position: relative;
-}
-
-.view-frame.ng-enter,
-.view-frame.ng-leave {
-  background: white;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-}
-
-.view-frame.ng-enter {
-  -webkit-animation: 0.5s fade-in;
-  -moz-animation: 0.5s fade-in;
-  -o-animation: 0.5s fade-in;
-  animation: 0.5s fade-in;
-  z-index: 100;
-}
-
-.view-frame.ng-leave {
-  -webkit-animation: 0.5s fade-out;
-  -moz-animation: 0.5s fade-out;
-  -o-animation: 0.5s fade-out;
-  animation: 0.5s fade-out;
-  z-index: 99;
-}
-
-@keyframes fade-in {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-@-moz-keyframes fade-in {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-@-webkit-keyframes fade-in {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-
-@keyframes fade-out {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-@-moz-keyframes fade-out {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-@-webkit-keyframes fade-out {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/css/app.css b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/css/app.css
deleted file mode 100644
index f41c420776..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/css/app.css
+++ /dev/null
@@ -1,99 +0,0 @@
-/* app css stylesheet */
-
-body {
-  padding-top: 20px;
-}
-
-
-.phone-images {
-  background-color: white;
-  width: 450px;
-  height: 450px;
-  overflow: hidden;
-  position: relative;
-  float: left;
-}
-
-.phones {
-  list-style: none;
-}
-
-.thumb {
-  float: left;
-  margin: -0.5em 1em 1.5em 0;
-  padding-bottom: 1em;
-  height: 100px;
-  width: 100px;
-}
-
-.phones li {
-  clear: both;
-  height: 115px;
-  padding-top: 15px;
-}
-
-/** Detail View **/
-img.phone {
-  float: left;
-  margin-right: 3em;
-  margin-bottom: 2em;
-  background-color: white;
-  padding: 2em;
-  height: 400px;
-  width: 400px;
-  display: none;
-}
-
-img.phone:first-of-type {
-  display: block;
-}
-
-
-ul.phone-thumbs {
-  margin: 0;
-  list-style: none;
-}
-
-ul.phone-thumbs li {
-  border: 1px solid black;
-  display: inline-block;
-  margin: 1em;
-  background-color: white;
-}
-
-ul.phone-thumbs img {
-  height: 100px;
-  width: 100px;
-  padding: 1em;
-}
-
-ul.phone-thumbs img:hover {
-  cursor: pointer;
-}
-
-
-ul.specs {
-  clear: both;
-  margin: 0;
-  padding: 0;
-  list-style: none;
-}
-
-ul.specs > li{
-  display: inline-block;
-  width: 200px;
-  vertical-align: top;
-}
-
-ul.specs > li > span{
-  font-weight: bold;
-  font-size: 1.2em;
-}
-
-ul.specs dt {
-  font-weight: bold;
-}
-
-h1 {
-  border-bottom: 1px solid gray;
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/img/.gitkeep b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/img/.gitkeep
deleted file mode 100644
index e69de29bb2..0000000000
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/img/glyphicons-halflings-white.png b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/img/glyphicons-halflings-white.png
deleted file mode 100644
index 3bf6484a29..0000000000
Binary files a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/img/glyphicons-halflings-white.png and /dev/null differ
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/img/glyphicons-halflings.png b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/img/glyphicons-halflings.png
deleted file mode 100644
index 5b67ffda5f..0000000000
Binary files a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/img/glyphicons-halflings.png and /dev/null differ
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/index.html b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/index.html
deleted file mode 100644
index b0d5e4caf2..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/index.html
+++ /dev/null
@@ -1,38 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-  <meta charset="utf-8">
-  <title>Google Phone Gallery</title>
-  <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">
-  <link rel="stylesheet" href="css/app.css">
-  <link rel="stylesheet" href="css/animations.css">
-  <!-- #docregion scripts -->
-  <script src="../node_modules/systemjs/dist/system.src.js"></script>
-  <script src="bower_components/jquery/dist/jquery.js"></script>
-  <script src="bower_components/angular/angular.js"></script>
-  <script src="bower_components/angular-animate/angular-animate.js"></script>
-  <script src="bower_components/angular-route/angular-route.js"></script>
-  <script src="bower_components/angular-resource/angular-resource.js"></script>
-  <!--<script src="js/app.module.js"></script>-->
-  <!--<script src="js/core/core.module.js"></script>-->
-  <!--<script src="js/core/checkmark.filter.js"></script>-->
-  <!--<script src="js/core/phone.factory.js"></script>-->
-  <!--<script src="js/phone_detail/phone_detail.module.js"></script>-->
-  <!--<script src="js/phone_detail/phone.animation.js"></script>-->
-  <!--<script src="js/phone_detail/phone_detail.controller.js"></script>-->
-  <!--<script src="js/phone_list/phone_list.module.js"></script>-->
-  <!--<script src="js/phone_list/phone_list.controller.js"></script>-->
-  <script src="systemjs.config.js"></script>
-  <script>
-    System.import('js/app.module');
-  </script>
-  <!-- #enddocregion scripts -->
-</head>
-<body>
-
-  <div class="view-container">
-    <div ng-view class="view-frame"></div>
-  </div>
-
-</body>
-</html>
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/app.module.ts b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/app.module.ts
deleted file mode 100644
index 835518a9c0..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/app.module.ts
+++ /dev/null
@@ -1,35 +0,0 @@
-// #docregion pre-bootstrap
-import core from './core/core.module';
-import phoneList from './phone_list/phone_list.module';
-import phoneDetail from './phone_detail/phone_detail.module';
-
-angular.module('phonecatApp', [
-  'ngAnimate',
-  'ngRoute',
-  core.name,
-  phoneList.name,
-  phoneDetail.name
-]).config(configure);
-
-configure.$inject = ['$routeProvider'];
-
-function configure($routeProvider) {
-  $routeProvider.
-    when('/phones', {
-      templateUrl: 'js/phone_list/phone_list.html',
-      controller: 'PhoneListCtrl',
-      controllerAs: 'vm'
-    }).
-    when('/phones/:phoneId', {
-      templateUrl: 'js/phone_detail/phone_detail.html',
-      controller: 'PhoneDetailCtrl',
-      controllerAs: 'vm'
-    }).
-    otherwise({
-      redirectTo: '/phones'
-    });
-}
-// #enddocregion pre-bootstrap
-// #docregion bootstrap
-angular.bootstrap(document.documentElement, ['phonecatApp']);
-// #enddocregion bootstrap
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/core/checkmark.filter.ts b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/core/checkmark.filter.ts
deleted file mode 100644
index b2615f15e4..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/core/checkmark.filter.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-// #docregion
-export default function checkmarkFilter() {
-  return function(input) {
-    return input ? '\u2713' : '\u2718';
-  };
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/core/core.module.ts b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/core/core.module.ts
deleted file mode 100644
index c20ce33683..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/core/core.module.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-// #docregion
-import Phone from './phone.factory';
-import checkmarkFilter from './checkmark.filter';
-
-export default angular.module('phonecat.core', [
-    'ngResource'
-  ])
-  .factory('Phone', Phone)
-  .filter('checkmark', checkmarkFilter);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/core/phone.factory.ts b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/core/phone.factory.ts
deleted file mode 100644
index a8492b29fc..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/core/phone.factory.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-// #docregion
-Phone.$inject = ['$resource'];
-
-function Phone($resource) {
-  return $resource('phones/:phoneId.json', {}, {
-    query: {method:'GET', params:{phoneId:'phones'}, isArray:true}
-  });
-}
-
-export default Phone;
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_detail/phone_detail.controller.ts b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_detail/phone_detail.controller.ts
deleted file mode 100644
index c8745c0cd2..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_detail/phone_detail.controller.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-// #docregion
-PhoneDetailCtrl.$inject = ['$routeParams', 'Phone'];
-
-function PhoneDetailCtrl($routeParams, Phone) {
-  var vm = this;
-  vm.phone = Phone.get({phoneId: $routeParams.phoneId}, function(phone) {
-    vm.mainImageUrl = phone.images[0];
-  });
-  vm.setImage = function(imageUrl) {
-    vm.mainImageUrl = imageUrl;
-  };
-}
-
-export default PhoneDetailCtrl;
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_detail/phone_detail.html b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_detail/phone_detail.html
deleted file mode 100644
index 954c65c2cd..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_detail/phone_detail.html
+++ /dev/null
@@ -1,118 +0,0 @@
-<div class="phone-images">
-  <img ng-src="{{img}}"
-       class="phone"
-       ng-repeat="img in vm.phone.images"
-       ng-class="{active: vm.mainImageUrl==img}">
-</div>
-
-<h1>{{vm.phone.name}}</h1>
-
-<p>{{vm.phone.description}}</p>
-
-<ul class="phone-thumbs">
-  <li ng-repeat="img in vm.phone.images">
-    <img ng-src="{{img}}" ng-click="vm.setImage(img)">
-  </li>
-</ul>
-
-<ul class="specs">
-  <li>
-    <span>Availability and Networks</span>
-    <dl>
-      <dt>Availability</dt>
-      <dd ng-repeat="availability in vm.phone.availability">{{availability}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Battery</span>
-    <dl>
-      <dt>Type</dt>
-      <dd>{{vm.phone.battery.type}}</dd>
-      <dt>Talk Time</dt>
-      <dd>{{vm.phone.battery.talkTime}}</dd>
-      <dt>Standby time (max)</dt>
-      <dd>{{vm.phone.battery.standbyTime}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Storage and Memory</span>
-    <dl>
-      <dt>RAM</dt>
-      <dd>{{vm.phone.storage.ram}}</dd>
-      <dt>Internal Storage</dt>
-      <dd>{{vm.phone.storage.flash}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Connectivity</span>
-    <dl>
-      <dt>Network Support</dt>
-      <dd>{{vm.phone.connectivity.cell}}</dd>
-      <dt>WiFi</dt>
-      <dd>{{vm.phone.connectivity.wifi}}</dd>
-      <dt>Bluetooth</dt>
-      <dd>{{vm.phone.connectivity.bluetooth}}</dd>
-      <dt>Infrared</dt>
-      <dd>{{vm.phone.connectivity.infrared | checkmark}}</dd>
-      <dt>GPS</dt>
-      <dd>{{vm.phone.connectivity.gps | checkmark}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Android</span>
-    <dl>
-      <dt>OS Version</dt>
-      <dd>{{vm.phone.android.os}}</dd>
-      <dt>UI</dt>
-      <dd>{{vm.phone.android.ui}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Size and Weight</span>
-    <dl>
-      <dt>Dimensions</dt>
-      <dd ng-repeat="dim in vm.phone.sizeAndWeight.dimensions">{{dim}}</dd>
-      <dt>Weight</dt>
-      <dd>{{vm.phone.sizeAndWeight.weight}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Display</span>
-    <dl>
-      <dt>Screen size</dt>
-      <dd>{{vm.phone.display.screenSize}}</dd>
-      <dt>Screen resolution</dt>
-      <dd>{{vm.phone.display.screenResolution}}</dd>
-      <dt>Touch screen</dt>
-      <dd>{{vm.phone.display.touchScreen | checkmark}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Hardware</span>
-    <dl>
-      <dt>CPU</dt>
-      <dd>{{vm.phone.hardware.cpu}}</dd>
-      <dt>USB</dt>
-      <dd>{{vm.phone.hardware.usb}}</dd>
-      <dt>Audio / headphone jack</dt>
-      <dd>{{vm.phone.hardware.audioJack}}</dd>
-      <dt>FM Radio</dt>
-      <dd>{{vm.phone.hardware.fmRadio | checkmark}}</dd>
-      <dt>Accelerometer</dt>
-      <dd>{{vm.phone.hardware.accelerometer | checkmark}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Camera</span>
-    <dl>
-      <dt>Primary</dt>
-      <dd>{{vm.phone.camera.primary}}</dd>
-      <dt>Features</dt>
-      <dd>{{vm.phone.camera.features.join(', ')}}</dd>
-    </dl>
-  </li>
-  <li>
-    <span>Additional Features</span>
-    <dd>{{vm.phone.additionalFeatures}}</dd>
-  </li>
-</ul>
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_detail/phone_detail.module.ts b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_detail/phone_detail.module.ts
deleted file mode 100644
index 5ea1739577..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_detail/phone_detail.module.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-// #docregion
-import PhoneDetailCtrl from './phone_detail.controller';
-
-export default angular.module('phonecat.detail', [
-    'phonecat.core',
-    'ngRoute'
-  ])
-  .controller('PhoneDetailCtrl', PhoneDetailCtrl);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_list/phone_list.controller.ts b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_list/phone_list.controller.ts
deleted file mode 100644
index 63dc2a6548..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_list/phone_list.controller.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-// #docregion
-PhoneListCtrl.$inject = ['Phone'];
-
-function PhoneListCtrl(Phone) {
-  var vm = this;
-  vm.phones = Phone.query();
-  vm.orderProp = 'age';
-}
-
-export default PhoneListCtrl;
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_list/phone_list.html b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_list/phone_list.html
deleted file mode 100644
index 471f474e89..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_list/phone_list.html
+++ /dev/null
@@ -1,28 +0,0 @@
-<div class="container-fluid">
-  <div class="row">
-    <div class="col-md-2">
-      <!--Sidebar content-->
-
-      Search: <input ng-model="vm.query">
-      Sort by:
-      <select ng-model="vm.orderProp">
-        <option value="name">Alphabetical</option>
-        <option value="age">Newest</option>
-      </select>
-
-    </div>
-    <div class="col-md-10">
-      <!--Body content-->
-
-      <ul class="phones">
-        <li ng-repeat="phone in vm.phones | filter:vm.query | orderBy:vm.orderProp"
-            class="thumbnail phone-listing">
-          <a href="#/phones/{{phone.id}}" class="thumb"><img ng-src="{{phone.imageUrl}}"></a>
-          <a href="#/phones/{{phone.id}}">{{phone.name}}</a>
-          <p>{{phone.snippet}}</p>
-        </li>
-      </ul>
-
-    </div>
-  </div>
-</div>
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_list/phone_list.module.ts b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_list/phone_list.module.ts
deleted file mode 100644
index 758b937927..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/js/phone_list/phone_list.module.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-// #docregion
-import PhoneListCtrl from './phone_list.controller';
-
-export default angular.module('phonecat.list', ['phonecat.core'])
-  .controller('PhoneListCtrl', PhoneListCtrl);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/systemjs.config.js b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/systemjs.config.js
deleted file mode 100644
index 9a46070388..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/app/systemjs.config.js
+++ /dev/null
@@ -1,12 +0,0 @@
-// #docregion
-(function(global) {
-
-// Use global packagePath if defined
-var pkgPath =  global.packagePath || '../node_modules/'; // path to packages
-System.config({
-  packages: {
-    'js': { defaultExtension: 'js' },
-  }
-});
-
-})(this);
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/bower.json b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/bower.json
deleted file mode 100644
index 0179178b02..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/bower.json
+++ /dev/null
@@ -1,20 +0,0 @@
-{
-  "name": "angular-phonecat",
-  "description": "A starter project for AngularJS",
-  "version": "0.0.0",
-  "homepage": "https://github.com/angular/angular-phonecat",
-  "license": "MIT",
-  "private": true,
-  "dependencies": {
-    "angular": "1.5.3",
-    "angular-mocks": "1.5.3",
-    "jquery": "~2.1.1",
-    "bootstrap": "~3.1.1",
-    "angular-route": "1.5.3",
-    "angular-resource": "1.5.3",
-    "angular-animate": "1.5.3"
-  },
-  "resolutions": {
-    "angular": "1.5.3"
-  }
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/package.1.json b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/package.1.json
deleted file mode 100644
index cec9c37aee..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/package.1.json
+++ /dev/null
@@ -1,38 +0,0 @@
-{
-  "version": "0.0.0",
-  "private": true,
-  "name": "angular-phonecat",
-  "description": "A tutorial application for AngularJS",
-  "repository": "https://github.com/angular/angular-phonecat",
-  "license": "MIT",
-  "dependencies": {
-    "systemjs": "0.19.25"
-  },
-  "devDependencies": {
-    "bower": "^1.3.1",
-    "http-server": "^0.6.1",
-    "karma": "^0.12.16",
-    "karma-chrome-launcher": "^0.1.4",
-    "karma-firefox-launcher": "^0.1.3",
-    "karma-jasmine": "~0.3.7",
-    "protractor": "^3.0.0",
-    "shelljs": "^0.2.6",
-    "tmp": "0.0.23",
-    "typescript": "^1.8.9",
-    "typings": "^0.7.12"
-  },
-  "scripts": {
-    "postinstall": "bower install",
-    "prestart": "npm install",
-    "start": "http-server -a 0.0.0.0 -p 8000",
-    "pretest": "npm install",
-    "test": "node node_modules/karma/bin/karma start test/karma.conf.js",
-    "test-single-run": "node node_modules/karma/bin/karma start test/karma.conf.js  --single-run",
-    "preupdate-webdriver": "npm install",
-    "update-webdriver": "webdriver-manager update",
-    "preprotractor": "npm run update-webdriver",
-    "protractor": "protractor test/protractor-conf.js",
-    "typings": "typings",
-    "tsc": "tsc -p . -w"
-  }
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/e2e/scenarios.js b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/e2e/scenarios.js
deleted file mode 100644
index 5a505b5dae..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/e2e/scenarios.js
+++ /dev/null
@@ -1,100 +0,0 @@
-'use strict';
-
-/* http://docs.angularjs.org/guide/dev_guide.e2e-testing */
-
-describe('PhoneCat App', function() {
-
-  it('should redirect index.html to index.html#/phones', function() {
-    browser.get('app/index.html');
-    browser.getLocationAbsUrl().then(function(url) {
-        expect(url).toEqual('/phones');
-      });
-  });
-
-
-  describe('Phone list view', function() {
-
-    beforeEach(function() {
-      browser.get('app/index.html#/phones');
-    });
-
-
-    it('should filter the phone list as a user types into the search box', function() {
-      var phoneList = element.all(by.repeater('phone in vm.phones'));
-      var query = element(by.model('vm.query'));
-
-      expect(phoneList.count()).toBe(20);
-
-      query.sendKeys('nexus');
-      expect(phoneList.count()).toBe(1);
-
-      query.clear();
-      query.sendKeys('motorola');
-      expect(phoneList.count()).toBe(8);
-    });
-
-
-    it('should be possible to control phone order via the drop down select box', function() {
-
-      var phoneNameColumn = element.all(by.repeater('phone in vm.phones').column('phone.name'));
-      var query = element(by.model('vm.query'));
-
-      function getNames() {
-        return phoneNameColumn.map(function(elm) {
-          return elm.getText();
-        });
-      }
-
-      query.sendKeys('tablet'); //let's narrow the dataset to make the test assertions shorter
-
-      expect(getNames()).toEqual([
-        "Motorola XOOM\u2122 with Wi-Fi",
-        "MOTOROLA XOOM\u2122"
-      ]);
-
-      element(by.model('vm.orderProp')).element(by.css('option[value="name"]')).click();
-
-      expect(getNames()).toEqual([
-        "MOTOROLA XOOM\u2122",
-        "Motorola XOOM\u2122 with Wi-Fi"
-      ]);
-    });
-
-
-    it('should render phone specific links', function() {
-      var query = element(by.model('vm.query'));
-      query.sendKeys('nexus');
-      element.all(by.css('.phones li a')).first().click();
-      browser.getLocationAbsUrl().then(function(url) {
-        expect(url).toEqual('/phones/nexus-s');
-      });
-    });
-  });
-
-
-  describe('Phone detail view', function() {
-
-    beforeEach(function() {
-      browser.get('app/index.html#/phones/nexus-s');
-    });
-
-
-    it('should display nexus-s page', function() {
-      expect(element(by.binding('vm.phone.name')).getText()).toBe('Nexus S');
-    });
-
-
-    it('should display the first phone image as the main phone image', function() {
-      expect(element(by.css('img.phone.active')).getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/);
-    });
-
-
-    it('should swap main image if a thumbnail image is clicked on', function() {
-      element(by.css('.phone-thumbs li:nth-child(3) img')).click();
-      expect(element(by.css('img.phone.active')).getAttribute('src')).toMatch(/img\/phones\/nexus-s.2.jpg/);
-
-      element(by.css('.phone-thumbs li:nth-child(1) img')).click();
-      expect(element(by.css('img.phone.active')).getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/);
-    });
-  });
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/jasmine_matchers.d.ts b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/jasmine_matchers.d.ts
deleted file mode 100644
index 6d24879775..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/jasmine_matchers.d.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-// #docregion
-declare module jasmine {
-  interface Matchers {
-    toEqualData(expected: any):boolean;
-  }
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/karma.conf.1.js b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/karma.conf.1.js
deleted file mode 100644
index 8f2e7d178f..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/karma.conf.1.js
+++ /dev/null
@@ -1,38 +0,0 @@
-module.exports = function(config){
-  config.set({
-
-    basePath : '..',
-
-    // #docregion files
-    files : [
-      'app/bower_components/angular/angular.js',
-      'app/bower_components/angular-route/angular-route.js',
-      'app/bower_components/angular-resource/angular-resource.js',
-      'app/bower_components/angular-animate/angular-animate.js',
-      'app/bower_components/angular-mocks/angular-mocks.js',
-      'node_modules/systemjs/dist/system.src.js',
-      'test/karma_test_shim.js',
-      {pattern: 'app/js/**/*.js', included: false, watched: true},
-      {pattern: 'test/unit/**/*.js', included: false, watched: true}
-    ],
-    // #enddocregion files
-
-    autoWatch : true,
-
-    frameworks: ['jasmine'],
-
-    browsers : ['Chrome', 'Firefox'],
-
-    plugins : [
-      'karma-chrome-launcher',
-      'karma-firefox-launcher',
-      'karma-jasmine'
-    ],
-
-    junitReporter : {
-      outputFile: 'test_out/unit.xml',
-      suite: 'unit'
-    }
-
-  });
-};
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/karma_test_shim.js b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/karma_test_shim.js
deleted file mode 100644
index 15cbee5d7d..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/karma_test_shim.js
+++ /dev/null
@@ -1,44 +0,0 @@
-// #docregion
-// Cancel Karma's synchronous start,
-// we will call `__karma__.start()` later, once all the specs are loaded.
-__karma__.loaded = function() {};
-
-System.config({
-  packages: {
-    'base/app/js': {
-      defaultExtension: false,
-      format: 'register',
-      map: Object.keys(window.__karma__.files).
-            filter(onlyAppFiles).
-            reduce(function createPathRecords(pathsMapping, appPath) {
-              // creates local module name mapping to global path with karma's fingerprint in path, e.g.:
-              // './hero.service': '/base/src/app/hero.service.js?f4523daf879cfb7310ef6242682ccf10b2041b3e'
-              var moduleName = appPath.replace(/^\/base\/app\/js\//, './').replace(/\.js$/, '');
-              pathsMapping[moduleName] = appPath + '?' + window.__karma__.files[appPath]
-              return pathsMapping;
-            }, {})
-
-      }
-    }
-});
-
-Promise.all(
-  Object.keys(window.__karma__.files) // All files served by Karma.
-  .filter(onlySpecFiles)
-  .map(function(moduleName) {
-    // loads all spec files via their global module names
-    return System.import(moduleName);
-}))
-.then(function() {
-  __karma__.start();
-}, function(error) {
-  __karma__.error(error.stack || error);
-});
-
-function onlyAppFiles(filePath) {
-  return /^\/base\/app\/js\/.*\.js$/.test(filePath)
-}
-
-function onlySpecFiles(path) {
-  return /\.spec\.js$/.test(path);
-}
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/protractor-conf.js b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/protractor-conf.js
deleted file mode 100644
index 118c7b9ec2..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/protractor-conf.js
+++ /dev/null
@@ -1,21 +0,0 @@
-exports.config = {
-  allScriptsTimeout: 11000,
-
-  specs: [
-    'e2e/*.js'
-  ],
-
-  capabilities: {
-    'browserName': 'chrome'
-  },
-
-  chromeOnly: true,
-
-  baseUrl: 'http://localhost:8000/',
-
-  framework: 'jasmine',
-
-  jasmineNodeOpts: {
-    defaultTimeoutInterval: 30000
-  }
-};
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/unit/checkmark.filter.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/unit/checkmark.filter.spec.ts
deleted file mode 100644
index bae35e6875..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/unit/checkmark.filter.spec.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-// #docregion top
-import '../../app/js/core/core.module';
-// #enddocregion top
-
-describe('checkmarkFilter', function() {
-
-  beforeEach(angular.mock.module('phonecat.core'));
-
-  it('should convert boolean values to unicode checkmark or cross',
-      inject(function(checkmarkFilter) {
-    expect(checkmarkFilter(true)).toBe('\u2713');
-    expect(checkmarkFilter(false)).toBe('\u2718');
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/unit/phone.factory.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/unit/phone.factory.spec.ts
deleted file mode 100644
index d7c95d347e..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/unit/phone.factory.spec.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-// #docregion top
-import '../../app/js/core/core.module';
-// #enddocregion top
-
-describe('phoneFactory', function() {
-
-  // load modules
-  beforeEach(angular.mock.module('phonecat.core'));
-
-  // Test service availability
-  it('check the existence of Phone factory', inject(function(Phone) {
-    expect(Phone).toBeDefined();
-  }));
-
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/unit/phone_detail.controller.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/unit/phone_detail.controller.spec.ts
deleted file mode 100644
index 02a3e20240..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/unit/phone_detail.controller.spec.ts
+++ /dev/null
@@ -1,44 +0,0 @@
-// #docregion top
-import '../../app/js/phone_detail/phone_detail.module';
-// #enddocregion top
-
-describe('PhoneDetailCtrl', function(){
-  var scope, $httpBackend, ctrl,
-      xyzPhoneData = function() {
-        return {
-          name: 'phone xyz',
-          images: ['image/url1.png', 'image/url2.png']
-        }
-      };
-
-  beforeEach(angular.mock.module('phonecat.detail'));
-
-  beforeEach(function(){
-    jasmine.addMatchers({
-      toEqualData: function(util, customEqualityTesters) {
-        return {
-          compare: function(actual, expected) {
-            return {pass: angular.equals(actual, expected)};
-          }
-        };
-      }
-    });
-  });
-
-  beforeEach(inject(function(_$httpBackend_, $rootScope, $routeParams, $controller) {
-    $httpBackend = _$httpBackend_;
-    $httpBackend.expectGET('phones/xyz.json').respond(xyzPhoneData());
-
-    $routeParams.phoneId = 'xyz';
-    scope = $rootScope.$new();
-    ctrl = $controller('PhoneDetailCtrl', {$scope: scope});
-  }));
-
-
-  it('should fetch phone detail', function() {
-    expect(ctrl.phone).toEqualData({});
-    $httpBackend.flush();
-
-    expect(ctrl.phone).toEqualData(xyzPhoneData());
-  });
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/unit/phone_list.controller.spec.ts b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/unit/phone_list.controller.spec.ts
deleted file mode 100644
index efec5d5f08..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/test/unit/phone_list.controller.spec.ts
+++ /dev/null
@@ -1,44 +0,0 @@
-// #docregion top
-import '../../app/js/phone_list/phone_list.module';
-// #enddocregion top
-
-describe('PhoneListCtrl', function(){
-  var scope, ctrl, $httpBackend;
-
-  beforeEach(angular.mock.module('phonecat.list'));
-
-  beforeEach(function(){
-    jasmine.addMatchers({
-      toEqualData: function(util, customEqualityTesters) {
-        return {
-          compare: function(actual, expected) {
-            return {pass: angular.equals(actual, expected)};
-          }
-        };
-      }
-    });
-  });
-
-  beforeEach(inject(function(_$httpBackend_, $rootScope, $controller) {
-    $httpBackend = _$httpBackend_;
-    $httpBackend.expectGET('phones/phones.json').
-        respond([{name: 'Nexus S'}, {name: 'Motorola DROID'}]);
-
-    scope = $rootScope.$new();
-    ctrl = $controller('PhoneListCtrl', {$scope: scope});
-  }));
-
-
-  it('should create "phones" model with 2 phones fetched from xhr', function() {
-    expect(ctrl.phones).toEqualData([]);
-    $httpBackend.flush();
-
-    expect(ctrl.phones).toEqualData(
-        [{name: 'Nexus S'}, {name: 'Motorola DROID'}]);
-  });
-
-
-  it('should set the default value of orderProp model', function() {
-    expect(ctrl.orderProp).toBe('age');
-  });
-});
diff --git a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/tsconfig.1.json b/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/tsconfig.1.json
deleted file mode 100644
index c3cf6bcddb..0000000000
--- a/public/docs/_examples/upgrade-phonecat/ts/typescript-conversion/tsconfig.1.json
+++ /dev/null
@@ -1,15 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES5",
-    "module": "system",
-    "sourceMap": true,
-    "emitDecoratorMetadata": true,
-    "experimentalDecorators": true,
-    "removeComments": false
-  },
-  "exclude": [
-    "node_modules",
-    "typings/main.d.ts",
-    "typings/main"
-  ]
-}
diff --git a/public/docs/dart/latest/guide/_data.json b/public/docs/dart/latest/guide/_data.json
index 4b6553b64d..eed8cf36a4 100644
--- a/public/docs/dart/latest/guide/_data.json
+++ b/public/docs/dart/latest/guide/_data.json
@@ -135,7 +135,7 @@
   },
 
   "webpack": {
-    "title": "Introduction to Webpack",
+    "title": "Webpack: an introduction",
     "intro": "Create your Angular 2 applications with a Webpack based tooling",
     "hide": true
   },
diff --git a/public/docs/js/latest/guide/_data.json b/public/docs/js/latest/guide/_data.json
index 59ba8dfd01..5584621203 100644
--- a/public/docs/js/latest/guide/_data.json
+++ b/public/docs/js/latest/guide/_data.json
@@ -133,7 +133,7 @@
   },
 
   "webpack": {
-    "title": "Introduction to Webpack",
+    "title": "Webpack: an introduction",
     "intro": "Create your Angular 2 applications with a Webpack based tooling",
     "hide": true
   },
diff --git a/public/docs/ts/latest/guide/npm-packages.jade b/public/docs/ts/latest/guide/npm-packages.jade
index 57b94b1580..2cfd190551 100644
--- a/public/docs/ts/latest/guide/npm-packages.jade
+++ b/public/docs/ts/latest/guide/npm-packages.jade
@@ -19,12 +19,12 @@ include ../_util-fns
     <a href="https://docs.npmjs.com/getting-started/installing-node" target="_blank" title="Installing Node.js and updating npm">
     立即获取它</a>！
  
-    **Verify that you are running node `v5.x.x` and npm `3.x.x`**
+    **Verify that you are running at least node `v5.x.x` and npm `3.x.x`**
     by running `node -v` and `npm -v` in a terminal/console window.
-    Older and newer versions produce errors.
+    Older versions produce errors.
     
     通过在终端/控制台窗口中运行`node -v`和`npm -v`命令，来**验证下你是否正在使用node `v5.x.x`和npm `3.x.x`**。
-    过老或过新的版本都有可能出现问题。
+    过老的版本有可能出现问题。
 
     We recommend [nvm](https://github.com/creationix/nvm) for managing multiple versions of node and npm.
     
diff --git a/public/docs/ts/latest/guide/server-communication.jade b/public/docs/ts/latest/guide/server-communication.jade
index 3799e4d013..fa998593b3 100644
--- a/public/docs/ts/latest/guide/server-communication.jade
+++ b/public/docs/ts/latest/guide/server-communication.jade
@@ -311,7 +311,7 @@ h2#fetch-data 通过#[b HeroService]获取数据
   我们把资源的URL传进`get`函数，它调用了服务器，而服务器应该返回英雄列表。
 .l-sub-section
   :marked
-    It *will* return heroes once we've set up the [in-memory web api](in-mem-web-api)
+    It *will* return heroes once we've set up the [in-memory web api](#in-mem-web-api)
     described in the appendix below.
     Alternatively, we can (temporarily) target a JSON file by changing the endpoint URL:
     
diff --git a/public/docs/ts/latest/guide/upgrade.jade b/public/docs/ts/latest/guide/upgrade.jade
index 2ece2d1e42..f5c349bea6 100644
--- a/public/docs/ts/latest/guide/upgrade.jade
+++ b/public/docs/ts/latest/guide/upgrade.jade
@@ -62,27 +62,22 @@ include ../_util-fns
       7. [让Angular 1提供的依赖可以被注入到Angular 2](#making-angular-1-dependencies-injectable-to-angular-2)
       8. [Making Angular 2 Dependencies Injectable to Angular 1](#making-angular-2-dependencies-injectable-to-angular-1)
       8. [让Angular 2提供的依赖可以被注入到Angular 1](#making-angular-2-dependencies-injectable-to-angular-1)
-  3. [PhoneCat Preparation Tutorial](#phonecat-preparation-tutorial)
+  3. [PhoneCat Upgrade Tutorial](#phonecat-upgrade-tutorial)
   3. [PhoneCat准备工作教程](#phonecat-preparation-tutorial)
-      1. [Switching to TypeScript And Module Loading](#switching-to-typescript-and-module-loading)
-      1. [切换到TypeScript和模块加载器](#switching-to-typescript-and-module-loading)
-      2. [Preparing Unit and E2E Tests](#preparing-unit-and-e2e-tests)
-      2. [准备单元测试和E2E测试](#preparing-unit-and-e2e-tests)
-      3. [Enjoying The Benefits of TypeScript](#enjoying-the-benefits-of-typescript)
-      3. [享受TypeScript带来的好处](#enjoying-the-benefits-of-typescript)
-
-  4. [PhoneCat Upgrade Tutorial](#phonecat-upgrade-tutorial)
-  4. [PhoneCat升级教程](#phonecat-upgrade-tutorial)
-      1. [Bootstrapping A Hybrid 1+2 PhoneCat](#bootstrapping-a-hybrid-1-2-phonecat)
-      1. [引导Angular 1+2的混合版PhoneCat](#bootstrapping-a-hybrid-1-2-phonecat)
-      2. [Upgrading the Phone factory](#upgrading-the-phone-factory)
-      2. [升级Phone工厂](#upgrading-the-phone-factory)
-      3. [Upgrading Controllers to Components](#upgrading-controllers-to-components)
-      3. [把控制器升级为组件](#upgrading-controllers-to-components)
-      4. [Switching To The Angular 2 Router And Bootstrap](#switching-to-the-angular-2-router-and-bootstrap)
-      4. [切换到Angular 2的路由器并引导](#switching-to-the-angular-2-router-and-bootstrap)
-      5. [Saying Goodbye to Angular 1](#saying-goodbye-to-angular-1)
-      5. [再见，Angular 1！](#saying-goodbye-to-angular-1)
+      1. [Switching to TypeScript](#switching-to-typescript)
+      1. [切换到TypeScript](#switching-to-typescript)
+      2. [Installing Angular 2](#installing-angular-2)
+      2. [安装Angular 2](#installing-angular-2)
+      3. [Bootstrapping A Hybrid 1+2 PhoneCat](#bootstrapping-a-hybrid-1-2-phonecat)
+      3. [引导Angular 1+2的混合版PhoneCat](#bootstrapping-a-hybrid-1-2-phonecat)
+      4. [Upgrading the Phone service](#upgrading-the-phone-service)
+      4. [升级Phone服务](#upgrading-the-phone-service)
+      5. [Upgrading Components](#upgrading-components)
+      5. [升级组件](#upgrading-components)
+      6. [Switching To The Angular 2 Router And Bootstrap](#switching-to-the-angular-2-router-and-bootstrap)
+      6. [切换到Angular 2的路由器并引导](#switching-to-the-angular-2-router-and-bootstrap)
+      7. [Saying Goodbye to Angular 1](#saying-goodbye-to-angular-1)
+      7. [再见，Angular 1！](#saying-goodbye-to-angular-1)
 
 .l-main-section
 :marked
@@ -101,7 +96,7 @@ include ../_util-fns
   ## Following The Angular Style Guide
   ## 遵循Angular风格指南
 
-  The [Angular Style Guide](https://github.com/johnpapa/angular-styleguide)
+  The [Angular 1 Style Guide](https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#single-responsibility)
   collects patterns and practices that have been proven to result in
   cleaner and more maintainable Angular 1 applications. It contains a wealth
   of information about how to write and organize Angular code - and equally
@@ -131,7 +126,7 @@ include ../_util-fns
     states that there should be one component per file. This not only makes
     components easy to navigate and find, but will also allow us to migrate
     them between languages and frameworks one at a time. In this example application,
-    each controller, factory, and filter is in its own source file.
+    each controller, component, service, and filter is in its own source file.
 
   * [规则1](https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#single-responsibility)
     规定应该每个文件中放一个组件。这不仅让组件更容易浏览和查找，而且还将允许我们逐个迁移它们的语言和框架。
@@ -228,11 +223,11 @@ include ../_util-fns
 
   * 类型注解可以逐步添加到已存在的函数和变量上，以固定它们的类型，并获得其优点：比如编译期错误检查、更好的支持自动完成，以及内联式文档等。
 
-  * JavaScript features new to ES2015, like `let`s and `const`s, default function
-    parameters, and destructuring assignments can also be gradually added to make
-    the code more expressive.
-
-  * 那些ES2015中新增的特性，比如`let`、`const`、默认函数参数、解构赋值等也能逐渐添加进来，让代码更有表现力。
+  * JavaScript features new to ES2015, like arrow functions, `let`s and `const`s,
+    default function parameters, and destructuring assignments can also be gradually
+    added to make the code more expressive.
+  
+  * 那些ES2015中新增的特性，比如箭头函数、`let`、`const`、默认函数参数、解构赋值等也能逐渐添加进来，让代码更有表现力。
 
   * Services and controllers can be turned into *classes*. That way they'll be a step
     closer to becoming Angular 2 service and component classes, which will make our
@@ -341,10 +336,10 @@ include ../_util-fns
 
   * 它强制使用组件的最佳实践，比如`controllerAs`。
 
-  * It has good default values for directive attributes like `scope`,
-    `restrict`, and `transclude`.
+  * It has good default values for directive attributes like `scope` and `restrict`.
+
+  * 对于指令中像`scope`和`restrict`这样的属性，它有良好的默认值。
 
-  * 对于指令中像`scope`、`restrict`和`transclude`这样的属性，它有良好的默认值。
 
   The component directive example from above looks like this when expressed
   using the component API:
@@ -353,7 +348,14 @@ include ../_util-fns
 
 +makeExample('upgrade-adapter/ts/app/upgrade-io/hero-detail.component.ts')
 
-
+:marked
+  Controller lifecycle hook methods `$onInit()`, `$onDestroy()`, and `$onChanges()`
+  are another convenient feature that Angular 1.5 introduces. They all have nearly
+  exact [equivalents in Angular 2](lifecycle-hooks.html), so organizing component lifecycle
+  logic around them will ease the eventual Angular 2 upgrade process.
+  
+  控制器的生命周期钩子`$onInit()`、`$onDestroy()`和`$onChanges()`是Angular 1.5引入的另一些便利特性。
+  它们都很接近于[Angular 2中的等价物](lifecycle-hooks.html)，所以，围绕它们组织组件生命周期的逻辑会更容易升级。
 
 .l-main-section
 :marked
@@ -761,6 +763,7 @@ figure
 
   这里我们得到的是一个叫做`heroDetail`的Angular 1指令，我们可以像用其它指令一样把它用在Angular 1模板中。
 
+
 +makeExample('upgrade-adapter/ts/index-downgrade-static.html', 'usecomponent')
 
 .alert.is-helpful
@@ -795,10 +798,31 @@ figure
   Note that even though we are in an Angular 1 template, **we're using Angular 2
   attribute syntax to bind the inputs and outputs**. This is a requirement for downgraded
   components. The expressions themselves are still regular Angular 1 expressions.
-
+  
   注意，虽然我们正在Angular 1的模板中，**但却在使用Angular 2的属性(Attribute)语法来绑定到输入属性与输出属性**。
   这是降级的组件本身要求的。而表达式本身仍然是标准的Angular 1表达式。
 
+.callout.is-important
+  header Use kebab-case for downgraded component attributes
+  header 在降级过的组件属性中使用中线命名法
+  :marked
+    There's one notable exception to the rule of using Angular 2 attribute syntax
+    for downgraded components. It has to do with input or output names that consist
+    of multiple words. In Angular 2 we would bind these attributes using camelCase:
+    
+    为降级过的组件使用Angualr 2的属性(Attribute)语法规则时有一个值得注意的例外。
+    它适用于由多个单词组成的输入或输出属性。在Angular 2中，我们要使用小驼峰命名法绑定这些属性：
+  code-example(format="").
+    [myHero]="hero"
+  :marked
+    But when using them from Angular 1 templates, we need to use kebab-case:
+    
+    但是从Angular 1的模板中使用它们时，我们得使用中线命名法：
+    
+  code-example(format="").
+    [my-hero]="hero"
+
+:marked
   The `$event` variable can be used in outputs to gain access to the
   object that was emitted. In this case it will be the `Hero` object, because
   that is what was passed to `this.deleted.emit()`.
@@ -868,10 +892,8 @@ figure
     Upgraded components always have an element selector, which is based
     on the original name of the original Angular 1 component directive.
 
-
     升级后的组件总会有一个元素选择器，它就是原Angular 1组件型指令的原始名字。
 
-
 :marked
   An upgraded component may also have inputs and outputs, as defined by
   the scope/controller bindings of the original Angular 1 component
@@ -1118,12 +1140,17 @@ figure
 
 +makeExample('upgrade-adapter/ts/app/2-to-1-providers/hero-detail.component.ts', null, 'hero-detail.component.ts')
 
+
+
+
+
 .l-main-section
 :marked
-  # PhoneCat Preparation Tutorial
-  # PhoneCat准备教程
+  # PhoneCat Upgrade Tutorial
+  
+  # PhoneCat升级教程
 
-  In this section and the one following it we will look at a complete example of
+  In this section and we will look at a complete example of
   preparing and upgrading an application using the `upgrade` module. The app
   we're going to work on is [Angular PhoneCat](https://github.com/angular/angular-phonecat)
   from [the original Angular 1 tutorial](https://docs.angularjs.org/tutorial),
@@ -1137,31 +1164,18 @@ figure
 
   During the process we'll learn how to apply the steps outlined in the
   [preparation guide](#preparation) in practice: We'll align the application
-  with Angular 2 and also take both the SystemJS module loader and TypeScript
-  into use.
+  with Angular 2 and also take TypeScript into use.
 
   这期间，我们将学到如何在实践中应用[准备指南](#preparation)中列出的那些重点步骤：
   我们先让该应用向Angular 2看齐，然后为它引入SystemJS模块加载器和TypeScript。
 
   To follow along with the tutorial, clone the
   [angular-phonecat](https://github.com/angular/angular-phonecat) repository
-  and apply the steps as we go
+  and apply the steps as we go.
 
   要跟随本教程，请先把[angular-phonecat](https://github.com/angular/angular-phonecat)仓库clone到本地，并跟我们一起应用这些步骤。
 
-.alert.is-important
-  :marked
-    If you do clone this repository, note that it doesn't look like this guide
-    assumes yet. There's [a pull request](https://github.com/angular/angular-phonecat/pull/289)
-    that will change this. Meanwhile, you'll find a good starting point from
-    [this commit](https://github.com/teropa/angular-phonecat/commit/d6fb83e1c2db9d1812c7c478fdb8d92301ef0061).
-
-    如果你已经克隆了这个仓库，可能会注意到它看起来和本指南中所假设的不太一样。
-    有一个[Pull Request](https://github.com/angular/angular-phonecat/pull/289)就是要求改变这一点的。同时，我们找到了一个更好的起点：
-    也就是[这个提交](https://github.com/teropa/angular-phonecat/commit/d6fb83e1c2db9d1812c7c478fdb8d92301ef0061)。
-
-:marked
-  In terms of project structure, this is where our work begins
+  In terms of project structure, this is where our work begins:
 
   在项目结构方面，我们工作的起点是这样的：
 
@@ -1169,123 +1183,106 @@ figure
   .file angular-phonecat
   .children
     .file bower.json
+    .file karma.conf.js
     .file package.json
     .file app
     .children
-      .file js
+      .file core
       .children
-        .file core
+        .file checkmark
         .children
           .file checkmark.filter.js
-          .file core.module.js
-          .file phone.factory.js
-        .file phone_detail
+          .file checkmark.filter.spec.js
+        .file phone
         .children
-          .file phone_detail.html
-          .file phone_detail.module.js
-          .file phone_detail.controller.js
-        .file phone_list
-        .children
-          .file phone_list.html
-          .file phone_list.module.js
-          .file phone_list.controller.js
-        .file app.module.js
-      .file css
+          .file phone.module.js
+          .file phone.service.js
+          .file phone.service.spec.js
+        .file core.module.js
+      .file phone-detail
       .children
-        .file animations.css
-        .file app.css
+        .file phone-detail.component.js
+        .file phone-detail.component.spec.js
+        .file phone-detail.module.js
+        .file phone-detail.template.html
+      .file phone-list
+      .children
+        .file phone-list.component.js
+        .file phone-list.component.spec.js
+        .file phone-list.module.js
+        .file phone-list.template.html
       .file img
       .children
         .file  ...
       .file phones
       .children
         .file  ...
+      .file app.animations.js
+      .file app.config.js
+      .file app.css
+      .file app.module.js
       .file index.html
-    .file test
+    .file e2e-tests
     .children
-      .file e2e
-      .children
-        .file scenarios.js
-      .file unit
-      .children
-        .file checkmark.filter.spec.js
-        .file phone_detail.controller.spec.js
-        .file phone.factory.spec.js
-        .file phone_list.controller.spec.js
-      .file karma.conf.js
       .file protractor-conf.js
+      .file scenarios.js
 
 :marked
-  This is actually a pretty good starting point. In particular, this organization
-  follows the [Angular Style Guide](https://github.com/johnpapa/angular-styleguide),
+  This is actually a pretty good starting point. The code uses the Angular 1.5
+  component API and the organization follows the
+  [Angular 1 Style Guide](https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md),
   which is an important [preparation step](#following-the-angular-style-guide) before
   a successful upgrade.
 
   这确实是一个很好地起点。特别是，该结构遵循了[Angular Style Guide](https://github.com/johnpapa/angular-styleguide)，
   要想成功升级，这是一个很重要的[准备步骤](#following-the-angular-style-guide)。
 
-  * Each controller, factory, and filter is in its own source file, as per the
-    [Rule of 1](https://github.com/johnpapa/angular-styleguide#single-responsibility).
+  * Each component, service, and filter is in its own source file, as per the
+  [Rule of 1](https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#single-responsibility).
+  
+  * 每个组件、服务和过滤器都在它自己的源文件中 —— 就像[规则1](https://github.com/johnpapa/angular-styleguide#single-responsibility)所要求的。
 
-  * 每个控制器、工厂和过滤器都在它自己的源文件中 —— 就像[规则1](https://github.com/johnpapa/angular-styleguide#single-responsibility)所要求的。
-
-  * The `core`, `phoneDetail`, and `phoneList` modules are each in their
+  * The `core`, `phone-detail`, and `phone-list` modules are each in their
     own subdirectory. Those subdirectories contain the JavaScript code as well as
     the HTML templates that go with each particular feature. This is in line with the
-    [Folders-by-Feature Structure](https://github.com/johnpapa/angular-styleguide#style-y152)
-    and [Modularity](https://github.com/johnpapa/angular-styleguide#modularity)
+    [Folders-by-Feature Structure](https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#style-y152)
+    and [Modularity](https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#modularity)
     rules.
 
-  * `core`、`phoneDetail`和`phoneList`模块都在它们自己的子目录中。那些子目录除了包含HTML模板之外，还包含JavaScript代码，它们共同完成一个特性。
+  * `core`、`phone-detail`和`phone-list`模块都在它们自己的子目录中。那些子目录除了包含HTML模板之外，还包含JavaScript代码，它们共同完成一个特性。
     这是[按特性分目录的结构](https://github.com/johnpapa/angular-styleguide#style-y152)
     和[模块化](https://github.com/johnpapa/angular-styleguide#modularity)规则所要求的。
 
+  * Unit tests are located side-by-side with application code where they are easily
+    found, as described in the rules for
+    [Organizing Tests](https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#style-y197).
+  
+  * 单元测试都和应用代码在一起，它们很容易找到。就像规则
+    [组织测试文件](https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#style-y197)中要求的那样。
+
 :marked
-  ## Switching to TypeScript And Module Loading
-  ## 切换到TypeScript和模块加载器
+  ## Switching to TypeScript
+  
+  ## 切换到TypeScript
 
   Since we're going to be writing our Angular 2 code in TypeScript, it makes sense to
   bring in the TypeScript compiler even before we begin upgrading.
 
-  既然我们准备用TypeScript写Angular 2代码，那么在开始升级前先引入TypeScript编译器就很有意义了。
-
-  In order to use TypeScript's ES2015 module system to `import` and `export` code, we're
-  going to need a JavaScript module loader. Our application doesn't currently
-  use one, and is just using plain old `&lt;script>` tags and the global `window` scope
-  instead. We'll replace this approach with the
-  [SystemJS loader](https://github.com/systemjs/systemjs).
-
-  要用TypeScript的ES2015模块系统来`import`和`export`代码，就需要一个JavaScript模块加载器。
-  我们的程序目前还没用到它，它只使用了老旧的`&lt;script>`标签和全局的`window`作用域。
-  我们这就把这种方式换成[SystemJS加载器](https://github.com/systemjs/systemjs)。
-
-.alert.is-helpful
-  :marked
-    Angular 2 itself doesn't require either TypeScript or SystemJS.
-    There will soon be other editions of this guide that show how to
-    do the upgrade using ES5.
-
-    Angular 2本身并不需要TypeScript或SystemJS。
-    本指南很快就会有另一个版本来展示如何用ES5进行升级。
-
-:marked
   We will also start to gradually phase out the Bower package manager in favor
   of NPM. We'll install all new dependencies using NPM, and will eventually be
   able to remove Bower from the project.
 
   我们还将开始逐步淘汰Bower包管理器，换成我们更喜欢的NPM。后面我们将使用NPM来安装新的依赖包，并最终从项目中移除Bower。
 
-  Let's begin by installing the SystemJS and TypeScript packages to the project.
-  While we're at it, let's also install the
-  [Typings type definition manager](https://github.com/typings/typings).
+  Let's begin by installing TypeScript to the project. While we're at it, let's also
+  install the [Typings type definition manager](https://github.com/typings/typings).
   It will allow us to install type definitions for libraries that don't come with
   prepackaged types.
 
-  让我们从把SystemJS和TypeScript包安装到项目中开始。同时我们还将安装[typings类型定义管理器](https://github.com/typings/typings)。
+  让我们从把TypeScript包安装到项目中开始。同时我们还将安装[typings类型定义管理器](https://github.com/typings/typings)。
   它将允许我们为那些没有提供内置类型信息的库文件安装类型定义。
 
 code-example(format="").
-  npm i systemjs --save
   npm i typescript typings --save-dev
 
 :marked
@@ -1294,66 +1291,41 @@ code-example(format="").
 
   我们还要把用来运行TypeScript编译器`tsc`和`typings`工具的脚本添加到`package.json`中：
 
-+makeJson('upgrade-phonecat/ts/typescript-conversion/package.1.json', {paths: 'scripts'}, 'package.json', {otl: /(\"tsc.*|\"typings.*)/g})
++makeJson('upgrade-phonecat-1-typescript/ts/package.json', {paths: 'scripts.tsc, scripts.tsc:w, scripts.typings'}, 'package.json')
 
 
 :marked
-  We can now use Typings to install the type definitions for Angular 1 and the Jasmine
-  unit test framework. This will add a `typings` directory to the project and install
-  a number of `.d.ts` files under it. It will also create a `typings.json` file to the
-  project, which contains metadata about the type definitions we've installed:
+  We can now use Typings to install type definitions for the existing libraries that
+  we're using: Angular 1 and the Jasmine unit test framework.
 
-  现在我们可以使用typings工具来安装Angular 1和Jasmine单元测试框架的类型定义文件。这一步将会在项目中创建一个`typings`目录，
-  并把一些`.d.ts`文件添加到此目录下。它还将在项目中创建一个`typings.json`文件，其中包含了我们已经安装的这些类型定义文件的元数据：
+  现在我们可以使用typings工具来安装Angular 1和Jasmine单元测试框架的类型定义文件。
 
 code-example(format="").
-  npm run typings install jquery -- --save --global
-  npm run typings install angular -- --save --global
-  npm run typings install angular-route -- --save --global
-  npm run typings install angular-resource -- --save --global
-  npm run typings install angular-mocks -- --save --global
-  npm run typings install jasmine -- --save --global
+  npm run typings install dt~jquery dt~angular dt~angular-route \
+    dt~angular-resource dt~angular-mocks dt~angular-animate \
+    dt~jasmine -- --save --global
 
 :marked
-  In `index.html`, let's now enable SystemJS. Add a couple of `&lt;script>` tags that
-  load the SystemJS library and then one that loads a configuration file for
-  it. Then add one more `&lt;script>` tag that uses SystemJS to load our application.
-  These will *replace* the various `&lt;script>` tags we had earlier for loading the
-  application components:
+  This will add these typings into a `typings.json` configuration file as well as
+  download them into the `typings directory`.
 
-  在`index.html`中，我们启用SystemJS。添加一组用于加载SystemJS库和一个为它加载配置文件的`&lt;script>`标签。
-  然后添加更多的`&lt;script>`标签，以通过SystemJS加载我们的应用。
-  它将会*替换掉*我们以前用来为应用程序加载部件的许多`&lt;script>`标签。
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/app/index.html', 'scripts', 'app/index.html')
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/app/systemjs.config.js', ull, 'app/systemjs.config.js')
-
-:marked
-  This tells SystemJS that we have a module called `app.module` that
-  resides in the `js` subdirectory (relative to the `index.html` page). We then load that
-  module using `System.import`. This will load and execute the `app/app.module.js` file.
-
-  这些代码告诉SystemJS，我们有一个名叫`app.module`的模块，它被放在`js`子目录下(相对于`index.html`页面的位置)。
-  然后我们使用`System.import`来加载该模块。这将加载并执行`app/app.module.js`文件。
+  这会把这些类型定义文件加到配置文件`typings.json`中，并把它们下载到`typings`目录下。
 
   We should also configure the TypeScript compiler so that it can understand our
-  project. We'll add a `tsconfig.json` file to the project directory, just like we did
+  project. We'll add a `tsconfig.json` file to the project directory, just like we do
   in the [Quickstart](../quickstart.html). It instructs the TypeScript compiler how
   to interpret our source files.
 
   我们还应该配置TypeScript编译器，以便它能理解我们的项目结构。我们要往项目目录下添加一个`tsconfig.json`文件，
   就像在[“快速起步”](../quickstart.html)中做过的那样。它将告诉TypeScript编译器，该如何解释我们的源文件。
 
-+makeJson('upgrade-phonecat/ts/typescript-conversion/tsconfig.1.json', null, 'tsconfig.json')
++makeJson('upgrade-phonecat-1-typescript/ts/tsconfig.ng1.json', null, 'tsconfig.json')
 
 :marked
   We are telling the TypeScript compiler to turn our TypeScript files to ES5 code
-  bundled into SystemJS modules. In other words, our compiler target is something
-  SystemJS can load and all major browsers are able to run.
+  bundled into CommonJS modules.
 
-  我们正在告诉TypeScript编译器如何把TypeScript文件转换成能在SystemJS模块中使用的ES5代码。
-  换句话说，我们编译的目标是生成能被SystemJS加载且能被主流浏览器运行的东西。
+  我们正在告诉TypeScript编译器如何把TypeScript文件转换成打包进CommonJS模块中的ES5代码。
 
   We can now launch the TypeScript compiler from the command line. It will watch
   our `.ts` source files and compile them to JavaScript on the fly. Those compiled
@@ -1364,316 +1336,84 @@ code-example(format="").
   然后这些编译出的`.js`文件被SystemJS加载到浏览器中。当我们继续往前走的时候，这个过程能在后台持续运行。
 
 code-example(format="").
-  npm run tsc
+  npm run tsc:w
 
 :marked
-  The next thing we'll do is convert our JavaScript files to TypeScript and define
-  their imports and exports. Each file should now explicitly export the things
-  it wants to expose, and import the things it needs from other files. This is a
-  departure from the previous approach which just relied on things being available
-  on the global `window` scope.
-
-  我们要做的下一件事是把JavaScript文件转换成TypeScript文件，并定义它们的导入和导出项。
-  每个文件都应该显式的导出它想暴露给外界的一切，并且导入它需要从别的文件中得到的东西。
-  这种方法不同于以前那种把所依赖的一切都放在全局`window`作用域的方法。
-
-  Since TypeScript is a superset of ECMAScript 2015, which in turn is a superset
+  The next thing we'll do is convert our JavaScript files to TypeScript. Since
+  TypeScript is a superset of ECMAScript 2015, which in turn is a superset
   of ECMAScript 5, we can simply switch the file extensions from `.js` to `.ts`
-  and define the imports and exports. We don't need to make other changes to
-  our existing code. Instead we'll introduce type annotations and other new
-  features gradually over time.
-
-  由于TypeScript是ECMAScript 2015的一个超集，而ES2015又是ECMAScript 5的超集，所以我们可以简单的把文件的扩展名从`.js`换成`.ts`，并定义导入和导出。
-  我们不用对现有代码做任何其它的修改。不过，我们将在一段时间内逐步引入类型注解和其它新特性。
-
-  Let's begin by renaming `app.module.js` to `app.module.ts`. The TypeScript
-  compiler should be able to compile it successfully right away. This means we can
-  move right along and go through the rest of our source files and convert them.
-  We'll rename each one to a `.ts` file, and add the imports and exports it needs.
-
-  让我们开始把`app.module.js`改名为`app.module.ts`。这个TypeScript编译器应该仍然能成功编译它。
-  这意味着我们可以逐步、一点点的转换源文件中的其它部分。
-  我们将把每一个改名为`.ts`文件，并在必要时添加导入和导出语句。
-
-  Beginning from the checkmark filter, here are the converted contents:
-
-  我们从对勾(`checkmark`)过滤器开始，下面是转换后的内容:
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/app/js/core/checkmark.filter.ts', null, 'app/js/core/checkmark.filter.ts')
-
-:marked
-  This file now has the filter factory function as the default export. Apart from
-  the export, there's one other major change we've applied to the file, which
-  is that it does *not* contain the registration of the filter into an Angular
-  module. We will do that later in the `core` module's main file.
-
-  该文件现在以一个过滤器工厂函数作为默认导出。在离导出语句稍远的地方，我们对此文件做了另一项主要改动，那就是它*没有*把此过滤器注册到Angular模块中。
-  稍后我们将在`core`模块的主文件中进行注册。
-
-  Moving to the `Phone` factory file, it now has the factory function as the default
-  export:
-
-  再来看`Phone`工厂文件，它现在用一个工厂方法作为默认导出：
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/app/js/core/phone.factory.ts', null, 'app/js/core/phone.factory.ts')
-
-:marked
-  The `core` module's main module file will now import both the checkmark filter
-  and the Phone factory. This is where we actually register them into the Angular module.
-  We then export the module itself as this file's default export:
-
-  `core`模块的主文件将导入`checkmark`过滤器和`Phone`工厂。这里就是我们将把它们实际注册到Angular模块中的地方。
-  然后我们把这个模块本身作为该文件的默认导出项：
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/app/js/core/core.module.ts', null, 'app/js/core/core.module.ts')
-
-:marked
-  Notice that with this organization pattern, the files that hold the application
-  components themselves - filters and factories - aren't concerned with the makeup
-  of Angular modules. That's just something we previously *had* to do because there
-  were no other good solutions. Now we use a separate file just for the purpose
-  of forming the Angular module.
-
-  注意，使用这种项目组织模式，这些文件保存程序的构造块本身(过滤器和工厂)，而不关心Angular模块之类的概念。
-  Angular模块是我们以前*不得不用*的办法，因为当时还没有其它更好的解决方案。
-  现在，有了模块加载器的支持，我们使用独立的文件也能达到和以前同样的效果了。
-
-  Now switching to the phone detail module, we'll make similar changes here. In the
-  controller file we export the controller function as the default export:
-
-  现在，切换到电话详情(phone detail)模块，我们将在这里做一些类似的改动。
-  在控制器文件中，我们把控制器函数作为默认导出：
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/app/js/phone_detail/phone_detail.controller.ts', null, 'app/js/phone_detail/phone_detail.controller.ts')
-
-:marked
-  In the main module file we import the controller and register it into the Angular
-  module, which itself is then exported:
-
-  在该模块的主文件中，我们导入了该控制器，并把它注册到Angular模块中，然后导出模块自身：
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/app/js/phone_detail/phone_detail.module.ts', null, 'app/js/phone_detail/phone_detail.module.ts')
-
-:marked
-  Then we'll repeat the same steps once more for the phone list module.
-  The controller file exports the controller function:
-
-  然后，我们又一次在电话列表(phone list)模块中重复同样的步骤。
-  该控制器文件导出控制其函数：
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/app/js/phone_list/phone_list.controller.ts', null, 'app/js/phone_list/phone_list.controller.ts')
-
-:marked
-  And the main module file imports the controller and registers it:
-
-  该模块的主文件导入了此控制器，并注册它：
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/app/js/phone_list/phone_list.module.ts', null, 'app/js/phone_list/phone_list.module.ts')
-
-:marked
-  Finally, we can now pull everything together in `app.module.ts`. We'll
-  import each of the three submodule files and register them as dependencies
-  of the main application module:
-
-  最终，我们在`app.module.ts`中把每一样东西都拉在一起。我们将导入这三个子模块文件，并把它们注册为主应用模块的依赖：
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/app/js/app.module.ts', 'pre-bootstrap', 'app/js/app.module.ts')
-
-:marked
-  Note that we don't have to repeat the submodule name strings here. Since the
-  modules export themselves, we can just refer to the `name` attribute of each
-  of them.
-
-  注意，我们并不用在这里重复写子模块的名称字符串。由于这些模块都导出了它们资深，因此我们只要引用它们各自的`name`属性就够了。
-
-  Before this converted version of the application will run, we need to change the
-  way we're bootstrapping it. It is currently bootstrapped using the `ng-app` directive
-  attached to the `<html>` element of the host page. This will no longer work because
-  `ng-app` is processed when the page loads, and our application code will not
-  be available at that point yet. It is loaded asynchronously by SystemJS instead.
-
-  在这个转换完的新版应用运行之前，我们还得修改它的引导方式。它目前是通过把`ng-app`指令附加到宿主页面的`<html>`元素上进行引导的。
-  但现在这种方式不再工作，因为`ng-app`会在页面加载时被处理，而我们的应用代码在那个时间点上还是不可用的。因为这些代码已经改为用SystemJS进行异步加载了。
-
-  We should switch to a JavaScript-driven bootstrap instead. As it happens, this is
-  also how Angular 2 apps are bootstrapped, so the switch brings us one step closer
-  to Angular as well. So, remove the `ng-app` attribute from `index.html`, and add
-  this at the end of `app.module.ts`:
-
-  替代方案是切换到由JavaScript驱动的引导方式，这也是Angular 2引导应用程序的方式。
-  于是，这次切换让我们离Angular 2又近了一步儿。所以，从`index.html`中移除`ng-app`属性，并且把这段代码加到`app.module.ts`的末尾：
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/app/js/app.module.ts', 'bootstrap', 'app/js/app.module.ts')
-
-:marked
-  We now have a fully functional version of the application, all converted
-  into TypeScript code and a modern module system! If you start the project HTTP
-  server with `npm start`, you should see the fully functional application in
-  your browser. On the other hand, if you were to try running the *test suite*,
-  things wouldn't look quite that good yet. We also have to make our tests
-  support our new module organization.
-
-  现在，我们有了一个全功能的应用版本，完全转换成了TypeScript代码和一个现代模块化系统！
-  如果通过`npm start`启动了项目的HTTP开发服务器，你就能在浏览器中看到这个全功能的应用程序了。
-  另一方面，如果我们尝试运行*测试套件*，事情看起来仍然不妙。接下来，我们也要让这些测试支持新的模块组织方式。
-
-:marked
-  ## Preparing Tests
-  ## 准备测试
-
-  Our project has both E2E Protractor tests and some Karma unit tests in it.
-  Of these two, E2E tests can be dealt with much quicker: By definition,
-  E2E tests access our application from the *outside* by interacting with
-  the various UI elements the app puts on the screen. E2E tests aren't really that
-  concerned with the internal structure of the application components. That
-  also means that although we've modified our project quite a bit, the E2E
-  test suite should keep passing just as it was before. We haven't changed
-  how the app behaves from the user's point of view.
-
-  这个项目中同时有基于Protractor的E2E测试和一些基于Karma的单元测试。
-  对这两者来说，E2E测试的转换要快得多：根据定义，E2E测试通过与应用中显示的这些UI元素互动，从*外部*访问我们的应用来进行测试。
-  E2E测试实际上并不关心这些应用中各部件的内部结构。这也意味着，虽然我们已经修改了一点儿此应用程序，
-  但是E2E测试套件仍然应该能像以前一样全部通过。因为从用户的角度来说，我们并没有改变应用的行为。
-
-  For unit tests, on the other hand, we'll do a bit of conversion work.
-  What we'll do is convert our existing unit tests to TypeScript and have them
-  use `import`s to load in the code they need.
-
-  另一方面，对单元测试来说，我们就要做一点转换工作了。
-  我们要做的就是把现存的单元测试转换成TypeScript，并让它们通过`import`语句来加载所需的代码。
-
-  We'll also need to tweak our Karma configuration so that it'll let SystemJS load
-  the application files. For this we'll use a shim file that will tweak the way
-  files get loaded:
-
-  我们还需要调整一下Karma配置，以便让Karma能通过SystemJS加载应用程序中的文件。因此，我们将使用一个垫片(shim)文件，它将调整文件的加载方式：
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/test/karma_test_shim.js', null, 'test/karma_test_shim.js')
-
-.alert.is-important The shim is likely to be replaced by improved tooling, but is currently needed.
-.alert.is-important 垫片(shim)可能会被改进过的工具所取代，但目前我们还需要它。
-
-:marked
-  We'll then update the Karma configuration file, so that it loads SystemJS and the
-  shim file. We'll also change how the app and unit tests files themselves are loaded.
-  We will *watch* them so that the test suite is triggered when changes occur, but we
-  won't have Karma *include* them because that is now done by SystemJS and the shim.
-
-  我们将更新Karma配置文件，以便它能加载SystemJS和垫片文件。我们还将修改应用文件和单元测试文件本身的加载方式。
-  我们将*监视(`watch`)*它们的变化，以便在发生修改时自动触发测试套件，但我们不会用Karma来*包含(`include`)*这些文件，
-  因为这项工作现在已经改由SystemJS和垫片来完成了。
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/test/karma.conf.1.js', 'files', 'test/karma.conf.js')
-
-:marked
-  Now we have the infrastructure in place and can convert the test files themselves.
-  This mainly just consists for changing the file extensions of those files, and adding
-  the necessary imports to them.
-
-  现在，我们做好了基础设施，可以开始转化测试文件本身了。
-  首要的工作是修改哪些文件的扩展名，并为它们添加必要的导入语句。
-
-  In the checkmark filter spec, we'll import the core module file, so that it is
-  available when we load the corresponding Angular module:
-
-  在对勾(`checkmark`)过滤器的测试规约中，我们将导入`core`模块文件，以便当我们加载相应的Angular模块时它是可用的：
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/test/unit/checkmark.filter.spec.ts', 'top', 'test/unit/checkmark.filter.spec.ts')
-
-:marked
-  We'll do the exact same thing for the phone factory spec:
-
-  我们要做的和`Phone`工厂类的规约完全一样：
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/test/unit/phone.factory.spec.ts', 'top', 'test/unit/phone.factory.spec.ts')
-
-:marked
-  In the phone detail controller spec, on the other hand, we should import
-  the phone detail module:
-
-  不过，在这个“电话详情(phone detail)”控制器的规约中，我们要导入“电话详情”模块：
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/test/unit/phone_detail.controller.spec.ts', 'top', 'test/unit/phone_detail.controller.spec.ts')
-
-:marked
-  Finally, the phone list controller spec should import the phone list
-  module:
-
-  最后，“电话列表(phone list)”控制器的规约应该导入“电话列表”模块：
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/test/unit/phone_list.controller.spec.ts', 'top', 'test/unit/phone_list.controller.spec.ts')
-
-:marked
-  There's one more issue we have in our controller tests, which is that TypeScript
-  isn't happy about compiling them at the moment. This is because we're using
-  the custom Jasmine matcher `toEqualData` in both of them. Because this is something
-  we define ourselves, it isn't included in the Jasmine type definitions that we
-  installed using Typings.
-
-  在我们这些控制器的单元测试中还有一个问题，那就是TypeScript此刻还无法正常编译它们。
-  这是因为我们正在这些文件中使用一个自定义的Jasmine匹配器`toEqualData`。
-  因为这是我们自己定义的，所以它没有包含在我们通过typings工具安装的Jasmine类型定义中。
-
-  We can add our own little type definition file for that extension, which extends
-  the `jasmine.Matchers` interface and adds our custom matcher to it. This will
-  satisfy the compiler and let us use our custom matcher while retaining the nice
-  type safety features of TypeScript:
-
-  我们可以为这个扩展添加一个自己的小型类型定义文件，它扩展了`jasmine.Matchers`接口，并把我们的自定义匹配器添加进去。
-  这将满足编译器的要求，并且让我们的自定义匹配器能保留TypeScript中漂亮的类型安全特性：
-
-+makeExample('upgrade-phonecat/ts/typescript-conversion/test/jasmine_matchers.d.ts', null, 'test/jasmine_matchers.d.ts')
-
-:marked
-  And now we have a fully functional test suite for our TypeScript-enabled
-  application as well.
-
-  现在，我们启用完TypeScript的应用也有全功能的测试套件了。
-
-:marked
-  ## Enjoying The Benefits of TypeScript
-  ## 享受TypeScript的优点
-
-  Now that we have TypeScript, we can start benefiting from some of its
-  other features in addition to the imports and exports that we're already using.
-  There's a lot of value the language can provide in Angular 1 applications.
-
-  现在，我们有了TypeScript，可以享用除了导入导出之外的更多优秀特性了。
-  该语言的很多价值也同样可用在Angular 1程序中。
+  and everything will work just like it did before. As the TypeScript compiler
+  runs, it emits the corresponding `.js` file for every `.ts` file and the
+  compiled JavaScript is what actually gets executed. If you start
+  the project HTTP server with `npm start`, you should see the fully functional
+  application in your browser.
+  
+  我们要做的下一件事是把JavaScript文件转换成TypeScript文件。
+  由于TypeScript是ECMAScript 2015的一个超集，而ES2015又是ECMAScript 5的超集，所以我们可以简单的把文件的扩展名从`.js`换成`.ts`，
+  它们就还会像以前一样工作。由于TypeScript编译器仍在运行，它会为每一个`.ts`文件生成对应的`.js`文件，而真正运行的是编译后的`.js`文件。
+  如果你用`npm start`开启了本项目的HTTP服务器，你会在浏览器中看到一个功能完好的应用。
+
+  Now that we have TypeScript though, we can start benefiting from some of its
+  features. There's a lot of value the language can provide to Angular 1 applications.
+  
+  有了TypeScript，我们就可以从它的一些特性中获益了。此语言可以为Angular 1应用提供很多价值。
 
   For one thing, TypeScript is a superset of ES2015. Any app that has previously
   been written in ES5 - like the PhoneCat example has - can with TypeScript
   start incorporating all of the JavaScript features that are new to ES2015.
-  These include things like `let`s and `const`s, default function parameters,
-  and destructuring assignments.
-
+  These include things like `let`s and `const`s, arrow functions, default function
+  parameters, and destructuring assignments.
+  
   首先，TypeScript是一个ES2015的超集。任何以前用ES5写的程序（就像PhoneCat范例）都可以开始通过TypeScript
   纳入那些添加到ES2015中的新特性。
-  这包括`let`、`const`、函数默认参数以及解构(destructure)赋值。
+  这包括`let`、`const`、箭头函数、函数默认参数以及解构(destructure)赋值。
 
-  Another thing we can do is start adding *type safety* to our code, by
-  adding type annotations. For instance, we can annotate the checkmark
-  filter so that it expects booleans as arguments and returns strings.
-  This makes it clearer what the filter is supposed to do, and makes it
-  possible for the TypeScript compiler to notify us when we're trying to
-  use it with incompatible types.
+  Another thing we can do is start adding *type safety* to our code. This has
+  actually partially already happened because of the Angular 1 typings we installed.
+  TypeScript are checking that we are calling Angular 1 APIs correctly when we do
+  things like register components to Angular modules.
+  
+  我们能做的另一件事就是把*类型安全*添加到代码中。这实际上已经部分完成了，因为我们已经安装了Angular 1的类型定义。
+  当我们正确调用Angular 1的API时，TypeScript会帮我们检查它 —— 比如王Angular模块中添加组件。
 
-  我们能做的另一件事就是通过添加类型注解来把*类型安全*添加到代码中。
-  比如，我们可以给`checkmark`过滤器加上注解，表明它期待一个`boolean`类型的参数，并返回`string`。
-  这可以更清楚的表明此过滤器打算做什么，而且如果我们尝试通过类型不兼容的参数使用它，TypeScript编译器就会通知我们。
+  But we can also start adding *type annotations* for our own code to get even more
+  out of TypeScript's type system. For instance, we can annotate the checkmark
+  filter so that it explicitly expects booleans as arguments. This makes it clearer
+  what the filter is supposed to do.
+  
+  我们还能开始把*类型注解*添加到自己的代码中，来从TypeScript的类型系统中获得更多帮助。
+  比如，我们可以给`checkmark`过滤器加上注解，表明它期待一个`boolean`类型的参数。
+  这可以更清楚的表明此过滤器打算做什么
 
-+makeExample('upgrade-phonecat/ts/classes/app/js/core/checkmark.filter.ts', null, 'app/js/core/checkmark.filter.ts', {otl: /(:\w+)/g})
++makeExample('upgrade-phonecat-1-typescript/ts/app/core/checkmark/checkmark.filter.ts', null, 'app/core/checkmark/checkmark.filter.ts')
+
+:marked
+  In the `Phone` service we can explicitly annotate the `$resource` service dependency
+  as an `angular.resource.IResourceService` - a type defined by the Angular 1 typings.
+  
+  在`Phone`服务中，我们可以明确的把`$resource`服务声明为`angular.resource.IResourceService`一个在Angular 1类型定义中提供的类型。
+
++makeExample('upgrade-phonecat-1-typescript/ts/app/core/phone/phone.service.ts', null, 'app/core/phone/phone.service.ts')
+
+:marked
+  We can apply the same trick to the application's route configuration file in `app.config.ts`,
+  where we are using the location and route services. By annotating them accordingly TypeScript
+  can verify we're calling their APIs with the correct kinds of arguments.
+  
+  我们可以在应用的路由配置中使用同样的技巧，那里我们用到了location和route服务。
+  一旦给它们提供了类型信息，TypeScript就能检查我们是否在用类型正确的参数来调用它们了。
+
++makeExample('upgrade-phonecat-1-typescript/ts/app/app.config.ts', null, 'app/app.config.ts')
 
 .l-sub-section
   :marked
     The [Angular 1.x type definitions](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/angularjs)
     we installed with Typings are not officially maintained by the Angular team,
-    but are quite comprehensive. Though we're not going to do it in this
-    tutorial, it is possible to make an Angular 1.x application fully
-    type-annotated with the help of these definitions.
-
+    but are quite comprehensive. It is possible to make an Angular 1.x application
+    fully type-annotated with the help of these definitions.
+    
     我们用typings工具安装的这个[Angular 1.x类型定义文件](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/angularjs)
-    并不是由Angular开发组维护的，但它也已经足够全面了。虽然我们并不打算在本教程中这么做，但借助这些类型定义给Angular 1.x程序全面加上类型注解也是可能的。
+    并不是由Angular开发组维护的，但它也已经足够全面了。借助这些类型定义的帮助，它可以为Angular 1.x程序加上全面的类型注解。
 
     If this is something we wanted to do, it would be a good idea to enable
     the `noImplicitAny` configuration option in `tsconfig.json`. This would
@@ -1687,54 +1427,52 @@ code-example(format="").
 
 :marked
   Another TypeScript feature we can make use of is *classes*. In particular, we
-  can turn our controllers into classes. That way they'll be a step
+  can turn our component controllers into classes. That way they'll be a step
   closer to becoming Angular 2 component classes, which will make our life
   easier once we do the upgrade.
 
   我们能用的另一个TypeScript特性是*类*。特别是，我们可以把控制器转换成类。
   这种方式下，我们离成为Angular 2组件类就又近了一步，它会令我们的升级之路变得更简单。
 
-  Angular 1 expects controllers to be constructor functions. That's what
-  ES2015/TypeScript classes really are, so that means we can just register a
-  class as a controller and Angular 1 will happily use it. We also won't
-  need to make any changes to our test suite as the external behavior of the
-  controllers will not change.
+  Angular 1 expects controllers to be constructor functions. That's exactly what
+  ES2015/TypeScript classes are under the hood, so that means we can just plug in a
+  class as a component controller and Angular 1 will happily use it.
 
   Angular 1期望控制器是一个构造函数。这实际上就是ES2015/TypeScript中的类，
-  这也就意味着只要我们把一个类注册为控制器，Angular 1就会愉快的使用它。
-  我们也不需要对测试套件做任何改变，因为该控制器的外在行为没有发生任何改变。
+  这也就意味着只要我们把一个类注册为组件控制器，Angular 1就会愉快的使用它。
 
-  Here's what our new class for the phone list controller looks like.
-
-  新的“电话列表(phone list)”控制器类看起来是这样的：
+  Here's what our new class for the phone list component controller looks like:
+  
+  新的“电话列表(phone list)”组件控制器类看起来是这样的：
 
 +makeExample('upgrade-phonecat/ts/classes/app/js/phone_list/phone_list.controller.ts', null, 'app/js/phone_list/phone_list.controller.ts')
 
 :marked
   What was previously done in the controller function is now done in the class
-  constructor function. The class additionally declares three members: The
-  array of phones, the name of the current sort key, and the search query. These
-  are all things we have already been attaching to the controller,
-  but that weren't explicitly declared anywhere. The last one of these isn't actually
-  used in the TypeScript code since it's only referred to in the template, but for
-  the sake of clarity we want to define all the members our controller will have.
+  constructor function. The dependency injection annotations are attached
+  to the class using a static property `$inject`. At runtime this becomes the
+  `PhoneListController.$inject` property.
 
-  以前在控制器函数中实现的一切现在都改由类的构造函数来实现了。该类额外定义了三个成员：电话列表、当前排序键的名字，以及搜索条件。
+  以前在控制器函数中实现的一切现在都改由类的构造函数来实现了。类型注入注解通过静态属性`$inject`
+  被附加到了类上。在运行时，它们变成了`PhoneListController.$inject`。
+
+  The class additionally declares three members: The array of phones, the name of
+  the current sort key, and the search query. These are all things we have already
+  been attaching to the controller but that weren't explicitly declared anywhere.
+  The last one of these isn't actually used in the TypeScript code since it's only
+  referred to in the template, but for the sake of clarity we want to define all the
+  members our controller will have.
+  
+  该类额外声明了三个成员：电话列表、当前排序键的名字，以及搜索条件。
   这些东西我们以前就加到了控制器上，只是从来没有在任何地方显式定义过它们。最后一个成员从未真正在TypeScript代码中用过，
   因为它只是在模板中被引用过。但为了清晰起见，我们还是该定义出此控制器应有的所有成员。
 
   In the Phone detail controller we'll have two members: One for the phone
-  that the user is looking at and another for the URL of the currently displayed image.
-  We can additionally introduce a TypeScript interface that explicitly defines
-  what we expect the `$routeParams` object to contain when it is
-  passed to the controller. This interface is not exported and is just used internally
-  inside this module:
+  that the user is looking at and another for the URL of the currently displayed image:
+  
+  在电话详情控制器中，我们有两个成员：一个是用户正在查看的电话，另一个是正在显示的图像：
 
-  在电话详情控制器中，我们有两个成员：一个是用户正在查看的电话，另一个是正在显示的图像的URL。
-  我们可以额外引入一个TypeScript接口，它显式定义出当`$routeParams`对象被传给控制器时，我们期望它包含哪些参数。
-  这个接口没有被导出，它只在本模块的内部使用：
-
-+makeExample('upgrade-phonecat/ts/classes/app/js/phone_detail/phone_detail.controller.ts', null, 'app/js/phone_detail/phone_detail.controller.ts')
++makeExample('upgrade-phonecat-1-typescript/ts/app/phone-detail/phone-detail.component.ts', null, 'app/phone-detail/phone-detail.component.ts')
 
 :marked
   This makes our controller code look a lot more like Angular 2 already. We're
@@ -1747,23 +1485,13 @@ code-example(format="").
   they're also constructor functions. But we only have the `Phone` factory
   in this project, and that's a bit special since it's an `ngResource`
   factory. So we won't be doing anything to it in the preparation stage.
-  We'll instead turn it directly into an Angular 2 service in the
-  next section.
-
-
-
-
-
-
+  We'll instead turn it directly into an Angular 2 service.
 
   如果项目中有任何Angular 1的服务，它们也是转换成类的优秀候选人，像控制器一样，它们也有构造函数。
   但是在本项目中，我们只有一个`Phone`工厂，这有点特别，因为它是一个`ngResource`工厂。
   所以我们不会在准备阶段中处理它，而是在下一节中直接把它转换成Angular 2服务。
 
-.l-main-section
-:marked
-  # PhoneCat Upgrade Tutorial
-  # PhoneCat升级指南
+  ## Installing Angular 2
 
   Having completed our preparation work, let's get going with the Angular 2
   upgrade of PhoneCat. We'll do this incrementally with the help of the
@@ -1779,42 +1507,79 @@ code-example(format="").
 .alert.is-important 该项目还包含一些动画，在此指南的当前版本我们先不升级它，等到后面的发行版再改。
 
 :marked
-  Let's install Angular 2 into the project. Add the Angular 2 dependencies
-  to `package.json` and `typings.json` as described in the [Quickstart](../quickstart.html).
-  Then run:
+  Let's install Angular 2 into the project, along with the SystemJS module loader. Take a look into the
+  [Quickstart](../quickstart.html) guide and get the following configurations from there:
 
-  我们来把Angular 2安装到项目中。像[“快速起步”](../quickstart.html)中描述的那样，把Angular 2的依赖包添加到`package.json`和`typings.json`中。
-  然后运行：
+  我们来使用SystemJS模块加载器把Angular 2安装到项目中。
+  看看[“快速起步”](../quickstart.html)中的指南，并从那里获得如下配置：
+  
+  * Add Angular 2 and the other new dependencies to `package.json`
+  
+  * 把添加Angular 2和其它新依赖添加到`package.json`中
+  
+  * Add the new typings into `typings.json`
+  
+  * 把这些新的类型定义添加到`typings.json`中
+  
+  * The SystemJS configuration file `systemjs.config.js` to the project root directory.
+  
+  * 把SystemJS的配置文件`systemjs.config.js`添加到项目的根目录。
+
+  Once these are done, run:
+
+  这些完成之后，就运行：
 
 code-example(format="").
   npm install
   npm run typings install
 
 :marked
-  We should then load some Angular 2 dependencies into the application by adding
-  some `&lt;script>` tags to `index.html`. They should go before the `&lt;script>` tag
-  that loads `systemjs.config.js`:
+  We can soon load Angular 2 dependencies into the application via `index.html`,
+  but first we need to do some directory path adjustments. This is because we're going
+  to need to load files from `node_modules` and the project root, whereas so far
+  in this project everything has been loaded from the `/app` directory.
+  
+  我们可以通过`index.html`来把Angular 2的依赖快速加载到应用中，
+  但首先，我们得做一些目录结构调整。这是因为我们正准备从`node_modules`中加载文件，然而目前项目中的每一个文件都是从`/app`目录下加载的。
 
-  然后，通过往`index.html`中添加一些`&lt;script>`标签，我们把一些Angular 2依赖包加载到程序中。
-  它们应该位于加载`systemjs.config.js`的`&lt;script>`标签之前：
+  Move the `app/index.html` file to the project root directory. Then change the
+  development server root path in `package.json` to also point to the project root
+  instead of `app`:
+  
+  把`app/index.html`移入项目的根目录，然后把`package.json`中的开发服务器根目录也指向项目的根目录，而不再是`app`目录：
 
-+makeExample('upgrade-phonecat/ts/ng2_initial/app/index.html', 'ng2')
++makeJson('upgrade-phonecat-2-hybrid/ts/package.ng1.json', {paths: 'scripts.start'}, 'package.json')
 
 :marked
-  We can then load Angular 2 itself by adding its packages into the `systemjs.config.js`
-  file:
+  Now we're able to serve everything from the project root to the web browser. But we do *not*
+  want to have to change all the image and data paths used in the application code to match
+  our development setup. For that reason, we'll add a `<base>` tag to `index.html`, which will
+  cause relative URLs to be resolved back to the `/app` directory:
+  
+  现在，我们能把项目根目录下的每一样东西发给浏览器了。但我们并不想修改在应用代码中用到的每一个图片和数据的路径，
+  以适应我们开发环境中的设置。因此，我们往`index.html`中添加一个`<base>`标签，它将导致各种相对路径被解析回`/app`目录：
 
-  然后我们就可以把它的npm包添加到`systemjs.config.js`文件中来加载Angular 2本身：
-
-+makeExample('upgrade-phonecat/ts/ng2_initial/app/systemjs.config.js', null, 'app/systemjs.config.js')
++makeExample('upgrade-phonecat-2-hybrid/ts/index.html', 'base', 'index.html')
 
 :marked
-  While we're at it, let's also make these files available to unit tests by
-  updating the Karma config:
+  Now we can load Angular 2 via SystemJS. We'll add the Angular 2 polyfills and the
+  SystemJS config to the end of the `<head>` section, and then we'll use `System.import`
+  to load the actual application:
+  
+  现在我们可以通过SystemJS加载Angular 2了。我们将把Angular 2的填充库(polyfills)
+  和SystemJS的配置加到`<head>`区的末尾，然后，我们就用`System.import`来加载实际的应用：
 
-  既然我们已经到这里了，那就干脆同时更新一下Karma配置，让这些文件也能在单元测试中可用：
++makeExample('upgrade-phonecat-2-hybrid/ts/index.html', 'ng2', 'index.html')
 
-+makeExample('upgrade-phonecat/ts/ng2_initial/test/karma.conf.1.js', 'ng2', 'test/karma.conf.js')
+:marked
+  In the `systemjs.config.js` file we got from the Quickstart we also need to make a couple
+  of adjustments because of our project structure. We want to point the browser to the project
+  root when loading things through SystemJS, instead of using the  `<base>` URL:
+  
+  在我们从“快速起步”中拿来的`systemjs.config.js`文件中，我们还需要做一些调整，以适应我们的项目结构。
+  在使用SystemJS而不是`<base>` URL加载时，我们需要把浏览器指向项目的根目录。
+
++makeExample('upgrade-phonecat-2-hybrid/ts/systemjs.config.1.js', 'paths', 'systemjs.config.js')
 
 :marked
   ## Bootstrapping A Hybrid 1+2 PhoneCat
@@ -1823,78 +1588,72 @@ code-example(format="").
   What we'll do next is bootstrap the application as a *hybrid application*
   that supports both Angular 1 and Angular 2 components. Once we've done that
   we can start converting the individual pieces to Angular 2.
-
+  
   我们后面将做的就是把该应用程序引导为一个同时支持Angular 1和Angular 2的*混合式应用*。
   一旦我们做完了，就能开始把这些不可分割的小块儿转换到Angular 2了.
 
-  At this point we need to do add the Angular 2 type definitions
-  into `app.ts`, so that the TypeScript compiler knows what we're talking about
-  when we use Angular 2 APIs. Unlike with Angular 1, we don't need to install
-  these type definitions with Typings because Angular 2 comes with them included.
-  What we do need to do is set the TypeScript compiler's `moduleResolution` option
-  to `node`, so that it knows to look for these definitions from the `angular2` NPM
-  package.
-
-  此时，我们就需要把Angular 2类型定义添加到`app.ts`中了，这样当使用Angular 2 API的时候，
-  TypeScript编译器才能知道我们在说什么。和Angular 1中不同，我们不需要借助typings来安装这些类型定义文件，
-  因为Angular 2自带了它们。我们所要做的就是把TypeScript编译器的`moduleResolution`选项设置为`node`，
-  来让编译器知道应该从`angular2`这个NPM包中查找这些类型定义。
-
-+makeJson('upgrade-phonecat/ts/ng2_initial/tsconfig.1.json', null, 'tsconfig.json', {otl: /(\"moduleResolution.*)/})
-
-:marked
-  To boostrap a hybrid application, we first need to initialize an `UpgradeAdapter`,
+  To bootstrap a hybrid application, we first need to initialize an `UpgradeAdapter`,
   which [provides the glue](#upgrading-with-the-upgrade-adapter) that joins the two
-  versions of the framework together. Let's import the `UpgradeAdapter` class into
-  `app.module.ts`:
+  versions of the framework together. Let's import the `UpgradeAdapter` class into a
+  new file `app/main.ts`. This file has been configured as the application entrypoint
+  in `systemjs.config.js`, so it is already being loaded by the browser.
+  
+  要引导一个混合式应用，我们首先得初始化一个`UpgradeAdapter`，它[提供了胶水](#upgrading-with-the-upgrade-adapter)
+  来把框架的两个不同版本粘在一起。我们在一个新文件`app/main.ts`中导入`UpgradeAdapter`类。
+  这个文件已经在`systemjs.config.js`文件中被配置成了应用的入口点，所以它已经被浏览器加载了。
 
-  要引导一个混合式应用，我们首先得初始化一个`UpgradeAdapter`，它[提供了“胶水”](#upgrading-with-the-upgrade-adapter)来把两个版本的框架粘在一起。
-  我们来把`UpgradeAdapter`类导入`app.module.ts`中：
-
-+makeExample('upgrade-phonecat/ts/ng2_initial/app/js/app.module.ts', 'adapter-import', 'app/js/app.module.ts')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/main.ts', 'import-adapter', 'app/main.ts')
 
 :marked
   We can then make an adapter by instantiating the class:
 
   然后我们可以制作一个适配器来实例化这个类：
 
-+makeExample('upgrade-phonecat/ts/ng2_initial/app/js/core/upgrade_adapter.ts', 'adapter-init')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/main.ts', 'init-adapter')
 
 :marked
-  Now we can use that adapter to bootstrap our application as a hybrid.
-  Instead of calling `angular.bootstrap`, we must call
-  `upgradeAdapter.bootstrap`, but the function arguments remain the same:
-  They are still the element that will become the root of the application,
-  and the names of the root Angular 1.x modules that we want to include:
+  Our application is currently bootstrapped using the Angular 1 `ng-app` directive
+  attached to the `<html>` element of the host page. This will no longer work with
+  Angular 2. We should switch to a JavaScript-driven bootstrap instead. So, remove the
+  `ng-app` attribute from `index.html`, and instead add this to `main.ts`:
+  
+  我们的应用现在是使用宿主页面中附加到`<html>`元素上的`ng-app`指令引导的。
+  但在Angular 2中，它不再工作了。我们得切换成JavaScript驱动的引导方式。
+  所以，从`index.html`中移除`ng-app`属性，并把这些加载`main.ts`中：
 
-  现在，我们就能使用这个适配器来把我们的应用引导为混合式应用了。我们必须调用`upgradeAdapter.bootstrap`以代替`angular.bootstrap`函数，
-  但函数的参数跟以前是一样的：第一个仍然是那个将用作该应用程序根节点的元素，第二个仍然是我们要包含的那个Angular 1.x根模块的名字。
-
-+makeExample('upgrade-phonecat/ts/ng2_initial/app/js/app.module.ts', 'bootstrap')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/main.ts', 'bootstrap')
 
 :marked
-  We are now running both Angular 1 and 2 at the same time. That's pretty
+  The arguments used here are the root element of the application (which is
+  the same element we had `ng-app` on earlier), and the Angular 1.x modules
+  that we want to load. Since we're bootstrapping the app through
+  an `UpgradeAdapter`, we're actually now running the app as a hybrid Angular 1+2
+  app.
+  
+  这里使用的参数是应用的根元素(也就是以前我们放`ng-app`的元素)，和我们准备加载的Angular 1.x模块。
+  由于我们是通过`UpgradeAdapter`引导应用的，所以实际在运行的应用实际上是一个Angular 1+2的混合体。
+
+  This means we are now running both Angular 1 and 2 at the same time. That's pretty
   exciting! We're not running any actual Angular 2 components yet though,
   so let's do that next.
 
-
   我们现在同时运行着Angular 1和Angular 2。漂亮！不过我们还没有运行人和实际的Angular 2组件，接下来我们就做这件事。
 :marked
-  ## Upgrading the Phone factory
-  ## 升级`Phone`工厂
+  ## Upgrading the Phone service
+  ## 升级`Phone`服务
 
-  The first piece we'll port over to Angular 2 is the `Phone` factory, which
-  resides in `app/js/core/phones.factory.ts` and makes it possible for controllers
+  The first piece we'll port over to Angular 2 is the `Phone` service, which
+  resides in `app/core/phone/phone.service.ts` and makes it possible for components
   to load phone information from the server. Right now it's implemented with
   ngResource and we're using it for two things:
 
   我们要移植到Angular 2的第一块儿是`Phone`工厂(位于`app/js/core/phones.factory.ts`)，
   并且让它能帮助控制器从服务器上加载电话信息。目前，它是用`ngResource`实现的，我们用它做两件事：
 
-  * For loading the list of all phones into the phone list controller
-  * 把所有电话的列表加载到电话列表控制器中。
-  * For loading the details of a single phone into the phone detail controller.
-  * 把一台电话的详情加载到电话详情控制器中。
+  * For loading the list of all phones into the phone list component
+  * 把所有电话的列表加载到电话列表组件中。
+  * For loading the details of a single phone into the phone detail component.
+  * 把一台电话的详情加载到电话详情组件中。
 
   We can replace this implementation with an Angular 2 service class, while
   keeping our controllers in Angular 1 land. In the new version we'll just use
@@ -1905,11 +1664,11 @@ code-example(format="").
 
   Before the `Http` service is available for injection, we need to register
   it into our application's dependency injector. We should import the `HTTP_PROVIDERS`
-  constant in `app.module.ts`:
+  constant in `main.ts`:
 
   要让`Http`服务在注入时可用，我们得先把它注册进我们应用程序的依赖注入器中。我们要把`HTTP_PROVIDERS`常量导入到`app.module.ts`中：
 
-+makeExample('upgrade-phonecat/ts/ng2_initial/app/js/app.module.ts', 'http-import')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/main.ts', 'import-http')
 
 :marked
   In a regular Angular 2 application we would now pass `HTTP_PROVIDERS` into
@@ -1927,17 +1686,15 @@ code-example(format="").
 
   这就是为什么我们必须单独把`HTTP_PROVIDERS`注册进`UpgradeAdapter`。为此，它提供了一个叫做`addProvider`的方法：
 
-+makeExample('upgrade-phonecat/ts/ng2_initial/app/js/app.module.ts', 'add-http-providers')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/main.ts', 'add-http')
 
 :marked
-  Now we're ready to upgrade the Phones factory itself. We'll put the Angular 2
-  implementation in a new file called `phones.service.ts` in the core module. It will be a TypeScript
-  class decorated as `@Injectable`:
+  Now we're ready to upgrade the Phone service itself. We replace the ngResource-based
+  service in `phone.service.ts` with a TypeScript class decorated as `@Injectable`:
 
-  现在，我们已经准备好了升级`Phones`工厂本身。我们将把Angular 2的实现放进`core`模块中一个名叫`phones.service.ts`的新文件中。
-  它将是一个带有`@Injectable`装饰器的类：
+  现在，我们已经准备好了升级`Phones`服务本身。我们将为`phone.service.ts`文件中基于ngResource的服务加上`@Injectable`装饰器：
 
-+makeExample('upgrade-phonecat/ts/ng2_initial/app/js/core/phones.service.ts', 'class', 'app/js/core/phones.service.ts')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/core/phone/phone.service.ts', 'classdef', 'app/core/phone/phone.service.ts')
 
 :marked
   The `@Injectable` decorator will attach some dependency injection metadata
@@ -1950,6 +1707,7 @@ code-example(format="").
   就像在[依赖注入指南](../guide/dependency-injection.html)中描述过的那样，
   这是一个标记装饰器，我们要把它用在那些没有其它Angular 2装饰器但仍然有依赖需要被注入进来的类上。
 
+
   In its constructor the class expects to get the `Http` service. It will
   be injected to it and it is stored as a private field. The service is then
   used in the two instance methods, one of which loads the list of all phones,
@@ -1958,23 +1716,23 @@ code-example(format="").
   在它的构造函数中，该类期待一个`Http`服务。`Http`服务将被注入进来并存入一个私有字段。
   然后该服务在两个实例方法中被使用到，一个加载所有电话的列表，另一个加载一台指定电话的详情：
 
-+makeExample('upgrade-phonecat/ts/ng2_initial/app/js/core/phones.service.ts', 'fullclass')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/core/phone/phone.service.ts', 'fullclass')
 
 :marked
-  The methods now return Observables of type `Phone` and `Phone[]`. This is
+  The methods now return Observables of type `PhoneData` and `PhoneData[]`. This is
   a type we don't have yet, so let's add a simple interface for it:
 
   该方法现在返回一个`Phone`类型或`Phone[]`类型的可观察对象(Observable)。
   这是一个我们从未用过的类型，因此我们得为它新增一个简单的接口：
 
-+makeExample('upgrade-phonecat/ts/ng2_initial/app/js/core/phones.service.ts', 'phone-interface', 'app/js/core/phones.service.ts')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/core/phone/phone.service.ts', 'phonedata-interface', 'app/core/phone/phone.service.ts')
 
 :marked
   Here's the full, final code for the service:
 
   最终，该类的全部代码如下：
 
-+makeExample('upgrade-phonecat/ts/ng2_initial/app/js/core/phones.service.ts', 'full', 'app/js/core/phones.service.ts')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/core/phone/phone.service.ts', null, 'app/core/phone/phone.service.ts')
 
 :marked
   Notice that we're importing the `map` operator of the RxJS `Observable` separately.
@@ -1984,408 +1742,167 @@ code-example(format="").
   注意，我们单独导入了RxJS `Observable`中的`map`操作符。
   我们需要对想用的所有RxJS操作符这么做，因为Angular 2默认不会加载所有RxJS操作符。
 
-  The new `Phones` service now has the same features that the original, ngResource based
-  service did. You can remove the old `phones.factory.ts` file. Now we just
-  need to register the new service into the application, so that our Angular 1
-  controllers will be able to use it.
+  The new `Phone` service now has the same features that the original, ngResource based
+  service did. Now we just need to register the new service into the application, so that
+  our Angular 1 components will be able to use it.
 
-  这个新的`Phones`服务现在有了和原来基于`ngResource`的服务相同的特性。你可以移除老的`phones.factory.ts`文件了。
+  这个新的`Phones`服务现在有了和原来基于`ngResource`的服务相同的特性。
   现在只要把这个新服务注册进应用程序，我们的Angular 1控制器就能使用它了。
 
+
   `UpgradeAdapter` has a `downgradeNg2Provider` method for the purpose of making
-  Angular 2 services available to Angular 1 code. The problem is that we don't have
-  our `UpgradeAdapter` available in `core.module.ts` where the `Phones` service should
-  be registered. We only have it in `app.module.ts`. There should only be one
-  `UpgradeAdapter` in an application, so we need to find a way to share our
-  instance between the two code modules.
+  Angular 2 services available to Angular 1 code. We can use it to plug in our
+  `Phone` service:
+  
+  `UpgradeAdapter`有个`downgradeNg2Provider`方法就是用来让Angular 2的服务在Angular 1的代码中可用的。
+  我们可以使用它来插入我们的`Phone`服务：
 
-  `UpgradeAdapter`有个`downgradeNg2Provider`就是用于让Angular 2的服务在Angular 1的代码中可用的。
-  问题是我们的`UpgradeAdapter`在将用来注册`Phones`服务的`core.module.ts`中还不可用。
-  它只在`app.module.ts`中有一个实例，而且它在一个应用程序中只应该有一个，所以我们得找到一种方法把该实例在两个代码模块中共享。
-
-  What we'll do is create a new module that instantiates `UpgradeAdapter`
-  and exports the instance. We can then just pull it in wherever we need it,
-  so that we're using the same object everywhere. Let's put this new file
-  under `core`:
-
-  我们要做的就是创建一个新模块，它实例化`UpgradeAdapter`，并导出其实例。然后我们还要能在需要的地方获取它，
-  以便我们在任何地方都用同一个实例。我们来把这个新文件放在`core`下：
-
-+makeExample('upgrade-phonecat/ts/ng2_initial/app/js/core/upgrade_adapter.ts', 'full', 'app/js/core/upgrade_adapter.ts')
-
-:marked
-  In `app.module.ts` we should now just import this adapter instead of making a separate one:
-
-  在`app.module.ts`中，我们应该导入这个适配器，而不是自己做一份独立的：
-
-+makeExample('upgrade-phonecat/ts/ng2_initial/app/js/app.module.ts', 'adapter-state-import')
-
-:marked
-  Also remove the line from `app.module.ts` that is instantiating `UpgradeAdapter`. It's no
-  longer needed since we import the instance from elsewhere.
-
-  同时从`app.module.ts`中移除实例化`UpgradeAdapter`的那行。它已经无用了，因为我们在任何地方都将导入那个唯一的实例。
-
-  We'll then do the same in `core.module.ts` as well. Then we can register the `Phones` service into it.
-  While doing that, we can remove the module's dependency to `ngResource`, which
-  we're no longer using.
-
-  我们在`core.module.ts`中也做同样的事情，然后我们就能把`Phones`服务注册到它里面了。
-  同时，我们可以移除该模块对`ngResource`的依赖，我们不再用它了。
-
-+makeExample('upgrade-phonecat/ts/ng2_initial/app/js/core/core.module.ts', null, 'app/js/core/core.module.ts')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/main.ts', 'phone-service', 'app/main.ts')
 
 :marked
   Note that we actually needed to do two registrations here:
 
   注意，我们实际上做了两次注册：
 
-  1. Register `Phones` as an **Angular 2 provider** with the `addProvider`
+  1. Register `Phone` as an **Angular 2 provider** with the `addProvider`
      method. That's the same method that we used earlier for `HTTP_PROVIDERS`.
+     
+  1. 用`addProvider`方法注册了一个名叫`Phone`的**Angular 2供应商**。这和我们以前使用`HTTP_PROVIDERS`的方法一样。
+  
+  2. Register an **Angular 1 factory** called `phone`, which will be a *downgraded*
+     version of the `Phone` Angular 2 service.
+  
+  2. 注册了一个名叫`phone`的**Angular 1工厂**，它是一个`Phones`服务的*降级*版。
+  
+  Now that we are loading `phone.service.ts` through an import that is resolved
+  by SystemJS, we should **remove the `<script>` tag** for the service from `index.html`.
+  This is something we'll do to all our components as we upgrade them. Simultaneously
+  with the Angular 1 to 2 upgrade we're also migrating our code from scripts to modules.
+  
+  现在，我们正在用SystemJS加载`phone.service.ts`，我们应该从`index.html`中**移除该服务的`<script>`标签**。
+  这也是我们在升级所有组件时将会做的事。在从Angular 1向2升级的同时，我们也把代码从脚本移植为模块。
 
-  1. 用`addProvider`方法注册了一个名叫`Phones`的**Angular 2供应商**。这和我们以前使用`HTTP_PROVIDERS`的方法一样。
-
-  2. Register an **Angular 1 factory** called `phones`, which will be a *downgraded*
-     version of the `Phones` service.
-
-  2. 注册了一个名叫`phones`的**Angular 1工厂**，它是一个`Phones`服务的*降级*版。
-
-  At this point we can switch our two controllers to use the new service
-  instead of the old one. We `$inject` it as the downgraded `phones` factory,
-  but it's really an instance of the `Phones` class and we can annotate its type
+  At this point we can switch our two components to use the new service
+  instead of the old one. We `$inject` it as the downgraded `phone` factory,
+  but it's really an instance of the `Phone` class and we can annotate its type
   accordingly:
-
+  
   这时，我们可以把两个控制器从使用老的服务切换成使用新的。我们像降级过的`phones`工厂一样`$inject`它，
   但它实际上是一个`Phones`类的实例，并且我们可以据此注解它的类型：
 
-+makeExample('upgrade-phonecat/ts/ng2_initial/app/js/phone_detail/phone_detail.controller.ts', null, 'app/js/phone_detail/phone_detail.controller.ts')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.component.ng1.ts', null, 'app/phone-list/phone-list.component.ts')
+
++makeExample('upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.ng1.ts', null, 'app/phone-detail/phone-detail.component.ts')
 
-+makeExample('upgrade-phonecat/ts/ng2_initial/app/js/phone_list/phone_list.controller.ts', null, 'app/js/phone_list/phone_list.controller.ts')
 
 :marked
-  What we have here are two Angular 1 controllers using an Angular 2 service!
-  The controllers don't need to be aware of this, though the fact that the
+  What we have here are two Angular 1 components using an Angular 2 service!
+  The components don't need to be aware of this, though the fact that the
   service returns Observables and not Promises is a bit of a giveaway.
   In any case, what we've achieved is a migration of a service to Angular 2
   without having to yet migrate the controllers that use it.
 
   这里的两个Angular 1控制器在使用Angular 2的服务！控制器不需要关心这一点，尽管实际上该服务返回的是可观察对象(Observable)，而不是承诺(Promise)。
-  无论如何，我们达到的效果都是把服务移植到Angular 2，而不用被迫移植控制器来使用它。
+  无论如何，我们达到的效果都是把服务移植到Angular 2，而不用被迫移植组件来使用它。
 
 .alert.is-helpful
   :marked
-    You could use the `toPromise` method of `Observable` to turn those Observables
-    into Promises in the service to further reduce the amount of changes
-    needed in controller code.
-
-    你可以使用`Observable`的`toPromise`方法来在服务中把这些可观察对象转变成承诺，以进一步减小控制器中需要修改的代码量。
+    We could also use the `toPromise` method of `Observable` to turn those
+    Observables into Promises in the service. This can in many cases further
+    reduce the amount of changes needed in the component controllers.
+    
+    我们也能使用`Observable`的`toPromise`方法来在服务中把这些可观察对象转变成承诺，以进一步减小组件控制器中需要修改的代码量。
 
 :marked
-  To bring our test suite up to speed with the changes, we should update the Karma
-  test shim. It'll make some of Angular 2 providers available before starting
-  to load any of the spec files:
+  ## Upgrading Components
+  
+  ## 升级组件
 
-  要让我们的测试套件跟上修改的速度，我们得更新Karma的测试垫片。它将在开始加载这些规约(`spec`)文件时，让Angular 2中的供应商可用。
-
-+makeExample('upgrade-phonecat/ts/ng2_initial/test/karma_test_shim.js', null, 'test/karma_test_shim.js')
-
-.alert.is-important The shim is likely to be replaced by improved tooling, but is needed right now.
-
-.alert.is-important 垫片(shim)可能会被改进过的工具所取代，但目前我们还需要它。
-
-:marked
-  Now, let's look at the tests for the service itself. What we used to have in
-  `phones_factory_spec.js` was a fairly simple test that simply checks if
-  the factory exists and is available for injection. We can now do that same
-  test in Angular 2. Rename `phones.factory.spec.ts` to `phones.service.spec.ts` and
-  set the contents as follows:
-
-  现在，我们看看该服务本身的测试。我们要在`phones_factory_spec.js`中用到的是相当简单的测试，它用于检查该工厂是否存在，以及是否能用于注入。
-  我们现在就能在Angular 2中做同样的测试。把`phones.factory.spec.ts`改名为`phones.service.spec.ts`，并写入如下代码：
-
-+makeExample('upgrade-phonecat/ts/ng2_initial/test/unit/phones.service.spec.ts', null, 'test/unit/phones.service.spec.ts')
-
-:marked
-  Here we first load the `Phones` provider and then test that an instance of
-  `Phones` can in fact be injected. We also need to load `HTTP_PROVIDERS` since
-  it is a dependency of `Phones`.
-
-  我们先加载`Phones`供应商，然后测试是否一个`Phones`的实例能被注入。我们还需要加载`HTTP_PROVIDERS`，因为它是`Phones`的依赖之一。
-
-  For the controller tests, we can first of all at this point get rid of the
-  custom `toEqualData` custom matcher. It was added because `ngResource` attaches
-  attributes to the data that we don't want to compare in tests. We're no longer
-  using `ngResource`, so we can simply use the built-in `toEqual` for comparisons.
-  This means we can remove the `test/jasmine_matchers.d.ts` file at this point.
-
-  对于这些控制器的测试，我们可以首先摆脱惯用的自定义匹配器`toEqualData`。
-  当初引入它是因为`ngResource`会把一些属性加到数据上，而我们不想在测试中比较它们。
-  我们不再使用`ngResource`了，所以我们可以简单地使用内建的`toEqual`函数来进行比较。
-  这意味着我们这时也可以移除`test/jasmine_matchers.d.ts`文件了。
-
-  Now, in the phone detail controller we have been testing that the phone details
-  with the id given in the route params are fetched over HTTP and put on the
-  scope. We can continue doing that, but we'll need to change the structure of the
-  test a bit. Instead of using the Angular 1 mock HTTP backend, we'll just mock out
-  the `get` method of the `Phones` service, which is what the controller is now
-  using to load what it needs. As the mocked value, we're returning an Observable
-  that will emit a single value - the mock phone data:
-
-  现在，在电话详情控制器中，我们已经测试了能通过HTTP取得路由参数中的ID所指定的那款电话的详情信息，并把它放到作用域(scope)上。
-  我们可以继续这样做，不过我们需要改动一点点该测试的结构。我们不再使用Angular 1模拟HTTP后端，
-  而是直接模拟出`Phones`服务的`get`方法，该控制器现在就是用它来加载所需数据的。作为被模拟的值，
-  我们返回一个会发出单一值的可观察对象(Observable) —— 模拟的电话数据：
-
-+makeExample('upgrade-phonecat/ts/ng2_initial/test/unit/phone_detail.controller.spec.ts', null, 'test/unit/phone_detail.controller.spec.ts')
-
-.alert.is-important
-  :marked
-    We're doing a manual `Phones` instantiation because hybrid apps can't be
-    bootstrapped for unit tests at the moment, which means that Angular 2
-    dependencies can't be made available. This is likely to change.
-
-    我们手工实例化了`Phones`，因为目前混合式应用还不能用于在单元测试中引导，这意味着Angular 2的依赖将不可用。
-    这问题将来可能会解决。
-
-:marked
-  In the phone list controller we'll do something very similar: We mock out the `query`
-  method of the `Phones` service, and check that the controller makes the resulting
-  value available:
-
-  在电话列表控制器中，我们将做一些类似的事情：我们模拟出`Phones`服务的`query`方法，并检查控制器得到的值是否可用：
-
-+makeExample('upgrade-phonecat/ts/ng2_initial/test/unit/phone_list.controller.spec.ts', null, 'test/unit/phone_list.controller.spec.ts')
-
-:marked
-  ## Upgrading Controllers to Components
-  ## 把控制器升级成组件
-
-  Next, let's upgrade our Angular 1 controllers to Angular 2 components. We'll
+  Next, let's upgrade our Angular 1 components to Angular 2 components. We'll
   do it one at a time, while still keeping the application in hybrid mode.
   As we make these conversions, we'll also be defining our first Angular 2 *pipes*.
-
+  
   接下来，我们把Angular 1的控制器升级成Angular 2的组件。我们每次升级一个，同时仍然保持应用运行在混合模式下。
   在做转换的同时，我们还将自定义首个Angular 2*管道*。
+  
 
-  Let's look at the phone list controller first. Right now it is a TypeScript class,
-  which is paired with an HTML template by the route configuration in `app.ts`.
-  We'll be turning it into an Angular 2 component.
-
-  首先我们来看看电话列表控制器。目前，它是一个TypeScript类，通过`app.ts`中的路由配置和一个HTML模板成对使用。
-  我们将把它转变成Angular 2组件。
-
-  Rename `phone_list.controller.ts` to `phone_list.component.ts`. Then rename the controller class
-  inside to just `PhoneList` and decorate it as a `@Component`:
-
-  把`phone_list.controller.ts`改名为`phone_list.component.ts`。然后把控制器的类名改为只剩下`PhoneList`，并且给它添加一个`@Component`装饰器：
-
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list_without_pipes.component.ts', 'top', 'app/js/phone_list/phone_list.component.ts')
+  Let's look at the phone list component first. Right now it contains a TypeScript
+  controller class and a component definition object. We can morph this into
+  an Angular 2 component by just renaming the controller class and turning the
+  Angular 1 component definition object into an Angular 2 `@Component` decorator.
+  We can then also remove the static `$inject` property from the class:
+  
++makeExample('upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.component.ts', 'initialclass', 'app/phone-list/phone-list.component.ts')
 
 :marked
   The `selector` attribute is a CSS selector that defines where on the page the component
-  should go. It will match elements by the name of `pc-phone-list`. It is a good idea
-  to always use application-specific prefixes in selectors so that they never clash with
-  built-in ones, and here we're using `pc-`, which is short for "PhoneCat".
-
-  `selector`属性是一个CSS选择器，它定义出该组件在页面中放在哪里。它将根据`pc-phone-list`这个名字来匹配元素。
-  总是在选择器中使用应用特有的前缀是个好主意，这样它们就永远不会和内建的名字冲突了，这里我们使用的是`pc-`前缀，它是"PhoneCat"的缩写。
-
-  The `templateUrl` defines the location of the component template. It points to our existing
-  template file
-
-  `templateUrl`属性定义了组件模板的位置，它指向一个现有的模板文件。
-
-  Both of these attributes are things that were defined *externally* for the controller,
-  but for the component are things that it defines *itself*. This will affect how we use
-  the component in the router.
-
-  所有这些属性都是在控制器的外部定义的，但对组件来说却是*它自己*定义的。这将影响到我们如何在路由器中使用该组件。
-
-:marked
+  should go. In Angular 1 we do matching based on component names, but in Angular 2 we
+  have these explicit selectors. This one will match elements with the name `phone-list`,
+  just like the Angular 1 version did.
+  
   We now also need to convert the template of this component into Angular 2 syntax.
-  In the search controls we need to use Angular 2 syntax for the two `ngModel`s
+  In the search controls we need to use Angular 2 syntax for the two `ngModel`s.
+  We should also no longer use the `$ctrl` prefix in expressions:
 
-  现在，我们得把组件的模板转换成Angular 2的语法。在搜索控件中，我们要对两个`ngModel`改用Angular 2的语法：
-
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list_without_pipes.html', 'controls', 'app/js/phone_list/phone_list.html')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.template.html', 'controls', 'app/phone-list/phone-list.template.html')
 
 :marked
-  In the list we need to replace the `ng-repeat` with an `*ngFor` and its
-  `#var of iterable` syntax, which is [described in our
+  In the list we need to replace the `ng-repeat` with an `*ngFor` and the
+  `let var of iterable` syntax, which is [described in our
   Template Syntax guide](../guide/template-syntax.html#directives).
-
+  For the images, we can replace `ng-src` with a binding to the standard `src` property.
+  
   在列表中，我们需要把`ng-repeat`替换为`*ngFor`以及它的`let var of iterable`语法，
   该语法在[模板语法指南中讲过](../guide/template-syntax.html#directives)。
+  对于图片，我们可以把`ng-src`替换为一个标准的`src`属性(property)绑定。
 
-  For the images, we can replace `ng-src` with the standard `src`, but will use a
-  property binding. Note that we're also adding a `name` CSS class for the phone name.
-  This is something we'll need for our Protractor tests:
-
-  对图片，我们需要把`ng-src`替换为标准的`src`，但这次将使用一个属性(property)绑定。注意，我们也为电话的名称添加了CSS类`name`。
-  这个类我们将在Protractor测试中用到：
-
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list_without_pipes.html', 'list', 'app/js/phone_list/phone_list.html')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.template.html', 'list', 'app/phone-list/phone-list.template.html')
 
 :marked
-  In the module file we're going to plug this component into our application. Instead
-  of registering a controller, we register a `pcPhoneList` directive.
-  The directive is a downgraded version of our component, and the `UpgradeAdapter`
+  Another thing that we've done here is that we've removed the use of `filter` and `orderBy` filters,
+  and replaced them with a call to the `getPhones()` controller method.
+  The built-in Angular filters `filter` and `orderBy` do not exist in Angular 2,
+  so we need to do the filtering and sorting ourselves. We could define our own Angular 2
+  pipes for this purpose, but in this case it is more convenient to just implement the filtering
+  and ordering logic in the component itself. We expect the `getPhones()` method to return a collection
+  where the current filtering and ordering has been applied.
+  
+  我们在这里做的另一件事就是移除了`filter`和`orderBy`过滤器的使用，并把它们换成对控制器中`getPhones()`方法的调用。
+  内建的`filter`和`orderBy`在Angular 2中已经不存在了，所以我们得自己进行过滤和排序。
+  我们可以为此定义自己的Angular 2管道，但是在这个案例中，在组件本身实现过滤和排序逻辑反倒更方便。
+  我们希望`getPhones()`方法直接返回一个应用过当前过滤和排序规则的集合。
+
++makeExample('upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.component.ts', 'getphones', 'app/phone-list/phone-list.component.ts')
+
+:marked
+  In the entrypoint file `main.ts` we're going to plug this component into our application. Instead
+  of registering a component, we register a `phoneList` *directive*.
+  The directive is a downgraded version of our Angular 2 component, and the `UpgradeAdapter`
   handles the bridging between the two:
 
   在模块文件中，我们将把这个组件插入到程序中。我们不再注册控制器，而是注册一个`pcPhoneList`指令。
   该指令是我们那个组件的降级版本，`UpgradeAdapter`负责桥接它们：
 
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list.module.ts', null, 'app/js/phone_list/phone_list.module.ts')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/main.ts', 'phone-list', 'app/main.ts')
 
 :marked
   The `<angular.IDirectiveFactory>` type annotation here is to let the TypeScript compiler
   know that the return value of the downgrade method call will be something that can be
   used as a directive factory.
 
-  这里的`<angular.IDirectiveFactory>`类型注解是为了让TypeScript编译器知道这个降级方法(`downgradeNg2Component`)的返回值能作为指令工厂使用。
+  这里的`<angular.IDirectiveFactory>`类型注解是为了让TypeScript编译器知道这个
+  降级方法(`downgradeNg2Component`)的返回值能作为指令工厂使用。
 
-  To complete the switch, we should change our route configuration in `app.module.ts`.
-  Instead of using the controller and template, it can just instantiate our component.
-  We can do that by using a simple template that uses the directive
-  we just registered:
+  At this point, also remove the `<script>` tag for the phone list component from `index.html`.
+  
+  这时，也从`index.html`中移除电话列表组件的`<script>`标签。
 
-  要完成这次切换，还应该在`app.module.ts`中改变我们的路由配置。
-  不使用控制器和模板，也能实例化我们的组件。借助一个带有刚注册的这个指令的简单模板，我们就能做到这一点：
+  Now we can start looking at our other component, which is the one for
+  the phone details. Set the contents of `phone-detail.component.ts` as follows:
+  
+  现在我们可以开始看看另一个组件，那就是电话详情。把`phone-detail.component.ts`的内容设置为这样：
 
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/app.module.ts', 'list-route')
-
-:marked
-  When the application runs, the Angular 1.x directive compiler will match
-  the element in the template to the `pcPhoneList` directive, which is actually
-  an Angular 2 component!
-
-  当应用程序运行起来时，Angular 1.x的指令编译器将匹配到模板中适用于`pcPhoneList`指令的元素，它实际上是个Angular 2组件！
-
-  The remaining issue with the phone list is the use of filters in its
-  template: It is referring to the `filter` filter and the `orderBy` filter,
-  and relying on them to filter and sort the phone list, respectively.
-  These pipes do not exist in Angular 2, so we're going to need to do
-  the filtering and sorting ourselves. Let's define a couple of pipes that
-  get the job done.
-
-  电话列表剩下的问题就是模板中过滤器的使用：它引用了`filter`过滤器和`orderBy`过滤器，
-  并依靠它们来对电话列表进行过滤和排序。这些管道在Angualr 2中不存在，所以我们得自己实现过滤和排序功能。
-  我们来定义两个管道来完成这项工作。
-
-.alert.is-helpful
-  :marked
-    If you want to learn more about how pipes in Angular 2
-    work, we have [a whole guide on the subject](../guide/pipes.html)
-    available!
-
-    如果你想学习关于Angular 2中管道的更多知识，我们在开发指南中有[一个完整的主题](../guide/pipes.html)讲它们。
-
-:marked
-  For filtering, we'll have a pipe called `PhoneFilterPipe`. It works like
-  the `filter` filter in Angular 1 in that it filters a collection of objects,
-  matching properties within the objects. But, as opposed to `filter`,
-  this pipe is specialized to filter `Phone` objects and we can use
-  type annotations to make this explicit:
-
-  要想过滤，我们得有一个名叫`PhoneFilterPipe`的管道。它工作起来就像Angular 1中的`filter`过滤器，它会过滤一组对象，并匹配对象中的属性。
-  但是，与`filter`相反，这个管道只能过滤`Phone`对象，而且我们会通过类型注解把它明确标示出来：
-
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_filter.pipe.ts', null, 'app/js/phone_list/phone_filter.pipe.ts')
-
-:marked
-  Since we're adding new code, it's a good idea to add some unit tests for
-  it too. Here are a few tests for `PhoneFilterPipe`:
-
-  由于我们在写新代码，所以最好同时为它写一些单元测试。
-  下面是一些针对`PhoneFilterPipe`的单元测试：
-
-+makeExample('upgrade-phonecat/ts/ng2_components/test/unit/phone_filter.pipe.spec.ts', null, 'test/unit/phone_filter.pipe.spec.ts')
-
-:marked
-  For sorting, we'll use a more generic pipe, just called `OrderBy`. It
-  takes an array of objects, and a property to order the array by. It returns
-  an array of the same type of thing it was given. In the implementation we
-  copy the input array, sort the copy, and return it.
-
-  要想排序，我们就需要一个更通用的管道了，称之为`OrderBy`。它接收一个对象数组，和一个用来作为排序依据的属性。
-  它返回与所获得的参数同一类型的数组。在这个实现中，我们将拷贝一份此输入数组，排序它，然后返回它。
-
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/phone_list/order_by.pipe.ts', null, 'app/js/phone_list/order_by.pipe.ts')
-
-:marked
-  Here's a unit test for `OrderByPipe` as well:
-
-  下面同样是`OrderByPipe`的单元测试：
-
-+makeExample('upgrade-phonecat/ts/ng2_components/test/unit/order_by.pipe.spec.ts', null, 'test/unit/order_by.pipe.spec.ts')
-
-:marked
-  We can now integrate these new pipes with our component. Before the pipes
-  are available there, we need to declare them in the `@Component` decorator.
-
-  我们可以把这些新的管道集成进组件中。要想让这些管道可用，我们得把它们声明在`@Component`装饰器中。
-
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list.component.ts', 'top', 'app/js/phone_list/phone_list.component.ts')
-
-:marked
-  In the template we need to use the `phoneFilter` pipe instead of `filter`.
-  No changes are needed for the `orderBy`
-
-  在这个模板中，我们要用`phoneFilter`管道代替`filter`。
-  而对`orderBy`则什么也不用改。
-
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list_without_async.html', 'list', 'app/js/phone_list/phone_list.html')
-
-:marked
-  Now that the phone list is an Angular 2 component, there's one more neat trick
-  we can apply to make its code a little bit simpler. Earlier, as we upgraded
-  the `Phones` service, we needed to add a `subscribe` callback to the list
-  response, which populated the `phones` array on the component.
-  With Angular 2, we can instead just put the Observable itself on the
-  component, and can skip the subscription callback:
-
-  现在，电话列表变成了一个Angular 2组件，还有一个小把戏能让它更整洁：我们可以让它的代码更简单一点。
-  以前，当我们升级`Phones`服务时，我们需要往列表的回应里添加一个`subscribe`(订阅)回调，它会把数据放在组件的`phones`数组中。
-  在Angular 2中，我们可以改为直接把这个可观察对象(Observable)本身放进组件中，而不再使用订阅回调：
-
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list.component.ts', 'full', 'app/js/phone_list/phone_list.component.ts')
-
-:marked
-  This is made possible by the `async` pipe, which we can apply in the template.
-  It knows how to turn an Observable to the (latest) value it has emitted:
-
-  `async`管道让这变为可能，我们可以把`async`管道用在模板中。
-  它知道该如何把一个可观察对象(Observable)变成它所发出的(最终)值：
-
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/phone_list/phone_list.html', 'list', 'app/js/phone_list/phone_list.html')
-
-:marked
-  That takes care of the phone list. Here's the updated unit test file for
-  that component to complete the migration:
-
-  它会负责照管电话列表。下面是升级后的单元测试文件，用来测试迁移后的组件：
-
-+makeExample('upgrade-phonecat/ts/ng2_components/test/unit/phone_list.component.spec.ts', null, 'test/unit/phone_list.component.spec.ts')
-
-:marked
-  Before this test will run, we'll need to augment our Karma configuration
-  so that component HTML templates are loaded properly. We didn't need them
-  before when we were testing the controller in isolation, but our new test
-  exercises the component as a whole, which includes the template.
-
-  在测试运行之前，我们还得增加Karma配置，以便组件的HTML模板可以正确加载。在我们以前单独测试控制器的时候，并不需要它们，
-  但是这个新的测试会把该组件作为整体进行测试，其中也包括了模板。
-
-+makeExample('upgrade-phonecat/ts/ng2_components/test/karma.conf.1.js', 'html', 'test/karma.conf.js')
-
-:marked
-  Now we can start looking at our other controller, which is the one for
-  the phone details. Rename `phone_detail.controller.ts` to `phone_detail.component.ts`,
-  and set the contents as follows:
-
-  现在，我们看看另一个控制器，也就是显示电话详情的那个。把`phone_detail.controller.ts`改名为`phone_detail.component.ts`，并写入如下代码：
-
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/phone_detail/phone_detail_without_pipes.component.ts', null, 'app/js/phone_detail/phone_detail.component.ts')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.ts', 'initialclass', 'app/phone-detail/phone-detail.component.ts')
 
 :marked
   This is pretty similar to what we did with the phone list. The one new change
@@ -2393,20 +1910,22 @@ code-example(format="").
   Angular 2 injector what this dependency should map to. We have a dependency called
   `$routeParams` in the Angular 1 injector, where it is provided by the Angular 1 router.
   That is what we were already using when `PhoneDetails` was still an Angular 1 controller.
+  
+  这和我们对电话列表所做的很相似。这里的一个新的更改是使用`@Inject`来获取`$routeParams`依赖。
+  它告诉Angular 2的注入器这个依赖该被映射成什么。我们在Angular 1的注入器中有一个名叫`$routeParams`的依赖，
+  它是由Angular 1路由器提供的。
+  它也是当`PhoneDetails`还是Angular 1控制器的时候我们用过的那个。
+
   The things is though, Angular 1 dependencies are not made automatically available to
-  Angular 2 components, so if we were to run this now, it would not work.
-
-  这跟我们对电话列表所做的很像。新的修改是使用`@Inject`来注入`$routeParams`依赖。它告诉Angular 2的注入器，这个依赖应该被映射到哪里。
-  我们在Angular 1注入器中有一个叫做`$routeParams`的依赖，那是由Angular 1路由器提供的。
-  这就是当`PhoneDetails`还是Angular 1控制器时我们已经做过的。
-  问题在于，Angular 1的依赖不会自动对Angular 2的组件可用，所以如果我们现在就想运行它，它是不会工作的。
-
-  We explicitly need to tell the `UpgradeAdapter` to upgrade `$routeParams` so that
-  it is available for injection in Angular 2. We can do it in `app.module.ts`:
-
-  我们需要明确的告诉`UpgradeAdapter`要升级`$routeParams`，以便它能用于Angular 2的依赖注入系统。我们在`app.module.ts`中做到这一点：
-
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/app.module.ts', 'upgrade-route-params', 'app/js/app.module.ts')
+  Angular 2 components, so if we were to run this now, it would not work. We need to explicitly
+  tell the `UpgradeAdapter` to upgrade `$routeParams` so that it is available for injection in
+  Angular 2. We can do it in `main.ts`:
+  
+  问题是，Angular 1的依赖不会自动对Angular 2的组件可用，所以如果我们现在运行它，它将无法工作。
+  我们得显式的告诉`UpgradeAdapter`去升级`$routeParams`，以便它能被注入到Angular 2中。
+  我们可以在`main.ts`中这么做：
+  
++makeExample('upgrade-phonecat-2-hybrid/ts/app/main.ts', 'routeparams', 'app/main.ts')
 
 
 
@@ -2417,20 +1936,20 @@ code-example(format="").
   我们现在也要把该组件的模板转变成Angular 2的语法。
   这里是它完整的新模板：
 
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/phone_detail/phone_detail.html', null, 'app/js/phone_detail/phone_detail.html')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.template.html', null, 'app/phone-detail/phone-detail.template.html')
 
 :marked
   There are several notable changes here:
 
   这里有几个值得注意的改动：
 
-  * We've removed the `vm.` prefix from all expressions.
+  * We've removed the `$ctrl.` prefix from all expressions.
 
-  * 我们从所有表达式中移除了`vm.`前缀。
+  * 我们从所有表达式中移除了`$ctrl.`前缀。
 
   * Just like we did in the phone list, we've replaced `ng-src` with property
-    bindings for the standard `src`.
-
+  bindings for the standard `src` property.
+  
   * 正如我们在电话列表中做过的那样，我们把`ng-src`替换成了标准的`src`属性绑定。
 
   * We're using the property binding syntax around `ng-class`. Though Angular 2
@@ -2452,35 +1971,32 @@ code-example(format="").
 
   * 我们把`ng-click`替换成了一个到标准`click`事件的绑定。
 
-  * In all references to `phone`, we're using the safe navigation operator `?.` for
-    safe property navigation. We need it because when the component first loads,
-    we don't have `phone` yet and the expressions will refer to a non-existing
-    value. Unlike in Angular 1, Angular 2 expressions do not fail silently when
-    we try to refer to properties on undefined objects. We need to be explicit
+  * We've wrapped the whole template in an `ngIf` that causes it only to be
+    rendered when there is a phone present. We need this because when the component
+    first loads, we don't have `phone` yet and the expressions will refer to a
+    non-existing value. Unlike in Angular 1, Angular 2 expressions do not fail silently
+    when we try to refer to properties on undefined objects. We need to be explicit
     about cases where this is expected.
-
-  * 在所有涉及`phone`的引用中，我们使用了安全导航操作符`?.`来实现安全的属性导航。我们必须这么做，
+  
+  * 我们把整个模板都包裹进了一个`ngIf`中，这导致只有当存在一个电话时它才会渲染。我们必须这么做，
     是因为组件首次加载时我们还没有`phone`变量，这些表达式就会引用到一个不存在的值。
     和Angular 1不同，当我们尝试引用未定义对象上的属性时，Angular 2中的表达式不会默默失败。
     我们必须明确指出这种情况是我们所期望的。
 
 :marked
-  In the module file we'll now register a `pcPhoneDetail` directive instead of a
-  controller. The directive is a downgraded version of the `PhoneDetail` component.
+  In `main.ts` we'll now register a `phoneDetail` directive instead of a
+  component. The directive is a downgraded version of the `PhoneDetail` Angular 2
+  component.
+  
+  在`main.ts`中，我们现在会注册一个`pcPhoneDetail`指令，而不再是组件。该指令是`PhoneDetail`组件的一个降级版。
 
-  在模块文件中，我们现在将注册一个`pcPhoneDetail`指令，而不再是控制器。该指令是`PhoneDetail`组件的一个降级版。
-
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/phone_detail/phone_detail.module.ts', null, 'app/js/phone_detail/phone_detail.module.ts')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/main.ts', 'phone-detail', 'app/main.ts')
 
 :marked
-  In the router configuration in `app.module.ts`, we'll switch the details route to
-  instantiate a component as well:
+  We should now also remove the phone detail component `<script>` tag from `index.html`.
 
   在`app.module.ts`中的路由器配置中，我们同样把详情路由改成实例化一个组件：
 
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/app.module.ts', 'detail-route')
-
-:marked
   There's one additional step we need to take, which is to upgrade the
   `checkmark` filter that the template is using. We need an Angular 2
   pipe instead of an Angular 1 filter.
@@ -2490,140 +2006,21 @@ code-example(format="").
   While there is no upgrade method in the upgrade adapter for filters, we
   can just turn the filter function into a class that fulfills
   the contract for Angular 2 Pipes. The implementation is the same as before.
-  It just comes in a different kind of package. While changing it, also
+  It just comes in a different kind of packaging. While changing it, also
   rename the file to `checkmark.pipe.ts`:
 
   在升级适配器中并没有哪个方法可用于升级过滤器，但我们只要把过滤器函数转变成一个能满足Angular 2管道契约的类就可以了。
   它的实现方式和前面一样。它只是到了一个不同类型的包而已。修改它的同时，也把它的文件名改为`checkmark.pipe.ts`：
 
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/core/checkmark.pipe.ts', null, 'app/js/core/checkmark.pipe.ts')
++makeExample('upgrade-phonecat-2-hybrid/ts/app/core/checkmark/checkmark.pipe.ts', null, 'app/core/checkmark/checkmark.pipe.ts')
 
 :marked
-  As we apply this change, we should also remove the registration of the filter
-  from the core module file. The module's content becomes:
+  In the component we should now import and declare our newly created pipe (as well as
+  remove the filter `<script>` tag from `index.html`):
 
   当我们做这个修改时，也要同时从`core`模块文件中移除对该过滤器的注册。该模块的内容变成了：
 
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/core/core.module.ts', null, 'app/js/core/core.module.ts')
-
-:marked
-  The unit test file for the filter also now becomes the unit test filter
-  for the pipe. While we're still testing the same thing, we need to change
-  how we set things up:
-
-  此过滤器的单元测试文件也将变为对管道的单元测试。不过我们本质上仍然在测同一个东西，要改的是对测试环境进行设置的代码：
-
-+makeExample('upgrade-phonecat/ts/ng2_components/test/unit/checkmark.pipe.spec.ts', null, 'test/unit/checkmark.pipe.spec.ts')
-
-:marked
-  In the component we should now import and declare our newly created pipe:
-
-  在这个组件中，我们应该立即引入和声明新建的这个管道：
-
-+makeExample('upgrade-phonecat/ts/ng2_components/app/js/phone_detail/phone_detail.component.ts', 'top', 'app/js/phone_detail/phone_detail.component.ts')
-
-:marked
-  With the phone detail component now migrated as well, we can go and migrate
-  its unit tests too.
-
-  电话详情组件已经迁移完毕了，我们也可以继续迁移它的单元测试文件。
-
-+makeExample('upgrade-phonecat/ts/ng2_components/test/unit/phone_detail.component.spec.ts', null, 'test/unit/phone_detail.component.spec.ts')
-
-:marked
-  As we discussed earlier, Protractor tests should largely remain functional
-  as we are making changes, since we're not really changing the user-visible
-  behavior of the application. Now that we've migrated some components and
-  their templates, however, there are a few changes we need to make. Apply
-  the following replacements to `scenarios.js`:
-
-  就像我们以前讨论过的，在我们修改的时候，Protractor测试会大量保持原有功能，因为我们没有真的修改此程序中用户可见的行为。
-  现在，我们已经迁移了一些组件和它们的模板，然而，我们还是要做一些修改。
-  在`scenarios.js`中做下列替换：
-
-table
-  tr
-    th
-      p Previous code
-      p 原有代码
-    th
-      p New code
-      p 新代码
-    th
-      p Notes
-      p 说明
-  tr
-    td
-      :marked
-        `by.repeater('phone in vm.phones').column('phone.name')`
-    td
-      :marked
-        `by.css('.phones .name')`
-    td
-      :marked
-        The repeater matcher relies on Angular 1 `ng-repeat`
-
-        repeater匹配器依赖于Angular 1中的`ng-repeat`
-  tr
-    td
-      :marked
-        `by.repeater('phone in vm.phones')`
-    td
-      :marked
-        `by.css('.phones li')`
-    td
-      :marked
-        The repeater matcher relies on Angular 1 `ng-repeat`
-
-        repeater匹配器依赖于Angular 1中的`ng-repeat`
-  tr
-    td
-      :marked
-        `by.model('vm.query')`
-    td
-      :marked
-        `by.css('input')`
-    td
-      :marked
-        The model matcher relies on Angular 1 `ng-model`
-
-        model匹配器依赖于Angular 1中的`ng-model`
-  tr
-    td
-      :marked
-        `by.model('vm.orderProp')`
-    td
-      :marked
-        `by.css('select')`
-    td
-      :marked
-        The model matcher relies on Angular 1 `ng-model`
-
-        model匹配器依赖于Angular 1中的`ng-model`
-  tr
-    td
-      :marked
-        `by.binding('vm.phone.name')`
-    td
-      :marked
-        `by.css('h1')`
-    td
-      :marked
-        The binding matcher relies on Angular 1 data binding
-
-        binding匹配器依赖于Angular 1的数据绑定
-  tr
-    td
-      :marked
-        `li:nth-child(1)` and `li:nth-child(3)`
-    td
-      :marked
-        `li:nth-of-type(1)` and `li:nth-of-type(3)`
-    td
-      :marked
-        Angular 2 may inject empty `&lt;script>` tags to the page for its internal purposes so we should not rely on the number of siblings being predictable.
-
-        Angular 2可能在页面中注入一个空白的`&lt;script>`标签供内部使用，所以我们不能假设兄弟节点的数量是可预计的。
++makeExample('upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.ts', 'checkmark-pipe', 'app/phone-detail/phone-detail.component.ts')
 
 :marked
   ## Switching To The Angular 2 Router And Bootstrap
@@ -2642,7 +2039,7 @@ table
 
   接下来只有两件事要做：我们要把路由器切换成Angular 2的，然后把该程序作为纯粹的Angular 2应用进行引导。
 
-  Let's do the routing part first. Angular 2 comes with a [shiny new router](router.html)
+  Let's do the routing part first. Angular 2 comes with an [all-new router](router.html)
   that we can use for this.
 
   我们先来处理路由部分。Angular 2自带了一个[全新的路由](router.html)可以用来做这件事。
@@ -2657,10 +2054,10 @@ table
   我们现在还不需要根组件，因为我们的程序还是被当做Angular 1的应用进行管理的。
   我们这就改变这一点，并且把`AppComponent`类填加到一个叫`app.component.ts`的新文件中：
 
-+makeExample('upgrade-phonecat/ts/ng2_final/app/js/app.component.ts', null, 'app/js/app.component.ts')
++makeExample('upgrade-phonecat-3-final/ts/app/app.component.ts', null, 'app/app.component.ts')
 
 :marked
-  This is a component that plugs in to an `<pc-app>` element on the page,
+  This is a component that plugs in to an `<phonecat-app>` element on the page,
   and has a simple template that only includes the router outlet component
   of the Angular router. This means that the component just renders the contents
   of the current route and nothing else. The `@RouteConfig` decorator defines
@@ -2671,12 +2068,12 @@ table
   这意味着该组件将只会渲染当前路由的内容，没别的。`@RouteConfig`装饰器定义了两个原有路由在Angular 2中的对应物。
   它们直接引用了这两个组件。
 
-  We should put this `<pc-app>` element in the HTML so that the root component
+  We should put this `<phonecat-app>` element in the HTML so that the root component
   has something to attach to. It replaces the old Angular 1 `ng-view` directive:
-
+  
   我们还要把这个`<pc-app>`元素放进HTML中，以便这个根组件可以附加上去。它代替了Angular 1中原来的`ng-view`指令：
 
-+makeExample('upgrade-phonecat/ts/ng2_final/app/index.html', 'body', 'app/index.html')
++makeExample('upgrade-phonecat-3-final/ts/index.html', 'appcomponent', 'index.html')
 
 :marked
   In the `PhoneDetail` component we now need to change how the phone id parameter
@@ -2688,25 +2085,17 @@ table
   在`PhoneDetail`组件中，我们现在需要修改电话id参数的接收方式。再也没有`$routeParams`可被注入了，
   因为它来自Angular 1路由器。Angular 2路由器提供了一个`RouteParams`对象。我们使用它来从参数中获得`phoneId`。
 
-+makeExample('upgrade-phonecat/ts/ng2_final/app/js/phone_detail/phone_detail.component.ts', null, 'app/js/phone_detail/phone_detail.component.ts')
-
-:marked
-  We should also make the corresponding change in the unit test. We provide
-  an instance of the `RouteParams` class instead of the `$routeParams` object:
-
-  我们还要在单元测试中做相应的修改。我们提供了一个`RouteParams`类的实例，以代替原来的`$routeParams`对的：
-
-+makeExample('upgrade-phonecat/ts/ng2_final/test/unit/phone_detail.component.spec.ts', 'routeparams', 'test/unit/phone_detail.component.spec.ts')
++makeExample('upgrade-phonecat-3-final/ts/app/phone-detail/phone-detail.component.ts', null, 'app/phone-detail/phone-detail.component.ts')
 
 :marked
   With that, we're ready to switch the bootstrap method of the application from that
   of the `UpgradeAdapter` to the main Angular 2 `bootstrap`. Let's import it together
-  with the router and the new app component in `app.module.ts`
-
+  with the router, the new app component, and everything else in `main.ts`
+  
   使用它，我们就可以把来自`UpgradeAdapter`中的`bootstrap`方法切换到Angular 2自己的`bootstrap`了。
-  通过路由器和`app.module.ts`中新的应用组件，我们把它们导入到一起：
+  通过路由器和`main.ts`中新的应用组件，我们把它们导入到一起：
 
-+makeExample('upgrade-phonecat/ts/ng2_final/app/js/main.ts', 'importbootstrap')
++makeExample('upgrade-phonecat-3-final/ts/app/main.ts', 'imports')
 
 :marked
   We'll now use the regular Angular 2 `bootstrap` function to bootstrap the app
@@ -2722,12 +2111,19 @@ table
   供应商构成的数组。这个数组中，我们包含了至今用`upgradeAdapter.addProvider`注册过的所有东西，
   比如各种供应商以及路由器中的指令：
 
-+makeExample('upgrade-phonecat/ts/ng2_final/app/js/main.ts', 'bootstrap')
++makeExample('upgrade-phonecat-3-final/ts/app/main.ts', 'bootstrap')
 
 :marked
-  We are now running a pure Angular 2 application!
+  We also configure a couple of things for the router here so that the application
+  URL paths match exactly those we had in the Angular 1 app: We want the
+  hash location strategy with the `!` prefix: `#!/phones`.
+  
+  这里我们还为路由器配置了一组东西，以便应用的URL路径和我们在Angular 1应用中用过的完全匹配：
+  我们希望hash地址策略使用`!`前缀：`#!/phones`。
 
-  我们已经在运行一个纯正的Angular 2应用了！
+  At this point we are running a pure Angular 2 application!
+  
+  此时，我们就在运行一个纯Angular 2应用了。
 
   But there's actually one more cool thing we can do with the new router.
   We no longer have to hardcode the links to phone details from the phone
@@ -2739,60 +2135,14 @@ table
   在电话列表页中，我们不需要再把到电话详情页的链接硬编码进去，因为Angular 2可以通过`routerLink`指令帮我们生成它。
   我们只需要引用`@RouteConfig`中用过的路由名称：
 
-+makeExample('upgrade-phonecat/ts/ng2_final/app/js/phone_list/phone_list.html', 'list', 'app/js/phone_list/phone_list.html')
++makeExample('upgrade-phonecat-3-final/ts/app/phone-list/phone-list.template.html', 'list', 'app/phone-list/phone-list.template.html')
 
 :marked
   For this to work the directive just needs to be declared in the component:
-
+  
   要让该指令能够工作，我们只需要把它在组件中声明一下：
 
-+makeExample('upgrade-phonecat/ts/ng2_final/app/js/phone_list/phone_list.component.ts', 'top')
-
-:marked
-  Also, the unit tests for `PhoneList` now need to set up some router providers
-  so that the `RouterLink` directive can be injected in the tests:
-
-  同样的，`PhoneList`的单元测试现在也需要设置一些路由供应商，以便`RouterLink`指令可以被注入到这些测试中：
-
-+makeExample('upgrade-phonecat/ts/ng2_final/test/unit/phone_list.component.spec.ts', null)
-
-:marked
-  To bring our Protractor test suite up to speed with the latest changes,
-  there are a few remaining things we need to do. Firstly, now that we're
-  no longer running Angular 1 at all, we should let Protractor know it
-  should not be looking for one but instead find *Angular 2 apps* from
-  the page. Add the following configuration option to `protractor-conf.js`:
-
-  要让Protractor测试套件能跟上最新的更改，我们还有一些事情要做。首先，我们完全不用运行Angular 1了，
-  我们得让Protractor知道它现在不用再找Angular 1了，而是从页面中找*Angular 2应用*。
-  把下列配置项添加到`protractor-conf.js`中：
-
-+makeExample('upgrade-phonecat/ts/ng2_final/test/protractor-conf.js', 'ng2')
-
-:marked
-  Also, there are a couple of Protractor API calls in our test code that
-  are using the Angular 1 `$location` service under the hood. As that
-  service is no longer there, we need to replace those calls with ones
-  that use WebDriver's generic URL APIs instead. The first of these is
-  the redirection spec:
-
-  同样，我们的测试代码中有两个Protractor API调用内部使用了`$location`。该服务没有了，
-  我们就得把这些调用用一个WebDriver的通用URL API代替。第一个API是“重定向(redirect)”规约：
-
-+makeExample('upgrade-phonecat/ts/ng2_final/test/e2e/scenarios.js', 'redirect')
-
-:marked
-  And the second is the phone links spec:
-
-  第二个是“电话链接(phone links)”规约：
-
-+makeExample('upgrade-phonecat/ts/ng2_final/test/e2e/scenarios.js', 'links')
-
-:marked
-  Now our E2E test suite is passing too, and we're ready to remove
-  Angular 1 from the project!
-
-  现在，我们的E2E测试套件也全都通过了，准备从项目中彻底移除Angular 1吧！
++makeExample('upgrade-phonecat-3-final/ts/app/phone-list/phone-list.component.ts', 'top')
 
 :marked
   ## Saying Goodbye to Angular 1
@@ -2805,37 +2155,32 @@ table
   是时候把辅助训练的轮子摘下来了！让我们的应用作为一个纯粹、势均力敌的Angular 2程序开始它的新生命吧。
   剩下的所有任务就是移除代码 —— 这当然是每个程序员最喜欢的任务！
 
-  First, rename `app.module.ts` to `main.ts`. It will no longer be setting up
-  an Angular 1 module, so it doesn't really make sense to call it a module.
-  Then remove all references to the `UpgradeAdapter` from `main.ts`. Also remove
-  the Angular 1 bootstrap code and the imports of the `core`, `phoneList`, and
-  `phoneDetail` modules. Instead import the `PhoneList` and `PhoneDetail`
-  components directly - they are needed in the route configuration.
-
-  首先，把`app.module.ts`改名为`main.ts`。它不会再设置一个Angular 1模块，把它叫做模块(module)也没有实际意义了。
-  然后从`main.ts`中移除所有到`UpgradeAdapter`的引用。同样移除Angular 1的引导代码，以及到`core`、`phoneList`
-  和`phoneDetail`模块的引用。改为直接导入`PhoneList`和`PhoneDetail`组件 —— 它们在路由配置中需要。
+  If you haven't already, remove all references to the `UpgradeAdapter` from `main.ts`.
+  Also remove the Angular 1 bootstrap code.
+  
+  请从`main.ts`中移除所有到`UpgradeAdapter`的引用，并移除Angular 1的引导代码。
 
   When you're done, this is what `main.ts` should look like:
-
+  
   都完成了之后，`main.ts`看起来应该像这样：
 
-+makeExample('upgrade-phonecat/ts/ng2_final/app/js/main.ts', null, 'app/js/main.ts')
++makeExample('upgrade-phonecat-3-final/ts/app/main.ts', null, 'app/main.ts')
 
 :marked
   You may also completely remove the following files. They are Angular 1
-  module configuration files and type definition files, and not required
-  in Angular 2:
+  module configuration files and not needed in Angular 2:
+  
+  我们还要完全移除了下列文件。它们是Angular 1的模块配置文件和类型定义文件，在Angular 2中不需要了：
 
-  我们还完全移除了下列文件。他们是Angular 1的模块配置文件和类型定义文件，在Angular 2中不需要了：
-
-  * `app/js/core/core.module.ts`
-  * `app/js/core/upgrade_adapter.ts`
-  * `app/js/phone_detail/phone_detail.module.ts`
-  * `app/js/phone_list/phone_list.module.ts`
+  * `app/app.module.ts`
+  * `app/app.config.ts`
+  * `app/core/core.module.ts`
+  * `app/core/phone/phone.module.ts`
+  * `app/phone-detail/phone-detail.module.ts`
+  * `app/phone-list/phone-list.module.ts`
 
   The external typings for Angular 1 may be uninstalled as well. The only ones
-  we still need are for Jasmine.
+  we still need are for Jasmine and Angular 2 polyfills.
 
   Angular 1的外部类型定义文件还需要被反安装。我们现在只需要Jasmine的那些。
 
@@ -2845,27 +2190,210 @@ code-example(format="").
   npm run typings uninstall angular-route -- --save --global
   npm run typings uninstall angular-resource -- --save --global
   npm run typings uninstall angular-mocks -- --save --global
+  npm run typings uninstall angular-animate -- --save --global
 
 :marked
-  Finally, from `index.html` and `karma.conf.js`, remove all references to
-  Angular 1 scripts as well as jQuery. Instead of importing `js/app.module`
-  with SystemJS, import `js/main`. When you're done, this is what `index.html`
-  should look like:
-
+  Finally, from `index.html`, remove all references to
+  Angular 1 scripts, the Angular 2 upgrade module, and jQuery. When we're done,
+  this is what it should look like:
+  
   最后，从`index.html`和`karma.conf.js`中，移除所有到Angular 1脚本的引用，比如jQuery。
-  改为通过SystemJS导入`js/app.module`和`js.main`。当这些全部做完时，`index.html`看起来应该是这样的：
+  当这些全部做完时，`index.html`看起来应该是这样的：
 
-+makeExample('upgrade-phonecat/ts/ng2_final/app/index.html', null, 'app/index.html')
-
-:marked
-  And this is what `karma.conf.js` should look like:
-
-  `karma.conf.js`看起来应该是这样的：
-
-+makeExample('upgrade-phonecat/ts/ng2_final/test/karma.conf.1.js', null, 'test/karma.conf.js')
++makeExample('upgrade-phonecat-3-final/ts/index.html', 'full', 'index.html')
 
 :marked
   That is the last we'll see of Angular 1! It has served us well but now
   it's time to say goodbye.
 
-  这是我们最后一次看到Angular 1了！它帮过我们很多忙，不过，是时候说再见了！
+  这是我们最后一次看到Angular 1了！它曾经带给我们很多帮助，不过现在，是时候说再见了。
+
+.l-main-section
+:marked
+  # Appendix: Upgrading PhoneCat Tests
+  
+  # 附录：升级PhoneCat的测试
+
+  Tests can not only be retained through an upgrade process, but they can also be
+  used as a valuable safety measure when ensuring that the application does not
+  break during the upgrade. E2E tests are especially useful for this purpose.
+  
+  ## E2E Tests
+
+  The PhoneCat project has both E2E Protractor tests and some Karma unit tests in it.
+  Of these two, E2E tests can be dealt with much more easily: By definition,
+  E2E tests access our application from the *outside* by interacting with
+  the various UI elements the app puts on the screen. E2E tests aren't really that
+  concerned with the internal structure of the application components. That
+  also means that although we modify our project quite a bit during the upgrade, the E2E
+  test suite should keep passing with just minor modifications. This is because
+  we don't change how the application behaves from the user's point of view.
+
+  During TypeScript conversion, there is nothing we have to do to keep E2E tests
+  working. It is only when we start to upgrade components and their template to Angular 2
+  that we need to make some changes. This is because the E2E tests have matchers
+  that are specific to Angular 1. For PhoneCat we need to make the following changes
+  in order to make things work with Angular 2:
+
+table
+  tr
+    th Previous code
+    th New code
+    th Notes
+  tr
+    td
+      :marked
+        `by.repeater('phone in $ctrl.phones').column('phone.name')`
+    td
+      :marked
+        `by.css('.phones .name')`
+    td
+      :marked
+        The repeater matcher relies on Angular 1 `ng-repeat`
+  tr
+    td
+      :marked
+        `by.repeater('phone in $ctrl.phones')`
+    td
+      :marked
+        `by.css('.phones li')`
+    td
+      :marked
+        The repeater matcher relies on Angular 1 `ng-repeat`
+  tr
+    td
+      :marked
+        `by.model('$ctrl.query')`
+    td
+      :marked
+        `by.css('input')`
+    td
+      :marked
+        The model matcher relies on Angular 1 `ng-model`
+  tr
+    td
+      :marked
+        `by.model('$ctrl.orderProp')`
+    td
+      :marked
+        `by.css('select')`
+    td
+      :marked
+        The model matcher relies on Angular 1 `ng-model`
+  tr
+    td
+      :marked
+        `by.binding('$ctrl.phone.name')`
+    td
+      :marked
+        `by.css('h1')`
+    td
+      :marked
+        The binding matcher relies on Angular 1 data binding
+
+
+:marked
+  When the bootstrap method is switched from that of `UpgradeAdapter` to
+  pure Angular 2, Angular 1 ceases to exist on the page completely.
+  At this point we need to tell Protractor that it should not be looking for
+  an Angular 1 app anymore, but instead it should find *Angular 2 apps* from
+  the page. The following change is then needed in `protractor-conf.js`:
+
+code-example(format="").
+  useAllAngular2AppRoots: true,
+
+:marked
+  Also, there are a couple of Protractor API calls in the PhoneCat test code that
+  are using the Angular 1 `$location` service under the hood. As that
+  service is no longer there after the upgrade, we need to replace those calls with ones
+  that use WebDriver's generic URL APIs instead. The first of these is
+  the redirection spec:
+
++makeExample('upgrade-phonecat-3-final/e2e-spec.js', 'redirect', 'e2e-tests/scenarios.js')
+
+:marked
+  And the second is the phone links spec:
+
++makeExample('upgrade-phonecat-3-final/e2e-spec.js', 'links', 'e2e-tests/scenarios.js')
+
+
+
+:marked
+  ## Unit Tests
+
+  For unit tests, on the other hand, more conversion work is needed. Effectively
+  they need to be *upgraded* along with the production code.
+
+  During TypeScript conversion no changes are strictly necessary. But it may be
+  a good idea to convert the unit test code into TypeScript as well, as the same
+  benefits we from TypeScript in production code also applies to tests.
+
+  For instance, in the phone detail component spec we can use not only ES2015
+  features like arrow functions and block-scoped variables, but also type
+  definitions for some of the Angular 1 services we're consuming:
+
++makeExample('upgrade-phonecat-1-typescript/ts/app/phone-detail/phone-detail.component.spec.ts', null, 'app/phone-detail/phone-detail.component.spec.ts')
+
+:marked
+  Once we start the upgrade process and bring in SystemJS, configuration changes
+  are needed for Karma. We need to let SystemJS load all the new Angular 2 code,
+  which can be done with the following kind of shim file:
+
++makeExample('upgrade-phonecat-2-hybrid/ts/karma-test-shim.1.js', null, 'karma-test-shim.js')
+
+:marked
+  The shim first loads the SystemJS configuration, then Angular 2's test support libraries,
+  and then the application's spec files themselves.
+
+  Karma configuration should then be changed so that it uses the application root dir
+  as the base directory, instead of `app`.
+
++makeExample('upgrade-phonecat-2-hybrid/ts/karma.conf.ng1.js', 'basepath', 'karma.conf.js')
+
+:marked
+  Once this is done, we can load SystemJS and other dependencies, and also switch the configuration
+  for loading application files so that they are *not* included to the page by Karma. We'll let
+  the shim and SystemJS load them.
+
++makeExample('upgrade-phonecat-2-hybrid/ts/karma.conf.ng1.js', 'files', 'karma.conf.js')
+
+:marked
+  Since the HTML templates of Angular 2 components will be loaded as well, we need to help
+  Karma out a bit so that it can route them to the right paths:
+
++makeExample('upgrade-phonecat-2-hybrid/ts/karma.conf.ng1.js', 'html', 'karma.conf.js')
+
+:marked
+  The unit test files themselves also need to be switched to Angular 2 when their production
+  counterparts are switched. The specs for the checkmark pipe are probably the most straightforward,
+  as the pipe has no dependencies:
+
++makeExample('upgrade-phonecat-2-hybrid/ts/app/core/checkmark/checkmark.pipe.spec.ts', null, 'app/core/checkmark/checkmark.pipe.spec.ts')
+
+:marked
+  The unit test for the phone service is a bit more involved. We need to switch from the mocked-out
+  Angular 1 `$httpBackend` to a mocked-out Angular 2 Http backend.
+
++makeExample('upgrade-phonecat-2-hybrid/ts/app/core/phone/phone.service.spec.ts', null, 'app/core/phone/phone.service.spec.ts')
+
+:marked
+  For the component specs we can mock out the `Phone` service itself, and have it provide
+  canned phone data. We use Angular's component unit testing APIs for both components.
+
++makeExample('upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.spec.ts', null, 'app/phone-detail/phone-detail.component.spec.ts')
+
++makeExample('upgrade-phonecat-2-hybrid/ts/app/phone-list/phone-list.component.spec.ts', null, 'app/phone-list/phone-list.component.spec.ts')
+
+
+:marked
+  Finally, we need to revisit both of the component tests when we switch to the Angular 2
+  router. For the details component we need to provide an Angular 2 `RouteParams` object
+  instead of using the Angular 1 `$routeParams`.
+
++makeExample('upgrade-phonecat-3-final/ts/app/phone-detail/phone-detail.component.spec.ts', 'routeparams', 'app/phone-detail/phone-detail.component.spec.ts')
+
+:marked
+  And for the phone list component we need to set up a few things for the router itself so that
+  the route link directive will work.
+
++makeExample('upgrade-phonecat-3-final/ts/app/phone-list/phone-list.component.spec.ts', 'routestuff', 'app/phone-list/phone-list.component.spec.ts')
diff --git a/public/docs/ts/latest/quickstart.jade b/public/docs/ts/latest/quickstart.jade
index 7aa3886e9c..15515b5fee 100644
--- a/public/docs/ts/latest/quickstart.jade
+++ b/public/docs/ts/latest/quickstart.jade
@@ -79,12 +79,12 @@ block setup-tooling
     如果你的机器上还没有**[Node.js®和npm](https://nodejs.org/en/download/)**，请安装它们。
   .l-sub-section
     :marked
-      **Verify that you are running node `v5.x.x` and npm `3.x.x`**
+      **Verify that you are running at least node `v5.x.x` and npm `3.x.x`**
       by running `node -v` and `npm -v` in a terminal/console window.
-      Older and newer versions produce errors.
+      Older versions produce errors.
       
       **在终端窗口运行`node -v`和`npm -v`，来确认你的node版本为`v5.x.x`，npm版本为`3.x.x`**。
-      老版本和新版本会出错。
+      老版本会出错。
       
 
 block download-source
diff --git a/public/docs/ts/latest/tutorial/toh-pt6.jade b/public/docs/ts/latest/tutorial/toh-pt6.jade
index 2eff1e6aa7..a35ba9c98b 100644
--- a/public/docs/ts/latest/tutorial/toh-pt6.jade
+++ b/public/docs/ts/latest/tutorial/toh-pt6.jade
@@ -259,12 +259,12 @@ figure.image-display
   As we noted above, that is the component's cue to create and present an empty hero.
   
   Add the following HTML to the `heroes.component.html`, just below the hero list (the `*ngFor`).
-+makeExample('toh-6/ts/app/heroes.component.html', 'add-hero', 'app/heroes.component.ts (add)')(format=".")
++makeExample('toh-6/ts/app/heroes.component.html', 'add-hero', 'app/heroes.component.html (add)')(format=".")
 :marked
   The user can *delete* an existing hero by clicking a delete button next to the hero's name.
   
   Add the following HTML to the `heroes.component.html` right after the name in the repeated `<li>` tag:
-+makeExample('toh-6/ts/app/heroes.component.html', 'delete-hero', 'app/heroes.component.ts (delete)')(format=".")
++makeExample('toh-6/ts/app/heroes.component.html', 'delete-hero', 'app/heroes.component.html (delete)')(format=".")
 
 :marked
   Now let's fix-up the `HeroesComponent` to support the *add* and *delete* actions in the template.
diff --git a/public/events.jade b/public/events.jade
index ab34daa8f6..36d0634e2a 100644
--- a/public/events.jade
+++ b/public/events.jade
@@ -7,29 +7,6 @@ table.is-full-width
 
   tbody
 
-    <!-- I/O -->
-    tr
-      th
-        a(
-        target="_blank"
-        href="https://events.google.com/io2016/"
-        ) Google I/O
-      td Mountain View, CA, USA
-      td May 18-20, 2016
-
-
-    <!-- angular-attack -->
-    tr
-      th
-        a(
-        target="_blank"
-        href="http://www.angularattack.com/"
-        ) Angular Attack
-      td 48 hour online Angular hackathon
-      td May 14-15, 2016
-
-
-
     <!-- Devoxx -->
     tr
       th
diff --git a/public/index.jade b/public/index.jade
index 6292e1d8ba..d7965d3c8f 100644
--- a/public/index.jade
+++ b/public/index.jade
@@ -54,9 +54,9 @@ div(class="home-rows")
         h3(class="text-headline") Loved by Millions
         h3(class="text-headline") 百万粉丝热捧
         p(class="text-body").
-          Supports you from your first scrappy launch all the way through global deployment -- Angular brings you the scaling infrastructure and techniques that support Google's largest applications.
+          From prototype through global deployment, Angular delivers the productivity and scalable infrastructure that supports Google's largest applications.
         p(class="text-body").
-          借助全球研发力量，为您披荆斩棘 —— Angular带给你支撑Google大型应用的那些高延展性基础设施与技术。
+          从原型到全球部署，Angular都能带给你支撑Google大型应用的那些高延展性基础设施与技术。
     div(class="promo-img-container promo-4")
       div
         img(src="resources/images/home/loved-by-millions.png")