diff --git a/lib/app_component.dart b/lib/app_component.dart
index cf77c3c..637c8cf 100644
--- a/lib/app_component.dart
+++ b/lib/app_component.dart
@@ -5,11 +5,13 @@ import 'package:rules_of_living/src/App.dart';
 
 @Component(
   selector: 'my-app',
+  templateUrl: "app_component.html"
 )
 class AppComponent implements OnInit {
   var name = "World";
 
   App engine;
+  String buttonRunText = "Start";
 
   @ViewChild("caCanvas")
   html.CanvasElement canvas;
@@ -26,4 +28,14 @@ class AppComponent implements OnInit {
     engine.process(now);
     html.window.animationFrame.then(animFrame);
   }
+
+  void onStartClicked() {
+    bool isRunning = !engine.running;
+    engine.running = isRunning;
+
+    switch (isRunning) {
+      case true: buttonRunText = "Stop"; break;
+      case false: buttonRunText = "Start"; break;
+    }
+  }
 }
diff --git a/lib/app_component.html b/lib/app_component.html
index 95d1c96..b0f6234 100644
--- a/lib/app_component.html
+++ b/lib/app_component.html
@@ -6,7 +6,7 @@
     <canvas #caCanvas width="500" height="500"></canvas>
 </div>
 <div id="controls">
-    <button id="run" >Run</button>
+    <button id="run" (click)="onStartClicked()">{{buttonRunText}}</button>
     <button id="step">Step</button>
     <button id="reset">Reset</button>
     <button id="random">Random</button>
diff --git a/lib/src/App.dart b/lib/src/App.dart
index 10e590d..64b9217 100644
--- a/lib/src/App.dart
+++ b/lib/src/App.dart
@@ -25,12 +25,6 @@ class App {
 
   App(this.canvas) {
     _elapsed.start();
-    var runBtn = html.querySelector("#run");
-    runBtn.onClick.forEach((html.MouseEvent mouse) {
-      running = !running;
-      if(running) runBtn.innerHtml = "Stop";
-      if(!running) runBtn.innerHtml = "Start";
-    });
   }
 
   void process(num now) {
@@ -56,7 +50,7 @@ class App {
 
   void update() {
 //    print("updating");
-    if (running) grid.update();
+    if (running == true) grid.update();
   }