Factor cpu profile tree into separate element and expose allocation tracing UI

runtime/observatory/lib/src/elements/class_view.html

Index: runtime/observatory/lib/src/elements/class_view.html
diff --git a/runtime/observatory/lib/src/elements/class_view.html b/runtime/observatory/lib/src/elements/class_view.html
index ad85d1600d9efcd676ec1b5757d1b8dfc2e79702..beddb21bccb9a3253dc06a474d09c37c76c1c465 100644
--- a/runtime/observatory/lib/src/elements/class_view.html
+++ b/runtime/observatory/lib/src/elements/class_view.html
@@ -1,4 +1,6 @@
 <link rel="import" href="../../../../packages/polymer/polymer.html">
+<link rel="import" href="action_link.html">
+<link rel="import" href="cpu_profile.html">
 <link rel="import" href="curly_block.html">
 <link rel="import" href="eval_box.html">
 <link rel="import" href="eval_link.html">
@@ -21,6 +23,7 @@
       <isolate-nav-menu isolate="{{ cls.isolate }}"></isolate-nav-menu>
       <library-nav-menu library="{{ cls.library }}"></library-nav-menu>
       <class-nav-menu cls="{{ cls }}" last="{{ true }}"></class-nav-menu>
+      <nav-refresh callback="{{ refreshAllocationProfile }}" label="Refresh Allocation Profile"></nav-refresh>
       <nav-refresh callback="{{ refreshCoverage }}" label="Refresh Coverage"></nav-refresh>
       <nav-refresh callback="{{ refresh }}"></nav-refresh>
     </nav-bar>
@@ -206,6 +209,35 @@
 
     <hr>
 
+    <div class="content">
+      <h2>Allocations</h2>
+      <div class="memberList">
+        <template if="{{ cls.traceAllocations }}">
+          <div class="memberItem">
+            <div class="memberName">Tracing allocations?</div>
+            <div class="memberValue">
+              <span>Yes</span><action-link label="disable" callback="{{ toggleAllocationTrace }}"></action-link>
+            </div>
+          </div>
+        </template>
+        <template if="{{ !cls.traceAllocations }}">
+          <div class="memberItem">
+            <div class="memberName">Tracing allocations?</div>
+            <div class="memberValue">
+              <span>No</span><action-link label="enable" callback="{{ toggleAllocationTrace }}"></action-link>
+            </div>
+          </div>
+        </template>
+      </div>
+      <div class="flex-row centered">
+        <div class="flex-item-90-percent outlined" style="margin: 16px; margin-left: 8px; margin-right: 8px">
+          <cpu-profile-tree id="cpuProfileTree"></cpu-profile-tree>
+        </div>
+      </div>
+    </div>
+
+    <hr>
+
     <div class="content-centered-big">
       <source-inset location="{{ cls.location }}">
       </source-inset>