[webkit-changes] [117778] trunk/Source/WebCore

Mon, 21 May 2012 06:49:44 -0700

Title: [117778] trunk/Source/WebCore
Revision
117778
Author
[email protected]
Date
2012-05-21 06:50:36 -0700 (Mon, 21 May 2012)

Log Message

Web Inspector: [refactoring] promote fill/border colors used by timeline's frame overview to TimelineCategory
https://bugs.webkit.org/show_bug.cgi?id=87016

Reviewed by Pavel Feldman.

- drop unused 'color' field from TimelineCategory;
- add borderColor and fillColorStop[0-1] to TimelineCategory;
- fix style in a handful of places.

Note we store textual values for color stops, not premade gradients so we can build gradients with different
orientations rather than transforming a gradient.

* inspector/front-end/TimelineOverviewPane.js:
(WebInspector.HeapGraph):
(WebInspector.HeapGraph.prototype.get element):
(WebInspector.HeapGraph.prototype.get visible):
(WebInspector.HeapGraph.prototype.show):
(WebInspector.HeapGraph.prototype.hide):
(WebInspector.HeapGraph.prototype._clear):
(WebInspector.TimelineCategoryStrips):
(WebInspector.TimelineVerticalOverview):
(WebInspector.TimelineVerticalOverview.prototype._renderBar):
* inspector/front-end/TimelinePresentationModel.js:
(WebInspector.TimelinePresentationModel.categories):
(WebInspector.TimelinePresentationModel.recordStyle):
(WebInspector.TimelineCategory):

Modified Paths

Diff

Modified: trunk/Source/WebCore/ChangeLog (117777 => 117778)


--- trunk/Source/WebCore/ChangeLog	2012-05-21 13:49:48 UTC (rev 117777)
+++ trunk/Source/WebCore/ChangeLog	2012-05-21 13:50:36 UTC (rev 117778)
@@ -1,3 +1,32 @@
+2012-05-21  Andrey Kosyakov  <[email protected]>
+
+        Web Inspector: [refactoring] promote fill/border colors used by timeline's frame overview to TimelineCategory
+        https://bugs.webkit.org/show_bug.cgi?id=87016
+
+        Reviewed by Pavel Feldman.
+
+        - drop unused 'color' field from TimelineCategory;
+        - add borderColor and fillColorStop[0-1] to TimelineCategory;
+        - fix style in a handful of places.
+
+        Note we store textual values for color stops, not premade gradients so we can build gradients with different
+        orientations rather than transforming a gradient.
+
+        * inspector/front-end/TimelineOverviewPane.js:
+        (WebInspector.HeapGraph):
+        (WebInspector.HeapGraph.prototype.get element):
+        (WebInspector.HeapGraph.prototype.get visible):
+        (WebInspector.HeapGraph.prototype.show):
+        (WebInspector.HeapGraph.prototype.hide):
+        (WebInspector.HeapGraph.prototype._clear):
+        (WebInspector.TimelineCategoryStrips):
+        (WebInspector.TimelineVerticalOverview):
+        (WebInspector.TimelineVerticalOverview.prototype._renderBar):
+        * inspector/front-end/TimelinePresentationModel.js:
+        (WebInspector.TimelinePresentationModel.categories):
+        (WebInspector.TimelinePresentationModel.recordStyle):
+        (WebInspector.TimelineCategory):
+
 2012-05-21  'Pavel Feldman'  <[email protected]>
 
         Web Inspector: declare setFormatted on UISourceCode (otherwise fails for styles).

Modified: trunk/Source/WebCore/inspector/front-end/TimelineOverviewPane.js (117777 => 117778)


--- trunk/Source/WebCore/inspector/front-end/TimelineOverviewPane.js	2012-05-21 13:49:48 UTC (rev 117777)
+++ trunk/Source/WebCore/inspector/front-end/TimelineOverviewPane.js	2012-05-21 13:50:36 UTC (rev 117778)
@@ -767,7 +767,8 @@
  * @constructor
  * @param {WebInspector.TimelineModel} model
  */
