[sheriff-o-matic]: Basic trooper display for sheriff-o-matic.

Tools/GardeningServer/ui/ct-chart.html

Index: Tools/GardeningServer/ui/ct-chart.html
diff --git a/Tools/GardeningServer/ui/ct-chart.html b/Tools/GardeningServer/ui/ct-chart.html
new file mode 100644
index 0000000000000000000000000000000000000000..b926ce0deebff38662b94531f4fdc98ec238e412
--- /dev/null
+++ b/Tools/GardeningServer/ui/ct-chart.html
@@ -0,0 +1,42 @@
+<!--
+Copyright 2014 The Chromium Authors. All rights reserved.
+Use of this source code is governed by a BSD-style license that can be
+found in the LICENSE file.
+-->
+
+<link rel="import" href="../lib/chart-loader.html">
+
+<polymer-element name="ct-chart" attributes="table options width height">
+  <template>
+    <style>

[ojan, 2014/09/05 00:24:47]

Don't need this style block in here, right?

[shans, 2014/09/05 01:44:00]

Done.

+      #failure {
+        flex: 1;
+        margin-left: 10px;
+      }
+
+      #details {
+        font-weight: bold;
+      }
+    </style>
+    <canvas id='chart' width="{{ width }}" height="{{ height }}"></canvas>
+  </template>
+  <script>
+    Polymer({
+      table: null,
+      options: null,
+      optionsChanged: function() {

[ojan, 2014/09/05 00:24:47]

Use observe for this.

http://www.polymer-project.org/docs/polymer/polymer.html#observeblock

[ojan, 2014/09/05 00:24:47]

Use observe for this.

http://www.polymer-project.org/docs/polymer/polymer.html#observeblock

[shans, 2014/09/05 01:44:00]

Done.

[shans, 2014/09/05 01:44:00]

Done.

+        this.updateChart();
+      },
+      tableChanged: function() {
+        this.updateChart();
+      },
+      updateChart: function() {
+        if (this.table == null || this.options == null) {
+          return;
+        }
+        var ctx = this.$.chart.getContext("2d");
+        new Chart(ctx).Bar(this.table, this.options);
+      }
+    });
+  </script>
+</template>