docs(samples): add Dart version of pipes example

closes #365

public/docs/_examples/pipes/dart/lib/chained_pipes.dart

@@ -0,0 +1,22 @@
+library pipe_examples.chained_pipes;
+
+import 'package:angular2/angular2.dart';
+
+@Component(selector: 'chained-pipes')
+@View(
+    template: '''
+<p>
+  The chained hero's birthday is
+  {{ birthday | date | uppercase}}
+</p>
+The chained hero's birthday is
+  {{ birthday | date:'fullDate' }}
+</p>
+<p>
+  The chained hero's birthday is
+  {{ ( birthday | date:'fullDate' ) | uppercase}}
+</p>
+''')
+class ChainedPipes {
+  DateTime birthday = new DateTime(1988, 4, 15); // April 15, 1988
+}

public/docs/_examples/pipes/dart/lib/exponential_strength_pipe.dart

@@ -0,0 +1,28 @@
+library pipes_examples.exponential_strength_pipe;
+
+import 'dart:math' as math;
+
+import 'package:angular2/angular2.dart';
+
+/*
+* Raise the value exponentially
+* Takes a value that defaults to 0 and an exponent argument that defaults to 1.
+* Checks for value to be a string or number.
+* Usage:
+*   value | exponentialStrength:exponent
+* Example:
+*   {{ 2 |  exponentialStrength:10}}
+*   formats to: 1024
+*/
+
+@Pipe(name: 'exponentialStrength')
+@Injectable()
+class ExponentialStrengthPipe {
+  transform(dynamic value, [List<dynamic> args]) {
+    var v = int.parse(value.toString(), onError: (source) => 0);
+    var p = args.isEmpty
+        ? 1
+        : int.parse(args.first.toString(), onError: (source) => 1);
+    return math.pow(v, p);
+  }
+}

public/docs/_examples/pipes/dart/lib/fetch_json_pipe.dart

@@ -0,0 +1,22 @@
+library pipe_examples.fetch_json_pipe;
+
+import 'dart:html';
+import 'dart:async';
+import 'dart:convert';
+
+import 'package:angular2/angular2.dart';
+
+@Pipe(name: 'fetch', pure: false)
+@Injectable()
+class FetchJsonPipe {
+  dynamic _fetchedValue;
+  Future<dynamic> _fetchPromise;
+  transform(dynamic value, [List<dynamic> args]) {
+    if (_fetchPromise == null) {
+      _fetchPromise = new Future(() async {
+        _fetchedValue = JSON.decode(await HttpRequest.getString(value));
+      });
+    }
+    return _fetchedValue;
+  }
+}

public/docs/_examples/pipes/dart/lib/hero_birthday.dart

@@ -0,0 +1,21 @@
+library pipe_examples.hero_birthday;
+
+import 'package:angular2/angular2.dart';
+
+@Component(selector: 'hero-birthday')
+@View(
+    template: '''
+<p>The hero's birthday is {{ birthday | date:format }}</p>
+<button (click)="toggleFormat()">Toggle Format</button>
+''')
+class HeroBirthday {
+  DateTime birthday = new DateTime(1988, 4, 15); // April 15, 1988
+  String format = 'shortDate';
+  String nextFormat = 'fullDate';
+
+  toggleFormat() {
+    var next = this.format;
+    format = this.nextFormat;
+    nextFormat = next;
+  }
+}

public/docs/_examples/pipes/dart/lib/heroes_list.dart

@@ -0,0 +1,12 @@
+library pipe_examples.heroes_list;
+
+import 'package:angular2/angular2.dart';
+import 'package:pipe_examples/fetch_json_pipe.dart';
+
+@Component(selector: 'heroes-list')
+@View(
+    template: '''
+<p>Heroes: {{'heroes.json' | fetch | json}}</p>
+''',
+    pipes: const [FetchJsonPipe])
+class HeroesList {}

public/docs/_examples/pipes/dart/lib/my_hero.dart

