Use Base objects for drawing params, so we can use param.extend() on them for easier overriding.

This commit is contained in:
Jürg Lehni 2013-06-11 20:40:44 -07:00
parent a7750c3e67
commit 20f7c567aa
6 changed files with 18 additions and 16 deletions

View file

@ -167,16 +167,14 @@ var Group = Item.extend(/** @lends Group# */{
}, },
_draw: function(ctx, param) { _draw: function(ctx, param) {
var clipItem = this._getClipItem(); var clipItem = param.clipItem = this._getClipItem();
if (clipItem) { if (clipItem)
param.clip = true; clipItem.draw(ctx, param.extend({ clip: true }));
clipItem.draw(ctx, param);
param.clip = false;
}
for (var i = 0, l = this._children.length; i < l; i++) { for (var i = 0, l = this._children.length; i < l; i++) {
var item = this._children[i]; var item = this._children[i];
if (item !== clipItem) if (item !== clipItem)
item.draw(ctx, param); item.draw(ctx, param);
} }
param.clipItem = null;
} }
}); });

View file

@ -1270,7 +1270,8 @@ var Item = Base.extend(Callback, /** @lends Item# */{
matrix = new Matrix().scale(scale).translate(-bounds.x, -bounds.y); matrix = new Matrix().scale(scale).translate(-bounds.x, -bounds.y);
ctx.save(); ctx.save();
matrix.applyToContext(ctx); matrix.applyToContext(ctx);
this.draw(ctx, { transforms: [matrix] }); // See Project#draw() for an explanation of Base.merge()
this.draw(ctx, Base.merge({ transforms: [matrix] }));
var raster = new Raster(canvas); var raster = new Raster(canvas);
raster.setBounds(bounds); raster.setBounds(bounds);
ctx.restore(); ctx.restore();

View file

@ -412,8 +412,9 @@ var Raster = Item.extend(/** @lends Raster# */{
.translate(-bounds.x, -bounds.y); .translate(-bounds.x, -bounds.y);
matrix.applyToContext(ctx); matrix.applyToContext(ctx);
// If a path was passed, draw it as a clipping mask: // If a path was passed, draw it as a clipping mask:
// See Project#draw() for an explanation of Base.merge()
if (path) if (path)
path.draw(ctx, { clip: true, transforms: [matrix] }); path.draw(ctx, Base.merge({ clip: true, transforms: [matrix] }));
// Now draw the image clipped into it. // Now draw the image clipped into it.
this._matrix.applyToContext(ctx); this._matrix.applyToContext(ctx);
ctx.drawImage(this.getElement(), ctx.drawImage(this.getElement(),

View file

@ -241,10 +241,9 @@ var CompoundPath = PathItem.extend(/** @lends CompoundPath# */{
if (children.length === 0) if (children.length === 0)
return; return;
ctx.beginPath(); ctx.beginPath();
param.compound = true; param = param.extend({ compound: true });
for (var i = 0, l = children.length; i < l; i++) for (var i = 0, l = children.length; i < l; i++)
children[i].draw(ctx, param); children[i].draw(ctx, param);
param.compound = false;
if (!param.clip) { if (!param.clip) {
this._setStyles(ctx); this._setStyles(ctx);
if (style.getFillColor()) if (style.getFillColor())

View file

@ -1809,7 +1809,9 @@ var Path = PathItem.extend(/** @lends Path# */{
return { return {
_draw: function(ctx, param) { _draw: function(ctx, param) {
if (!param.compound) var clip = param.clip,
compound = param.compound;
if (!compound)
ctx.beginPath(); ctx.beginPath();
// We can access styles directly on the internal _styles object, // We can access styles directly on the internal _styles object,
@ -1824,14 +1826,13 @@ var Path = PathItem.extend(/** @lends Path# */{
// Prepare the canvas path if we have any situation that requires it // Prepare the canvas path if we have any situation that requires it
// to be defined. // to be defined.
if (fillColor || strokeColor && !drawDash || param.compound if (fillColor || strokeColor && !drawDash || compound || clip)
|| param.clip)
drawSegments(ctx, this); drawSegments(ctx, this);
if (this._closed) if (this._closed)
ctx.closePath(); ctx.closePath();
if (!param.clip && !param.compound && (fillColor || strokeColor)) { if (!clip && !compound && (fillColor || strokeColor)) {
// If the path is part of a compound path or doesn't have a fill // If the path is part of a compound path or doesn't have a fill
// or stroke, there is no need to continue. // or stroke, there is no need to continue.
this._setStyles(ctx); this._setStyles(ctx);

View file

@ -299,12 +299,14 @@ var Project = PaperScopeItem.extend(/** @lends Project# */{
this._drawCount++; this._drawCount++;
ctx.save(); ctx.save();
matrix.applyToContext(ctx); matrix.applyToContext(ctx);
var param = { // Use Base.merge() so we can use param.extend() to easily override
// values
var param = Base.merge({
offset: new Point(0, 0), offset: new Point(0, 0),
// A stack of concatenated matrices, to keep track of the current // A stack of concatenated matrices, to keep track of the current
// global matrix, since Canvas is not able tell us (yet). // global matrix, since Canvas is not able tell us (yet).
transforms: [matrix] transforms: [matrix]
}; });
for (var i = 0, l = this.layers.length; i < l; i++) for (var i = 0, l = this.layers.length; i < l; i++)
this.layers[i].draw(ctx, param); this.layers[i].draw(ctx, param);
ctx.restore(); ctx.restore();