DevTools: Add energy value under Timeline pie chart

Source/devtools/front_end/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 277 matching lines @@
         text.textContent = Number.millisToString(aggregatedStats[index], true);
         cell.appendChild(text);
     }
     return cell;
 }
 
 /**
  * @param {!Object} aggregatedStats
  * @param {!WebInspector.TimelineCategory=} selfCategory
  * @param {number=} selfTime
+ * @param {number=} energy
  * @return {!Element}
  */
-WebInspector.TimelineUIUtils.generatePieChart = function(aggregatedStats, selfCategory, selfTime)
+WebInspector.TimelineUIUtils.generatePieChart = function(aggregatedStats, selfCategory, selfTime, energy)
 {
     var element = document.createElement("div");
     element.className = "timeline-aggregated-info";
 
     var total = 0;
     for (var categoryName in aggregatedStats)
         total += aggregatedStats[categoryName];
 
     function formatter(value)
     {
@@ skipping 28 matching lines @@
          if (category === selfCategory)
              continue;
          var value = aggregatedStats[category.name];
          if (!value)
              continue;
          pieChart.addSlice(value, category.fillColorStop0);
          var rowElement = footerElement.createChild("div");
          rowElement.createChild("div", "timeline-aggregated-category timeline-" + category.name);
          rowElement.createTextChild(WebInspector.UIString("%s %s", formatter(value), category.title));
     }
+
+    if (energy) {
+        var rowElement = footerElement.createChild("div");
+        rowElement.createChild("div", "timeline-aggregated-category timeline-" + "power");

[alph, 2014/04/09 16:02:27]

what does this div do? Is it empty?

+        rowElement.createTextChild(WebInspector.UIString("%0.2f joules %s", energy, "Energy"));

[alph, 2014/04/09 16:02:27]

%.2f

Why not just put "Energy" inside the UIString, e.g. "Energy: %.2f Joules"?

+    }
     return element;
 }
 
 WebInspector.TimelineUIUtils.generatePopupContentForFrame = function(frame)
 {
     var contentHelper = new WebInspector.TimelinePopupContentHelper(WebInspector.UIString("Frame"));
     var durationInMillis = frame.endTime - frame.startTime;
     var durationText = WebInspector.UIString("%s (at %s)", Number.millisToString(frame.endTime - frame.startTime, true),
         Number.millisToString(frame.startTimeOffset, true));
     contentHelper.appendTextRow(WebInspector.UIString("Duration"), durationText);
@@ skipping 619 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);
         }
     }
 }