diff --git a/public/docs/_examples/pipes/dart/lib/chained_pipes.dart b/public/docs/_examples/pipes/dart/lib/chained_pipes.dart new file mode 100644 index 0000000000..1142625541 --- /dev/null +++ b/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: ''' +

+ The chained hero's birthday is + {{ birthday | date | uppercase}} +

+The chained hero's birthday is + {{ birthday | date:'fullDate' }} +

+

+ The chained hero's birthday is + {{ ( birthday | date:'fullDate' ) | uppercase}} +

+''') +class ChainedPipes { + DateTime birthday = new DateTime(1988, 4, 15); // April 15, 1988 +} diff --git a/public/docs/_examples/pipes/dart/lib/exponential_strength_pipe.dart b/public/docs/_examples/pipes/dart/lib/exponential_strength_pipe.dart new file mode 100644 index 0000000000..d503d46038 --- /dev/null +++ b/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 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); + } +} diff --git a/public/docs/_examples/pipes/dart/lib/fetch_json_pipe.dart b/public/docs/_examples/pipes/dart/lib/fetch_json_pipe.dart new file mode 100644 index 0000000000..3eb965f198 --- /dev/null +++ b/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 _fetchPromise; + transform(dynamic value, [List args]) { + if (_fetchPromise == null) { + _fetchPromise = new Future(() async { + _fetchedValue = JSON.decode(await HttpRequest.getString(value)); + }); + } + return _fetchedValue; + } +} diff --git a/public/docs/_examples/pipes/dart/lib/hero_birthday.dart b/public/docs/_examples/pipes/dart/lib/hero_birthday.dart new file mode 100644 index 0000000000..ca140cf728 --- /dev/null +++ b/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: ''' +

The hero's birthday is {{ birthday | date:format }}

+ +''') +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; + } +} diff --git a/public/docs/_examples/pipes/dart/lib/heroes_list.dart b/public/docs/_examples/pipes/dart/lib/heroes_list.dart new file mode 100644 index 0000000000..8480818825 --- /dev/null +++ b/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: ''' +

Heroes: {{'heroes.json' | fetch | json}}

+''', + pipes: const [FetchJsonPipe]) +class HeroesList {} diff --git a/public/docs/_examples/pipes/dart/lib/my_hero.dart b/public/docs/_examples/pipes/dart/lib/my_hero.dart new file mode 100644 index 0000000000..01e8719fc7 --- /dev/null +++ b/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: ''' +

Message: {{delayedMessage | async}}

+''') +class MyHero { + Future delayedMessage = + new Future.delayed(new Duration(milliseconds: 500), () { + return 'You are my Hero!'; + }); +} diff --git a/public/docs/_examples/pipes/dart/lib/power_boost_calculator.dart b/public/docs/_examples/pipes/dart/lib/power_boost_calculator.dart new file mode 100644 index 0000000000..05a4745516 --- /dev/null +++ b/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: ''' +

Power Boost Calculator

+
Normal power:
+
Boost factor:
+

+ Super Hero Power: {{power | exponentialStrength: factor}} +

+''', + pipes: const [ExponentialStrengthPipe], + directives: const [FORM_DIRECTIVES]) +class PowerBoostCalculator { + int power = 5; + int factor = 1; +} diff --git a/public/docs/_examples/pipes/dart/lib/power_booster.dart b/public/docs/_examples/pipes/dart/lib/power_booster.dart new file mode 100644 index 0000000000..415a8e58ff --- /dev/null +++ b/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: ''' +

Super power boost: {{2 | exponentialStrength: 10}}

+''', + pipes: const [ExponentialStrengthPipe]) +class PowerBooster {} diff --git a/public/docs/_examples/pipes/dart/pubspec.yaml b/public/docs/_examples/pipes/dart/pubspec.yaml new file mode 100644 index 0000000000..3e9fbacc85 --- /dev/null +++ b/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 diff --git a/public/docs/_examples/pipes/dart/web/heroes.json b/public/docs/_examples/pipes/dart/web/heroes.json new file mode 100644 index 0000000000..6248df4575 --- /dev/null +++ b/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" + } +] diff --git a/public/docs/_examples/pipes/dart/web/index.html b/public/docs/_examples/pipes/dart/web/index.html new file mode 100644 index 0000000000..26d8eeebd9 --- /dev/null +++ b/public/docs/_examples/pipes/dart/web/index.html @@ -0,0 +1,17 @@ + + + + Pipes Example + + + + + + + + + + + + + diff --git a/public/docs/_examples/pipes/dart/web/main.dart b/public/docs/_examples/pipes/dart/web/main.dart new file mode 100644 index 0000000000..722539dc5f --- /dev/null +++ b/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); +} diff --git a/public/docs/_examples/pipes/dart/web/style.css b/public/docs/_examples/pipes/dart/web/style.css new file mode 100644 index 0000000000..e69de29bb2