(docs) plunkers for template-syntax & pipes

closes #410

public/docs/_examples/pipes/ts/src/app/app.html

@@ -12,7 +12,7 @@
 <!-- #enddocregion hero-birthday-template-->
 
 <!-- #docregion format-birthday -->
-<p>The hero's birthday is {{ birthday | date:"MM/dd/yy" }} /p>
+<p>The hero's birthday is {{ birthday | date:"MM/dd/yy" }} </p>
 <!-- #enddocregion format-birthday-->
 
 <hr>

public/docs/_examples/pipes/ts/src/app/app.ts

@@ -1,4 +1,4 @@
-import {HeroBirthday as HeroBirthday2} from './hero-birthday.2';
+import {HeroBirthday as HeroBirthday2} from './hero-birthday';
 import {PowerBooster} from './power-booster';
 import {PowerBoostCalculator} from './power-boost-calculator';
 import {HeroListComponent} from './hero-list-component';

public/docs/_examples/pipes/ts/src/app/hero-birthday.ts

@@ -1,5 +1,5 @@
 import {bootstrap, Component} from 'angular2/angular2'
-// #docregion hero-birthday2
+// #docregion
 @Component({ 
   selector: 'hero-birthday',
   template: `
@@ -13,4 +13,4 @@ export class HeroBirthday {
   toggle = true;
   toggleFormat() { this.toggle = !this.toggle; }  
 }
-// #enddocregion hero-birthday2
+// #enddocregion

public/docs/_examples/pipes/ts/src/index.html

@@ -17,7 +17,7 @@
     <h4>Hero Birthday 1</h4>
     <hero-birthday>loading...</hero-birthday>
     <hr>
-    <my-app>loading ...<my-app>
+    <my-app>loading ...</my-app>
   </body>
 
 </html>

public/docs/_examples/pipes/ts/src/plnkr.config

@@ -0,0 +1,3 @@
+{
+  "files":["!**/*.d.ts",  "!**/*.js"]
+}

public/docs/_examples/template-syntax/ts/src/app/app.html

@@ -30,7 +30,7 @@
 
 <div class="special">
    <!--<img src="http://www.wpclipart.com/cartoon/people/hero/hero_silhoutte_T.png">-->
-   <img src="../../images/hero.png"> 
+   <img src="images/hero.png">
    <button disabled>Save</button>
 </div>
 
@@ -44,7 +44,7 @@
 -->
 <!-- property over attribute -->
 <!-- examine the following <img> tag in the browser tools -->
-<img src="../../images/ng-logo.png"
+<img src="images/ng-logo.png"
     [src]="heroImageUrl">
 <hr>
 <h3 [text-content]="title"></h3>

public/docs/_examples/template-syntax/ts/src/app/app.ts

@@ -218,10 +218,10 @@ class AppComponent {
   heroes = Hero.MockHeroes;
 
   //heroImageUrl = 'http://www.wpclipart.com/cartoon/people/hero/hero_silhoutte_T.png';
-  heroImageUrl = '../../images/hero.png';
+  heroImageUrl = 'images/hero.png';
 
   //iconUrl = 'https://angular.io/resources/images/logos/standard/shield-large.png';
-  iconUrl = '../../images/ng-logo.png';
+  iconUrl = 'images/ng-logo.png';
   isActive = false;
   isSpecial = true;
   isUnchanged = true;
@@ -291,7 +291,7 @@ class AppComponent {
   title = 'Template Syntax'
   val=2;
   //  villainImageUrl = 'http://www.clker.com/cliparts/u/s/y/L/x/9/villain-man-hi.png'
-  villainImageUrl = '../../images/villain.png'
+  villainImageUrl = 'images/villain.png'
 
 
 }

public/docs/_examples/template-syntax/ts/src/plnkr.config

@@ -1,4 +1,5 @@
 {
-  "description": "Template Syntax Collection"
-
+  "description": "Template Syntax Collection",
+  "files":["!**/*.d.ts",  "!**/*.js"],
+  "tags": ["template"]
 }

public/docs/ts/latest/guide/pipes.jade

@@ -17,6 +17,8 @@ include ../../../../_includes/_util-fns
 
   Welcome, Angular pipes, the simple display-value transformations that we can declare in our HTML!
   
+  [Live Example](/docs/_examples/pipes/ts/src/plnkr.html)
+
 .l-main-section
 :marked
   ## Using Pipes
@@ -74,7 +76,7 @@ include ../../../../_includes/_util-fns
 
   Let's revise our example to bind the pipe's format parameter
   to the component's `format` property.
-+makeExample('pipes/ts/src/app/hero-birthday.2.ts', 'hero-birthday2')
++makeExample('pipes/ts/src/app/hero-birthday.ts')
 
 :marked
   We also added a button to the template and bound its click event to the component's `toggleFormat` method.

public/docs/ts/latest/guide/template-syntax.jade

@@ -1,7 +1,5 @@
 include ../../../../_includes/_util-fns
 
-a(href='/docs/_examples/template-syntax/ts/src/plnkr.html') Live Example 1
-
 :marked
   # Template Syntax
   Our Angular application manages what the user sees and does through the interaction of a Component class instance and its user-facing template.
@@ -12,8 +10,6 @@ a(href='/docs/_examples/template-syntax/ts/src/plnkr.html') Live Example 1
 
   We’ll cover these basic elements of Template Syntax
 
-  [Live Example 1](/docs/_examples/template-syntax/ts/src/plnkr.html)
-
   >[HTML](#html)
 
   >[Interpolation](#interpolation)
@@ -40,6 +36,8 @@ a(href='/docs/_examples/template-syntax/ts/src/plnkr.html') Live Example 1
 
   >[Template Expression Operators](#expression-ops)
   
+  [Live Example](/docs/_examples/template-syntax/ts/src/plnkr.html)
+
 .l-main-section
 :marked
   ## HTML

tools/plunker-builder/plunkerBuilder.js

@@ -78,7 +78,7 @@ function initConfigAndCollectFileNames(configFileName) {
       return path.join(basePath, fileName);
     }
   });
-  var defaultExcludes = [ '!**/typings/**','!**/tsconfig.json', '!**/plnkr.html', '!**/*.plnkr.html' ];
+  var defaultExcludes = [ '!**/node_modules/**','!**/typings/**','!**/tsconfig.json', '!**/plnkr.html', '!**/*.plnkr.html' ];
   Array.prototype.push.apply(gpaths, defaultExcludes);
 
   config.fileNames = globule.find(gpaths);