Add aggregated stats to selected trace event details

Source/devtools/front_end/timeline/TimelineUIUtils.js

 /*
  * Copyright (C) 2013 Google Inc. All rights reserved.
  * Copyright (C) 2012 Intel Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
@@ skipping 719 matching lines @@
  * @param {?Element} imagePreviewElement
  * @param {?WebInspector.DOMNode} relatedNode
  * @param {boolean} loadedFromFile
  * @param {?WebInspector.TimelineTraceEventBindings} bindings
  * @param {!WebInspector.Target} target
  * @return {!DocumentFragment}
  */
 WebInspector.TimelineUIUtils._buildTraceEventDetailsSynchronously = function(event, model, linkifier, imagePreviewElement, relatedNode, loadedFromFile, bindings, target)
 {
     var fragment = document.createDocumentFragment();
+    var stats = WebInspector.TimelineUIUtils._aggregatedStatsForTraceEvent(model, event);
+    fragment.appendChild(WebInspector.TimelineUIUtils.generatePieChart(stats));
+
     var recordTypes = WebInspector.TimelineModel.RecordType;
 
     // The messages may vary per event.name;
     var callSiteStackTraceLabel;
     var callStackLabel;
     var relatedNodeLabel;
 
     var contentHelper = new WebInspector.TimelineDetailsContentHelper(target, linkifier, true);
     contentHelper.appendTextRow(WebInspector.UIString("Self Time"), Number.millisToString(event.selfTime / 1000, true));
     contentHelper.appendTextRow(WebInspector.UIString("Start Time"), Number.millisToString((event.startTime - model.minimumRecordTime()) / 1000));
@@ skipping 126 matching lines @@
     if (warning) {
         var div = document.createElement("div");
         div.textContent = warning;
         contentHelper.appendElementRow(WebInspector.UIString("Warning"), div);
     }
     fragment.appendChild(contentHelper.element);
     return fragment;
 }
 
 /**
+ * @param {!WebInspector.TracingModel} model
+ * @param {!WebInspector.TracingModel.Event} event
+ * @return {!Object}
+ */
+WebInspector.TimelineUIUtils._aggregatedStatsForTraceEvent = function(model, event)
+{
+    var events = model.inspectedTargetEvents();
+    /**
+     * @param {number} startTime
+     * @param {!WebInspector.TracingModel.Event} e
+     * @return {number}
+     */
+    function eventComparator(startTime, e)
+    {
+        return startTime - e.startTime;
+    }
+    var index = events.binaryIndexOf(event.startTime, eventComparator);
+    var aggregatedStats = {};
+    var endTime = event.endTime;
+    if (!endTime)
+        return aggregatedStats;
+    for (;index < events.length; index++) {

[alph, 2014/05/28 18:43:14]

missing space

[yurys, 2014/05/28 19:18:41]

Done.

+        var nextEvent = events[index];
+        if (nextEvent.startTime > endTime)
+            break;
+        if (!nextEvent.selfTime)
+            continue;
+        var category = WebInspector.TimelineUIUtils.styleForTimelineEvent(nextEvent.name).category.name;
+        aggregatedStats[category] = (aggregatedStats[category] || 0) + nextEvent.selfTime;
+    }
+    return aggregatedStats;
+}
+
+/**
  * @param {!Array.<number>} quad
  * @return {number}
  */
 WebInspector.TimelineUIUtils._quadHeight = function(quad)
 {
     return Math.round(Math.sqrt(Math.pow(quad[0] - quad[6], 2) + Math.pow(quad[1] - quad[7], 2)));
 }
 
 /**
  * @param {!WebInspector.TimelineModel.Record} record
@@ skipping 446 matching lines @@
         for (var i = 0; i < stackTrace.length; ++i) {
             var stackFrame = stackTrace[i];
             var row = stackTraceElement.createChild("div");
             row.createTextChild(stackFrame.functionName || WebInspector.UIString("(anonymous function)"));
             row.createTextChild(" @ ");
             var urlElement = this._linkifier.linkifyLocation(this._target, stackFrame.url, stackFrame.lineNumber - 1);
             row.appendChild(urlElement);
         }
     }
 }