From f2943ef2bb913097c33422eb3fdbf05579faa123 Mon Sep 17 00:00:00 2001 From: Max Kaplan Date: Fri, 7 Mar 2014 00:19:35 -0500 Subject: [PATCH 1/4] Fix loadFromJSON 404s breaking fabric (Pattern) Prevent image 404s in patterns from loadFromJSON from breaking everything trying to get attributes of a source which is null, while passing it upwards to allow dealing with images which failed to load outside of Fabric.JS --- src/pattern.class.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/pattern.class.js b/src/pattern.class.js index 0100d2af..ca104123 100644 --- a/src/pattern.class.js +++ b/src/pattern.class.js @@ -137,6 +137,11 @@ fabric.Pattern = fabric.util.createClass(/** @lends fabric.Pattern.prototype */ ? this.source() : this.source; + // if the image failed to load, return, and allow rest to continue loading + if (!source){ + return ''; + } + // if an image if (typeof source.src !== 'undefined') { if (!source.complete) { From 6f3f1ff7c9312078da3ed2c0b6be071d749c6996 Mon Sep 17 00:00:00 2001 From: Max Kaplan Date: Fri, 7 Mar 2014 01:12:50 -0500 Subject: [PATCH 2/4] Fix loadFromJSON 404s breaking fabric (Image) Prevent image 404s in Images from loadFromJSON from breaking everything trying to get attributes of a source which is null, while passing it upwards to allow dealing with images which failed to load outside of Fabric.JS Issue #1079 --- src/shapes/image.class.js | 30 +++++++++++++++++++----------- src/util/dom_misc.js | 2 +- 2 files changed, 20 insertions(+), 12 deletions(-) diff --git a/src/shapes/image.class.js b/src/shapes/image.class.js index 94f5dddf..54db3244 100644 --- a/src/shapes/image.class.js +++ b/src/shapes/image.class.js @@ -252,7 +252,9 @@ * @return {String} Source of an image */ getSrc: function() { - return this.getElement().src || this.getElement()._src; + if(this.getElement()){ + return this.getElement().src || this.getElement()._src; + } }, /** @@ -281,6 +283,10 @@ */ applyFilters: function(callback) { + if(!this._originalElement){ + return; + } + if (this.filters.length === 0) { this._element = this._originalElement; callback && callback(); @@ -330,13 +336,13 @@ * @param {CanvasRenderingContext2D} ctx Context to render on */ _render: function(ctx) { - ctx.drawImage( - this._element, - -this.width / 2, - -this.height / 2, - this.width, - this.height - ); + this._element && ctx.drawImage( + this._element, + -this.width / 2, + -this.height / 2, + this.width, + this.height + ); }, /** @@ -368,7 +374,9 @@ options || (options = { }); this.setOptions(options); this._setWidthHeight(options); - this._element.crossOrigin = this.crossOrigin; + if(this._element){ + this._element.crossOrigin = this.crossOrigin; + } }, /** @@ -394,11 +402,11 @@ _setWidthHeight: function(options) { this.width = 'width' in options ? options.width - : (this.getElement().width || 0); + : (this.getElement() ? this.getElement().width || 0 : 0); this.height = 'height' in options ? options.height - : (this.getElement().height || 0); + : (this.getElement() ? this.getElement().height || 0 : 0); }, /** diff --git a/src/util/dom_misc.js b/src/util/dom_misc.js index fbcdf594..541cf201 100644 --- a/src/util/dom_misc.js +++ b/src/util/dom_misc.js @@ -68,7 +68,7 @@ * @param {String} className Class to add to an element */ function addClass(element, className) { - if ((' ' + element.className + ' ').indexOf(' ' + className + ' ') === -1) { + if (element && (' ' + element.className + ' ').indexOf(' ' + className + ' ') === -1) { element.className += (element.className ? ' ' : '') + className; } } From fd38b8f4a4f8515e443b4c406a507df5ed9386d7 Mon Sep 17 00:00:00 2001 From: Max Kaplan Date: Fri, 7 Mar 2014 01:15:56 -0500 Subject: [PATCH 3/4] formatting for fixes --- src/shapes/image.class.js | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/src/shapes/image.class.js b/src/shapes/image.class.js index 54db3244..96f75dc2 100644 --- a/src/shapes/image.class.js +++ b/src/shapes/image.class.js @@ -252,7 +252,7 @@ * @return {String} Source of an image */ getSrc: function() { - if(this.getElement()){ + if (this.getElement()){ return this.getElement().src || this.getElement()._src; } }, @@ -283,7 +283,7 @@ */ applyFilters: function(callback) { - if(!this._originalElement){ + if (!this._originalElement){ return; } @@ -374,7 +374,7 @@ options || (options = { }); this.setOptions(options); this._setWidthHeight(options); - if(this._element){ + if (this._element){ this._element.crossOrigin = this.crossOrigin; } }, @@ -402,11 +402,15 @@ _setWidthHeight: function(options) { this.width = 'width' in options ? options.width - : (this.getElement() ? this.getElement().width || 0 : 0); + : (this.getElement() + ? this.getElement().width || 0 + : 0); this.height = 'height' in options ? options.height - : (this.getElement() ? this.getElement().height || 0 : 0); + : (this.getElement() + ? this.getElement().height || 0 + : 0); }, /** From 54f9c0428f0d7d8b7e64c09d6feda0e8a4172fb0 Mon Sep 17 00:00:00 2001 From: Max Kaplan Date: Fri, 7 Mar 2014 17:32:09 -0500 Subject: [PATCH 4/4] add spaces before { --- src/pattern.class.js | 2 +- src/shapes/image.class.js | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/pattern.class.js b/src/pattern.class.js index ca104123..7d1cb04c 100644 --- a/src/pattern.class.js +++ b/src/pattern.class.js @@ -138,7 +138,7 @@ fabric.Pattern = fabric.util.createClass(/** @lends fabric.Pattern.prototype */ : this.source; // if the image failed to load, return, and allow rest to continue loading - if (!source){ + if (!source) { return ''; } diff --git a/src/shapes/image.class.js b/src/shapes/image.class.js index 96f75dc2..89e09a22 100644 --- a/src/shapes/image.class.js +++ b/src/shapes/image.class.js @@ -252,7 +252,7 @@ * @return {String} Source of an image */ getSrc: function() { - if (this.getElement()){ + if (this.getElement()) { return this.getElement().src || this.getElement()._src; } }, @@ -283,7 +283,7 @@ */ applyFilters: function(callback) { - if (!this._originalElement){ + if (!this._originalElement) { return; } @@ -374,7 +374,7 @@ options || (options = { }); this.setOptions(options); this._setWidthHeight(options); - if (this._element){ + if (this._element) { this._element.crossOrigin = this.crossOrigin; } },