From 393987bdf521a2977579865e2003eeb746d8b1f4 Mon Sep 17 00:00:00 2001 From: Ward Bell Date: Fri, 11 Dec 2015 15:37:35 -0800 Subject: [PATCH] docs: split intro into separate chapters, shuffle code, update to alph52 closes #483 A major refactoring of the intro chapters includes text revision and the addition of "module" as an 8th "basic building block". Incorporates John Papa feedback. --- .../{intro => architecture}/ts/.gitignore | 0 .../architecture/ts/app/app.component.ts | 13 + .../ts}/app/backend.service.ts | 8 +- .../_examples/architecture/ts/app/boot.ts | 13 + .../ts/app/hero-detail.component.html | 9 + .../ts}/app/hero-detail.component.ts | 2 +- .../ts/app/hero-list.component.1.html | 12 + .../ts/app/hero-list.component.html | 9 + .../ts}/app/hero-list.component.ts | 6 +- .../ts}/app/hero.service.ts | 4 +- .../ts/src => architecture/ts}/app/hero.ts | 0 .../ts}/app/logger.service.ts | 2 +- .../ts/src => architecture/ts}/index.html | 6 +- ...debug.log.77ba9bb88f1c7e91ec20f862c16decc7 | 40 ++ .../_examples/architecture/ts/package.json | 15 + .../ts/src => architecture/ts}/plnkr.json | 0 .../ts/src => architecture/ts}/tsconfig.json | 8 +- public/docs/_examples/intro/ts/package.json | 21 - .../docs/_examples/intro/ts/src/app/boot.ts | 11 - .../ts/src/app/hero-detail.component.html | 9 - .../ts/src/app/hero-list.component.1.html | 12 - .../intro/ts/src/app/hero-list.component.html | 8 - public/docs/ts/latest/guide/_data.json | 6 +- public/docs/ts/latest/guide/architecture.jade | 523 +++++++++++++++++ public/docs/ts/latest/guide/index.jade | 527 ++---------------- .../{intro => architecture}/airplane.png | Bin .../component-databinding.png | Bin .../component-tree.png | Bin .../{intro => architecture}/databinding.png | Bin .../dependency-injection.png | Bin .../{intro => architecture}/directive.png | Bin .../hero-component.png | Bin .../injector-injects.png | Bin .../devguide/architecture/library-module.png | Bin 0 -> 28010 bytes .../{intro => architecture}/metadata.png | Bin .../images/devguide/architecture/module.png | Bin 0 -> 12595 bytes .../images/devguide/architecture/modules.png | Bin 0 -> 24572 bytes .../{intro => architecture}/overview.png | Bin .../devguide/architecture/overview2.png | Bin 0 -> 83045 bytes .../parent-child-binding.png | Bin .../{intro => architecture}/service.png | Bin .../template-metadata-component.png | Bin .../{intro => architecture}/template.png | Bin 43 files changed, 714 insertions(+), 550 deletions(-) rename public/docs/_examples/{intro => architecture}/ts/.gitignore (100%) create mode 100644 public/docs/_examples/architecture/ts/app/app.component.ts rename public/docs/_examples/{intro/ts/src => architecture/ts}/app/backend.service.ts (75%) create mode 100644 public/docs/_examples/architecture/ts/app/boot.ts create mode 100644 public/docs/_examples/architecture/ts/app/hero-detail.component.html rename public/docs/_examples/{intro/ts/src => architecture/ts}/app/hero-detail.component.ts (80%) create mode 100644 public/docs/_examples/architecture/ts/app/hero-list.component.1.html create mode 100644 public/docs/_examples/architecture/ts/app/hero-list.component.html rename public/docs/_examples/{intro/ts/src => architecture/ts}/app/hero-list.component.ts (87%) rename public/docs/_examples/{intro/ts/src => architecture/ts}/app/hero.service.ts (90%) rename public/docs/_examples/{intro/ts/src => architecture/ts}/app/hero.ts (100%) rename public/docs/_examples/{intro/ts/src => architecture/ts}/app/logger.service.ts (77%) rename public/docs/_examples/{intro/ts/src => architecture/ts}/index.html (57%) create mode 100644 public/docs/_examples/architecture/ts/npm-debug.log.77ba9bb88f1c7e91ec20f862c16decc7 create mode 100644 public/docs/_examples/architecture/ts/package.json rename public/docs/_examples/{intro/ts/src => architecture/ts}/plnkr.json (100%) rename public/docs/_examples/{intro/ts/src => architecture/ts}/tsconfig.json (70%) delete mode 100644 public/docs/_examples/intro/ts/package.json delete mode 100644 public/docs/_examples/intro/ts/src/app/boot.ts delete mode 100644 public/docs/_examples/intro/ts/src/app/hero-detail.component.html delete mode 100644 public/docs/_examples/intro/ts/src/app/hero-list.component.1.html delete mode 100644 public/docs/_examples/intro/ts/src/app/hero-list.component.html create mode 100644 public/docs/ts/latest/guide/architecture.jade rename public/resources/images/devguide/{intro => architecture}/airplane.png (100%) rename public/resources/images/devguide/{intro => architecture}/component-databinding.png (100%) rename public/resources/images/devguide/{intro => architecture}/component-tree.png (100%) rename public/resources/images/devguide/{intro => architecture}/databinding.png (100%) rename public/resources/images/devguide/{intro => architecture}/dependency-injection.png (100%) rename public/resources/images/devguide/{intro => architecture}/directive.png (100%) rename public/resources/images/devguide/{intro => architecture}/hero-component.png (100%) rename public/resources/images/devguide/{intro => architecture}/injector-injects.png (100%) create mode 100644 public/resources/images/devguide/architecture/library-module.png rename public/resources/images/devguide/{intro => architecture}/metadata.png (100%) create mode 100644 public/resources/images/devguide/architecture/module.png create mode 100644 public/resources/images/devguide/architecture/modules.png rename public/resources/images/devguide/{intro => architecture}/overview.png (100%) create mode 100644 public/resources/images/devguide/architecture/overview2.png rename public/resources/images/devguide/{intro => architecture}/parent-child-binding.png (100%) rename public/resources/images/devguide/{intro => architecture}/service.png (100%) rename public/resources/images/devguide/{intro => architecture}/template-metadata-component.png (100%) rename public/resources/images/devguide/{intro => architecture}/template.png (100%) diff --git a/public/docs/_examples/intro/ts/.gitignore b/public/docs/_examples/architecture/ts/.gitignore similarity index 100% rename from public/docs/_examples/intro/ts/.gitignore rename to public/docs/_examples/architecture/ts/.gitignore diff --git a/public/docs/_examples/architecture/ts/app/app.component.ts b/public/docs/_examples/architecture/ts/app/app.component.ts new file mode 100644 index 0000000000..83daef23ab --- /dev/null +++ b/public/docs/_examples/architecture/ts/app/app.component.ts @@ -0,0 +1,13 @@ +// #docregion import +import {Component} from 'angular2/core'; +// #enddocregion import +import {HeroListComponent} from './hero-list.component'; + +@Component({ + selector: 'my-app', + template: '', + directives: [HeroListComponent] +}) +// #docregion export +export class AppComponent { } +// #enddocregion export \ No newline at end of file diff --git a/public/docs/_examples/intro/ts/src/app/backend.service.ts b/public/docs/_examples/architecture/ts/app/backend.service.ts similarity index 75% rename from public/docs/_examples/intro/ts/src/app/backend.service.ts rename to public/docs/_examples/architecture/ts/app/backend.service.ts index ad76e0044b..d8e01b0e37 100644 --- a/public/docs/_examples/intro/ts/src/app/backend.service.ts +++ b/public/docs/_examples/architecture/ts/app/backend.service.ts @@ -1,17 +1,17 @@ -import {Injectable} from 'angular2/angular2'; +import {Injectable} from 'angular2/core'; import {Logger} from './logger.service'; import {Hero} from './hero'; @Injectable() export class BackendService { constructor(private _logger: Logger) {} - + getAll(type: {new(...args:any[]): any }) : any[]{ if (type === Hero) { // TODO get from the database and return as a promise return [ - new Hero('Windstorm', 'Weather mastery'), - new Hero('Mr. Nice', 'Killing them with kindness'), + new Hero('Windstorm', 'Weather mastery'), + new Hero('Mr. Nice', 'Killing them with kindness'), new Hero('Magneta', 'Manipulates metalic objects')]; } let err = new Error('Cannot get object of this type'); diff --git a/public/docs/_examples/architecture/ts/app/boot.ts b/public/docs/_examples/architecture/ts/app/boot.ts new file mode 100644 index 0000000000..174b1289f2 --- /dev/null +++ b/public/docs/_examples/architecture/ts/app/boot.ts @@ -0,0 +1,13 @@ +import {bootstrap} from 'angular2/platform/browser'; +// #docregion import +import {AppComponent} from './app.component'; +// #enddocregion import +import {HeroService} from './hero.service'; +import {BackendService} from './backend.service'; +import {Logger} from './logger.service'; + +// #docregion bootstrap +bootstrap(AppComponent, [ + BackendService, HeroService, Logger +]); +// #enddocregion bootstrap diff --git a/public/docs/_examples/architecture/ts/app/hero-detail.component.html b/public/docs/_examples/architecture/ts/app/hero-detail.component.html new file mode 100644 index 0000000000..baa3e8d9f9 --- /dev/null +++ b/public/docs/_examples/architecture/ts/app/hero-detail.component.html @@ -0,0 +1,9 @@ +
+

