From e4a42e054fe2e413799ded311cdb0269ebb79b7b Mon Sep 17 00:00:00 2001 From: Asturur Date: Sat, 25 Mar 2017 18:44:09 +0100 Subject: [PATCH] support svg crossorigin on images --- src/elements_parser.js | 3 ++- src/parser.js | 32 +++++++++++++++++++------------- src/shapes/image.class.js | 2 +- 3 files changed, 22 insertions(+), 15 deletions(-) diff --git a/src/elements_parser.js b/src/elements_parser.js index 30aa7eed..6e79e996 100644 --- a/src/elements_parser.js +++ b/src/elements_parser.js @@ -1,9 +1,10 @@ -fabric.ElementsParser = function(elements, callback, options, reviver) { +fabric.ElementsParser = function(elements, callback, options, reviver, parsingOptions) { this.elements = elements; this.callback = callback; this.options = options; this.reviver = reviver; this.svgUid = (options && options.svgUid) || 0; + this.parsingOptions = parsingOptions; }; fabric.ElementsParser.prototype.parse = function() { diff --git a/src/parser.js b/src/parser.js index 3c71c44b..5918f00a 100644 --- a/src/parser.js +++ b/src/parser.js @@ -602,8 +602,10 @@ * @param {Function} callback Callback to call when parsing is finished; * It's being passed an array of elements (parsed from a document). * @param {Function} [reviver] Method for further parsing of SVG elements, called after each fabric object created. + * @param {Object} [parsingOptions] options for parsing document + * @param {String} [parsingOptions.crossOrigin] crossOrigin settings */ - fabric.parseSVGDocument = function(doc, callback, reviver) { + fabric.parseSVGDocument = function(doc, callback, reviver, parsingOptions) { if (!doc) { return; } @@ -613,7 +615,7 @@ var svgUid = fabric.Object.__uid++, options = applyViewboxTransform(doc), descendants = fabric.util.toArray(doc.getElementsByTagName('*')); - + options.crossOrigin = parsingOptions.crossOrigin; options.svgUid = svgUid; if (descendants.length === 0 && fabric.isLikelyNode) { @@ -645,7 +647,7 @@ if (callback) { callback(instances, options); } - }, clone(options), reviver); + }, clone(options), reviver, parsingOptions); }; var reFontDeclaration = new RegExp( @@ -797,8 +799,8 @@ * @param {Object} [options] Options object * @param {Function} [reviver] Method for further parsing of SVG elements, called after each fabric object created. */ - parseElements: function(elements, callback, options, reviver) { - new fabric.ElementsParser(elements, callback, options, reviver).parse(); + parseElements: function(elements, callback, options, reviver, parsingOptions) { + new fabric.ElementsParser(elements, callback, options, reviver, parsingOptions).parse(); }, /** @@ -924,8 +926,10 @@ * @param {String} url * @param {Function} callback * @param {Function} [reviver] Method for further parsing of SVG elements, called after each fabric object created. + * @param {Object} [options] Object containing options for parsing + * @param {String} [options.crossOrigin] crossOrigin crossOrigin setting to use for external resources */ - loadSVGFromURL: function(url, callback, reviver) { + loadSVGFromURL: function(url, callback, reviver, options) { url = url.replace(/^\n\s*/, '').trim(); new fabric.util.request(url, { @@ -946,9 +950,9 @@ callback && callback(null); } - fabric.parseSVGDocument(xml.documentElement, function (results, options) { - callback && callback(results, options); - }, reviver); + fabric.parseSVGDocument(xml.documentElement, function (results, _options) { + callback && callback(results, _options); + }, reviver, options); } }, @@ -958,8 +962,10 @@ * @param {String} string * @param {Function} callback * @param {Function} [reviver] Method for further parsing of SVG elements, called after each fabric object created. + * @param {Object} [options] Object containing options for parsing + * @param {String} [options.crossOrigin] crossOrigin crossOrigin setting to use for external resources */ - loadSVGFromString: function(string, callback, reviver) { + loadSVGFromString: function(string, callback, reviver, options) { string = string.trim(); var doc; if (typeof DOMParser !== 'undefined') { @@ -975,9 +981,9 @@ doc.loadXML(string.replace(//i, '')); } - fabric.parseSVGDocument(doc.documentElement, function (results, options) { - callback(results, options); - }, reviver); + fabric.parseSVGDocument(doc.documentElement, function (results, _options) { + callback(results, _options); + }, reviver, options); } }); diff --git a/src/shapes/image.class.js b/src/shapes/image.class.js index 28e731f1..d3cfaee8 100644 --- a/src/shapes/image.class.js +++ b/src/shapes/image.class.js @@ -646,7 +646,7 @@ * @see {@link http://www.w3.org/TR/SVG/struct.html#ImageElement} */ fabric.Image.ATTRIBUTE_NAMES = - fabric.SHARED_ATTRIBUTES.concat('x y width height preserveAspectRatio xlink:href'.split(' ')); + fabric.SHARED_ATTRIBUTES.concat('x y width height preserveAspectRatio xlink:href crossOrigin'.split(' ')); /** * Returns {@link fabric.Image} instance from an SVG element