Add Function based profile tree

runtime/observatory/lib/src/elements/function_ref.dart

Index: runtime/observatory/lib/src/elements/function_ref.dart
diff --git a/runtime/observatory/lib/src/elements/function_ref.dart b/runtime/observatory/lib/src/elements/function_ref.dart
index 32d79ea6c872e2ed2a3f59e479081eeea6504e41..0e85bb08a91537ceda755caef866a1aab9649d54 100644
--- a/runtime/observatory/lib/src/elements/function_ref.dart
+++ b/runtime/observatory/lib/src/elements/function_ref.dart
@@ -4,7 +4,9 @@
 
 library function_ref_element;
 
+import 'dart:html';
 import 'package:polymer/polymer.dart';
+import 'package:observatory/service.dart';
 import 'service_ref.dart';
 
 @CustomTag('function-ref')
@@ -12,4 +14,37 @@ class FunctionRefElement extends ServiceRefElement {
   @published bool qualified = true;
 
   FunctionRefElement.created() : super.created();
-}
+
+  refChanged(oldValue) {
+    super.refChanged(oldValue);
+    _updateShadowDom();
+  }
+
+  ServiceFunction get function => ref;
+  void _updateShadowDom() {
+    clearShadowRoot();
+    if (ref == null) {
+      return;
+    }
+    if (function.isDart) {
+      if (qualified) {
+        // Add class-name or parent-function-name followed by a dot.
+        if ((function.parent == null) && (function.owningClass != null)) {
+          var classRef = new Element.tag('class-ref');
+          classRef.ref = function.owningClass;
+          shadowRoot.children.add(classRef);
+          insertTextSpanIntoShadowRoot('.');
+        } else if (function.parent != null) {
+          var functionRef = new Element.tag('function-ref');
+          functionRef.ref = function.parent;
+          functionRef.qualified = true;
+          shadowRoot.children.add(functionRef);
+          insertTextSpanIntoShadowRoot('.');
+        }
+      }
+      insertLinkIntoShadowRoot(name, url, hoverText);
+    } else {
+      insertTextSpanIntoShadowRoot(name);
+    }
+  }
+}