scratchfoundation/paper.js
1
0
Fork 0
mirror of https://github.com/scratchfoundation/paper.js.git synced 2025-01-06 04:42:15 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Only draw Raster items when they're fully loaded.

Browse source 
Closes #645.
This commit is contained in:
Jürg Lehni 2015-02-28 18:30:23 +01:00
parent 23ec75f5d2
commit 3b47d7ee89
1 changed files with 11 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/item/Raster.js
View file

@ -90,8 +90,10 @@ var Raster = Item.extend(/** @lends Raster# */{
this.setImage(object); this.setImage(object);
} }
} }
if (!this._size) if (!this._size) {
this._size = new Size(); this._size = new Size();
this._loaded = false;
}
}, },
_equals: function(item) { _equals: function(item) {
@ -225,10 +227,12 @@ var Raster = Item.extend(/** @lends Raster# */{
// A canvas object // A canvas object
this._image = null; this._image = null;
this._canvas = image; this._canvas = image;
this._loaded = true;
} else { } else {
// A image object // A image object
this._image = image; this._image = image;
this._canvas = null; this._canvas = null;
this._loaded = image && image.complete;
} }
// Both canvas and image have width / height attributes. Due to IE, // Both canvas and image have width / height attributes. Due to IE,
// naturalWidth / Height needs to be checked for a swell, because it // naturalWidth / Height needs to be checked for a swell, because it
@ -394,7 +398,8 @@ var Raster = Item.extend(/** @lends Raster# */{
// DOCS: document Raster#getElement // DOCS: document Raster#getElement
getElement: function() { getElement: function() {
return this._canvas || this._image; // Only return the internal element if the content is actually ready.
return this._canvas || this._loaded && this._image;
} }
}, /** @lends Raster# */{ }, /** @lends Raster# */{
// Explicitly deactivate the creation of beans, as we have functions here // Explicitly deactivate the creation of beans, as we have functions here
@ -526,8 +531,10 @@ var Raster = Item.extend(/** @lends Raster# */{
path.draw(ctx, new Base({ clip: true, matrices: [matrix] })); path.draw(ctx, new Base({ clip: true, matrices: [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(), var element = this.getElement(),
-this._size.width / 2, -this._size.height / 2); size = this._size;
if (element)
ctx.drawImage(element, -size.width / 2, -size.height / 2);
ctx.restore(); ctx.restore();
// Get pixel data from the context and calculate the average color value // Get pixel data from the context and calculate the average color value
// from it, taking alpha into account. // from it, taking alpha into account.