Make all chapters' samples more consistent and up to date

kwalrath · kwalrath · commit 3aa0c38b56fd · 2014-01-29T13:26:10.000-08:00
Review URL: https://codereview.appspot.com/58320043
diff --git a/Chapter_01/README b/Chapter_01/README
@@ -1,2 +1,2 @@
-"Hello World" Angular Dart application
+"Hello World" AngularDart application
 
diff --git a/Chapter_02/README b/Chapter_02/README
@@ -1,3 +1,3 @@
-Recipe Book Angular Dart application
-Illustrates how to create a basic Angular Controller
+Recipe Book AngularDart application
+Illustrates how to create a basic Angular controller
 
diff --git a/Chapter_03/README b/Chapter_03/README
@@ -1,3 +1,3 @@
-Recipe Book Angular Dart application
-Illustrates the use of an Angular Component
+Recipe Book AngularDart application
+Illustrates the use of an Angular component
 
diff --git a/Chapter_03/lib/rating/rating_component.dart b/Chapter_03/lib/rating/rating_component.dart
@@ -30,11 +30,7 @@ import 'package:angular/angular.dart';
     selector: 'rating',
     templateUrl: 'packages/angular_dart_demo/rating/rating_component.html',
     cssUrl: 'packages/angular_dart_demo/rating/rating_component.css',
