DevTools: Add total time column to the timeline tree view

Source/devtools/front_end/timeline/TimelineTreeView.js

 // Copyright 2015 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.
 
 /**
  * @constructor
  * @extends {WebInspector.VBox}
  * @param {!WebInspector.TimelineModel} model
  */
 WebInspector.TimelineTreeView = function(model)
 {
     WebInspector.VBox.call(this);
     this.element.classList.add("timeline-tree-view");
 
     this._model = model;
     var columns = [];
     columns.push({id: "self", title: WebInspector.UIString("Self Time"), width: "120px", sort: WebInspector.DataGrid.Order.Descending, sortable: true});
+    columns.push({id: "total", title: WebInspector.UIString("Total Time"), width: "120px", sort: WebInspector.DataGrid.Order.Descending, sortable: true});
     columns.push({id: "activity", title: WebInspector.UIString("Activity"), disclosure: true, sortable: true});
 
     this._filters = [
         WebInspector.TimelineUIUtils.hiddenEventsFilter(),
         new WebInspector.ExcludeTopLevelFilter()
     ];
 
     this._groupBySetting = WebInspector.settings.createSetting("timelineTreeGroupBy", WebInspector.TimelineTreeView.GroupBy.None);
 
     this.dataGrid = new WebInspector.SortableDataGrid(columns);
@@ skipping 62 matching lines @@
         /**
          * @param {string} id
          * @return {!WebInspector.TimelineModel.ProfileTreeNode}
          */
         function groupNodeById(id)
         {
             var node = groupNodes.get(id);
             if (!node) {
                 node = new WebInspector.TimelineModel.ProfileTreeNode();
                 node.name = id || WebInspector.UIString("(unknown)");
+                node.selfTime = 0;
                 node.totalTime = 0;
                 groupNodes.set(id, node);
             }
             return node;
         }
 
         /**
          * @return {?WebInspector.TimelineModel.ProfileTreeNode}
          */
         function groupByNone()
@@ skipping 84 matching lines @@
          */
         function compareField(field, a, b)
         {
             var nodeA = /** @type {!WebInspector.TimelineTreeView.GridNode} */ (a);
             var nodeB = /** @type {!WebInspector.TimelineTreeView.GridNode} */ (b);
             var valueA = nodeA._profileNode[field];
             var valueB = nodeB._profileNode[field];
             return valueA === valueB ? 0 : valueA > valueB ? 1 : -1;
         }
         var field = {
-            "self": "totalTime",
+            "self": "selfTime",
+            "total": "totalTime",
             "activity": "name"
         }[columnIdentifier];
         this.dataGrid.sortNodes(compareField.bind(null, field), !this.dataGrid.isSortOrderAscending());
     },
 
     __proto__: WebInspector.VBox.prototype
 }
 
 /**
  * @param {!WebInspector.TracingModel.Event} event
@@ skipping 30 matching lines @@
      * @return {string}
      */
     function formatPercent(value)
     {
         return WebInspector.UIString("%.2f\u2009%%", value);
     }
 
     this._populated = false;
     this._profileNode = profileNode;
     this._totalTime = grandTotalTime;
-    var selfTime = profileNode.totalTime;
+    var selfTime = profileNode.selfTime;
     var selfPercent = selfTime / grandTotalTime * 100;
+    var totalTime = profileNode.totalTime;
+    var totalPercent = totalTime / grandTotalTime * 100;
     var data = {
         "activity": profileNode.name,
         "self-percent": formatPercent(selfPercent),
         "self": formatMilliseconds(selfTime),
+        "total-percent": formatPercent(totalPercent),
+        "total": formatMilliseconds(totalTime),
     };
     var hasChildren = this._profileNode.children ? this._profileNode.children.size > 0 : false;
     WebInspector.SortableDataGridNode.call(this, data, hasChildren);
 }
 
 WebInspector.TimelineTreeView.GridNode.prototype = {
     /**
      * @override
      * @param {string} columnIdentifier
      * @return {!Element}
@@ skipping 70 matching lines @@
         if (!this._profileNode.children)
             return;
         for (var node of this._profileNode.children.values()) {
             var gridNode = new WebInspector.TimelineTreeView.GridNode(node, this._totalTime);
             this.insertChildOrdered(gridNode);
         }
     },
 
     __proto__: WebInspector.SortableDataGridNode.prototype
 }