@@ -0,0 +1,17 @@
+library pipe_examples.my_hero;
+
+import 'dart:async';
+
+import 'package:angular2/angular2.dart';
+
+@Component(selector: 'my-hero')
+@View(
+    template: '''
+<p>Message: {{delayedMessage | async}}</p>
+''')
+class MyHero {
+  Future<String> delayedMessage =
+      new Future.delayed(new Duration(milliseconds: 500), () {
+    return 'You are my Hero!';
+  });
+}

public/docs/_examples/pipes/dart/lib/power_boost_calculator.dart

@@ -0,0 +1,21 @@
+library pipe_examples.power_boost_calculator;
+
+import 'package:angular2/angular2.dart';
+import 'package:pipe_examples/exponential_strength_pipe.dart';
+
+@Component(selector: 'power-boost-calculator')
+@View(
+    template: '''
+<h2>Power Boost Calculator</h2>
+<div>Normal power: <input [(ng-model)]="power"></div>
+<div>Boost factor: <input [(ng-model)]="factor"></div>
+<p>
+  Super Hero Power: {{power | exponentialStrength: factor}}
+</p>
+''',
+    pipes: const [ExponentialStrengthPipe],
+    directives: const [FORM_DIRECTIVES])
+class PowerBoostCalculator {
+  int power = 5;
+  int factor = 1;
+}

public/docs/_examples/pipes/dart/lib/power_booster.dart

@@ -0,0 +1,12 @@
+library pipe_examples.power_booster;
+
+import 'package:angular2/angular2.dart';
+import 'package:pipe_examples/exponential_strength_pipe.dart';
+
+@Component(selector: 'power-booster')
+@View(
+    template: '''
+<p>Super power boost: {{2 | exponentialStrength: 10}}</p>
+''',
+    pipes: const [ExponentialStrengthPipe])
+class PowerBooster {}

public/docs/_examples/pipes/dart/pubspec.yaml

@@ -0,0 +1,9 @@
+name: pipe_examples
+description: Pipes Example
+version: 0.0.1
+dependencies:
+  angular2: 2.0.0-alpha.45
+  browser: ^0.10.0
+transformers:
+- angular2:
+    entry_points: web/main.dart

public/docs/_examples/pipes/dart/web/heroes.json

@@ -0,0 +1,17 @@
+[
+  {
+    "id":1,
+    "firstName":"Eenie",
+    "lastName":"Toe"
+  },
+  {
+    "id":2,
+    "firstName":"Meenie",
+    "lastName":"Toe"
+  },
+  {
+    "id":3,
+    "firstName":"Miny",
+    "lastName":"Toe"
+  }
+]

public/docs/_examples/pipes/dart/web/index.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Pipes Example</title>
+    <link rel="stylesheet" href="style.css">
+    <script async src="main.dart" type="application/dart"></script>
+    <script async src="packages/browser/dart.js"></script>
+</head>
+<body>
+<hero-birthday></hero-birthday>
+<chained-pipes></chained-pipes>
+<power-booster></power-booster>
+<power-boost-calculator></power-boost-calculator>
+<my-hero></my-hero>
+<heroes-list></heroes-list>
+</body>
+</html>

public/docs/_examples/pipes/dart/web/main.dart

@@ -0,0 +1,16 @@
+import 'package:angular2/bootstrap.dart';
+import 'package:pipe_examples/hero_birthday.dart';
+import 'package:pipe_examples/chained_pipes.dart';
+import 'package:pipe_examples/power_booster.dart';
+import 'package:pipe_examples/power_boost_calculator.dart';
+import 'package:pipe_examples/my_hero.dart';
+import 'package:pipe_examples/heroes_list.dart';
+
+main() {
+  bootstrap(HeroBirthday);
+  bootstrap(ChainedPipes);
+  bootstrap(PowerBooster);
+  bootstrap(PowerBoostCalculator);
+  bootstrap(MyHero);
+  bootstrap(HeroesList);
+}