{{hero.name}} Detail

+
Id: {{hero.id}}
+
Name: + + + +
+
Power:
\ No newline at end of file diff --git a/public/docs/_examples/intro/ts/src/app/hero-detail.component.ts b/public/docs/_examples/architecture/ts/app/hero-detail.component.ts similarity index 80% rename from public/docs/_examples/intro/ts/src/app/hero-detail.component.ts rename to public/docs/_examples/architecture/ts/app/hero-detail.component.ts index 78c94af9a1..d8c7bed1a8 100644 --- a/public/docs/_examples/intro/ts/src/app/hero-detail.component.ts +++ b/public/docs/_examples/architecture/ts/app/hero-detail.component.ts @@ -1,4 +1,4 @@ -import {Component, Input} from 'angular2/angular2'; +import {Component, Input} from 'angular2/core'; import {Hero} from './hero'; @Component({ diff --git a/public/docs/_examples/architecture/ts/app/hero-list.component.1.html b/public/docs/_examples/architecture/ts/app/hero-list.component.1.html new file mode 100644 index 0000000000..55581cd645 --- /dev/null +++ b/public/docs/_examples/architecture/ts/app/hero-list.component.1.html @@ -0,0 +1,12 @@ + +
{{hero.name}}
+ +
+ + + diff --git a/public/docs/_examples/architecture/ts/app/hero-list.component.html b/public/docs/_examples/architecture/ts/app/hero-list.component.html new file mode 100644 index 0000000000..a3de7f2950 --- /dev/null +++ b/public/docs/_examples/architecture/ts/app/hero-list.component.html @@ -0,0 +1,9 @@ + +

Hero List

+ +

Pick a hero from the list

+
+ {{hero.name}} +
+ + diff --git a/public/docs/_examples/intro/ts/src/app/hero-list.component.ts b/public/docs/_examples/architecture/ts/app/hero-list.component.ts similarity index 87% rename from public/docs/_examples/intro/ts/src/app/hero-list.component.ts rename to public/docs/_examples/architecture/ts/app/hero-list.component.ts index b583d4f390..e001eb0294 100644 --- a/public/docs/_examples/intro/ts/src/app/hero-list.component.ts +++ b/public/docs/_examples/architecture/ts/app/hero-list.component.ts @@ -1,6 +1,6 @@ // #docplaster -import {Component} from 'angular2/angular2'; +import {Component} from 'angular2/core'; import {Hero} from './hero'; import {HeroDetailComponent} from './hero-detail.component'; import {HeroService} from './hero.service' @@ -12,7 +12,7 @@ import {HeroService} from './hero.service' selector: 'hero-list', templateUrl: 'app/hero-list.component.html', directives: [HeroDetailComponent], -// #docregion providers +// #docregion providers providers: [HeroService] }) // #enddocregion providers @@ -25,7 +25,7 @@ export class HeroesComponent { ... } // #docregion class export class HeroListComponent { // #docregion ctor - constructor(service: HeroService) { + constructor(service: HeroService) { this.heroes = service.getHeroes(); } // #enddocregion ctor diff --git a/public/docs/_examples/intro/ts/src/app/hero.service.ts b/public/docs/_examples/architecture/ts/app/hero.service.ts similarity index 90% rename from public/docs/_examples/intro/ts/src/app/hero.service.ts rename to public/docs/_examples/architecture/ts/app/hero.service.ts index 4833be8a9b..2abc71dca0 100644 --- a/public/docs/_examples/intro/ts/src/app/hero.service.ts +++ b/public/docs/_examples/architecture/ts/app/hero.service.ts @@ -1,4 +1,4 @@ -import {Injectable} from 'angular2/angular2'; +import {Injectable} from 'angular2/core'; import {Hero} from './hero'; import {BackendService} from './backend.service'; import {Logger} from './logger.service'; @@ -7,7 +7,7 @@ import {Logger} from './logger.service'; @Injectable() export class HeroService { constructor(private _backend: BackendService, private _logger:Logger){} - + getHeroes() { // TODO return as a promise let heroes = this._backend.getAll(Hero); diff --git a/public/docs/_examples/intro/ts/src/app/hero.ts b/public/docs/_examples/architecture/ts/app/hero.ts similarity index 100% rename from public/docs/_examples/intro/ts/src/app/hero.ts rename to public/docs/_examples/architecture/ts/app/hero.ts diff --git a/public/docs/_examples/intro/ts/src/app/logger.service.ts b/public/docs/_examples/architecture/ts/app/logger.service.ts similarity index 77% rename from public/docs/_examples/intro/ts/src/app/logger.service.ts rename to public/docs/_examples/architecture/ts/app/logger.service.ts index 2f7935fba0..c69944101b 100644 --- a/public/docs/_examples/intro/ts/src/app/logger.service.ts +++ b/public/docs/_examples/architecture/ts/app/logger.service.ts @@ -1,4 +1,4 @@ -import {Injectable} from 'angular2/angular2'; +import {Injectable} from 'angular2/core'; @Injectable() export class Logger { diff --git a/public/docs/_examples/intro/ts/src/index.html b/public/docs/_examples/architecture/ts/index.html similarity index 57% rename from public/docs/_examples/intro/ts/src/index.html rename to public/docs/_examples/architecture/ts/index.html index 07272ac54b..96b68a3ea8 100644 --- a/public/docs/_examples/intro/ts/src/index.html +++ b/public/docs/_examples/architecture/ts/index.html @@ -2,8 +2,8 @@ Intro to Angular 2 - - + +