-WebInspector.HeapGraph = function(model) {
+WebInspector.HeapGraph = function(model)
+{
     this._canvas = document.createElement("canvas");
     this._model = model;
 
@@ -786,19 +787,29 @@
 }
 
 WebInspector.HeapGraph.prototype = {
-    get element() {
+    /**
+     * @return {Node}
+     */
+    get element()
+    {
         return this._element;
     },
 
-    get visible() {
+    /**
+     * @return {boolean}
+     */
+    get visible()
+    {
         return !this.element.hasStyleClass("hidden");
     },
 
-    show: function() {
+    show: function()
+    {
         this.element.removeStyleClass("hidden");
     },
 
-    hide: function() {
+    hide: function()
+    {
         this.element.addStyleClass("hidden");
     },
 
@@ -874,18 +885,24 @@
         this._minHeapSizeLabel.textContent = Number.bytesToString(minUsedHeapSize);
     },
 
-    _clear: function(ctx) {
+    _clear: function(ctx)
+    {
         ctx.fillStyle = "rgba(255,255,255,0.8)";
         ctx.fillRect(0, 0, this._canvas.width, this._canvas.height);
     },
 }
 
+WebInspector.TimelineCategoryStrips = function(model)
+{
+}
+
 /**
  * @constructor
  * @extends {WebInspector.View}
  * @param {WebInspector.TimelineModel} model
  */
-WebInspector.TimelineVerticalOverview = function(model) {
+WebInspector.TimelineVerticalOverview = function(model)
+{
     WebInspector.View.call(this);
     this.element = document.createElement("canvas");
     this.element.className = "timeline-vertical-overview-bars fill";
@@ -900,22 +917,15 @@
     this._actualOuterBarWidth = this._maxInnerBarWidth + this._actualPadding;
 
     this._context = this.element.getContext("2d");
+
     this._fillStyles = {};
-    this._fillStyles.loading = this._context.createLinearGradient(0, 0, this._maxInnerBarWidth, 0);
-    this._fillStyles.loading.addColorStop(0, "rgb(201, 220, 245)");
-    this._fillStyles.loading.addColorStop(1, "rgb(109, 157, 222)");
-    this._fillStyles.scripting = this._context.createLinearGradient(0, 0, this._maxInnerBarWidth, 0);
-    this._fillStyles.scripting.addColorStop(0, "rgb(251, 222, 168)");
-    this._fillStyles.scripting.addColorStop(1, "rgb(234, 182, 77)");
-    this._fillStyles.rendering = this._context.createLinearGradient(0, 0, this._maxInnerBarWidth, 0);
-    this._fillStyles.rendering.addColorStop(0, "rgb(213, 185, 236)");
-    this._fillStyles.rendering.addColorStop(1, "rgb(137, 62, 200)");
-
-    this._borderStyles = {};
-    this._borderStyles.loading = "rgb(106, 152, 213)";
-    this._borderStyles.scripting = "rgb(223, 175, 77)";
-    this._borderStyles.rendering = "rgb(130, 59, 190)";
-    this._borderStyles._frameLength = "rgb(90, 90, 90)";
+    var categories = WebInspector.TimelinePresentationModel.categories();
+    for (var category in categories) {
+        var fillStyle = this._context.createLinearGradient(0, 0, this._maxInnerBarWidth, 0);
+        fillStyle.addColorStop(0, categories[category].fillColorStop0);
+        fillStyle.addColorStop(1, categories[category].fillColorStop1);
+        this._fillStyles[category] = fillStyle;
+    }
 }
 
 WebInspector.TimelineVerticalOverview.prototype = {
@@ -1037,7 +1047,7 @@
             this._context.fillRect(0, y, this._maxInnerBarWidth, Math.floor(height));
             this._context.restore();
 
-            this._context.strokeStyle = this._borderStyles[category];
+            this._context.strokeStyle = WebInspector.TimelinePresentationModel.categories()[category];
             this._context.strokeRect(x, y, width, Math.floor(height));
             bottomOffset -= height - 1;
         }
@@ -1046,7 +1056,7 @@
         var y0 = Math.floor(bottomOffset - nonCPUTime * scale) + 0.5;
         var y1 = Math.floor(bottomOffset) + 0.5;
 
-        this._context.strokeStyle = this._borderStyles._frameLength;
+        this._context.strokeStyle = "rgb(90, 90, 90)";
         this._context.beginPath();
         this._context.moveTo(x, y1);
         this._context.lineTo(x, y0);

Modified: trunk/Source/WebCore/inspector/front-end/TimelinePresentationModel.js (117777 => 117778)


--- trunk/Source/WebCore/inspector/front-end/TimelinePresentationModel.js	2012-05-21 13:49:48 UTC (rev 117777)
+++ trunk/Source/WebCore/inspector/front-end/TimelinePresentationModel.js	2012-05-21 13:50:36 UTC (rev 117778)
@@ -47,9 +47,9 @@
     if (WebInspector.TimelinePresentationModel._categories)
         return WebInspector.TimelinePresentationModel._categories;
     WebInspector.TimelinePresentationModel._categories = {
-        loading: new WebInspector.TimelineCategory("loading", WebInspector.UIString("Loading"), "rgb(47,102,236)"),
-        scripting: new WebInspector.TimelineCategory("scripting", WebInspector.UIString("Scripting"), "rgb(157,231,119)"),
-        rendering: new WebInspector.TimelineCategory("rendering", WebInspector.UIString("Rendering"), "rgb(164,60,255)")
+        loading: new WebInspector.TimelineCategory("loading", WebInspector.UIString("Loading"), "rgb(106, 152, 213)", "rgb(201, 220, 245)", "rgb(109, 157, 222)"),
+        scripting: new WebInspector.TimelineCategory("scripting", WebInspector.UIString("Scripting"), "rgb(223, 175, 77)", "rgb(251, 222, 168)", "rgb(234, 182, 77)"),
+        rendering: new WebInspector.TimelineCategory("rendering", WebInspector.UIString("Rendering"), "rgb(130, 59, 190)", "rgb(213, 185, 236)", "rgb(137, 62, 200)")
     };
     return WebInspector.TimelinePresentationModel._categories;
 };
@@ -57,7 +57,8 @@
 /**
  * @param {Object} record
  */
-WebInspector.TimelinePresentationModel.recordStyle = function(record) {
+WebInspector.TimelinePresentationModel.recordStyle = function(record)
+{
     if (WebInspector.TimelinePresentationModel._recordStylesMap)
         return WebInspector.TimelinePresentationModel._recordStylesMap[record.type];
 
@@ -769,12 +770,19 @@
 /**
  * @constructor
  * @extends {WebInspector.Object}
+ * @param {string} name
+ * @param {string} title
+ * @param {string} borderColor
+ * @param {string} fillColorStop0
+ * @param {string} fillColorStop1
  */
-WebInspector.TimelineCategory = function(name, title, color)
+WebInspector.TimelineCategory = function(name, title, borderColor, fillColorStop0, fillColorStop1)
 {
     this.name = name;
     this.title = title;
-    this.color = color;
+    this.borderColor = borderColor;
+    this.fillColorStop0 = fillColorStop0;
+    this.fillColorStop1 = fillColorStop1;
     this.hidden = false;
 }
 

_______________________________________________
webkit-changes mailing list
[email protected]
http://lists.webkit.org/mailman/listinfo.cgi/webkit-changes

Reply via email to