Improve CPU Profile View

runtime/observatory/lib/src/app/view_model.dart

 // Copyright (c) 2014, the Dart project authors.  Please see the AUTHORS file
 // for details. All rights reserved. Use of this source code is governed by a
 // BSD-style license that can be found in the LICENSE file.
 
 part of app;
 
 abstract class VirtualTreeRow {
   // Number of ems each subtree is indented.
-  static const subtreeIndent = 1.05;
+  static const subtreeIndent = 2.0;
 
   static const redColor = '#F44336';
   static const blueColor = '#3F51B5';
   static const purpleColor = '#673AB7';
   static const greenColor = '#4CAF50';
   static const orangeColor = '#FF9800';
   static const lightGrayColor = '#FAFAFA';
 
   List backgroundColors = const [
     purpleColor,
@@ skipping 19 matching lines @@
     if (!changed) {
       return;
     }
     if (_expanded) {
       _expand();
     } else {
       _collapse();
     }
   }
 
-  Element makeColorBar() {
+  Element makeColorBar(int depth) {
     var element = new SpanElement();
     element.style.paddingLeft = '2px';
     element.style.paddingRight = '2px';
     element.style.flexBasis = '2px';
     element.style.height = '${tree.rowHeight}px';
     element.style.minHeight = '${tree.rowHeight}px';
     if (depth > 0) {
       var colorIndex = (depth - 1) % backgroundColors.length;
       element.style.backgroundColor = backgroundColors[colorIndex];
     }
@@ skipping 11 matching lines @@
           new Element.tag('icon-expand-more') :
           new Element.tag('icon-chevron-right'));
     }
     _listeners.add(element.onClick.listen((e) {
       e.stopPropagation();
       toggle();
     }));
     return element;
   }
 
-  Element makeIndenter({colored: true}) {
+  Element makeIndenter(int depth, {colored: true}) {
     SpanElement element = new SpanElement();
     element.style.paddingLeft = '${subtreeIndent * depth}em';
     element.style.flexBasis = '${subtreeIndent * depth}em';
     element.style.height = '${tree.rowHeight}px';
     element.style.minHeight = '${tree.rowHeight}px';
     if (colored) {
       if (depth > 0) {
         var colorIndex = (depth - 1) % backgroundColors.length;
         element.style.backgroundColor = backgroundColors[colorIndex];
       }
     }
     return element;
   }
 
-  Element makeText(String text, {String toolTip, String flexBasis: '7em'}) {
+  Element makeText(String text, {String toolTip,
+                                 String flexBasis: '4.5em',
+                                 String cssClass}) {
     SpanElement element = new SpanElement();
     element.text = text;
     if (toolTip != null) {
       element.title = toolTip;
     }
     if (flexBasis != null) {
       element.style.flexBasis = flexBasis;
     }
+    if (cssClass != null) {
+      element.classes.add(cssClass);
+    }
     return element;
   }
 
   Element makeGap({double ems: 0.5}) {
     SpanElement element = new SpanElement();
     var flexBasis = '${ems}em';
     element.style.flexBasis = flexBasis;
     return element;
   }
 
@@ skipping 626 matching lines @@
     if (column != _sortColumnIndex) {
       return columns[column].label + '\u2003';
     }
     return columns[column].label + (_sortDescending ? arrowUp : arrowDown);
   }
 
   dynamic getValue(int row, int column) {
     return rows[row].values[column];
   }
 }