wine/gecko
0
0
Fork 0
mirror of https://gitlab.winehq.org/wine/wine-gecko.git synced 2024-09-13 09:24:08 -07:00
Code Issues Packages Projects Releases Wiki Activity

Bug 1034670 - The canvas graphs should draw the background separately from the plotted data, r=pbrosset

Browse Source
This commit is contained in:
Victor Porof 2014-07-08 09:02:00 -04:00
parent cecde6961f
commit 416df7bddb
1 changed files with 37 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
browser/devtools/shared/widgets/Graphs.jsm
View File

@ -233,6 +233,7 @@ AbstractCanvasGraph.prototype = {
this._data = null;
this._regions = null;
this._cachedBackgroundImage = null;
this._cachedGraphImage = null;
this._renderTargets.clear();
gCachedStripePattern.clear();
@ -257,6 +258,14 @@ AbstractCanvasGraph.prototype = {
fixedWidth: null,
fixedHeight: null,
/**
* Optionally builds and caches a background image for this graph.
* Inheriting classes may override this method.
*/
buildBackgroundImage: function() {
return null;
},
/**
* Builds and caches a graph image, based on the data source supplied
* in `setData`. The graph image is not rebuilt on each frame, but
@ -281,6 +290,7 @@ AbstractCanvasGraph.prototype = {
*/
setData: function(data) {
this._data = data;
this._cachedBackgroundImage = this.buildBackgroundImage();
this._cachedGraphImage = this.buildGraphImage();
this._shouldRedraw = true;
},
@ -568,10 +578,11 @@ AbstractCanvasGraph.prototype = {
this._width = this._canvas.width = bounds.width * this._pixelRatio;
this._height = this._canvas.height = bounds.height * this._pixelRatio;
if (this._data) {
if (this.hasData()) {
this._cachedBackgroundImage = this.buildBackgroundImage();
this._cachedGraphImage = this.buildGraphImage();
}
if (this._regions) {
if (this.hasRegions()) {
this._bakeRegions(this._regions, this._cachedGraphImage);
}
@ -634,14 +645,16 @@ AbstractCanvasGraph.prototype = {
if (!this._shouldRedraw) {
return;
}
let ctx = this._ctx;
ctx.clearRect(0, 0, this._width, this._height);
// Draw the graph underneath the cursor and selection.
if (this.hasData()) {
if (this._cachedBackgroundImage) {
ctx.drawImage(this._cachedBackgroundImage, 0, 0, this._width, this._height);
}
if (this._cachedGraphImage) {
ctx.drawImage(this._cachedGraphImage, 0, 0, this._width, this._height);
}
if (this.hasCursor()) {
this._drawCliphead();
}
@ -1045,7 +1058,7 @@ AbstractCanvasGraph.prototype = {
* Listener for the "resize" event on the graph's parent node.
*/
_onResize: function() {
if (this._cachedGraphImage) {
if (this.hasData()) {
setNamedTimeout(this._uid, GRAPH_RESIZE_EVENTS_DRAIN, this.refresh);
}
}
@ -1369,6 +1382,24 @@ BarGraphWidget.prototype = Heritage.extend(AbstractCanvasGraph.prototype, {
*/
minBlocksHeight: BAR_GRAPH_MIN_BLOCKS_HEIGHT,
/**
* Renders the graph's background.
* @see AbstractCanvasGraph.prototype.buildBackgroundImage
*/
buildBackgroundImage: function() {
let { canvas, ctx } = this._getNamedCanvas("bar-graph-background");
let width = this._width;
let height = this._height;
let gradient = ctx.createLinearGradient(0, 0, 0, height);
gradient.addColorStop(0, BAR_GRAPH_BACKGROUND_GRADIENT_START);
gradient.addColorStop(1, BAR_GRAPH_BACKGROUND_GRADIENT_END);
ctx.fillStyle = gradient;
ctx.fillRect(0, 0, width, height);
return canvas;
},
/**
* Renders the graph on a canvas.
* @see AbstractCanvasGraph.prototype.buildGraphImage
@ -1397,14 +1428,6 @@ BarGraphWidget.prototype = Heritage.extend(AbstractCanvasGraph.prototype, {
minBarsWidth: minBarsWidth
}) * BAR_GRAPH_DAMPEN_VALUES;
// Draw the background.
let gradient = ctx.createLinearGradient(0, 0, 0, height);
gradient.addColorStop(0, BAR_GRAPH_BACKGROUND_GRADIENT_START);
gradient.addColorStop(1, BAR_GRAPH_BACKGROUND_GRADIENT_END);
ctx.fillStyle = gradient;
ctx.fillRect(0, 0, width, height);
// Draw the graph.
// Iterate over the blocks, then the bars, to draw all rectangles of