Changeset 147213 in webkit

Timestamp:

Mar 29, 2013 6:56:55 AM (11 years ago)

Author:

loislo@chromium.org

Message:

Web Inspector: Flame Chart. Developers will have more clue
if two different profiles will have same colors for same functions.
​https://bugs.webkit.org/show_bug.cgi?id=113410

Reviewed by Pavel Feldman.

The code related to color generator was extracted into a separate class.
The instance of the class was stored as static private member of the FlameChart class,
so all the profiles will share the same instance and will use same colors.
The colors itself were slightly adjusted.

Drive by fix: coordinatesToNodeIndex was fixed. The error was introduced in the patch about left padding.

• inspector/front-end/FlameChart.js:

(WebInspector.FlameChart):
(WebInspector.FlameChart.ColorGenerator):
(WebInspector.FlameChart.ColorGenerator.prototype._colorPairForID):
(WebInspector.FlameChart.prototype._calculateTimelineData):
(WebInspector.FlameChart.prototype._calculateTimelineDataForSamples):
(WebInspector.FlameChart.prototype._coordinatesToNodeIndex):

Location:

trunk/Source/WebCore

Files:

• ChangeLog (modified) (1 diff)
• inspector/front-end/FlameChart.js (modified) (8 diffs)

trunk/Source/WebCore/ChangeLog

@@ +1 @@
+2013-03-29  Ilya Tikhonovsky  <loislo@chromium.org>
+
+        Web Inspector: Flame Chart. Developers will have more clue
+        if two different profiles will have same colors for same functions.
+        https://bugs.webkit.org/show_bug.cgi?id=113410
+
+        Reviewed by Pavel Feldman.
+
+        The code related to color generator was extracted into a separate class.
+        The instance of the class was stored as static private member of the FlameChart class,
+        so all the profiles will share the same instance and will use same colors.
+        The colors itself were slightly adjusted.
+
+        Drive by fix: coordinatesToNodeIndex was fixed. The error was introduced in the patch about left padding.
+
+        * inspector/front-end/FlameChart.js:
+        (WebInspector.FlameChart):
+        (WebInspector.FlameChart.ColorGenerator):
+        (WebInspector.FlameChart.ColorGenerator.prototype._colorPairForID):
+        (WebInspector.FlameChart.prototype._calculateTimelineData):
+        (WebInspector.FlameChart.prototype._calculateTimelineDataForSamples):
+        (WebInspector.FlameChart.prototype._coordinatesToNodeIndex):
+
 2013-03-29  Charles Wei  <charles.wei@torchmobile.com.cn>
 

trunk/Source/WebCore/inspector/front-end/FlameChart.js

@@ -71 +71 @@
     this._linkifier = new WebInspector.Linkifier();
     this._highlightedNodeIndex = -1;
+
+    if (!WebInspector.FlameChart._colorGenerator)
+        WebInspector.FlameChart._colorGenerator = new WebInspector.FlameChart.ColorGenerator();
 }
 
@@ -184 +187 @@
     SelectedNode: "SelectedNode"
 }
+
+/**
+ * @constructor
+ */
+WebInspector.FlameChart.ColorGenerator = function()
+{
+    this._colorPairs = {};
+    this._currentColorIndex = 0;
+}
+
+WebInspector.FlameChart.ColorGenerator.prototype = {
+    /**
+     * @param {!string} id
+     */
+    _colorPairForID: function(id)
+    {
+        var colorPairs = this._colorPairs;
+        var colorPair = colorPairs[id];
+        if (!colorPair) {
+            var currentColorIndex = ++this._currentColorIndex;
+            var hue = (currentColorIndex * 5 + 11 * (currentColorIndex % 2)) % 360;
+            colorPairs[id] = colorPair = {highlighted: "hsla(" + hue + ", 100%, 33%, 0.7)", normal: "hsla(" + hue + ", 100%, 66%, 0.7)"};
+        }
+        return colorPair;
+    }
+}
+
 
 WebInspector.FlameChart.prototype = {
@@ -254 +284 @@
         var levelOffsets = /** @type {Array.<!number>} */ ([0]);
         var levelExitIndexes = /** @type {Array.<!number>} */ ([0]);
+        var colorGenerator = WebInspector.FlameChart._colorGenerator;
 
         while (stack.length) {
@@ -260 +291 @@
             var offset = levelOffsets[level];
 
-            var functionUID = node.functionName + ":" + node.url + ":" + node.lineNumber;
-            var colorPair = functionColorPairs[functionUID];
-            if (!colorPair) {
-                ++currentColorIndex;
-                var hue = (currentColorIndex * 5 + 11 * (currentColorIndex % 2)) % 360;
-                functionColorPairs[functionUID] = colorPair = {highlighted: "hsl(" + hue + ", 100%, 33%)", normal: "hsl(" + hue + ", 100%, 66%)"};
-            }
+            var colorPair = colorGenerator._colorPairForID(node.functionName + ":" + node.url + ":" + node.lineNumber);
 
             entries.push({
@@ -276 +301 @@
             });
 
-
             ++index;
 
@@ -319 +343 @@
         var openIntervals = [];
         var stackTrace = [];
+        var colorGenerator = WebInspector.FlameChart._colorGenerator;
         for (var sampleIndex = 0; sampleIndex < samplesCount; sampleIndex++) {
             var node = idToNode[samples[sampleIndex]];
@@ -342 +367 @@
 
             while (node) {
-                var functionUID = node.functionName + ":" + node.url + ":" + node.lineNumber;
-                var colorPair = functionColorPairs[functionUID];
-                if (!colorPair) {
-                    ++currentColorIndex;
-                    var hue = (currentColorIndex * 5 + 11 * (currentColorIndex % 2)) % 360;
-                    functionColorPairs[functionUID] = colorPair = {highlighted: "hsl(" + hue + ", 100%, 33%)", normal: "hsl(" + hue + ", 100%, 66%)"};
-                }
+                var colorPair = colorGenerator._colorPairForID(node.functionName + ":" + node.url + ":" + node.lineNumber);
 
                 entries.push({
@@ -464 +483 @@
             return -1;
         var timelineEntries = timelineData.entries;
-        var cursorTime = (x + this._pixelWindowLeft) * this._pixelToTime;
+        var cursorTime = (x + this._pixelWindowLeft - this._paddingLeft) * this._pixelToTime;
         var cursorLevel = Math.floor((this._canvas.height - y) / this._barHeight);