-    publishAs: 'ctrl',
-    map: const {
-      'max-rating' : '@maxRating',
-      'rating' : '<=>rating'
-    }
+    publishAs: 'cmp'
 )
 class RatingComponent {
   static const String _starOnChar = "\u2605";
@@ -44,8 +40,10 @@ class RatingComponent {
 
   List<int> stars = [];
 
+  @NgTwoWay('rating')
   int rating;
 
+  @NgAttr('max-rating')
   set maxRating(String value) {
     stars = [];
     var count = value == null ? 5 : int.parse(value);
diff --git a/Chapter_03/lib/rating/rating_component.html b/Chapter_03/lib/rating/rating_component.html
@@ -1,7 +1,7 @@
 <span class="stars"
-      ng-if="ctrl.rating != null"
-      ng-repeat="star in ctrl.stars"
-      ng-click="ctrl.handleClick(star)"
-      ng-class="ctrl.starClass(star)">
-  {{ctrl.starChar(star)}}
+      ng-if="cmp.rating != null"
+      ng-repeat="star in cmp.stars"
+      ng-click="cmp.handleClick(star)"
+      ng-class="cmp.starClass(star)">
+  {{cmp.starChar(star)}}
 </span>
diff --git a/Chapter_04/README b/Chapter_04/README
@@ -1,3 +1,3 @@
-Recipe Book Angular Dart application
-Illustrates the use of an Angular Directive
+Recipe Book AngularDart application
+Illustrates the use of an Angular directive
 
diff --git a/Chapter_04/lib/rating/rating_component.dart b/Chapter_04/lib/rating/rating_component.dart
@@ -22,7 +22,7 @@ import 'package:angular/angular.dart';
  *
  * <rating max-rating="5" rating="mycontrol.rating">
  *
- * The compnoent's public fields are available for data binding from the
+ * The component's public fields are available for data binding from the
  * component's view. Similarly, the component's public methods can be
  * invoked from the component's view.
  */
@@ -33,10 +33,10 @@ import 'package:angular/angular.dart';
     publishAs: 'cmp'
 )
 class RatingComponent {
-  String _starOnChar = "\u2605";
-  String _starOffChar = "\u2606";
-  String _starOnClass = "star-on";
-  String _starOffClass = "star-off";
+  static const String _starOnChar = "\u2605";
+  static const String _starOffChar = "\u2606";
+  static const String _starOnClass = "star-on";
+  static const String _starOffClass = "star-off";
 
   List<int> stars = [];
 
diff --git a/Chapter_05/README b/Chapter_05/README
@@ -1,3 +1,3 @@
-Recipe Book Angular Dart application
-Illustrates the use of Filters and Services
+Recipe Book AngularDart application
+Illustrates the use of filters and services
 
diff --git a/Chapter_05/lib/rating/rating_component.dart b/Chapter_05/lib/rating/rating_component.dart
@@ -22,30 +22,28 @@ import 'package:angular/angular.dart';
  *
  * <rating max-rating="5" rating="mycontrol.rating">
  *
- * The compnoent's public fields are available for data binding from the
+ * The component's public fields are available for data binding from the
  * component's view. Similarly, the component's public methods can be
  * invoked from the component's view.
  */
 @NgComponent(
     selector: 'rating',
     templateUrl: 'packages/angular_dart_demo/rating/rating_component.html',
     cssUrl: 'packages/angular_dart_demo/rating/rating_component.css',
-    publishAs: 'ctrl',
-    map: const {
-      'max-rating' : '@maxRating',
-      'rating' : '<=>rating'
-    }
+    publishAs: 'cmp'
 )
 class RatingComponent {
-  String _starOnChar = "\u2605";
-  String _starOffChar = "\u2606";
-  String _starOnClass = "star-on";
-  String _starOffClass = "star-off";
+  static const String _starOnChar = "\u2605";
+  static const String _starOffChar = "\u2606";
+  static const String _starOnClass = "star-on";
+  static const String _starOffClass = "star-off";
 
   List<int> stars = [];
 
+  @NgTwoWay('rating')
   int rating;
 
+  @NgAttr('max-rating')
   set maxRating(String value) {
     stars = [];
     var count = value == null ? 5 : int.parse(value);
diff --git a/Chapter_05/lib/rating/rating_component.html b/Chapter_05/lib/rating/rating_component.html
@@ -1,7 +1,7 @@
 <span class="stars"
-      ng-if="ctrl.rating != null"
-      ng-repeat="star in ctrl.stars"
-      ng-click="ctrl.handleClick(star)"
-      ng-class="ctrl.starClass(star)">
-  {{ctrl.starChar(star)}}
+      ng-if="cmp.rating != null"
+      ng-repeat="star in cmp.stars"
+      ng-click="cmp.handleClick(star)"
+      ng-class="cmp.starClass(star)">
+  {{cmp.starChar(star)}}
 </span>
diff --git a/Chapter_05/lib/tooltip/tooltip_directive.dart b/Chapter_05/lib/tooltip/tooltip_directive.dart
@@ -5,19 +5,17 @@ import 'dart:math';
 import 'package:angular/angular.dart';
 
 @NgDirective(
-    selector: '[tooltip]',
-    map: const {
-      'tooltip': '=>displayModel'
-    }
+    selector: '[tooltip]'
 )
 class Tooltip {
   dom.Element element;
-  Scope scope;
+  
+  @NgOneWay('tooltip')
   TooltipModel displayModel;
 
   dom.Element tooltipElem;
 
-  Tooltip(this.element, this.scope) {
+  Tooltip(this.element) {
     element
       ..onMouseEnter.listen((_) => _createTemplate())
       ..onMouseLeave.listen((_) => _destroyTemplate());
diff --git a/Chapter_06/README b/Chapter_06/README
@@ -1,3 +1,3 @@
-Recipe Book Angular Dart application
-Illustrates the use of Routing to create views
+Recipe Book AngularDart application
+Illustrates the use of routing to create views
 
diff --git a/Chapter_06/lib/component/search_recipe_component.dart b/Chapter_06/lib/component/search_recipe_component.dart
@@ -5,14 +5,13 @@ import 'package:angular/angular.dart';
 @NgComponent(
     selector: 'search-recipe',
     templateUrl: 'packages/angular_dart_demo/component/search_recipe_component.html',
-    publishAs: 'ctrl',
-    map: const {
-      'name-filter-string': '<=>nameFilterString',
-      'category-filter-map' : '<=>categoryFilterMap'
-    }
+    publishAs: 'ctrl'
 )
 class SearchRecipeComponent {
+  @NgTwoWay('name-filter-string')
   String nameFilterString = "";
+  
+  @NgTwoWay('category-filter-map')
   Map categoryFilterMap;
 
   get categories {
diff --git a/Chapter_06/lib/component/view_recipe_component.dart b/Chapter_06/lib/component/view_recipe_component.dart
@@ -7,13 +7,12 @@ import 'package:angular/angular.dart';
     selector: 'view-recipe',
     templateUrl: 'packages/angular_dart_demo/component/view_recipe_component.html',
     cssUrl: 'packages/angular_dart_demo/component/view_recipe_component.css',
-    publishAs: 'ctrl',
-    map: const {
-      'recipe-map':'<=>recipeMap'
-    }
+    publishAs: 'ctrl'
 )
 class ViewRecipeComponent {
+  @NgTwoWay('recipe-map')
   Map<String, Recipe> recipeMap;
+  
   String _recipeId;
 
   get recipe {
diff --git a/Chapter_06/lib/rating/rating_component.dart b/Chapter_06/lib/rating/rating_component.dart
@@ -22,30 +22,28 @@ import 'package:angular/angular.dart';
  *
  * <rating max-rating="5" rating="mycontrol.rating">
  *
- * The compnoent's public fields are available for data binding from the
+ * The component's public fields are available for data binding from the
  * component's view. Similarly, the component's public methods can be
  * invoked from the component's view.
  */
 @NgComponent(
     selector: 'rating',
     templateUrl: 'packages/angular_dart_demo/rating/rating_component.html',
     cssUrl: 'packages/angular_dart_demo/rating/rating_component.css',
-    publishAs: 'ctrl',
-    map: const {
-      'max-rating' : '@maxRating',
-      'rating' : '<=>rating'
-    }
+    publishAs: 'cmp'
 )
 class RatingComponent {
-  String _starOnChar = "\u2605";
-  String _starOffChar = "\u2606";
-  String _starOnClass = "star-on";
-  String _starOffClass = "star-off";
+  static const String _starOnChar = "\u2605";
+  static const String _starOffChar = "\u2606";
+  static const String _starOnClass = "star-on";
+  static const String _starOffClass = "star-off";
 
   List<int> stars = [];
 
+  @NgTwoWay('rating')
   int rating;
 
+  @NgAttr('max-rating')
   set maxRating(String value) {
     stars = [];
     var count = value == null ? 5 : int.parse(value);
diff --git a/Chapter_06/lib/rating/rating_component.html b/Chapter_06/lib/rating/rating_component.html
@@ -1,7 +1,7 @@
 <span class="stars"
-      ng-if="ctrl.rating != null"
-      ng-repeat="star in ctrl.stars"
-      ng-click="ctrl.handleClick(star)"
-      ng-class="ctrl.starClass(star)">
-  {{ctrl.starChar(star)}}
+      ng-if="cmp.rating != null"
+      ng-repeat="star in cmp.stars"
+      ng-click="cmp.handleClick(star)"
+      ng-class="cmp.starClass(star)">
+  {{cmp.starChar(star)}}
 </span>
diff --git a/Chapter_06/lib/recipe_book.dart b/Chapter_06/lib/recipe_book.dart
@@ -46,24 +46,25 @@ kitchen and took the recipe book with him!""";
   }
 
   // Tooltip
-  static final tooltip = new Expando<TooltipModel>();
+  static final _tooltip = new Expando<TooltipModel>();
   TooltipModel tooltipForRecipe(Recipe recipe) {
-    if (tooltip[recipe] == null) {
-      tooltip[recipe] = new TooltipModel(recipe.imgUrl,
+    if (_tooltip[recipe] == null) {
+      _tooltip[recipe] = new TooltipModel(recipe.imgUrl,
           "I don't have a picture of these recipes, "
           "so here's one of my cat instead!",
           80);
     }
-    return tooltip[recipe]; // recipe.tooltip
+    return _tooltip[recipe]; // recipe.tooltip
   }
 
   void _loadData() {
     _queryService.getAllRecipes()
       .then((Map<String, Recipe> allRecipes) {
         _recipeMap = allRecipes;
         recipesLoaded = true;
-      },
-      onError: (Object obj) {
+      })
+      .catchError((e) {
+        print(e);
         recipesLoaded = false;
         message = ERROR_MESSAGE;
       });
@@ -75,8 +76,9 @@ kitchen and took the recipe book with him!""";
           categoryFilterMap[category] = false;
         }
         categoriesLoaded = true;
-      },
-      onError: (Object obj) {
+      })
+      .catchError((e) {
+        print(e);
         categoriesLoaded = false;
         message = ERROR_MESSAGE;
       });
diff --git a/Chapter_06/lib/tooltip/tooltip_directive.dart b/Chapter_06/lib/tooltip/tooltip_directive.dart
@@ -5,19 +5,17 @@ import 'dart:math';
 import 'package:angular/angular.dart';
 
 @NgDirective(
-    selector: '[tooltip]',
-    map: const {
-      'tooltip': '=>displayModel'
-    }
+    selector: '[tooltip]'
 )
 class Tooltip {
   dom.Element element;
-  Scope scope;
+  
+  @NgOneWay('tooltip')
   TooltipModel displayModel;
 
   dom.Element tooltipElem;
 
-  Tooltip(this.element, this.scope) {
+  Tooltip(this.element) {
     element
       ..onMouseEnter.listen((_) => _createTemplate())
       ..onMouseLeave.listen((_) => _destroyTemplate());
diff --git a/Chapter_06/web/style.css b/Chapter_06/web/style.css
@@ -1,15 +1,15 @@
-[ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
-   display: none !important;
-}
-
-ul {
-  list-style-type: none;
-}
-
 a {
   text-decoration: none;
 }
 
 .extra-space {
   padding-left: 10px;
 }
+
+[ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
+   display: none !important;
+}
+
+ul {
+  list-style-type: none;
+}
diff --git a/Chapter_06/web/view/addRecipe.html b/Chapter_06/web/view/addRecipe.html
@@ -1,4 +1,4 @@
 <div>
   <h3>Add recipe</h3>
-  Now it's your turn. Write some code to add a new recipe
+  Now it's your turn. Write some code to add a new recipe.
 </div>
diff --git a/Chapter_06/web/view/editRecipe.html b/Chapter_06/web/view/editRecipe.html
@@ -1,4 +1,4 @@
 <div>
   <h3>Edit recipe</h3>
-  Now it's your turn. Write some code to edit the recipe
+  Now it's your turn. Write some code to edit the recipe.
 </div>

Original file line number	Diff line number	Diff line change
`@@ -1,2 +1,2 @@`
`1`		`-"Hello World" Angular Dart application`
	`1`	`+"Hello World" AngularDart application`
`2`	`2`