added ng controller (not yet woring)

DartFlightSchoolHackLiberec · Feb 15, 2014 · 18a63f3 · 18a63f3
1 parent dcafb4a
commit 18a63f3
Show file tree

Hide file tree

Showing 4 changed files with 83 additions and 17 deletions.
diff --git a/web/ng/SpaceShipController.dart b/web/ng/SpaceShipController.dart
@@ -0,0 +1,63 @@
+@NgController(
+  selector: '[ship-control]',
+  publishAs: 'ctrl')  
+  class SpaceShipController {
+
+  List<Recipe> recipes;
+  SpaceShipController() {
+    recipes = _loadData();
+  }
+
+  Recipe selectedRecipe;
+
+  void selectRecipe(Recipe recipe) {
+    selectedRecipe = recipe;
+  }
+
+  List<Recipe> _loadData() {
+    return [
+      new Recipe('My Appetizer','Appetizers',
+          ["Ingredient 1", "Ingredient 2"],
+          "Some Directions", 1),
+      new Recipe('My Salad','Salads',
+          ["Ingredient 1", "Ingredient 2"],
+          "Some Directions", 3),
+      new Recipe('My Soup','Soups',
+          ["Ingredient 1", "Ingredient 2"],
+          "Some Directions", 4),
+      new Recipe('My Main Dish','Main Dishes',
+          ["Ingredient 1", "Ingredient 2"],
+          "Some Directions", 2),
+      new Recipe('My Side Dish','Side Dishes',
+          ["Ingredient 1", "Ingredient 2"],
+          "Some Directions", 3),
+      new Recipe('My Awesome Dessert','Desserts',
+          ["Ingredient 1", "Ingredient 2"],
+          "Some Directions", 5),
+      new Recipe('My So-So Dessert','Desserts',
+          ["Ingredient 1", "Ingredient 2"],
+          "Some Directions", 3),
+    ];
+  }
+}
+
+class Recipe {
+  String name;
+  String category;
+  List<String> ingredients;
+  String directions;
+  int rating;
+
+  Recipe(this.name, this.category, this.ingredients, this.directions,
+      this.rating);
+}
+
+class SpaceShipModule extends Module {
+  SpaceShipModule() {
+    type(SpaceShipController);
+  }
+}
+
+void main() {
+  ngBootstrap(module: new MyAppModule());
+}
diff --git a/web/spaceshipai.css b/web/spaceshipai.css
@@ -13,9 +13,16 @@ h1, p {
 }
 
 label {
+  width: 200px;
   display: block;
 }
 
+.visualization {
+  width: 600px;
+  height: 400px;
+  background-color: #aaa;
+}
+
 #sample_container_id {
   width: 100%;
   height: 400px;

diff --git a/web/spaceshipai.dart b/web/spaceshipai.dart
@@ -2,17 +2,5 @@ import 'dart:html';
 import 'package:angular/angular.dart';
 
 void main() {
-
-  querySelector("#sample_text_id")
-    ..text = "Click me!"
-    ..onClick.listen(reverseText);
-}
-
-void reverseText(MouseEvent event) {
-  var text = querySelector("#sample_text_id").text;
-  var buffer = new StringBuffer();
-  for (int i = text.length - 1; i >= 0; i--) {
-    buffer.write(text[i]);
-  }
-  querySelector("#sample_text_id").text = buffer.toString();
-}
+    ngBootstrap(module: new MyAppModule());
+}
diff --git a/web/spaceshipai.html b/web/spaceshipai.html
@@ -1,14 +1,16 @@
 <!DOCTYPE html>
 
-<html>
+<html ng-app>
   <head>
     <meta charset="utf-8">
     <title>SpaceShip AI</title>
     <link rel="stylesheet" href="spaceshipai.css">
   </head>
-  <body>
+  <body ng-controller="ship-control">
     <h1>SpaceShip AI</h1>
 
+    {{ctrl.turn}}
+
     <form>
         <label>
         Turn: <input type="number" ng-model="turn">
@@ -19,13 +21,19 @@ <h1>SpaceShip AI</h1>
         <label>
         Forward or backward: <input type="number" ng-model="forwardBack">
         </label>
+
+        <button type="button" ng-disable="isSending">Refresh</button>
     </form>
+
+    <canvas class="visualization"></canvas>
 
     <div id="sample_container_id">
       <p id="sample_text_id"></p>
     </div>
 
     <script type="application/dart" src="spaceshipai.dart"></script>
-    <script src="packages/browser/dart.js"></script>
+    <script src="packages/browser/dart.js"></script>    
+    <script src="packages/shadow_dom/shadow_dom.min.js"></script>
+
   </body>
 </html>