[polymer] Stops using Polymer subclasses for scalar span unit updates

tracing/tracing/value/ui/scalar_span.html

Index: tracing/tracing/value/ui/scalar_span.html
diff --git a/tracing/tracing/value/ui/scalar_span.html b/tracing/tracing/value/ui/scalar_span.html
index 747f17e12dd218801cdad5b9ac0d250c0164571a..aea5ec7b63d94f447346a4e3042be41f0740bc68 100644
--- a/tracing/tracing/value/ui/scalar_span.html
+++ b/tracing/tracing/value/ui/scalar_span.html
@@ -45,34 +45,6 @@ tr.exportTo('tr.v.ui', function() {
     return span;
   }
 
-  tr.v.Unit.addEventListener('display-mode-changed', function(e) {
-
-    // Can't do this subclass dependency, and subclasses
-    // have been eliminated, so querySelectorAll works
-
-    var scalarSpans = document.querySelectorAll('tr-v-ui-scalar-span');
-    for (var i = 0; i < scalarSpans.length; i++)
-      scalarSpans[i].updateContent_();
-
-//    var scalarSpanTagName = 'tr-v-ui-scalar-span';
-//    var subclassNames = tr.ui.b.getPolymerElementsThatSubclass(
-//        scalarSpanTagName);
-//    subclassNames.push(scalarSpanTagName);
-//    var isSubclass = {};
-//    subclassNames.forEach(function(n) {
-//      isSubclass[n.toUpperCase()] = true;
-//    });
-
-//    var m = tr.b.findDeepElementsMatchingPredicate(
-//        document.body,
-//        function(el) {
-//         return isSubclass[el.tagName];
-//        });
-//    m.forEach(function(el) {
-//      el.updateContent_();
-//    });
-  });
-
   return {
     createScalarSpan: createScalarSpan
   };
@@ -126,6 +98,16 @@ Polymer({
     this.percentage_ = undefined;
   },
 
+  attached: function() {
+    tr.v.Unit.addEventListener(
+        'display-mode-changed', this.updateContent_.bind(this));
+  },
+
+  detached: function() {
+    tr.v.Unit.removeEventListener(
+        'display-mode-changed', this.updateContent_.bind(this));
+  },
+
   set contentTextDecoration(deco) {
     this.$.content.style.textDecoration = deco;
   },