You can not select more than 25 topics
			Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
		
		
		
		
			
				
					7967 lines
				
				281 KiB
			
		
		
			
		
	
	
					7967 lines
				
				281 KiB
			| 
											11 months ago
										 | 'use strict'; | ||
|  | 
 | ||
|  | Object.defineProperty(exports, '__esModule', { value: true }); | ||
|  | 
 | ||
|  | require('core-js/modules/es.object.to-string.js'); | ||
|  | require('core-js/modules/es.promise.js'); | ||
|  | require('core-js/modules/es.reflect.delete-property.js'); | ||
|  | var _regeneratorRuntime = require('@babel/runtime/regenerator'); | ||
|  | var _asyncToGenerator = require('@babel/runtime/helpers/asyncToGenerator'); | ||
|  | require('core-js/modules/es.array.map.js'); | ||
|  | require('core-js/modules/es.parse-float.js'); | ||
|  | require('core-js/modules/es.regexp.exec.js'); | ||
|  | require('core-js/modules/es.string.match.js'); | ||
|  | require('core-js/modules/es.string.replace.js'); | ||
|  | require('core-js/modules/es.string.starts-with.js'); | ||
|  | require('core-js/modules/es.array.join.js'); | ||
|  | var _slicedToArray = require('@babel/runtime/helpers/slicedToArray'); | ||
|  | var _defineProperty = require('@babel/runtime/helpers/defineProperty'); | ||
|  | var _classCallCheck = require('@babel/runtime/helpers/classCallCheck'); | ||
|  | var _createClass = require('@babel/runtime/helpers/createClass'); | ||
|  | require('core-js/modules/es.array.concat.js'); | ||
|  | require('core-js/modules/es.array.every.js'); | ||
|  | require('core-js/modules/es.array.reduce.js'); | ||
|  | require('core-js/modules/es.string.ends-with.js'); | ||
|  | require('core-js/modules/es.string.split.js'); | ||
|  | var requestAnimationFrame = require('raf'); | ||
|  | require('core-js/modules/es.function.name.js'); | ||
|  | require('core-js/modules/es.string.trim.js'); | ||
|  | var RGBColor = require('rgbcolor'); | ||
|  | require('core-js/modules/es.array.for-each.js'); | ||
|  | require('core-js/modules/web.dom-collections.for-each.js'); | ||
|  | var _inherits = require('@babel/runtime/helpers/inherits'); | ||
|  | var _possibleConstructorReturn = require('@babel/runtime/helpers/possibleConstructorReturn'); | ||
|  | var _getPrototypeOf = require('@babel/runtime/helpers/getPrototypeOf'); | ||
|  | require('core-js/modules/es.array.from.js'); | ||
|  | require('core-js/modules/es.array.includes.js'); | ||
|  | require('core-js/modules/es.array.some.js'); | ||
|  | require('core-js/modules/es.string.includes.js'); | ||
|  | require('core-js/modules/es.string.iterator.js'); | ||
|  | var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray'); | ||
|  | require('core-js/modules/es.array.index-of.js'); | ||
|  | require('core-js/modules/es.array.reverse.js'); | ||
|  | var _get = require('@babel/runtime/helpers/get'); | ||
|  | require('core-js/modules/es.number.constructor.js'); | ||
|  | require('core-js/modules/es.array.fill.js'); | ||
|  | var svgPathdata = require('svg-pathdata'); | ||
|  | require('core-js/modules/es.regexp.to-string.js'); | ||
|  | var _assertThisInitialized = require('@babel/runtime/helpers/assertThisInitialized'); | ||
|  | require('core-js/modules/es.array.iterator.js'); | ||
|  | require('core-js/modules/web.dom-collections.iterator.js'); | ||
|  | require('core-js/modules/es.map.js'); | ||
|  | require('core-js/modules/es.reflect.apply.js'); | ||
|  | require('core-js/modules/es.reflect.get-prototype-of.js'); | ||
|  | var stackblurCanvas = require('stackblur-canvas'); | ||
|  | 
 | ||
|  | function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; } | ||
|  | 
 | ||
|  | var _regeneratorRuntime__default = /*#__PURE__*/_interopDefaultLegacy(_regeneratorRuntime); | ||
|  | var _asyncToGenerator__default = /*#__PURE__*/_interopDefaultLegacy(_asyncToGenerator); | ||
|  | var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray); | ||
|  | var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty); | ||
|  | var _classCallCheck__default = /*#__PURE__*/_interopDefaultLegacy(_classCallCheck); | ||
|  | var _createClass__default = /*#__PURE__*/_interopDefaultLegacy(_createClass); | ||
|  | var requestAnimationFrame__default = /*#__PURE__*/_interopDefaultLegacy(requestAnimationFrame); | ||
|  | var RGBColor__default = /*#__PURE__*/_interopDefaultLegacy(RGBColor); | ||
|  | var _inherits__default = /*#__PURE__*/_interopDefaultLegacy(_inherits); | ||
|  | var _possibleConstructorReturn__default = /*#__PURE__*/_interopDefaultLegacy(_possibleConstructorReturn); | ||
|  | var _getPrototypeOf__default = /*#__PURE__*/_interopDefaultLegacy(_getPrototypeOf); | ||
|  | var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray); | ||
|  | var _get__default = /*#__PURE__*/_interopDefaultLegacy(_get); | ||
|  | var _assertThisInitialized__default = /*#__PURE__*/_interopDefaultLegacy(_assertThisInitialized); | ||
|  | 
 | ||
|  | /** | ||
|  |  * Options preset for `OffscreenCanvas`. | ||
|  |  * @param config - Preset requirements. | ||
|  |  * @param config.DOMParser - XML/HTML parser from string into DOM Document. | ||
|  |  * @returns Preset object. | ||
|  |  */ | ||
|  | function offscreen() { | ||
|  |   var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, | ||
|  |       DOMParserFallback = _ref.DOMParser; | ||
|  | 
 | ||
|  |   var preset = { | ||
|  |     window: null, | ||
|  |     ignoreAnimation: true, | ||
|  |     ignoreMouse: true, | ||
|  |     DOMParser: DOMParserFallback, | ||
|  |     createCanvas: function createCanvas(width, height) { | ||
|  |       return new OffscreenCanvas(width, height); | ||
|  |     }, | ||
|  |     createImage: function createImage(url) { | ||
|  |       return _asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee() { | ||
|  |         var response, blob, img; | ||
|  |         return _regeneratorRuntime__default['default'].wrap(function _callee$(_context) { | ||
|  |           while (1) { | ||
|  |             switch (_context.prev = _context.next) { | ||
|  |               case 0: | ||
|  |                 _context.next = 2; | ||
|  |                 return fetch(url); | ||
|  | 
 | ||
|  |               case 2: | ||
|  |                 response = _context.sent; | ||
|  |                 _context.next = 5; | ||
|  |                 return response.blob(); | ||
|  | 
 | ||
|  |               case 5: | ||
|  |                 blob = _context.sent; | ||
|  |                 _context.next = 8; | ||
|  |                 return createImageBitmap(blob); | ||
|  | 
 | ||
|  |               case 8: | ||
|  |                 img = _context.sent; | ||
|  |                 return _context.abrupt("return", img); | ||
|  | 
 | ||
|  |               case 10: | ||
|  |               case "end": | ||
|  |                 return _context.stop(); | ||
|  |             } | ||
|  |           } | ||
|  |         }, _callee); | ||
|  |       }))(); | ||
|  |     } | ||
|  |   }; | ||
|  | 
 | ||
|  |   if (typeof DOMParser !== 'undefined' || typeof DOMParserFallback === 'undefined') { | ||
|  |     Reflect.deleteProperty(preset, 'DOMParser'); | ||
|  |   } | ||
|  | 
 | ||
|  |   return preset; | ||
|  | } | ||
|  | 
 | ||
|  | /** | ||
|  |  * Options preset for `node-canvas`. | ||
|  |  * @param config - Preset requirements. | ||
|  |  * @param config.DOMParser - XML/HTML parser from string into DOM Document. | ||
|  |  * @param config.canvas - `node-canvas` exports. | ||
|  |  * @param config.fetch - WHATWG-compatible `fetch` function. | ||
|  |  * @returns Preset object. | ||
|  |  */ | ||
|  | function node(_ref) { | ||
|  |   var DOMParser = _ref.DOMParser, | ||
|  |       canvas = _ref.canvas, | ||
|  |       fetch = _ref.fetch; | ||
|  |   return { | ||
|  |     window: null, | ||
|  |     ignoreAnimation: true, | ||
|  |     ignoreMouse: true, | ||
|  |     DOMParser: DOMParser, | ||
|  |     fetch: fetch, | ||
|  |     createCanvas: canvas.createCanvas, | ||
|  |     createImage: canvas.loadImage | ||
|  |   }; | ||
|  | } | ||
|  | 
 | ||
|  | var index = /*#__PURE__*/Object.freeze({ | ||
|  | 	__proto__: null, | ||
|  | 	offscreen: offscreen, | ||
|  | 	node: node | ||
|  | }); | ||
|  | 
 | ||
|  | /** | ||
|  |  * HTML-safe compress white-spaces. | ||
|  |  * @param str - String to compress. | ||
|  |  * @returns String. | ||
|  |  */ | ||
|  | function compressSpaces(str) { | ||
|  |   return str.replace(/(?!\u3000)\s+/gm, ' '); | ||
|  | } | ||
|  | /** | ||
|  |  * HTML-safe left trim. | ||
|  |  * @param str - String to trim. | ||
|  |  * @returns String. | ||
|  |  */ | ||
|  | 
 | ||
|  | function trimLeft(str) { | ||
|  |   return str.replace(/^[\n \t]+/, ''); | ||
|  | } | ||
|  | /** | ||
|  |  * HTML-safe right trim. | ||
|  |  * @param str - String to trim. | ||
|  |  * @returns String. | ||
|  |  */ | ||
|  | 
 | ||
|  | function trimRight(str) { | ||
|  |   return str.replace(/[\n \t]+$/, ''); | ||
|  | } | ||
|  | /** | ||
|  |  * String to numbers array. | ||
|  |  * @param str - Numbers string. | ||
|  |  * @returns Numbers array. | ||
|  |  */ | ||
|  | 
 | ||
|  | function toNumbers(str) { | ||
|  |   var matches = (str || '').match(/-?(\d+(?:\.\d*(?:[eE][+-]?\d+)?)?|\.\d+)(?=\D|$)/gm) || []; | ||
|  |   return matches.map(parseFloat); | ||
|  | } // Microsoft Edge fix
 | ||
|  | 
 | ||
|  | var allUppercase = /^[A-Z-]+$/; | ||
|  | /** | ||
|  |  * Normalize attribute name. | ||
|  |  * @param name - Attribute name. | ||
|  |  * @returns Normalized attribute name. | ||
|  |  */ | ||
|  | 
 | ||
|  | function normalizeAttributeName(name) { | ||
|  |   if (allUppercase.test(name)) { | ||
|  |     return name.toLowerCase(); | ||
|  |   } | ||
|  | 
 | ||
|  |   return name; | ||
|  | } | ||
|  | /** | ||
|  |  * Parse external URL. | ||
|  |  * @param url - CSS url string. | ||
|  |  * @returns Parsed URL. | ||
|  |  */ | ||
|  | 
 | ||
|  | function parseExternalUrl(url) { | ||
|  |   //                      single quotes [2]
 | ||
|  |   //                      v         double quotes [3]
 | ||
|  |   //                      v         v         no quotes [4]
 | ||
|  |   //                      v         v         v
 | ||
|  |   var urlMatch = /url\(('([^']+)'|"([^"]+)"|([^'")]+))\)/.exec(url) || []; | ||
|  |   return urlMatch[2] || urlMatch[3] || urlMatch[4]; | ||
|  | } | ||
|  | /** | ||
|  |  * Transform floats to integers in rgb colors. | ||
|  |  * @param color - Color to normalize. | ||
|  |  * @returns Normalized color. | ||
|  |  */ | ||
|  | 
 | ||
|  | function normalizeColor(color) { | ||
|  |   if (!color.startsWith('rgb')) { | ||
|  |     return color; | ||
|  |   } | ||
|  | 
 | ||
|  |   var rgbParts = 3; | ||
|  |   var normalizedColor = color.replace(/\d+(\.\d+)?/g, function (num, isFloat) { | ||
|  |     return rgbParts-- && isFloat ? String(Math.round(parseFloat(num))) : num; | ||
|  |   }); | ||
|  |   return normalizedColor; | ||
|  | } | ||
|  | 
 | ||
|  | // slightly modified version of https://github.com/keeganstreet/specificity/blob/master/specificity.js
 | ||
|  | var attributeRegex = /(\[[^\]]+\])/g; | ||
|  | var idRegex = /(#[^\s+>~.[:]+)/g; | ||
|  | var classRegex = /(\.[^\s+>~.[:]+)/g; | ||
|  | var pseudoElementRegex = /(::[^\s+>~.[:]+|:first-line|:first-letter|:before|:after)/gi; | ||
|  | var pseudoClassWithBracketsRegex = /(:[\w-]+\([^)]*\))/gi; | ||
|  | var pseudoClassRegex = /(:[^\s+>~.[:]+)/g; | ||
|  | var elementRegex = /([^\s+>~.[:]+)/g; | ||
|  | 
 | ||
|  | function findSelectorMatch(selector, regex) { | ||
|  |   var matches = regex.exec(selector); | ||
|  | 
 | ||
|  |   if (!matches) { | ||
|  |     return [selector, 0]; | ||
|  |   } | ||
|  | 
 | ||
|  |   return [selector.replace(regex, ' '), matches.length]; | ||
|  | } | ||
|  | /** | ||
|  |  * Measure selector specificity. | ||
|  |  * @param selector - Selector to measure. | ||
|  |  * @returns Specificity. | ||
|  |  */ | ||
|  | 
 | ||
|  | 
 | ||
|  | function getSelectorSpecificity(selector) { | ||
|  |   var specificity = [0, 0, 0]; | ||
|  |   var currentSelector = selector.replace(/:not\(([^)]*)\)/g, '     $1 ').replace(/{[\s\S]*/gm, ' '); | ||
|  |   var delta = 0; | ||
|  | 
 | ||
|  |   var _findSelectorMatch = findSelectorMatch(currentSelector, attributeRegex); | ||
|  | 
 | ||
|  |   var _findSelectorMatch2 = _slicedToArray__default['default'](_findSelectorMatch, 2); | ||
|  | 
 | ||
|  |   currentSelector = _findSelectorMatch2[0]; | ||
|  |   delta = _findSelectorMatch2[1]; | ||
|  |   specificity[1] += delta; | ||
|  | 
 | ||
|  |   var _findSelectorMatch3 = findSelectorMatch(currentSelector, idRegex); | ||
|  | 
 | ||
|  |   var _findSelectorMatch4 = _slicedToArray__default['default'](_findSelectorMatch3, 2); | ||
|  | 
 | ||
|  |   currentSelector = _findSelectorMatch4[0]; | ||
|  |   delta = _findSelectorMatch4[1]; | ||
|  |   specificity[0] += delta; | ||
|  | 
 | ||
|  |   var _findSelectorMatch5 = findSelectorMatch(currentSelector, classRegex); | ||
|  | 
 | ||
|  |   var _findSelectorMatch6 = _slicedToArray__default['default'](_findSelectorMatch5, 2); | ||
|  | 
 | ||
|  |   currentSelector = _findSelectorMatch6[0]; | ||
|  |   delta = _findSelectorMatch6[1]; | ||
|  |   specificity[1] += delta; | ||
|  | 
 | ||
|  |   var _findSelectorMatch7 = findSelectorMatch(currentSelector, pseudoElementRegex); | ||
|  | 
 | ||
|  |   var _findSelectorMatch8 = _slicedToArray__default['default'](_findSelectorMatch7, 2); | ||
|  | 
 | ||
|  |   currentSelector = _findSelectorMatch8[0]; | ||
|  |   delta = _findSelectorMatch8[1]; | ||
|  |   specificity[2] += delta; | ||
|  | 
 | ||
|  |   var _findSelectorMatch9 = findSelectorMatch(currentSelector, pseudoClassWithBracketsRegex); | ||
|  | 
 | ||
|  |   var _findSelectorMatch10 = _slicedToArray__default['default'](_findSelectorMatch9, 2); | ||
|  | 
 | ||
|  |   currentSelector = _findSelectorMatch10[0]; | ||
|  |   delta = _findSelectorMatch10[1]; | ||
|  |   specificity[1] += delta; | ||
|  | 
 | ||
|  |   var _findSelectorMatch11 = findSelectorMatch(currentSelector, pseudoClassRegex); | ||
|  | 
 | ||
|  |   var _findSelectorMatch12 = _slicedToArray__default['default'](_findSelectorMatch11, 2); | ||
|  | 
 | ||
|  |   currentSelector = _findSelectorMatch12[0]; | ||
|  |   delta = _findSelectorMatch12[1]; | ||
|  |   specificity[1] += delta; | ||
|  |   currentSelector = currentSelector.replace(/[*\s+>~]/g, ' ').replace(/[#.]/g, ' '); | ||
|  | 
 | ||
|  |   var _findSelectorMatch13 = findSelectorMatch(currentSelector, elementRegex); | ||
|  | 
 | ||
|  |   var _findSelectorMatch14 = _slicedToArray__default['default'](_findSelectorMatch13, 2); | ||
|  | 
 | ||
|  |   currentSelector = _findSelectorMatch14[0]; | ||
|  |   delta = _findSelectorMatch14[1]; | ||
|  |   // lgtm [js/useless-assignment-to-local]
 | ||
|  |   specificity[2] += delta; | ||
|  |   return specificity.join(''); | ||
|  | } | ||
|  | 
 | ||
|  | var PSEUDO_ZERO = .00000001; | ||
|  | /** | ||
|  |  * Vector magnitude. | ||
|  |  * @param v | ||
|  |  * @returns Number result. | ||
|  |  */ | ||
|  | 
 | ||
|  | function vectorMagnitude(v) { | ||
|  |   return Math.sqrt(Math.pow(v[0], 2) + Math.pow(v[1], 2)); | ||
|  | } | ||
|  | /** | ||
|  |  * Ratio between two vectors. | ||
|  |  * @param u | ||
|  |  * @param v | ||
|  |  * @returns Number result. | ||
|  |  */ | ||
|  | 
 | ||
|  | function vectorsRatio(u, v) { | ||
|  |   return (u[0] * v[0] + u[1] * v[1]) / (vectorMagnitude(u) * vectorMagnitude(v)); | ||
|  | } | ||
|  | /** | ||
|  |  * Angle between two vectors. | ||
|  |  * @param u | ||
|  |  * @param v | ||
|  |  * @returns Number result. | ||
|  |  */ | ||
|  | 
 | ||
|  | function vectorsAngle(u, v) { | ||
|  |   return (u[0] * v[1] < u[1] * v[0] ? -1 : 1) * Math.acos(vectorsRatio(u, v)); | ||
|  | } | ||
|  | function CB1(t) { | ||
|  |   return t * t * t; | ||
|  | } | ||
|  | function CB2(t) { | ||
|  |   return 3 * t * t * (1 - t); | ||
|  | } | ||
|  | function CB3(t) { | ||
|  |   return 3 * t * (1 - t) * (1 - t); | ||
|  | } | ||
|  | function CB4(t) { | ||
|  |   return (1 - t) * (1 - t) * (1 - t); | ||
|  | } | ||
|  | function QB1(t) { | ||
|  |   return t * t; | ||
|  | } | ||
|  | function QB2(t) { | ||
|  |   return 2 * t * (1 - t); | ||
|  | } | ||
|  | function QB3(t) { | ||
|  |   return (1 - t) * (1 - t); | ||
|  | } | ||
|  | 
 | ||
|  | var Property = /*#__PURE__*/function () { | ||
|  |   function Property(document, name, value) { | ||
|  |     _classCallCheck__default['default'](this, Property); | ||
|  | 
 | ||
|  |     this.document = document; | ||
|  |     this.name = name; | ||
|  |     this.value = value; | ||
|  |     this.isNormalizedColor = false; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](Property, [{ | ||
|  |     key: "split", | ||
|  |     value: function split() { | ||
|  |       var separator = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : ' '; | ||
|  |       var document = this.document, | ||
|  |           name = this.name; | ||
|  |       return compressSpaces(this.getString()).trim().split(separator).map(function (value) { | ||
|  |         return new Property(document, name, value); | ||
|  |       }); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "hasValue", | ||
|  |     value: function hasValue(zeroIsValue) { | ||
|  |       var value = this.value; | ||
|  |       return value !== null && value !== '' && (zeroIsValue || value !== 0) && typeof value !== 'undefined'; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "isString", | ||
|  |     value: function isString(regexp) { | ||
|  |       var value = this.value; | ||
|  |       var result = typeof value === 'string'; | ||
|  | 
 | ||
|  |       if (!result || !regexp) { | ||
|  |         return result; | ||
|  |       } | ||
|  | 
 | ||
|  |       return regexp.test(value); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "isUrlDefinition", | ||
|  |     value: function isUrlDefinition() { | ||
|  |       return this.isString(/^url\(/); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "isPixels", | ||
|  |     value: function isPixels() { | ||
|  |       if (!this.hasValue()) { | ||
|  |         return false; | ||
|  |       } | ||
|  | 
 | ||
|  |       var asString = this.getString(); | ||
|  | 
 | ||
|  |       switch (true) { | ||
|  |         case asString.endsWith('px'): | ||
|  |         case /^[0-9]+$/.test(asString): | ||
|  |           return true; | ||
|  | 
 | ||
|  |         default: | ||
|  |           return false; | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "setValue", | ||
|  |     value: function setValue(value) { | ||
|  |       this.value = value; | ||
|  |       return this; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getValue", | ||
|  |     value: function getValue(def) { | ||
|  |       if (typeof def === 'undefined' || this.hasValue()) { | ||
|  |         return this.value; | ||
|  |       } | ||
|  | 
 | ||
|  |       return def; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getNumber", | ||
|  |     value: function getNumber(def) { | ||
|  |       if (!this.hasValue()) { | ||
|  |         if (typeof def === 'undefined') { | ||
|  |           return 0; | ||
|  |         } | ||
|  | 
 | ||
|  |         return parseFloat(def); | ||
|  |       } | ||
|  | 
 | ||
|  |       var value = this.value; | ||
|  |       var n = parseFloat(value); | ||
|  | 
 | ||
|  |       if (this.isString(/%$/)) { | ||
|  |         n /= 100.0; | ||
|  |       } | ||
|  | 
 | ||
|  |       return n; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getString", | ||
|  |     value: function getString(def) { | ||
|  |       if (typeof def === 'undefined' || this.hasValue()) { | ||
|  |         return typeof this.value === 'undefined' ? '' : String(this.value); | ||
|  |       } | ||
|  | 
 | ||
|  |       return String(def); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getColor", | ||
|  |     value: function getColor(def) { | ||
|  |       var color = this.getString(def); | ||
|  | 
 | ||
|  |       if (this.isNormalizedColor) { | ||
|  |         return color; | ||
|  |       } | ||
|  | 
 | ||
|  |       this.isNormalizedColor = true; | ||
|  |       color = normalizeColor(color); | ||
|  |       this.value = color; | ||
|  |       return color; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getDpi", | ||
|  |     value: function getDpi() { | ||
|  |       return 96.0; // TODO: compute?
 | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getRem", | ||
|  |     value: function getRem() { | ||
|  |       return this.document.rootEmSize; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getEm", | ||
|  |     value: function getEm() { | ||
|  |       return this.document.emSize; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getUnits", | ||
|  |     value: function getUnits() { | ||
|  |       return this.getString().replace(/[0-9.-]/g, ''); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getPixels", | ||
|  |     value: function getPixels(axisOrIsFontSize) { | ||
|  |       var processPercent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; | ||
|  | 
 | ||
|  |       if (!this.hasValue()) { | ||
|  |         return 0; | ||
|  |       } | ||
|  | 
 | ||
|  |       var _ref = typeof axisOrIsFontSize === 'boolean' ? [undefined, axisOrIsFontSize] : [axisOrIsFontSize], | ||
|  |           _ref2 = _slicedToArray__default['default'](_ref, 2), | ||
|  |           axis = _ref2[0], | ||
|  |           isFontSize = _ref2[1]; | ||
|  | 
 | ||
|  |       var viewPort = this.document.screen.viewPort; | ||
|  | 
 | ||
|  |       switch (true) { | ||
|  |         case this.isString(/vmin$/): | ||
|  |           return this.getNumber() / 100.0 * Math.min(viewPort.computeSize('x'), viewPort.computeSize('y')); | ||
|  | 
 | ||
|  |         case this.isString(/vmax$/): | ||
|  |           return this.getNumber() / 100.0 * Math.max(viewPort.computeSize('x'), viewPort.computeSize('y')); | ||
|  | 
 | ||
|  |         case this.isString(/vw$/): | ||
|  |           return this.getNumber() / 100.0 * viewPort.computeSize('x'); | ||
|  | 
 | ||
|  |         case this.isString(/vh$/): | ||
|  |           return this.getNumber() / 100.0 * viewPort.computeSize('y'); | ||
|  | 
 | ||
|  |         case this.isString(/rem$/): | ||
|  |           return this.getNumber() * this.getRem(); | ||
|  | 
 | ||
|  |         case this.isString(/em$/): | ||
|  |           return this.getNumber() * this.getEm(); | ||
|  | 
 | ||
|  |         case this.isString(/ex$/): | ||
|  |           return this.getNumber() * this.getEm() / 2.0; | ||
|  | 
 | ||
|  |         case this.isString(/px$/): | ||
|  |           return this.getNumber(); | ||
|  | 
 | ||
|  |         case this.isString(/pt$/): | ||
|  |           return this.getNumber() * this.getDpi() * (1.0 / 72.0); | ||
|  | 
 | ||
|  |         case this.isString(/pc$/): | ||
|  |           return this.getNumber() * 15; | ||
|  | 
 | ||
|  |         case this.isString(/cm$/): | ||
|  |           return this.getNumber() * this.getDpi() / 2.54; | ||
|  | 
 | ||
|  |         case this.isString(/mm$/): | ||
|  |           return this.getNumber() * this.getDpi() / 25.4; | ||
|  | 
 | ||
|  |         case this.isString(/in$/): | ||
|  |           return this.getNumber() * this.getDpi(); | ||
|  | 
 | ||
|  |         case this.isString(/%$/) && isFontSize: | ||
|  |           return this.getNumber() * this.getEm(); | ||
|  | 
 | ||
|  |         case this.isString(/%$/): | ||
|  |           return this.getNumber() * viewPort.computeSize(axis); | ||
|  | 
 | ||
|  |         default: | ||
|  |           { | ||
|  |             var n = this.getNumber(); | ||
|  | 
 | ||
|  |             if (processPercent && n < 1.0) { | ||
|  |               return n * viewPort.computeSize(axis); | ||
|  |             } | ||
|  | 
 | ||
|  |             return n; | ||
|  |           } | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getMilliseconds", | ||
|  |     value: function getMilliseconds() { | ||
|  |       if (!this.hasValue()) { | ||
|  |         return 0; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (this.isString(/ms$/)) { | ||
|  |         return this.getNumber(); | ||
|  |       } | ||
|  | 
 | ||
|  |       return this.getNumber() * 1000; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getRadians", | ||
|  |     value: function getRadians() { | ||
|  |       if (!this.hasValue()) { | ||
|  |         return 0; | ||
|  |       } | ||
|  | 
 | ||
|  |       switch (true) { | ||
|  |         case this.isString(/deg$/): | ||
|  |           return this.getNumber() * (Math.PI / 180.0); | ||
|  | 
 | ||
|  |         case this.isString(/grad$/): | ||
|  |           return this.getNumber() * (Math.PI / 200.0); | ||
|  | 
 | ||
|  |         case this.isString(/rad$/): | ||
|  |           return this.getNumber(); | ||
|  | 
 | ||
|  |         default: | ||
|  |           return this.getNumber() * (Math.PI / 180.0); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getDefinition", | ||
|  |     value: function getDefinition() { | ||
|  |       var asString = this.getString(); | ||
|  |       var name = /#([^)'"]+)/.exec(asString); | ||
|  | 
 | ||
|  |       if (name) { | ||
|  |         name = name[1]; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (!name) { | ||
|  |         name = asString; | ||
|  |       } | ||
|  | 
 | ||
|  |       return this.document.definitions[name]; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getFillStyleDefinition", | ||
|  |     value: function getFillStyleDefinition(element, opacity) { | ||
|  |       var def = this.getDefinition(); | ||
|  | 
 | ||
|  |       if (!def) { | ||
|  |         return null; | ||
|  |       } // gradient
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       if (typeof def.createGradient === 'function') { | ||
|  |         return def.createGradient(this.document.ctx, element, opacity); | ||
|  |       } // pattern
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       if (typeof def.createPattern === 'function') { | ||
|  |         if (def.getHrefAttribute().hasValue()) { | ||
|  |           var patternTransform = def.getAttribute('patternTransform'); | ||
|  |           def = def.getHrefAttribute().getDefinition(); | ||
|  | 
 | ||
|  |           if (patternTransform.hasValue()) { | ||
|  |             def.getAttribute('patternTransform', true).setValue(patternTransform.value); | ||
|  |           } | ||
|  |         } | ||
|  | 
 | ||
|  |         return def.createPattern(this.document.ctx, element, opacity); | ||
|  |       } | ||
|  | 
 | ||
|  |       return null; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getTextBaseline", | ||
|  |     value: function getTextBaseline() { | ||
|  |       if (!this.hasValue()) { | ||
|  |         return null; | ||
|  |       } | ||
|  | 
 | ||
|  |       return Property.textBaselineMapping[this.getString()]; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "addOpacity", | ||
|  |     value: function addOpacity(opacity) { | ||
|  |       var value = this.getColor(); | ||
|  |       var len = value.length; | ||
|  |       var commas = 0; // Simulate old RGBColor version, which can't parse rgba.
 | ||
|  | 
 | ||
|  |       for (var i = 0; i < len; i++) { | ||
|  |         if (value[i] === ',') { | ||
|  |           commas++; | ||
|  |         } | ||
|  | 
 | ||
|  |         if (commas === 3) { | ||
|  |           break; | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       if (opacity.hasValue() && this.isString() && commas !== 3) { | ||
|  |         var color = new RGBColor__default['default'](value); | ||
|  | 
 | ||
|  |         if (color.ok) { | ||
|  |           color.alpha = opacity.getNumber(); | ||
|  |           value = color.toRGBA(); | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       return new Property(this.document, this.name, value); | ||
|  |     } | ||
|  |   }], [{ | ||
|  |     key: "empty", | ||
|  |     value: function empty(document) { | ||
|  |       return new Property(document, 'EMPTY', ''); | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return Property; | ||
|  | }(); | ||
|  | Property.textBaselineMapping = { | ||
|  |   'baseline': 'alphabetic', | ||
|  |   'before-edge': 'top', | ||
|  |   'text-before-edge': 'top', | ||
|  |   'middle': 'middle', | ||
|  |   'central': 'middle', | ||
|  |   'after-edge': 'bottom', | ||
|  |   'text-after-edge': 'bottom', | ||
|  |   'ideographic': 'ideographic', | ||
|  |   'alphabetic': 'alphabetic', | ||
|  |   'hanging': 'hanging', | ||
|  |   'mathematical': 'alphabetic' | ||
|  | }; | ||
|  | 
 | ||
|  | var ViewPort = /*#__PURE__*/function () { | ||
|  |   function ViewPort() { | ||
|  |     _classCallCheck__default['default'](this, ViewPort); | ||
|  | 
 | ||
|  |     this.viewPorts = []; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](ViewPort, [{ | ||
|  |     key: "clear", | ||
|  |     value: function clear() { | ||
|  |       this.viewPorts = []; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "setCurrent", | ||
|  |     value: function setCurrent(width, height) { | ||
|  |       this.viewPorts.push({ | ||
|  |         width: width, | ||
|  |         height: height | ||
|  |       }); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "removeCurrent", | ||
|  |     value: function removeCurrent() { | ||
|  |       this.viewPorts.pop(); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getCurrent", | ||
|  |     value: function getCurrent() { | ||
|  |       var viewPorts = this.viewPorts; | ||
|  |       return viewPorts[viewPorts.length - 1]; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "computeSize", | ||
|  |     value: function computeSize(d) { | ||
|  |       if (typeof d === 'number') { | ||
|  |         return d; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (d === 'x') { | ||
|  |         return this.width; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (d === 'y') { | ||
|  |         return this.height; | ||
|  |       } | ||
|  | 
 | ||
|  |       return Math.sqrt(Math.pow(this.width, 2) + Math.pow(this.height, 2)) / Math.sqrt(2); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "width", | ||
|  |     get: function get() { | ||
|  |       return this.getCurrent().width; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "height", | ||
|  |     get: function get() { | ||
|  |       return this.getCurrent().height; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return ViewPort; | ||
|  | }(); | ||
|  | 
 | ||
|  | var Point = /*#__PURE__*/function () { | ||
|  |   function Point(x, y) { | ||
|  |     _classCallCheck__default['default'](this, Point); | ||
|  | 
 | ||
|  |     this.x = x; | ||
|  |     this.y = y; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](Point, [{ | ||
|  |     key: "angleTo", | ||
|  |     value: function angleTo(point) { | ||
|  |       return Math.atan2(point.y - this.y, point.x - this.x); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "applyTransform", | ||
|  |     value: function applyTransform(transform) { | ||
|  |       var x = this.x, | ||
|  |           y = this.y; | ||
|  |       var xp = x * transform[0] + y * transform[2] + transform[4]; | ||
|  |       var yp = x * transform[1] + y * transform[3] + transform[5]; | ||
|  |       this.x = xp; | ||
|  |       this.y = yp; | ||
|  |     } | ||
|  |   }], [{ | ||
|  |     key: "parse", | ||
|  |     value: function parse(point) { | ||
|  |       var defaultValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0; | ||
|  | 
 | ||
|  |       var _toNumbers = toNumbers(point), | ||
|  |           _toNumbers2 = _slicedToArray__default['default'](_toNumbers, 2), | ||
|  |           _toNumbers2$ = _toNumbers2[0], | ||
|  |           x = _toNumbers2$ === void 0 ? defaultValue : _toNumbers2$, | ||
|  |           _toNumbers2$2 = _toNumbers2[1], | ||
|  |           y = _toNumbers2$2 === void 0 ? defaultValue : _toNumbers2$2; | ||
|  | 
 | ||
|  |       return new Point(x, y); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "parseScale", | ||
|  |     value: function parseScale(scale) { | ||
|  |       var defaultValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1; | ||
|  | 
 | ||
|  |       var _toNumbers3 = toNumbers(scale), | ||
|  |           _toNumbers4 = _slicedToArray__default['default'](_toNumbers3, 2), | ||
|  |           _toNumbers4$ = _toNumbers4[0], | ||
|  |           x = _toNumbers4$ === void 0 ? defaultValue : _toNumbers4$, | ||
|  |           _toNumbers4$2 = _toNumbers4[1], | ||
|  |           y = _toNumbers4$2 === void 0 ? x : _toNumbers4$2; | ||
|  | 
 | ||
|  |       return new Point(x, y); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "parsePath", | ||
|  |     value: function parsePath(path) { | ||
|  |       var points = toNumbers(path); | ||
|  |       var len = points.length; | ||
|  |       var pathPoints = []; | ||
|  | 
 | ||
|  |       for (var i = 0; i < len; i += 2) { | ||
|  |         pathPoints.push(new Point(points[i], points[i + 1])); | ||
|  |       } | ||
|  | 
 | ||
|  |       return pathPoints; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return Point; | ||
|  | }(); | ||
|  | 
 | ||
|  | var Mouse = /*#__PURE__*/function () { | ||
|  |   function Mouse(screen) { | ||
|  |     _classCallCheck__default['default'](this, Mouse); | ||
|  | 
 | ||
|  |     this.screen = screen; | ||
|  |     this.working = false; | ||
|  |     this.events = []; | ||
|  |     this.eventElements = []; // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
 | ||
|  | 
 | ||
|  |     this.onClick = this.onClick.bind(this); // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
 | ||
|  | 
 | ||
|  |     this.onMouseMove = this.onMouseMove.bind(this); | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](Mouse, [{ | ||
|  |     key: "isWorking", | ||
|  |     value: function isWorking() { | ||
|  |       return this.working; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "start", | ||
|  |     value: function start() { | ||
|  |       if (this.working) { | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       var screen = this.screen, | ||
|  |           onClick = this.onClick, | ||
|  |           onMouseMove = this.onMouseMove; | ||
|  |       var canvas = screen.ctx.canvas; | ||
|  |       canvas.onclick = onClick; | ||
|  |       canvas.onmousemove = onMouseMove; | ||
|  |       this.working = true; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "stop", | ||
|  |     value: function stop() { | ||
|  |       if (!this.working) { | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       var canvas = this.screen.ctx.canvas; | ||
|  |       this.working = false; | ||
|  |       canvas.onclick = null; | ||
|  |       canvas.onmousemove = null; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "hasEvents", | ||
|  |     value: function hasEvents() { | ||
|  |       return this.working && this.events.length > 0; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "runEvents", | ||
|  |     value: function runEvents() { | ||
|  |       if (!this.working) { | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       var document = this.screen, | ||
|  |           events = this.events, | ||
|  |           eventElements = this.eventElements; | ||
|  |       var style = document.ctx.canvas.style; | ||
|  | 
 | ||
|  |       if (style) { | ||
|  |         style.cursor = ''; | ||
|  |       } | ||
|  | 
 | ||
|  |       events.forEach(function (_ref, i) { | ||
|  |         var run = _ref.run; | ||
|  |         var element = eventElements[i]; | ||
|  | 
 | ||
|  |         while (element) { | ||
|  |           run(element); | ||
|  |           element = element.parent; | ||
|  |         } | ||
|  |       }); // done running, clear
 | ||
|  | 
 | ||
|  |       this.events = []; | ||
|  |       this.eventElements = []; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "checkPath", | ||
|  |     value: function checkPath(element, ctx) { | ||
|  |       if (!this.working || !ctx) { | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       var events = this.events, | ||
|  |           eventElements = this.eventElements; | ||
|  |       events.forEach(function (_ref2, i) { | ||
|  |         var x = _ref2.x, | ||
|  |             y = _ref2.y; | ||
|  | 
 | ||
|  |         if (!eventElements[i] && ctx.isPointInPath && ctx.isPointInPath(x, y)) { | ||
|  |           eventElements[i] = element; | ||
|  |         } | ||
|  |       }); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "checkBoundingBox", | ||
|  |     value: function checkBoundingBox(element, boundingBox) { | ||
|  |       if (!this.working || !boundingBox) { | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       var events = this.events, | ||
|  |           eventElements = this.eventElements; | ||
|  |       events.forEach(function (_ref3, i) { | ||
|  |         var x = _ref3.x, | ||
|  |             y = _ref3.y; | ||
|  | 
 | ||
|  |         if (!eventElements[i] && boundingBox.isPointInBox(x, y)) { | ||
|  |           eventElements[i] = element; | ||
|  |         } | ||
|  |       }); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "mapXY", | ||
|  |     value: function mapXY(x, y) { | ||
|  |       var _this$screen = this.screen, | ||
|  |           window = _this$screen.window, | ||
|  |           ctx = _this$screen.ctx; | ||
|  |       var point = new Point(x, y); | ||
|  |       var element = ctx.canvas; | ||
|  | 
 | ||
|  |       while (element) { | ||
|  |         point.x -= element.offsetLeft; | ||
|  |         point.y -= element.offsetTop; | ||
|  |         element = element.offsetParent; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (window.scrollX) { | ||
|  |         point.x += window.scrollX; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (window.scrollY) { | ||
|  |         point.y += window.scrollY; | ||
|  |       } | ||
|  | 
 | ||
|  |       return point; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "onClick", | ||
|  |     value: function onClick(event) { | ||
|  |       var _this$mapXY = this.mapXY(event.clientX, event.clientY), | ||
|  |           x = _this$mapXY.x, | ||
|  |           y = _this$mapXY.y; | ||
|  | 
 | ||
|  |       this.events.push({ | ||
|  |         type: 'onclick', | ||
|  |         x: x, | ||
|  |         y: y, | ||
|  |         run: function run(eventTarget) { | ||
|  |           if (eventTarget.onClick) { | ||
|  |             eventTarget.onClick(); | ||
|  |           } | ||
|  |         } | ||
|  |       }); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "onMouseMove", | ||
|  |     value: function onMouseMove(event) { | ||
|  |       var _this$mapXY2 = this.mapXY(event.clientX, event.clientY), | ||
|  |           x = _this$mapXY2.x, | ||
|  |           y = _this$mapXY2.y; | ||
|  | 
 | ||
|  |       this.events.push({ | ||
|  |         type: 'onmousemove', | ||
|  |         x: x, | ||
|  |         y: y, | ||
|  |         run: function run(eventTarget) { | ||
|  |           if (eventTarget.onMouseMove) { | ||
|  |             eventTarget.onMouseMove(); | ||
|  |           } | ||
|  |         } | ||
|  |       }); | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return Mouse; | ||
|  | }(); | ||
|  | 
 | ||
|  | var defaultWindow = typeof window !== 'undefined' ? window : null; | ||
|  | var defaultFetch$1 = typeof fetch !== 'undefined' ? fetch.bind(undefined) // `fetch` depends on context: `someObject.fetch(...)` will throw error.
 | ||
|  | : null; | ||
|  | 
 | ||
|  | var Screen = /*#__PURE__*/function () { | ||
|  |   function Screen(ctx) { | ||
|  |     var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}, | ||
|  |         _ref$fetch = _ref.fetch, | ||
|  |         fetch = _ref$fetch === void 0 ? defaultFetch$1 : _ref$fetch, | ||
|  |         _ref$window = _ref.window, | ||
|  |         window = _ref$window === void 0 ? defaultWindow : _ref$window; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, Screen); | ||
|  | 
 | ||
|  |     this.ctx = ctx; | ||
|  |     this.FRAMERATE = 30; | ||
|  |     this.MAX_VIRTUAL_PIXELS = 30000; | ||
|  |     this.CLIENT_WIDTH = 800; | ||
|  |     this.CLIENT_HEIGHT = 600; | ||
|  |     this.viewPort = new ViewPort(); | ||
|  |     this.mouse = new Mouse(this); | ||
|  |     this.animations = []; | ||
|  |     this.waits = []; | ||
|  |     this.frameDuration = 0; | ||
|  |     this.isReadyLock = false; | ||
|  |     this.isFirstRender = true; | ||
|  |     this.intervalId = null; | ||
|  |     this.window = window; | ||
|  |     this.fetch = fetch; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](Screen, [{ | ||
|  |     key: "wait", | ||
|  |     value: function wait(checker) { | ||
|  |       this.waits.push(checker); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "ready", | ||
|  |     value: function ready() { | ||
|  |       // eslint-disable-next-line @typescript-eslint/no-misused-promises
 | ||
|  |       if (!this.readyPromise) { | ||
|  |         return Promise.resolve(); | ||
|  |       } | ||
|  | 
 | ||
|  |       return this.readyPromise; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "isReady", | ||
|  |     value: function isReady() { | ||
|  |       if (this.isReadyLock) { | ||
|  |         return true; | ||
|  |       } | ||
|  | 
 | ||
|  |       var isReadyLock = this.waits.every(function (_) { | ||
|  |         return _(); | ||
|  |       }); | ||
|  | 
 | ||
|  |       if (isReadyLock) { | ||
|  |         this.waits = []; | ||
|  | 
 | ||
|  |         if (this.resolveReady) { | ||
|  |           this.resolveReady(); | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       this.isReadyLock = isReadyLock; | ||
|  |       return isReadyLock; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "setDefaults", | ||
|  |     value: function setDefaults(ctx) { | ||
|  |       // initial values and defaults
 | ||
|  |       ctx.strokeStyle = 'rgba(0,0,0,0)'; | ||
|  |       ctx.lineCap = 'butt'; | ||
|  |       ctx.lineJoin = 'miter'; | ||
|  |       ctx.miterLimit = 4; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "setViewBox", | ||
|  |     value: function setViewBox(_ref2) { | ||
|  |       var document = _ref2.document, | ||
|  |           ctx = _ref2.ctx, | ||
|  |           aspectRatio = _ref2.aspectRatio, | ||
|  |           width = _ref2.width, | ||
|  |           desiredWidth = _ref2.desiredWidth, | ||
|  |           height = _ref2.height, | ||
|  |           desiredHeight = _ref2.desiredHeight, | ||
|  |           _ref2$minX = _ref2.minX, | ||
|  |           minX = _ref2$minX === void 0 ? 0 : _ref2$minX, | ||
|  |           _ref2$minY = _ref2.minY, | ||
|  |           minY = _ref2$minY === void 0 ? 0 : _ref2$minY, | ||
|  |           refX = _ref2.refX, | ||
|  |           refY = _ref2.refY, | ||
|  |           _ref2$clip = _ref2.clip, | ||
|  |           clip = _ref2$clip === void 0 ? false : _ref2$clip, | ||
|  |           _ref2$clipX = _ref2.clipX, | ||
|  |           clipX = _ref2$clipX === void 0 ? 0 : _ref2$clipX, | ||
|  |           _ref2$clipY = _ref2.clipY, | ||
|  |           clipY = _ref2$clipY === void 0 ? 0 : _ref2$clipY; | ||
|  |       // aspect ratio - http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute
 | ||
|  |       var cleanAspectRatio = compressSpaces(aspectRatio).replace(/^defer\s/, ''); // ignore defer
 | ||
|  | 
 | ||
|  |       var _cleanAspectRatio$spl = cleanAspectRatio.split(' '), | ||
|  |           _cleanAspectRatio$spl2 = _slicedToArray__default['default'](_cleanAspectRatio$spl, 2), | ||
|  |           aspectRatioAlign = _cleanAspectRatio$spl2[0], | ||
|  |           aspectRatioMeetOrSlice = _cleanAspectRatio$spl2[1]; | ||
|  | 
 | ||
|  |       var align = aspectRatioAlign || 'xMidYMid'; | ||
|  |       var meetOrSlice = aspectRatioMeetOrSlice || 'meet'; // calculate scale
 | ||
|  | 
 | ||
|  |       var scaleX = width / desiredWidth; | ||
|  |       var scaleY = height / desiredHeight; | ||
|  |       var scaleMin = Math.min(scaleX, scaleY); | ||
|  |       var scaleMax = Math.max(scaleX, scaleY); | ||
|  |       var finalDesiredWidth = desiredWidth; | ||
|  |       var finalDesiredHeight = desiredHeight; | ||
|  | 
 | ||
|  |       if (meetOrSlice === 'meet') { | ||
|  |         finalDesiredWidth *= scaleMin; | ||
|  |         finalDesiredHeight *= scaleMin; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (meetOrSlice === 'slice') { | ||
|  |         finalDesiredWidth *= scaleMax; | ||
|  |         finalDesiredHeight *= scaleMax; | ||
|  |       } | ||
|  | 
 | ||
|  |       var refXProp = new Property(document, 'refX', refX); | ||
|  |       var refYProp = new Property(document, 'refY', refY); | ||
|  |       var hasRefs = refXProp.hasValue() && refYProp.hasValue(); | ||
|  | 
 | ||
|  |       if (hasRefs) { | ||
|  |         ctx.translate(-scaleMin * refXProp.getPixels('x'), -scaleMin * refYProp.getPixels('y')); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (clip) { | ||
|  |         var scaledClipX = scaleMin * clipX; | ||
|  |         var scaledClipY = scaleMin * clipY; | ||
|  |         ctx.beginPath(); | ||
|  |         ctx.moveTo(scaledClipX, scaledClipY); | ||
|  |         ctx.lineTo(width, scaledClipY); | ||
|  |         ctx.lineTo(width, height); | ||
|  |         ctx.lineTo(scaledClipX, height); | ||
|  |         ctx.closePath(); | ||
|  |         ctx.clip(); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (!hasRefs) { | ||
|  |         var isMeetMinY = meetOrSlice === 'meet' && scaleMin === scaleY; | ||
|  |         var isSliceMaxY = meetOrSlice === 'slice' && scaleMax === scaleY; | ||
|  |         var isMeetMinX = meetOrSlice === 'meet' && scaleMin === scaleX; | ||
|  |         var isSliceMaxX = meetOrSlice === 'slice' && scaleMax === scaleX; | ||
|  | 
 | ||
|  |         if (align.startsWith('xMid') && (isMeetMinY || isSliceMaxY)) { | ||
|  |           ctx.translate(width / 2.0 - finalDesiredWidth / 2.0, 0); | ||
|  |         } | ||
|  | 
 | ||
|  |         if (align.endsWith('YMid') && (isMeetMinX || isSliceMaxX)) { | ||
|  |           ctx.translate(0, height / 2.0 - finalDesiredHeight / 2.0); | ||
|  |         } | ||
|  | 
 | ||
|  |         if (align.startsWith('xMax') && (isMeetMinY || isSliceMaxY)) { | ||
|  |           ctx.translate(width - finalDesiredWidth, 0); | ||
|  |         } | ||
|  | 
 | ||
|  |         if (align.endsWith('YMax') && (isMeetMinX || isSliceMaxX)) { | ||
|  |           ctx.translate(0, height - finalDesiredHeight); | ||
|  |         } | ||
|  |       } // scale
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       switch (true) { | ||
|  |         case align === 'none': | ||
|  |           ctx.scale(scaleX, scaleY); | ||
|  |           break; | ||
|  | 
 | ||
|  |         case meetOrSlice === 'meet': | ||
|  |           ctx.scale(scaleMin, scaleMin); | ||
|  |           break; | ||
|  | 
 | ||
|  |         case meetOrSlice === 'slice': | ||
|  |           ctx.scale(scaleMax, scaleMax); | ||
|  |           break; | ||
|  |       } // translate
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       ctx.translate(-minX, -minY); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "start", | ||
|  |     value: function start(element) { | ||
|  |       var _this = this; | ||
|  | 
 | ||
|  |       var _ref3 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}, | ||
|  |           _ref3$enableRedraw = _ref3.enableRedraw, | ||
|  |           enableRedraw = _ref3$enableRedraw === void 0 ? false : _ref3$enableRedraw, | ||
|  |           _ref3$ignoreMouse = _ref3.ignoreMouse, | ||
|  |           ignoreMouse = _ref3$ignoreMouse === void 0 ? false : _ref3$ignoreMouse, | ||
|  |           _ref3$ignoreAnimation = _ref3.ignoreAnimation, | ||
|  |           ignoreAnimation = _ref3$ignoreAnimation === void 0 ? false : _ref3$ignoreAnimation, | ||
|  |           _ref3$ignoreDimension = _ref3.ignoreDimensions, | ||
|  |           ignoreDimensions = _ref3$ignoreDimension === void 0 ? false : _ref3$ignoreDimension, | ||
|  |           _ref3$ignoreClear = _ref3.ignoreClear, | ||
|  |           ignoreClear = _ref3$ignoreClear === void 0 ? false : _ref3$ignoreClear, | ||
|  |           forceRedraw = _ref3.forceRedraw, | ||
|  |           scaleWidth = _ref3.scaleWidth, | ||
|  |           scaleHeight = _ref3.scaleHeight, | ||
|  |           offsetX = _ref3.offsetX, | ||
|  |           offsetY = _ref3.offsetY; | ||
|  | 
 | ||
|  |       var FRAMERATE = this.FRAMERATE, | ||
|  |           mouse = this.mouse; | ||
|  |       var frameDuration = 1000 / FRAMERATE; | ||
|  |       this.frameDuration = frameDuration; | ||
|  |       this.readyPromise = new Promise(function (resolve) { | ||
|  |         _this.resolveReady = resolve; | ||
|  |       }); | ||
|  | 
 | ||
|  |       if (this.isReady()) { | ||
|  |         this.render(element, ignoreDimensions, ignoreClear, scaleWidth, scaleHeight, offsetX, offsetY); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (!enableRedraw) { | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       var now = Date.now(); | ||
|  |       var then = now; | ||
|  |       var delta = 0; | ||
|  | 
 | ||
|  |       var tick = function tick() { | ||
|  |         now = Date.now(); | ||
|  |         delta = now - then; | ||
|  | 
 | ||
|  |         if (delta >= frameDuration) { | ||
|  |           then = now - delta % frameDuration; | ||
|  | 
 | ||
|  |           if (_this.shouldUpdate(ignoreAnimation, forceRedraw)) { | ||
|  |             _this.render(element, ignoreDimensions, ignoreClear, scaleWidth, scaleHeight, offsetX, offsetY); | ||
|  | 
 | ||
|  |             mouse.runEvents(); | ||
|  |           } | ||
|  |         } | ||
|  | 
 | ||
|  |         _this.intervalId = requestAnimationFrame__default['default'](tick); | ||
|  |       }; | ||
|  | 
 | ||
|  |       if (!ignoreMouse) { | ||
|  |         mouse.start(); | ||
|  |       } | ||
|  | 
 | ||
|  |       this.intervalId = requestAnimationFrame__default['default'](tick); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "stop", | ||
|  |     value: function stop() { | ||
|  |       if (this.intervalId) { | ||
|  |         requestAnimationFrame__default['default'].cancel(this.intervalId); | ||
|  |         this.intervalId = null; | ||
|  |       } | ||
|  | 
 | ||
|  |       this.mouse.stop(); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "shouldUpdate", | ||
|  |     value: function shouldUpdate(ignoreAnimation, forceRedraw) { | ||
|  |       // need update from animations?
 | ||
|  |       if (!ignoreAnimation) { | ||
|  |         var frameDuration = this.frameDuration; | ||
|  |         var shouldUpdate = this.animations.reduce(function (shouldUpdate, animation) { | ||
|  |           return animation.update(frameDuration) || shouldUpdate; | ||
|  |         }, false); | ||
|  | 
 | ||
|  |         if (shouldUpdate) { | ||
|  |           return true; | ||
|  |         } | ||
|  |       } // need update from redraw?
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       if (typeof forceRedraw === 'function' && forceRedraw()) { | ||
|  |         return true; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (!this.isReadyLock && this.isReady()) { | ||
|  |         return true; | ||
|  |       } // need update from mouse events?
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       if (this.mouse.hasEvents()) { | ||
|  |         return true; | ||
|  |       } | ||
|  | 
 | ||
|  |       return false; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "render", | ||
|  |     value: function render(element, ignoreDimensions, ignoreClear, scaleWidth, scaleHeight, offsetX, offsetY) { | ||
|  |       var CLIENT_WIDTH = this.CLIENT_WIDTH, | ||
|  |           CLIENT_HEIGHT = this.CLIENT_HEIGHT, | ||
|  |           viewPort = this.viewPort, | ||
|  |           ctx = this.ctx, | ||
|  |           isFirstRender = this.isFirstRender; | ||
|  |       var canvas = ctx.canvas; | ||
|  |       viewPort.clear(); | ||
|  | 
 | ||
|  |       if (canvas.width && canvas.height) { | ||
|  |         viewPort.setCurrent(canvas.width, canvas.height); | ||
|  |       } else { | ||
|  |         viewPort.setCurrent(CLIENT_WIDTH, CLIENT_HEIGHT); | ||
|  |       } | ||
|  | 
 | ||
|  |       var widthStyle = element.getStyle('width'); | ||
|  |       var heightStyle = element.getStyle('height'); | ||
|  | 
 | ||
|  |       if (!ignoreDimensions && (isFirstRender || typeof scaleWidth !== 'number' && typeof scaleHeight !== 'number')) { | ||
|  |         // set canvas size
 | ||
|  |         if (widthStyle.hasValue()) { | ||
|  |           canvas.width = widthStyle.getPixels('x'); | ||
|  | 
 | ||
|  |           if (canvas.style) { | ||
|  |             canvas.style.width = "".concat(canvas.width, "px"); | ||
|  |           } | ||
|  |         } | ||
|  | 
 | ||
|  |         if (heightStyle.hasValue()) { | ||
|  |           canvas.height = heightStyle.getPixels('y'); | ||
|  | 
 | ||
|  |           if (canvas.style) { | ||
|  |             canvas.style.height = "".concat(canvas.height, "px"); | ||
|  |           } | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       var cWidth = canvas.clientWidth || canvas.width; | ||
|  |       var cHeight = canvas.clientHeight || canvas.height; | ||
|  | 
 | ||
|  |       if (ignoreDimensions && widthStyle.hasValue() && heightStyle.hasValue()) { | ||
|  |         cWidth = widthStyle.getPixels('x'); | ||
|  |         cHeight = heightStyle.getPixels('y'); | ||
|  |       } | ||
|  | 
 | ||
|  |       viewPort.setCurrent(cWidth, cHeight); | ||
|  | 
 | ||
|  |       if (typeof offsetX === 'number') { | ||
|  |         element.getAttribute('x', true).setValue(offsetX); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (typeof offsetY === 'number') { | ||
|  |         element.getAttribute('y', true).setValue(offsetY); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (typeof scaleWidth === 'number' || typeof scaleHeight === 'number') { | ||
|  |         var viewBox = toNumbers(element.getAttribute('viewBox').getString()); | ||
|  |         var xRatio = 0; | ||
|  |         var yRatio = 0; | ||
|  | 
 | ||
|  |         if (typeof scaleWidth === 'number') { | ||
|  |           var _widthStyle = element.getStyle('width'); | ||
|  | 
 | ||
|  |           if (_widthStyle.hasValue()) { | ||
|  |             xRatio = _widthStyle.getPixels('x') / scaleWidth; | ||
|  |           } else if (!isNaN(viewBox[2])) { | ||
|  |             xRatio = viewBox[2] / scaleWidth; | ||
|  |           } | ||
|  |         } | ||
|  | 
 | ||
|  |         if (typeof scaleHeight === 'number') { | ||
|  |           var _heightStyle = element.getStyle('height'); | ||
|  | 
 | ||
|  |           if (_heightStyle.hasValue()) { | ||
|  |             yRatio = _heightStyle.getPixels('y') / scaleHeight; | ||
|  |           } else if (!isNaN(viewBox[3])) { | ||
|  |             yRatio = viewBox[3] / scaleHeight; | ||
|  |           } | ||
|  |         } | ||
|  | 
 | ||
|  |         if (!xRatio) { | ||
|  |           xRatio = yRatio; | ||
|  |         } | ||
|  | 
 | ||
|  |         if (!yRatio) { | ||
|  |           yRatio = xRatio; | ||
|  |         } | ||
|  | 
 | ||
|  |         element.getAttribute('width', true).setValue(scaleWidth); | ||
|  |         element.getAttribute('height', true).setValue(scaleHeight); | ||
|  |         var transformStyle = element.getStyle('transform', true, true); | ||
|  |         transformStyle.setValue("".concat(transformStyle.getString(), " scale(").concat(1.0 / xRatio, ", ").concat(1.0 / yRatio, ")")); | ||
|  |       } // clear and render
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       if (!ignoreClear) { | ||
|  |         ctx.clearRect(0, 0, cWidth, cHeight); | ||
|  |       } | ||
|  | 
 | ||
|  |       element.render(ctx); | ||
|  | 
 | ||
|  |       if (isFirstRender) { | ||
|  |         this.isFirstRender = false; | ||
|  |       } | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return Screen; | ||
|  | }(); | ||
|  | Screen.defaultWindow = defaultWindow; | ||
|  | Screen.defaultFetch = defaultFetch$1; | ||
|  | 
 | ||
|  | var defaultFetch = Screen.defaultFetch; | ||
|  | var DefaultDOMParser = typeof DOMParser !== 'undefined' ? DOMParser : null; | ||
|  | 
 | ||
|  | var Parser = /*#__PURE__*/function () { | ||
|  |   function Parser() { | ||
|  |     var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, | ||
|  |         _ref$fetch = _ref.fetch, | ||
|  |         fetch = _ref$fetch === void 0 ? defaultFetch : _ref$fetch, | ||
|  |         _ref$DOMParser = _ref.DOMParser, | ||
|  |         DOMParser = _ref$DOMParser === void 0 ? DefaultDOMParser : _ref$DOMParser; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, Parser); | ||
|  | 
 | ||
|  |     this.fetch = fetch; | ||
|  |     this.DOMParser = DOMParser; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](Parser, [{ | ||
|  |     key: "parse", | ||
|  |     value: function () { | ||
|  |       var _parse = _asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee(resource) { | ||
|  |         return _regeneratorRuntime__default['default'].wrap(function _callee$(_context) { | ||
|  |           while (1) { | ||
|  |             switch (_context.prev = _context.next) { | ||
|  |               case 0: | ||
|  |                 if (!resource.startsWith('<')) { | ||
|  |                   _context.next = 2; | ||
|  |                   break; | ||
|  |                 } | ||
|  | 
 | ||
|  |                 return _context.abrupt("return", this.parseFromString(resource)); | ||
|  | 
 | ||
|  |               case 2: | ||
|  |                 return _context.abrupt("return", this.load(resource)); | ||
|  | 
 | ||
|  |               case 3: | ||
|  |               case "end": | ||
|  |                 return _context.stop(); | ||
|  |             } | ||
|  |           } | ||
|  |         }, _callee, this); | ||
|  |       })); | ||
|  | 
 | ||
|  |       function parse(_x) { | ||
|  |         return _parse.apply(this, arguments); | ||
|  |       } | ||
|  | 
 | ||
|  |       return parse; | ||
|  |     }() | ||
|  |   }, { | ||
|  |     key: "parseFromString", | ||
|  |     value: function parseFromString(xml) { | ||
|  |       var parser = new this.DOMParser(); | ||
|  | 
 | ||
|  |       try { | ||
|  |         return this.checkDocument(parser.parseFromString(xml, 'image/svg+xml')); | ||
|  |       } catch (err) { | ||
|  |         return this.checkDocument(parser.parseFromString(xml, 'text/xml')); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "checkDocument", | ||
|  |     value: function checkDocument(document) { | ||
|  |       var parserError = document.getElementsByTagName('parsererror')[0]; | ||
|  | 
 | ||
|  |       if (parserError) { | ||
|  |         throw new Error(parserError.textContent); | ||
|  |       } | ||
|  | 
 | ||
|  |       return document; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "load", | ||
|  |     value: function () { | ||
|  |       var _load = _asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee2(url) { | ||
|  |         var response, xml; | ||
|  |         return _regeneratorRuntime__default['default'].wrap(function _callee2$(_context2) { | ||
|  |           while (1) { | ||
|  |             switch (_context2.prev = _context2.next) { | ||
|  |               case 0: | ||
|  |                 _context2.next = 2; | ||
|  |                 return this.fetch(url); | ||
|  | 
 | ||
|  |               case 2: | ||
|  |                 response = _context2.sent; | ||
|  |                 _context2.next = 5; | ||
|  |                 return response.text(); | ||
|  | 
 | ||
|  |               case 5: | ||
|  |                 xml = _context2.sent; | ||
|  |                 return _context2.abrupt("return", this.parseFromString(xml)); | ||
|  | 
 | ||
|  |               case 7: | ||
|  |               case "end": | ||
|  |                 return _context2.stop(); | ||
|  |             } | ||
|  |           } | ||
|  |         }, _callee2, this); | ||
|  |       })); | ||
|  | 
 | ||
|  |       function load(_x2) { | ||
|  |         return _load.apply(this, arguments); | ||
|  |       } | ||
|  | 
 | ||
|  |       return load; | ||
|  |     }() | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return Parser; | ||
|  | }(); | ||
|  | 
 | ||
|  | var Translate = /*#__PURE__*/function () { | ||
|  |   function Translate(_, point) { | ||
|  |     _classCallCheck__default['default'](this, Translate); | ||
|  | 
 | ||
|  |     this.type = 'translate'; | ||
|  |     this.point = null; | ||
|  |     this.point = Point.parse(point); | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](Translate, [{ | ||
|  |     key: "apply", | ||
|  |     value: function apply(ctx) { | ||
|  |       var _this$point = this.point, | ||
|  |           x = _this$point.x, | ||
|  |           y = _this$point.y; | ||
|  |       ctx.translate(x || 0.0, y || 0.0); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "unapply", | ||
|  |     value: function unapply(ctx) { | ||
|  |       var _this$point2 = this.point, | ||
|  |           x = _this$point2.x, | ||
|  |           y = _this$point2.y; | ||
|  |       ctx.translate(-1.0 * x || 0.0, -1.0 * y || 0.0); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "applyToPoint", | ||
|  |     value: function applyToPoint(point) { | ||
|  |       var _this$point3 = this.point, | ||
|  |           x = _this$point3.x, | ||
|  |           y = _this$point3.y; | ||
|  |       point.applyTransform([1, 0, 0, 1, x || 0.0, y || 0.0]); | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return Translate; | ||
|  | }(); | ||
|  | 
 | ||
|  | var Rotate = /*#__PURE__*/function () { | ||
|  |   function Rotate(document, rotate, transformOrigin) { | ||
|  |     _classCallCheck__default['default'](this, Rotate); | ||
|  | 
 | ||
|  |     this.type = 'rotate'; | ||
|  |     this.angle = null; | ||
|  |     this.originX = null; | ||
|  |     this.originY = null; | ||
|  |     this.cx = 0; | ||
|  |     this.cy = 0; | ||
|  |     var numbers = toNumbers(rotate); | ||
|  |     this.angle = new Property(document, 'angle', numbers[0]); | ||
|  |     this.originX = transformOrigin[0]; | ||
|  |     this.originY = transformOrigin[1]; | ||
|  |     this.cx = numbers[1] || 0; | ||
|  |     this.cy = numbers[2] || 0; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](Rotate, [{ | ||
|  |     key: "apply", | ||
|  |     value: function apply(ctx) { | ||
|  |       var cx = this.cx, | ||
|  |           cy = this.cy, | ||
|  |           originX = this.originX, | ||
|  |           originY = this.originY, | ||
|  |           angle = this.angle; | ||
|  |       var tx = cx + originX.getPixels('x'); | ||
|  |       var ty = cy + originY.getPixels('y'); | ||
|  |       ctx.translate(tx, ty); | ||
|  |       ctx.rotate(angle.getRadians()); | ||
|  |       ctx.translate(-tx, -ty); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "unapply", | ||
|  |     value: function unapply(ctx) { | ||
|  |       var cx = this.cx, | ||
|  |           cy = this.cy, | ||
|  |           originX = this.originX, | ||
|  |           originY = this.originY, | ||
|  |           angle = this.angle; | ||
|  |       var tx = cx + originX.getPixels('x'); | ||
|  |       var ty = cy + originY.getPixels('y'); | ||
|  |       ctx.translate(tx, ty); | ||
|  |       ctx.rotate(-1.0 * angle.getRadians()); | ||
|  |       ctx.translate(-tx, -ty); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "applyToPoint", | ||
|  |     value: function applyToPoint(point) { | ||
|  |       var cx = this.cx, | ||
|  |           cy = this.cy, | ||
|  |           angle = this.angle; | ||
|  |       var rad = angle.getRadians(); | ||
|  |       point.applyTransform([1, 0, 0, 1, cx || 0.0, cy || 0.0 // this.p.y
 | ||
|  |       ]); | ||
|  |       point.applyTransform([Math.cos(rad), Math.sin(rad), -Math.sin(rad), Math.cos(rad), 0, 0]); | ||
|  |       point.applyTransform([1, 0, 0, 1, -cx || 0.0, -cy || 0.0 // -this.p.y
 | ||
|  |       ]); | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return Rotate; | ||
|  | }(); | ||
|  | 
 | ||
|  | var Scale = /*#__PURE__*/function () { | ||
|  |   function Scale(_, scale, transformOrigin) { | ||
|  |     _classCallCheck__default['default'](this, Scale); | ||
|  | 
 | ||
|  |     this.type = 'scale'; | ||
|  |     this.scale = null; | ||
|  |     this.originX = null; | ||
|  |     this.originY = null; | ||
|  |     var scaleSize = Point.parseScale(scale); // Workaround for node-canvas
 | ||
|  | 
 | ||
|  |     if (scaleSize.x === 0 || scaleSize.y === 0) { | ||
|  |       scaleSize.x = PSEUDO_ZERO; | ||
|  |       scaleSize.y = PSEUDO_ZERO; | ||
|  |     } | ||
|  | 
 | ||
|  |     this.scale = scaleSize; | ||
|  |     this.originX = transformOrigin[0]; | ||
|  |     this.originY = transformOrigin[1]; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](Scale, [{ | ||
|  |     key: "apply", | ||
|  |     value: function apply(ctx) { | ||
|  |       var _this$scale = this.scale, | ||
|  |           x = _this$scale.x, | ||
|  |           y = _this$scale.y, | ||
|  |           originX = this.originX, | ||
|  |           originY = this.originY; | ||
|  |       var tx = originX.getPixels('x'); | ||
|  |       var ty = originY.getPixels('y'); | ||
|  |       ctx.translate(tx, ty); | ||
|  |       ctx.scale(x, y || x); | ||
|  |       ctx.translate(-tx, -ty); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "unapply", | ||
|  |     value: function unapply(ctx) { | ||
|  |       var _this$scale2 = this.scale, | ||
|  |           x = _this$scale2.x, | ||
|  |           y = _this$scale2.y, | ||
|  |           originX = this.originX, | ||
|  |           originY = this.originY; | ||
|  |       var tx = originX.getPixels('x'); | ||
|  |       var ty = originY.getPixels('y'); | ||
|  |       ctx.translate(tx, ty); | ||
|  |       ctx.scale(1.0 / x, 1.0 / y || x); | ||
|  |       ctx.translate(-tx, -ty); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "applyToPoint", | ||
|  |     value: function applyToPoint(point) { | ||
|  |       var _this$scale3 = this.scale, | ||
|  |           x = _this$scale3.x, | ||
|  |           y = _this$scale3.y; | ||
|  |       point.applyTransform([x || 0.0, 0, 0, y || 0.0, 0, 0]); | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return Scale; | ||
|  | }(); | ||
|  | 
 | ||
|  | var Matrix = /*#__PURE__*/function () { | ||
|  |   function Matrix(_, matrix, transformOrigin) { | ||
|  |     _classCallCheck__default['default'](this, Matrix); | ||
|  | 
 | ||
|  |     this.type = 'matrix'; | ||
|  |     this.matrix = []; | ||
|  |     this.originX = null; | ||
|  |     this.originY = null; | ||
|  |     this.matrix = toNumbers(matrix); | ||
|  |     this.originX = transformOrigin[0]; | ||
|  |     this.originY = transformOrigin[1]; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](Matrix, [{ | ||
|  |     key: "apply", | ||
|  |     value: function apply(ctx) { | ||
|  |       var originX = this.originX, | ||
|  |           originY = this.originY, | ||
|  |           matrix = this.matrix; | ||
|  |       var tx = originX.getPixels('x'); | ||
|  |       var ty = originY.getPixels('y'); | ||
|  |       ctx.translate(tx, ty); | ||
|  |       ctx.transform(matrix[0], matrix[1], matrix[2], matrix[3], matrix[4], matrix[5]); | ||
|  |       ctx.translate(-tx, -ty); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "unapply", | ||
|  |     value: function unapply(ctx) { | ||
|  |       var originX = this.originX, | ||
|  |           originY = this.originY, | ||
|  |           matrix = this.matrix; | ||
|  |       var a = matrix[0]; | ||
|  |       var b = matrix[2]; | ||
|  |       var c = matrix[4]; | ||
|  |       var d = matrix[1]; | ||
|  |       var e = matrix[3]; | ||
|  |       var f = matrix[5]; | ||
|  |       var g = 0.0; | ||
|  |       var h = 0.0; | ||
|  |       var i = 1.0; | ||
|  |       var det = 1 / (a * (e * i - f * h) - b * (d * i - f * g) + c * (d * h - e * g)); | ||
|  |       var tx = originX.getPixels('x'); | ||
|  |       var ty = originY.getPixels('y'); | ||
|  |       ctx.translate(tx, ty); | ||
|  |       ctx.transform(det * (e * i - f * h), det * (f * g - d * i), det * (c * h - b * i), det * (a * i - c * g), det * (b * f - c * e), det * (c * d - a * f)); | ||
|  |       ctx.translate(-tx, -ty); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "applyToPoint", | ||
|  |     value: function applyToPoint(point) { | ||
|  |       point.applyTransform(this.matrix); | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return Matrix; | ||
|  | }(); | ||
|  | 
 | ||
|  | function _createSuper$M(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$M(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$M() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var Skew = /*#__PURE__*/function (_Matrix) { | ||
|  |   _inherits__default['default'](Skew, _Matrix); | ||
|  | 
 | ||
|  |   var _super = _createSuper$M(Skew); | ||
|  | 
 | ||
|  |   function Skew(document, skew, transformOrigin) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, Skew); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, skew, transformOrigin); | ||
|  |     _this.type = 'skew'; | ||
|  |     _this.angle = null; | ||
|  |     _this.angle = new Property(document, 'angle', skew); | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   return Skew; | ||
|  | }(Matrix); | ||
|  | 
 | ||
|  | function _createSuper$L(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$L(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$L() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var SkewX = /*#__PURE__*/function (_Skew) { | ||
|  |   _inherits__default['default'](SkewX, _Skew); | ||
|  | 
 | ||
|  |   var _super = _createSuper$L(SkewX); | ||
|  | 
 | ||
|  |   function SkewX(document, skew, transformOrigin) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, SkewX); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, skew, transformOrigin); | ||
|  |     _this.type = 'skewX'; | ||
|  |     _this.matrix = [1, 0, Math.tan(_this.angle.getRadians()), 1, 0, 0]; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   return SkewX; | ||
|  | }(Skew); | ||
|  | 
 | ||
|  | function _createSuper$K(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$K(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$K() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var SkewY = /*#__PURE__*/function (_Skew) { | ||
|  |   _inherits__default['default'](SkewY, _Skew); | ||
|  | 
 | ||
|  |   var _super = _createSuper$K(SkewY); | ||
|  | 
 | ||
|  |   function SkewY(document, skew, transformOrigin) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, SkewY); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, skew, transformOrigin); | ||
|  |     _this.type = 'skewY'; | ||
|  |     _this.matrix = [1, Math.tan(_this.angle.getRadians()), 0, 1, 0, 0]; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   return SkewY; | ||
|  | }(Skew); | ||
|  | 
 | ||
|  | function parseTransforms(transform) { | ||
|  |   return compressSpaces(transform).trim().replace(/\)([a-zA-Z])/g, ') $1').replace(/\)(\s?,\s?)/g, ') ').split(/\s(?=[a-z])/); | ||
|  | } | ||
|  | 
 | ||
|  | function parseTransform(transform) { | ||
|  |   var _transform$split = transform.split('('), | ||
|  |       _transform$split2 = _slicedToArray__default['default'](_transform$split, 2), | ||
|  |       type = _transform$split2[0], | ||
|  |       value = _transform$split2[1]; | ||
|  | 
 | ||
|  |   return [type.trim(), value.trim().replace(')', '')]; | ||
|  | } | ||
|  | 
 | ||
|  | var Transform = /*#__PURE__*/function () { | ||
|  |   function Transform(document, transform, transformOrigin) { | ||
|  |     var _this = this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, Transform); | ||
|  | 
 | ||
|  |     this.document = document; | ||
|  |     this.transforms = []; | ||
|  |     var data = parseTransforms(transform); | ||
|  |     data.forEach(function (transform) { | ||
|  |       if (transform === 'none') { | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       var _parseTransform = parseTransform(transform), | ||
|  |           _parseTransform2 = _slicedToArray__default['default'](_parseTransform, 2), | ||
|  |           type = _parseTransform2[0], | ||
|  |           value = _parseTransform2[1]; | ||
|  | 
 | ||
|  |       var TransformType = Transform.transformTypes[type]; | ||
|  | 
 | ||
|  |       if (typeof TransformType !== 'undefined') { | ||
|  |         _this.transforms.push(new TransformType(_this.document, value, transformOrigin)); | ||
|  |       } | ||
|  |     }); | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](Transform, [{ | ||
|  |     key: "apply", | ||
|  |     value: function apply(ctx) { | ||
|  |       var transforms = this.transforms; | ||
|  |       var len = transforms.length; | ||
|  | 
 | ||
|  |       for (var i = 0; i < len; i++) { | ||
|  |         transforms[i].apply(ctx); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "unapply", | ||
|  |     value: function unapply(ctx) { | ||
|  |       var transforms = this.transforms; | ||
|  |       var len = transforms.length; | ||
|  | 
 | ||
|  |       for (var i = len - 1; i >= 0; i--) { | ||
|  |         transforms[i].unapply(ctx); | ||
|  |       } | ||
|  |     } // TODO: applyToPoint unused ... remove?
 | ||
|  | 
 | ||
|  |   }, { | ||
|  |     key: "applyToPoint", | ||
|  |     value: function applyToPoint(point) { | ||
|  |       var transforms = this.transforms; | ||
|  |       var len = transforms.length; | ||
|  | 
 | ||
|  |       for (var i = 0; i < len; i++) { | ||
|  |         transforms[i].applyToPoint(point); | ||
|  |       } | ||
|  |     } | ||
|  |   }], [{ | ||
|  |     key: "fromElement", | ||
|  |     value: function fromElement(document, element) { | ||
|  |       var transformStyle = element.getStyle('transform', false, true); | ||
|  | 
 | ||
|  |       var _element$getStyle$spl = element.getStyle('transform-origin', false, true).split(), | ||
|  |           _element$getStyle$spl2 = _slicedToArray__default['default'](_element$getStyle$spl, 2), | ||
|  |           transformOriginXProperty = _element$getStyle$spl2[0], | ||
|  |           _element$getStyle$spl3 = _element$getStyle$spl2[1], | ||
|  |           transformOriginYProperty = _element$getStyle$spl3 === void 0 ? transformOriginXProperty : _element$getStyle$spl3; | ||
|  | 
 | ||
|  |       var transformOrigin = [transformOriginXProperty, transformOriginYProperty]; | ||
|  | 
 | ||
|  |       if (transformStyle.hasValue()) { | ||
|  |         return new Transform(document, transformStyle.getString(), transformOrigin); | ||
|  |       } | ||
|  | 
 | ||
|  |       return null; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return Transform; | ||
|  | }(); | ||
|  | Transform.transformTypes = { | ||
|  |   translate: Translate, | ||
|  |   rotate: Rotate, | ||
|  |   scale: Scale, | ||
|  |   matrix: Matrix, | ||
|  |   skewX: SkewX, | ||
|  |   skewY: SkewY | ||
|  | }; | ||
|  | 
 | ||
|  | var Element = /*#__PURE__*/function () { | ||
|  |   function Element(document, node) { | ||
|  |     var _this = this; | ||
|  | 
 | ||
|  |     var captureTextNodes = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, Element); | ||
|  | 
 | ||
|  |     this.document = document; | ||
|  |     this.node = node; | ||
|  |     this.captureTextNodes = captureTextNodes; | ||
|  |     this.attributes = {}; | ||
|  |     this.styles = {}; | ||
|  |     this.stylesSpecificity = {}; | ||
|  |     this.animationFrozen = false; | ||
|  |     this.animationFrozenValue = ''; | ||
|  |     this.parent = null; | ||
|  |     this.children = []; | ||
|  | 
 | ||
|  |     if (!node || node.nodeType !== 1) { | ||
|  |       // ELEMENT_NODE
 | ||
|  |       return; | ||
|  |     } // add attributes
 | ||
|  | 
 | ||
|  | 
 | ||
|  |     Array.from(node.attributes).forEach(function (attribute) { | ||
|  |       var nodeName = normalizeAttributeName(attribute.nodeName); | ||
|  |       _this.attributes[nodeName] = new Property(document, nodeName, attribute.value); | ||
|  |     }); | ||
|  |     this.addStylesFromStyleDefinition(); // add inline styles
 | ||
|  | 
 | ||
|  |     if (this.getAttribute('style').hasValue()) { | ||
|  |       var styles = this.getAttribute('style').getString().split(';').map(function (_) { | ||
|  |         return _.trim(); | ||
|  |       }); | ||
|  |       styles.forEach(function (style) { | ||
|  |         if (!style) { | ||
|  |           return; | ||
|  |         } | ||
|  | 
 | ||
|  |         var _style$split$map = style.split(':').map(function (_) { | ||
|  |           return _.trim(); | ||
|  |         }), | ||
|  |             _style$split$map2 = _slicedToArray__default['default'](_style$split$map, 2), | ||
|  |             name = _style$split$map2[0], | ||
|  |             value = _style$split$map2[1]; | ||
|  | 
 | ||
|  |         _this.styles[name] = new Property(document, name, value); | ||
|  |       }); | ||
|  |     } | ||
|  | 
 | ||
|  |     var definitions = document.definitions; | ||
|  |     var id = this.getAttribute('id'); // add id
 | ||
|  | 
 | ||
|  |     if (id.hasValue()) { | ||
|  |       if (!definitions[id.getString()]) { | ||
|  |         definitions[id.getString()] = this; | ||
|  |       } | ||
|  |     } | ||
|  | 
 | ||
|  |     Array.from(node.childNodes).forEach(function (childNode) { | ||
|  |       if (childNode.nodeType === 1) { | ||
|  |         _this.addChild(childNode); // ELEMENT_NODE
 | ||
|  | 
 | ||
|  |       } else if (captureTextNodes && (childNode.nodeType === 3 || childNode.nodeType === 4)) { | ||
|  |         var textNode = document.createTextNode(childNode); | ||
|  | 
 | ||
|  |         if (textNode.getText().length > 0) { | ||
|  |           _this.addChild(textNode); // TEXT_NODE
 | ||
|  | 
 | ||
|  |         } | ||
|  |       } | ||
|  |     }); | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](Element, [{ | ||
|  |     key: "getAttribute", | ||
|  |     value: function getAttribute(name) { | ||
|  |       var createIfNotExists = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; | ||
|  |       var attr = this.attributes[name]; | ||
|  | 
 | ||
|  |       if (!attr && createIfNotExists) { | ||
|  |         var _attr = new Property(this.document, name, ''); | ||
|  | 
 | ||
|  |         this.attributes[name] = _attr; | ||
|  |         return _attr; | ||
|  |       } | ||
|  | 
 | ||
|  |       return attr || Property.empty(this.document); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getHrefAttribute", | ||
|  |     value: function getHrefAttribute() { | ||
|  |       for (var key in this.attributes) { | ||
|  |         if (key === 'href' || key.endsWith(':href')) { | ||
|  |           return this.attributes[key]; | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       return Property.empty(this.document); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getStyle", | ||
|  |     value: function getStyle(name) { | ||
|  |       var createIfNotExists = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; | ||
|  |       var skipAncestors = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; | ||
|  |       var style = this.styles[name]; | ||
|  | 
 | ||
|  |       if (style) { | ||
|  |         return style; | ||
|  |       } | ||
|  | 
 | ||
|  |       var attr = this.getAttribute(name); | ||
|  | 
 | ||
|  |       if (attr !== null && attr !== void 0 && attr.hasValue()) { | ||
|  |         this.styles[name] = attr; // move up to me to cache
 | ||
|  | 
 | ||
|  |         return attr; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (!skipAncestors) { | ||
|  |         var parent = this.parent; | ||
|  | 
 | ||
|  |         if (parent) { | ||
|  |           var parentStyle = parent.getStyle(name); | ||
|  | 
 | ||
|  |           if (parentStyle !== null && parentStyle !== void 0 && parentStyle.hasValue()) { | ||
|  |             return parentStyle; | ||
|  |           } | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       if (createIfNotExists) { | ||
|  |         var _style = new Property(this.document, name, ''); | ||
|  | 
 | ||
|  |         this.styles[name] = _style; | ||
|  |         return _style; | ||
|  |       } | ||
|  | 
 | ||
|  |       return style || Property.empty(this.document); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "render", | ||
|  |     value: function render(ctx) { | ||
|  |       // don't render display=none
 | ||
|  |       // don't render visibility=hidden
 | ||
|  |       if (this.getStyle('display').getString() === 'none' || this.getStyle('visibility').getString() === 'hidden') { | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       ctx.save(); | ||
|  | 
 | ||
|  |       if (this.getStyle('mask').hasValue()) { | ||
|  |         // mask
 | ||
|  |         var mask = this.getStyle('mask').getDefinition(); | ||
|  | 
 | ||
|  |         if (mask) { | ||
|  |           this.applyEffects(ctx); | ||
|  |           mask.apply(ctx, this); | ||
|  |         } | ||
|  |       } else if (this.getStyle('filter').getValue('none') !== 'none') { | ||
|  |         // filter
 | ||
|  |         var filter = this.getStyle('filter').getDefinition(); | ||
|  | 
 | ||
|  |         if (filter) { | ||
|  |           this.applyEffects(ctx); | ||
|  |           filter.apply(ctx, this); | ||
|  |         } | ||
|  |       } else { | ||
|  |         this.setContext(ctx); | ||
|  |         this.renderChildren(ctx); | ||
|  |         this.clearContext(ctx); | ||
|  |       } | ||
|  | 
 | ||
|  |       ctx.restore(); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "setContext", | ||
|  |     value: function setContext(_) {// NO RENDER
 | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "applyEffects", | ||
|  |     value: function applyEffects(ctx) { | ||
|  |       // transform
 | ||
|  |       var transform = Transform.fromElement(this.document, this); | ||
|  | 
 | ||
|  |       if (transform) { | ||
|  |         transform.apply(ctx); | ||
|  |       } // clip
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       var clipPathStyleProp = this.getStyle('clip-path', false, true); | ||
|  | 
 | ||
|  |       if (clipPathStyleProp.hasValue()) { | ||
|  |         var clip = clipPathStyleProp.getDefinition(); | ||
|  | 
 | ||
|  |         if (clip) { | ||
|  |           clip.apply(ctx); | ||
|  |         } | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "clearContext", | ||
|  |     value: function clearContext(_) {// NO RENDER
 | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "renderChildren", | ||
|  |     value: function renderChildren(ctx) { | ||
|  |       this.children.forEach(function (child) { | ||
|  |         child.render(ctx); | ||
|  |       }); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "addChild", | ||
|  |     value: function addChild(childNode) { | ||
|  |       var child = childNode instanceof Element ? childNode : this.document.createElement(childNode); | ||
|  |       child.parent = this; | ||
|  | 
 | ||
|  |       if (!Element.ignoreChildTypes.includes(child.type)) { | ||
|  |         this.children.push(child); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "matchesSelector", | ||
|  |     value: function matchesSelector(selector) { | ||
|  |       var node = this.node; | ||
|  | 
 | ||
|  |       if (typeof node.matches === 'function') { | ||
|  |         return node.matches(selector); | ||
|  |       } | ||
|  | 
 | ||
|  |       var styleClasses = node.getAttribute('class'); | ||
|  | 
 | ||
|  |       if (!styleClasses || styleClasses === '') { | ||
|  |         return false; | ||
|  |       } | ||
|  | 
 | ||
|  |       return styleClasses.split(' ').some(function (styleClass) { | ||
|  |         return ".".concat(styleClass) === selector; | ||
|  |       }); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "addStylesFromStyleDefinition", | ||
|  |     value: function addStylesFromStyleDefinition() { | ||
|  |       var _this$document = this.document, | ||
|  |           styles = _this$document.styles, | ||
|  |           stylesSpecificity = _this$document.stylesSpecificity; | ||
|  | 
 | ||
|  |       for (var selector in styles) { | ||
|  |         if (!selector.startsWith('@') && this.matchesSelector(selector)) { | ||
|  |           var style = styles[selector]; | ||
|  |           var specificity = stylesSpecificity[selector]; | ||
|  | 
 | ||
|  |           if (style) { | ||
|  |             for (var name in style) { | ||
|  |               var existingSpecificity = this.stylesSpecificity[name]; | ||
|  | 
 | ||
|  |               if (typeof existingSpecificity === 'undefined') { | ||
|  |                 existingSpecificity = '000'; | ||
|  |               } | ||
|  | 
 | ||
|  |               if (specificity >= existingSpecificity) { | ||
|  |                 this.styles[name] = style[name]; | ||
|  |                 this.stylesSpecificity[name] = specificity; | ||
|  |               } | ||
|  |             } | ||
|  |           } | ||
|  |         } | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "removeStyles", | ||
|  |     value: function removeStyles(element, ignoreStyles) { | ||
|  |       var toRestore = ignoreStyles.reduce(function (toRestore, name) { | ||
|  |         var styleProp = element.getStyle(name); | ||
|  | 
 | ||
|  |         if (!styleProp.hasValue()) { | ||
|  |           return toRestore; | ||
|  |         } | ||
|  | 
 | ||
|  |         var value = styleProp.getString(); | ||
|  |         styleProp.setValue(''); | ||
|  |         return [].concat(_toConsumableArray__default['default'](toRestore), [[name, value]]); | ||
|  |       }, []); | ||
|  |       return toRestore; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "restoreStyles", | ||
|  |     value: function restoreStyles(element, styles) { | ||
|  |       styles.forEach(function (_ref) { | ||
|  |         var _ref2 = _slicedToArray__default['default'](_ref, 2), | ||
|  |             name = _ref2[0], | ||
|  |             value = _ref2[1]; | ||
|  | 
 | ||
|  |         element.getStyle(name, true).setValue(value); | ||
|  |       }); | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return Element; | ||
|  | }(); | ||
|  | Element.ignoreChildTypes = ['title']; | ||
|  | 
 | ||
|  | function _createSuper$J(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$J(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$J() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var UnknownElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](UnknownElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$J(UnknownElement); | ||
|  | 
 | ||
|  |   function UnknownElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, UnknownElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  | 
 | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   return UnknownElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function wrapFontFamily(fontFamily) { | ||
|  |   var trimmed = fontFamily.trim(); | ||
|  |   return /^('|")/.test(trimmed) ? trimmed : "\"".concat(trimmed, "\""); | ||
|  | } | ||
|  | 
 | ||
|  | function prepareFontFamily(fontFamily) { | ||
|  |   return typeof process === 'undefined' ? fontFamily : fontFamily.trim().split(',').map(wrapFontFamily).join(','); | ||
|  | } | ||
|  | /** | ||
|  |  * https://developer.mozilla.org/en-US/docs/Web/CSS/font-style
 | ||
|  |  * @param fontStyle | ||
|  |  * @returns CSS font style. | ||
|  |  */ | ||
|  | 
 | ||
|  | 
 | ||
|  | function prepareFontStyle(fontStyle) { | ||
|  |   if (!fontStyle) { | ||
|  |     return ''; | ||
|  |   } | ||
|  | 
 | ||
|  |   var targetFontStyle = fontStyle.trim().toLowerCase(); | ||
|  | 
 | ||
|  |   switch (targetFontStyle) { | ||
|  |     case 'normal': | ||
|  |     case 'italic': | ||
|  |     case 'oblique': | ||
|  |     case 'inherit': | ||
|  |     case 'initial': | ||
|  |     case 'unset': | ||
|  |       return targetFontStyle; | ||
|  | 
 | ||
|  |     default: | ||
|  |       if (/^oblique\s+(-|)\d+deg$/.test(targetFontStyle)) { | ||
|  |         return targetFontStyle; | ||
|  |       } | ||
|  | 
 | ||
|  |       return ''; | ||
|  |   } | ||
|  | } | ||
|  | /** | ||
|  |  * https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight
 | ||
|  |  * @param fontWeight | ||
|  |  * @returns CSS font weight. | ||
|  |  */ | ||
|  | 
 | ||
|  | 
 | ||
|  | function prepareFontWeight(fontWeight) { | ||
|  |   if (!fontWeight) { | ||
|  |     return ''; | ||
|  |   } | ||
|  | 
 | ||
|  |   var targetFontWeight = fontWeight.trim().toLowerCase(); | ||
|  | 
 | ||
|  |   switch (targetFontWeight) { | ||
|  |     case 'normal': | ||
|  |     case 'bold': | ||
|  |     case 'lighter': | ||
|  |     case 'bolder': | ||
|  |     case 'inherit': | ||
|  |     case 'initial': | ||
|  |     case 'unset': | ||
|  |       return targetFontWeight; | ||
|  | 
 | ||
|  |     default: | ||
|  |       if (/^[\d.]+$/.test(targetFontWeight)) { | ||
|  |         return targetFontWeight; | ||
|  |       } | ||
|  | 
 | ||
|  |       return ''; | ||
|  |   } | ||
|  | } | ||
|  | 
 | ||
|  | var Font = /*#__PURE__*/function () { | ||
|  |   function Font(fontStyle, fontVariant, fontWeight, fontSize, fontFamily, inherit) { | ||
|  |     _classCallCheck__default['default'](this, Font); | ||
|  | 
 | ||
|  |     var inheritFont = inherit ? typeof inherit === 'string' ? Font.parse(inherit) : inherit : {}; | ||
|  |     this.fontFamily = fontFamily || inheritFont.fontFamily; | ||
|  |     this.fontSize = fontSize || inheritFont.fontSize; | ||
|  |     this.fontStyle = fontStyle || inheritFont.fontStyle; | ||
|  |     this.fontWeight = fontWeight || inheritFont.fontWeight; | ||
|  |     this.fontVariant = fontVariant || inheritFont.fontVariant; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](Font, [{ | ||
|  |     key: "toString", | ||
|  |     value: function toString() { | ||
|  |       return [prepareFontStyle(this.fontStyle), this.fontVariant, prepareFontWeight(this.fontWeight), this.fontSize, // Wrap fontFamily only on nodejs and only for canvas.ctx
 | ||
|  |       prepareFontFamily(this.fontFamily)].join(' ').trim(); | ||
|  |     } | ||
|  |   }], [{ | ||
|  |     key: "parse", | ||
|  |     value: function parse() { | ||
|  |       var font = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : ''; | ||
|  |       var inherit = arguments.length > 1 ? arguments[1] : undefined; | ||
|  |       var fontStyle = ''; | ||
|  |       var fontVariant = ''; | ||
|  |       var fontWeight = ''; | ||
|  |       var fontSize = ''; | ||
|  |       var fontFamily = ''; | ||
|  |       var parts = compressSpaces(font).trim().split(' '); | ||
|  |       var set = { | ||
|  |         fontSize: false, | ||
|  |         fontStyle: false, | ||
|  |         fontWeight: false, | ||
|  |         fontVariant: false | ||
|  |       }; | ||
|  |       parts.forEach(function (part) { | ||
|  |         switch (true) { | ||
|  |           case !set.fontStyle && Font.styles.includes(part): | ||
|  |             if (part !== 'inherit') { | ||
|  |               fontStyle = part; | ||
|  |             } | ||
|  | 
 | ||
|  |             set.fontStyle = true; | ||
|  |             break; | ||
|  | 
 | ||
|  |           case !set.fontVariant && Font.variants.includes(part): | ||
|  |             if (part !== 'inherit') { | ||
|  |               fontVariant = part; | ||
|  |             } | ||
|  | 
 | ||
|  |             set.fontStyle = true; | ||
|  |             set.fontVariant = true; | ||
|  |             break; | ||
|  | 
 | ||
|  |           case !set.fontWeight && Font.weights.includes(part): | ||
|  |             if (part !== 'inherit') { | ||
|  |               fontWeight = part; | ||
|  |             } | ||
|  | 
 | ||
|  |             set.fontStyle = true; | ||
|  |             set.fontVariant = true; | ||
|  |             set.fontWeight = true; | ||
|  |             break; | ||
|  | 
 | ||
|  |           case !set.fontSize: | ||
|  |             if (part !== 'inherit') { | ||
|  |               var _part$split = part.split('/'); | ||
|  | 
 | ||
|  |               var _part$split2 = _slicedToArray__default['default'](_part$split, 1); | ||
|  | 
 | ||
|  |               fontSize = _part$split2[0]; | ||
|  |             } | ||
|  | 
 | ||
|  |             set.fontStyle = true; | ||
|  |             set.fontVariant = true; | ||
|  |             set.fontWeight = true; | ||
|  |             set.fontSize = true; | ||
|  |             break; | ||
|  | 
 | ||
|  |           default: | ||
|  |             if (part !== 'inherit') { | ||
|  |               fontFamily += part; | ||
|  |             } | ||
|  | 
 | ||
|  |         } | ||
|  |       }); | ||
|  |       return new Font(fontStyle, fontVariant, fontWeight, fontSize, fontFamily, inherit); | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return Font; | ||
|  | }(); | ||
|  | Font.styles = 'normal|italic|oblique|inherit'; | ||
|  | Font.variants = 'normal|small-caps|inherit'; | ||
|  | Font.weights = 'normal|bold|bolder|lighter|100|200|300|400|500|600|700|800|900|inherit'; | ||
|  | 
 | ||
|  | var BoundingBox = /*#__PURE__*/function () { | ||
|  |   function BoundingBox() { | ||
|  |     var x1 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : Number.NaN; | ||
|  |     var y1 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : Number.NaN; | ||
|  |     var x2 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : Number.NaN; | ||
|  |     var y2 = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : Number.NaN; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, BoundingBox); | ||
|  | 
 | ||
|  |     this.x1 = x1; | ||
|  |     this.y1 = y1; | ||
|  |     this.x2 = x2; | ||
|  |     this.y2 = y2; | ||
|  |     this.addPoint(x1, y1); | ||
|  |     this.addPoint(x2, y2); | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](BoundingBox, [{ | ||
|  |     key: "addPoint", | ||
|  |     value: function addPoint(x, y) { | ||
|  |       if (typeof x !== 'undefined') { | ||
|  |         if (isNaN(this.x1) || isNaN(this.x2)) { | ||
|  |           this.x1 = x; | ||
|  |           this.x2 = x; | ||
|  |         } | ||
|  | 
 | ||
|  |         if (x < this.x1) { | ||
|  |           this.x1 = x; | ||
|  |         } | ||
|  | 
 | ||
|  |         if (x > this.x2) { | ||
|  |           this.x2 = x; | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       if (typeof y !== 'undefined') { | ||
|  |         if (isNaN(this.y1) || isNaN(this.y2)) { | ||
|  |           this.y1 = y; | ||
|  |           this.y2 = y; | ||
|  |         } | ||
|  | 
 | ||
|  |         if (y < this.y1) { | ||
|  |           this.y1 = y; | ||
|  |         } | ||
|  | 
 | ||
|  |         if (y > this.y2) { | ||
|  |           this.y2 = y; | ||
|  |         } | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "addX", | ||
|  |     value: function addX(x) { | ||
|  |       this.addPoint(x, null); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "addY", | ||
|  |     value: function addY(y) { | ||
|  |       this.addPoint(null, y); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "addBoundingBox", | ||
|  |     value: function addBoundingBox(boundingBox) { | ||
|  |       if (!boundingBox) { | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       var x1 = boundingBox.x1, | ||
|  |           y1 = boundingBox.y1, | ||
|  |           x2 = boundingBox.x2, | ||
|  |           y2 = boundingBox.y2; | ||
|  |       this.addPoint(x1, y1); | ||
|  |       this.addPoint(x2, y2); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "sumCubic", | ||
|  |     value: function sumCubic(t, p0, p1, p2, p3) { | ||
|  |       return Math.pow(1 - t, 3) * p0 + 3 * Math.pow(1 - t, 2) * t * p1 + 3 * (1 - t) * Math.pow(t, 2) * p2 + Math.pow(t, 3) * p3; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "bezierCurveAdd", | ||
|  |     value: function bezierCurveAdd(forX, p0, p1, p2, p3) { | ||
|  |       var b = 6 * p0 - 12 * p1 + 6 * p2; | ||
|  |       var a = -3 * p0 + 9 * p1 - 9 * p2 + 3 * p3; | ||
|  |       var c = 3 * p1 - 3 * p0; | ||
|  | 
 | ||
|  |       if (a === 0) { | ||
|  |         if (b === 0) { | ||
|  |           return; | ||
|  |         } | ||
|  | 
 | ||
|  |         var t = -c / b; | ||
|  | 
 | ||
|  |         if (0 < t && t < 1) { | ||
|  |           if (forX) { | ||
|  |             this.addX(this.sumCubic(t, p0, p1, p2, p3)); | ||
|  |           } else { | ||
|  |             this.addY(this.sumCubic(t, p0, p1, p2, p3)); | ||
|  |           } | ||
|  |         } | ||
|  | 
 | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       var b2ac = Math.pow(b, 2) - 4 * c * a; | ||
|  | 
 | ||
|  |       if (b2ac < 0) { | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       var t1 = (-b + Math.sqrt(b2ac)) / (2 * a); | ||
|  | 
 | ||
|  |       if (0 < t1 && t1 < 1) { | ||
|  |         if (forX) { | ||
|  |           this.addX(this.sumCubic(t1, p0, p1, p2, p3)); | ||
|  |         } else { | ||
|  |           this.addY(this.sumCubic(t1, p0, p1, p2, p3)); | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       var t2 = (-b - Math.sqrt(b2ac)) / (2 * a); | ||
|  | 
 | ||
|  |       if (0 < t2 && t2 < 1) { | ||
|  |         if (forX) { | ||
|  |           this.addX(this.sumCubic(t2, p0, p1, p2, p3)); | ||
|  |         } else { | ||
|  |           this.addY(this.sumCubic(t2, p0, p1, p2, p3)); | ||
|  |         } | ||
|  |       } | ||
|  |     } // from http://blog.hackers-cafe.net/2009/06/how-to-calculate-bezier-curves-bounding.html
 | ||
|  | 
 | ||
|  |   }, { | ||
|  |     key: "addBezierCurve", | ||
|  |     value: function addBezierCurve(p0x, p0y, p1x, p1y, p2x, p2y, p3x, p3y) { | ||
|  |       this.addPoint(p0x, p0y); | ||
|  |       this.addPoint(p3x, p3y); | ||
|  |       this.bezierCurveAdd(true, p0x, p1x, p2x, p3x); | ||
|  |       this.bezierCurveAdd(false, p0y, p1y, p2y, p3y); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "addQuadraticCurve", | ||
|  |     value: function addQuadraticCurve(p0x, p0y, p1x, p1y, p2x, p2y) { | ||
|  |       var cp1x = p0x + 2 / 3 * (p1x - p0x); // CP1 = QP0 + 2/3 *(QP1-QP0)
 | ||
|  | 
 | ||
|  |       var cp1y = p0y + 2 / 3 * (p1y - p0y); // CP1 = QP0 + 2/3 *(QP1-QP0)
 | ||
|  | 
 | ||
|  |       var cp2x = cp1x + 1 / 3 * (p2x - p0x); // CP2 = CP1 + 1/3 *(QP2-QP0)
 | ||
|  | 
 | ||
|  |       var cp2y = cp1y + 1 / 3 * (p2y - p0y); // CP2 = CP1 + 1/3 *(QP2-QP0)
 | ||
|  | 
 | ||
|  |       this.addBezierCurve(p0x, p0y, cp1x, cp2x, cp1y, cp2y, p2x, p2y); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "isPointInBox", | ||
|  |     value: function isPointInBox(x, y) { | ||
|  |       var x1 = this.x1, | ||
|  |           y1 = this.y1, | ||
|  |           x2 = this.x2, | ||
|  |           y2 = this.y2; | ||
|  |       return x1 <= x && x <= x2 && y1 <= y && y <= y2; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "x", | ||
|  |     get: function get() { | ||
|  |       return this.x1; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "y", | ||
|  |     get: function get() { | ||
|  |       return this.y1; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "width", | ||
|  |     get: function get() { | ||
|  |       return this.x2 - this.x1; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "height", | ||
|  |     get: function get() { | ||
|  |       return this.y2 - this.y1; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return BoundingBox; | ||
|  | }(); | ||
|  | 
 | ||
|  | function _createSuper$I(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$I(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$I() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var PathParser = /*#__PURE__*/function (_SVGPathData) { | ||
|  |   _inherits__default['default'](PathParser, _SVGPathData); | ||
|  | 
 | ||
|  |   var _super = _createSuper$I(PathParser); | ||
|  | 
 | ||
|  |   function PathParser(path) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, PathParser); | ||
|  | 
 | ||
|  |     _this = _super.call(this, path // Fix spaces after signs.
 | ||
|  |     .replace(/([+\-.])\s+/gm, '$1') // Remove invalid part.
 | ||
|  |     .replace(/[^MmZzLlHhVvCcSsQqTtAae\d\s.,+-].*/g, '')); | ||
|  |     _this.control = null; | ||
|  |     _this.start = null; | ||
|  |     _this.current = null; | ||
|  |     _this.command = null; | ||
|  |     _this.commands = _this.commands; | ||
|  |     _this.i = -1; | ||
|  |     _this.previousCommand = null; | ||
|  |     _this.points = []; | ||
|  |     _this.angles = []; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](PathParser, [{ | ||
|  |     key: "reset", | ||
|  |     value: function reset() { | ||
|  |       this.i = -1; | ||
|  |       this.command = null; | ||
|  |       this.previousCommand = null; | ||
|  |       this.start = new Point(0, 0); | ||
|  |       this.control = new Point(0, 0); | ||
|  |       this.current = new Point(0, 0); | ||
|  |       this.points = []; | ||
|  |       this.angles = []; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "isEnd", | ||
|  |     value: function isEnd() { | ||
|  |       var i = this.i, | ||
|  |           commands = this.commands; | ||
|  |       return i >= commands.length - 1; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "next", | ||
|  |     value: function next() { | ||
|  |       var command = this.commands[++this.i]; | ||
|  |       this.previousCommand = this.command; | ||
|  |       this.command = command; | ||
|  |       return command; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getPoint", | ||
|  |     value: function getPoint() { | ||
|  |       var xProp = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'x'; | ||
|  |       var yProp = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'y'; | ||
|  |       var point = new Point(this.command[xProp], this.command[yProp]); | ||
|  |       return this.makeAbsolute(point); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getAsControlPoint", | ||
|  |     value: function getAsControlPoint(xProp, yProp) { | ||
|  |       var point = this.getPoint(xProp, yProp); | ||
|  |       this.control = point; | ||
|  |       return point; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getAsCurrentPoint", | ||
|  |     value: function getAsCurrentPoint(xProp, yProp) { | ||
|  |       var point = this.getPoint(xProp, yProp); | ||
|  |       this.current = point; | ||
|  |       return point; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getReflectedControlPoint", | ||
|  |     value: function getReflectedControlPoint() { | ||
|  |       var previousCommand = this.previousCommand.type; | ||
|  | 
 | ||
|  |       if (previousCommand !== svgPathdata.SVGPathData.CURVE_TO && previousCommand !== svgPathdata.SVGPathData.SMOOTH_CURVE_TO && previousCommand !== svgPathdata.SVGPathData.QUAD_TO && previousCommand !== svgPathdata.SVGPathData.SMOOTH_QUAD_TO) { | ||
|  |         return this.current; | ||
|  |       } // reflect point
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       var _this$current = this.current, | ||
|  |           cx = _this$current.x, | ||
|  |           cy = _this$current.y, | ||
|  |           _this$control = this.control, | ||
|  |           ox = _this$control.x, | ||
|  |           oy = _this$control.y; | ||
|  |       var point = new Point(2 * cx - ox, 2 * cy - oy); | ||
|  |       return point; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "makeAbsolute", | ||
|  |     value: function makeAbsolute(point) { | ||
|  |       if (this.command.relative) { | ||
|  |         var _this$current2 = this.current, | ||
|  |             x = _this$current2.x, | ||
|  |             y = _this$current2.y; | ||
|  |         point.x += x; | ||
|  |         point.y += y; | ||
|  |       } | ||
|  | 
 | ||
|  |       return point; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "addMarker", | ||
|  |     value: function addMarker(point, from, priorTo) { | ||
|  |       var points = this.points, | ||
|  |           angles = this.angles; // if the last angle isn't filled in because we didn't have this point yet ...
 | ||
|  | 
 | ||
|  |       if (priorTo && angles.length > 0 && !angles[angles.length - 1]) { | ||
|  |         angles[angles.length - 1] = points[points.length - 1].angleTo(priorTo); | ||
|  |       } | ||
|  | 
 | ||
|  |       this.addMarkerAngle(point, from ? from.angleTo(point) : null); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "addMarkerAngle", | ||
|  |     value: function addMarkerAngle(point, angle) { | ||
|  |       this.points.push(point); | ||
|  |       this.angles.push(angle); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getMarkerPoints", | ||
|  |     value: function getMarkerPoints() { | ||
|  |       return this.points; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getMarkerAngles", | ||
|  |     value: function getMarkerAngles() { | ||
|  |       var angles = this.angles; | ||
|  |       var len = angles.length; | ||
|  | 
 | ||
|  |       for (var i = 0; i < len; i++) { | ||
|  |         if (!angles[i]) { | ||
|  |           for (var j = i + 1; j < len; j++) { | ||
|  |             if (angles[j]) { | ||
|  |               angles[i] = angles[j]; | ||
|  |               break; | ||
|  |             } | ||
|  |           } | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       return angles; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return PathParser; | ||
|  | }(svgPathdata.SVGPathData); | ||
|  | 
 | ||
|  | function _createSuper$H(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$H(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$H() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var RenderedElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](RenderedElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$H(RenderedElement); | ||
|  | 
 | ||
|  |   function RenderedElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, RenderedElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.modifiedEmSizeStack = false; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](RenderedElement, [{ | ||
|  |     key: "calculateOpacity", | ||
|  |     value: function calculateOpacity() { | ||
|  |       var opacity = 1.0; // eslint-disable-next-line @typescript-eslint/no-this-alias, consistent-this
 | ||
|  | 
 | ||
|  |       var element = this; | ||
|  | 
 | ||
|  |       while (element) { | ||
|  |         var opacityStyle = element.getStyle('opacity', false, true); // no ancestors on style call
 | ||
|  | 
 | ||
|  |         if (opacityStyle.hasValue(true)) { | ||
|  |           opacity *= opacityStyle.getNumber(); | ||
|  |         } | ||
|  | 
 | ||
|  |         element = element.parent; | ||
|  |       } | ||
|  | 
 | ||
|  |       return opacity; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "setContext", | ||
|  |     value: function setContext(ctx) { | ||
|  |       var fromMeasure = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; | ||
|  | 
 | ||
|  |       if (!fromMeasure) { | ||
|  |         // causes stack overflow when measuring text with gradients
 | ||
|  |         // fill
 | ||
|  |         var fillStyleProp = this.getStyle('fill'); | ||
|  |         var fillOpacityStyleProp = this.getStyle('fill-opacity'); | ||
|  |         var strokeStyleProp = this.getStyle('stroke'); | ||
|  |         var strokeOpacityProp = this.getStyle('stroke-opacity'); | ||
|  | 
 | ||
|  |         if (fillStyleProp.isUrlDefinition()) { | ||
|  |           var fillStyle = fillStyleProp.getFillStyleDefinition(this, fillOpacityStyleProp); | ||
|  | 
 | ||
|  |           if (fillStyle) { | ||
|  |             ctx.fillStyle = fillStyle; | ||
|  |           } | ||
|  |         } else if (fillStyleProp.hasValue()) { | ||
|  |           if (fillStyleProp.getString() === 'currentColor') { | ||
|  |             fillStyleProp.setValue(this.getStyle('color').getColor()); | ||
|  |           } | ||
|  | 
 | ||
|  |           var _fillStyle = fillStyleProp.getColor(); | ||
|  | 
 | ||
|  |           if (_fillStyle !== 'inherit') { | ||
|  |             ctx.fillStyle = _fillStyle === 'none' ? 'rgba(0,0,0,0)' : _fillStyle; | ||
|  |           } | ||
|  |         } | ||
|  | 
 | ||
|  |         if (fillOpacityStyleProp.hasValue()) { | ||
|  |           var _fillStyle2 = new Property(this.document, 'fill', ctx.fillStyle).addOpacity(fillOpacityStyleProp).getColor(); | ||
|  | 
 | ||
|  |           ctx.fillStyle = _fillStyle2; | ||
|  |         } // stroke
 | ||
|  | 
 | ||
|  | 
 | ||
|  |         if (strokeStyleProp.isUrlDefinition()) { | ||
|  |           var strokeStyle = strokeStyleProp.getFillStyleDefinition(this, strokeOpacityProp); | ||
|  | 
 | ||
|  |           if (strokeStyle) { | ||
|  |             ctx.strokeStyle = strokeStyle; | ||
|  |           } | ||
|  |         } else if (strokeStyleProp.hasValue()) { | ||
|  |           if (strokeStyleProp.getString() === 'currentColor') { | ||
|  |             strokeStyleProp.setValue(this.getStyle('color').getColor()); | ||
|  |           } | ||
|  | 
 | ||
|  |           var _strokeStyle = strokeStyleProp.getString(); | ||
|  | 
 | ||
|  |           if (_strokeStyle !== 'inherit') { | ||
|  |             ctx.strokeStyle = _strokeStyle === 'none' ? 'rgba(0,0,0,0)' : _strokeStyle; | ||
|  |           } | ||
|  |         } | ||
|  | 
 | ||
|  |         if (strokeOpacityProp.hasValue()) { | ||
|  |           var _strokeStyle2 = new Property(this.document, 'stroke', ctx.strokeStyle).addOpacity(strokeOpacityProp).getString(); | ||
|  | 
 | ||
|  |           ctx.strokeStyle = _strokeStyle2; | ||
|  |         } | ||
|  | 
 | ||
|  |         var strokeWidthStyleProp = this.getStyle('stroke-width'); | ||
|  | 
 | ||
|  |         if (strokeWidthStyleProp.hasValue()) { | ||
|  |           var newLineWidth = strokeWidthStyleProp.getPixels(); | ||
|  |           ctx.lineWidth = !newLineWidth ? PSEUDO_ZERO // browsers don't respect 0 (or node-canvas? :-)
 | ||
|  |           : newLineWidth; | ||
|  |         } | ||
|  | 
 | ||
|  |         var strokeLinecapStyleProp = this.getStyle('stroke-linecap'); | ||
|  |         var strokeLinejoinStyleProp = this.getStyle('stroke-linejoin'); | ||
|  |         var strokeMiterlimitProp = this.getStyle('stroke-miterlimit'); // NEED TEST
 | ||
|  |         // const pointOrderStyleProp = this.getStyle('paint-order');
 | ||
|  | 
 | ||
|  |         var strokeDasharrayStyleProp = this.getStyle('stroke-dasharray'); | ||
|  |         var strokeDashoffsetProp = this.getStyle('stroke-dashoffset'); | ||
|  | 
 | ||
|  |         if (strokeLinecapStyleProp.hasValue()) { | ||
|  |           ctx.lineCap = strokeLinecapStyleProp.getString(); | ||
|  |         } | ||
|  | 
 | ||
|  |         if (strokeLinejoinStyleProp.hasValue()) { | ||
|  |           ctx.lineJoin = strokeLinejoinStyleProp.getString(); | ||
|  |         } | ||
|  | 
 | ||
|  |         if (strokeMiterlimitProp.hasValue()) { | ||
|  |           ctx.miterLimit = strokeMiterlimitProp.getNumber(); | ||
|  |         } // NEED TEST
 | ||
|  |         // if (pointOrderStyleProp.hasValue()) {
 | ||
|  |         // 	// ?
 | ||
|  |         // 	ctx.paintOrder = pointOrderStyleProp.getValue();
 | ||
|  |         // }
 | ||
|  | 
 | ||
|  | 
 | ||
|  |         if (strokeDasharrayStyleProp.hasValue() && strokeDasharrayStyleProp.getString() !== 'none') { | ||
|  |           var gaps = toNumbers(strokeDasharrayStyleProp.getString()); | ||
|  | 
 | ||
|  |           if (typeof ctx.setLineDash !== 'undefined') { | ||
|  |             ctx.setLineDash(gaps); | ||
|  |           } else // @ts-expect-error Handle browser prefix.
 | ||
|  |             if (typeof ctx.webkitLineDash !== 'undefined') { | ||
|  |               // @ts-expect-error Handle browser prefix.
 | ||
|  |               ctx.webkitLineDash = gaps; | ||
|  |             } else // @ts-expect-error Handle browser prefix.
 | ||
|  |               if (typeof ctx.mozDash !== 'undefined' && !(gaps.length === 1 && gaps[0] === 0)) { | ||
|  |                 // @ts-expect-error Handle browser prefix.
 | ||
|  |                 ctx.mozDash = gaps; | ||
|  |               } | ||
|  | 
 | ||
|  |           var offset = strokeDashoffsetProp.getPixels(); | ||
|  | 
 | ||
|  |           if (typeof ctx.lineDashOffset !== 'undefined') { | ||
|  |             ctx.lineDashOffset = offset; | ||
|  |           } else // @ts-expect-error Handle browser prefix.
 | ||
|  |             if (typeof ctx.webkitLineDashOffset !== 'undefined') { | ||
|  |               // @ts-expect-error Handle browser prefix.
 | ||
|  |               ctx.webkitLineDashOffset = offset; | ||
|  |             } else // @ts-expect-error Handle browser prefix.
 | ||
|  |               if (typeof ctx.mozDashOffset !== 'undefined') { | ||
|  |                 // @ts-expect-error Handle browser prefix.
 | ||
|  |                 ctx.mozDashOffset = offset; | ||
|  |               } | ||
|  |         } | ||
|  |       } // font
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       this.modifiedEmSizeStack = false; | ||
|  | 
 | ||
|  |       if (typeof ctx.font !== 'undefined') { | ||
|  |         var fontStyleProp = this.getStyle('font'); | ||
|  |         var fontStyleStyleProp = this.getStyle('font-style'); | ||
|  |         var fontVariantStyleProp = this.getStyle('font-variant'); | ||
|  |         var fontWeightStyleProp = this.getStyle('font-weight'); | ||
|  |         var fontSizeStyleProp = this.getStyle('font-size'); | ||
|  |         var fontFamilyStyleProp = this.getStyle('font-family'); | ||
|  |         var font = new Font(fontStyleStyleProp.getString(), fontVariantStyleProp.getString(), fontWeightStyleProp.getString(), fontSizeStyleProp.hasValue() ? "".concat(fontSizeStyleProp.getPixels(true), "px") : '', fontFamilyStyleProp.getString(), Font.parse(fontStyleProp.getString(), ctx.font)); | ||
|  |         fontStyleStyleProp.setValue(font.fontStyle); | ||
|  |         fontVariantStyleProp.setValue(font.fontVariant); | ||
|  |         fontWeightStyleProp.setValue(font.fontWeight); | ||
|  |         fontSizeStyleProp.setValue(font.fontSize); | ||
|  |         fontFamilyStyleProp.setValue(font.fontFamily); | ||
|  |         ctx.font = font.toString(); | ||
|  | 
 | ||
|  |         if (fontSizeStyleProp.isPixels()) { | ||
|  |           this.document.emSize = fontSizeStyleProp.getPixels(); | ||
|  |           this.modifiedEmSizeStack = true; | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       if (!fromMeasure) { | ||
|  |         // effects
 | ||
|  |         this.applyEffects(ctx); // opacity
 | ||
|  | 
 | ||
|  |         ctx.globalAlpha = this.calculateOpacity(); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "clearContext", | ||
|  |     value: function clearContext(ctx) { | ||
|  |       _get__default['default'](_getPrototypeOf__default['default'](RenderedElement.prototype), "clearContext", this).call(this, ctx); | ||
|  | 
 | ||
|  |       if (this.modifiedEmSizeStack) { | ||
|  |         this.document.popEmSize(); | ||
|  |       } | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return RenderedElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function _createSuper$G(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$G(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$G() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var PathElement = /*#__PURE__*/function (_RenderedElement) { | ||
|  |   _inherits__default['default'](PathElement, _RenderedElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$G(PathElement); | ||
|  | 
 | ||
|  |   function PathElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, PathElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.type = 'path'; | ||
|  |     _this.pathParser = null; | ||
|  |     _this.pathParser = new PathParser(_this.getAttribute('d').getString()); | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](PathElement, [{ | ||
|  |     key: "path", | ||
|  |     value: function path(ctx) { | ||
|  |       var pathParser = this.pathParser; | ||
|  |       var boundingBox = new BoundingBox(); | ||
|  |       pathParser.reset(); | ||
|  | 
 | ||
|  |       if (ctx) { | ||
|  |         ctx.beginPath(); | ||
|  |       } | ||
|  | 
 | ||
|  |       while (!pathParser.isEnd()) { | ||
|  |         switch (pathParser.next().type) { | ||
|  |           case PathParser.MOVE_TO: | ||
|  |             this.pathM(ctx, boundingBox); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.LINE_TO: | ||
|  |             this.pathL(ctx, boundingBox); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.HORIZ_LINE_TO: | ||
|  |             this.pathH(ctx, boundingBox); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.VERT_LINE_TO: | ||
|  |             this.pathV(ctx, boundingBox); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.CURVE_TO: | ||
|  |             this.pathC(ctx, boundingBox); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.SMOOTH_CURVE_TO: | ||
|  |             this.pathS(ctx, boundingBox); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.QUAD_TO: | ||
|  |             this.pathQ(ctx, boundingBox); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.SMOOTH_QUAD_TO: | ||
|  |             this.pathT(ctx, boundingBox); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.ARC: | ||
|  |             this.pathA(ctx, boundingBox); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.CLOSE_PATH: | ||
|  |             this.pathZ(ctx, boundingBox); | ||
|  |             break; | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       return boundingBox; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getBoundingBox", | ||
|  |     value: function getBoundingBox(_) { | ||
|  |       return this.path(); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getMarkers", | ||
|  |     value: function getMarkers() { | ||
|  |       var pathParser = this.pathParser; | ||
|  |       var points = pathParser.getMarkerPoints(); | ||
|  |       var angles = pathParser.getMarkerAngles(); | ||
|  |       var markers = points.map(function (point, i) { | ||
|  |         return [point, angles[i]]; | ||
|  |       }); | ||
|  |       return markers; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "renderChildren", | ||
|  |     value: function renderChildren(ctx) { | ||
|  |       this.path(ctx); | ||
|  |       this.document.screen.mouse.checkPath(this, ctx); | ||
|  |       var fillRuleStyleProp = this.getStyle('fill-rule'); | ||
|  | 
 | ||
|  |       if (ctx.fillStyle !== '') { | ||
|  |         if (fillRuleStyleProp.getString('inherit') !== 'inherit') { | ||
|  |           ctx.fill(fillRuleStyleProp.getString()); | ||
|  |         } else { | ||
|  |           ctx.fill(); | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       if (ctx.strokeStyle !== '') { | ||
|  |         if (this.getAttribute('vector-effect').getString() === 'non-scaling-stroke') { | ||
|  |           ctx.save(); | ||
|  |           ctx.setTransform(1, 0, 0, 1, 0, 0); | ||
|  |           ctx.stroke(); | ||
|  |           ctx.restore(); | ||
|  |         } else { | ||
|  |           ctx.stroke(); | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       var markers = this.getMarkers(); | ||
|  | 
 | ||
|  |       if (markers) { | ||
|  |         var markersLastIndex = markers.length - 1; | ||
|  |         var markerStartStyleProp = this.getStyle('marker-start'); | ||
|  |         var markerMidStyleProp = this.getStyle('marker-mid'); | ||
|  |         var markerEndStyleProp = this.getStyle('marker-end'); | ||
|  | 
 | ||
|  |         if (markerStartStyleProp.isUrlDefinition()) { | ||
|  |           var marker = markerStartStyleProp.getDefinition(); | ||
|  | 
 | ||
|  |           var _markers$ = _slicedToArray__default['default'](markers[0], 2), | ||
|  |               point = _markers$[0], | ||
|  |               angle = _markers$[1]; | ||
|  | 
 | ||
|  |           marker.render(ctx, point, angle); | ||
|  |         } | ||
|  | 
 | ||
|  |         if (markerMidStyleProp.isUrlDefinition()) { | ||
|  |           var _marker = markerMidStyleProp.getDefinition(); | ||
|  | 
 | ||
|  |           for (var i = 1; i < markersLastIndex; i++) { | ||
|  |             var _markers$i = _slicedToArray__default['default'](markers[i], 2), | ||
|  |                 _point = _markers$i[0], | ||
|  |                 _angle = _markers$i[1]; | ||
|  | 
 | ||
|  |             _marker.render(ctx, _point, _angle); | ||
|  |           } | ||
|  |         } | ||
|  | 
 | ||
|  |         if (markerEndStyleProp.isUrlDefinition()) { | ||
|  |           var _marker2 = markerEndStyleProp.getDefinition(); | ||
|  | 
 | ||
|  |           var _markers$markersLastI = _slicedToArray__default['default'](markers[markersLastIndex], 2), | ||
|  |               _point2 = _markers$markersLastI[0], | ||
|  |               _angle2 = _markers$markersLastI[1]; | ||
|  | 
 | ||
|  |           _marker2.render(ctx, _point2, _angle2); | ||
|  |         } | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathM", | ||
|  |     value: function pathM(ctx, boundingBox) { | ||
|  |       var pathParser = this.pathParser; | ||
|  | 
 | ||
|  |       var _PathElement$pathM = PathElement.pathM(pathParser), | ||
|  |           point = _PathElement$pathM.point; | ||
|  | 
 | ||
|  |       var x = point.x, | ||
|  |           y = point.y; | ||
|  |       pathParser.addMarker(point); | ||
|  |       boundingBox.addPoint(x, y); | ||
|  | 
 | ||
|  |       if (ctx) { | ||
|  |         ctx.moveTo(x, y); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathL", | ||
|  |     value: function pathL(ctx, boundingBox) { | ||
|  |       var pathParser = this.pathParser; | ||
|  | 
 | ||
|  |       var _PathElement$pathL = PathElement.pathL(pathParser), | ||
|  |           current = _PathElement$pathL.current, | ||
|  |           point = _PathElement$pathL.point; | ||
|  | 
 | ||
|  |       var x = point.x, | ||
|  |           y = point.y; | ||
|  |       pathParser.addMarker(point, current); | ||
|  |       boundingBox.addPoint(x, y); | ||
|  | 
 | ||
|  |       if (ctx) { | ||
|  |         ctx.lineTo(x, y); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathH", | ||
|  |     value: function pathH(ctx, boundingBox) { | ||
|  |       var pathParser = this.pathParser; | ||
|  | 
 | ||
|  |       var _PathElement$pathH = PathElement.pathH(pathParser), | ||
|  |           current = _PathElement$pathH.current, | ||
|  |           point = _PathElement$pathH.point; | ||
|  | 
 | ||
|  |       var x = point.x, | ||
|  |           y = point.y; | ||
|  |       pathParser.addMarker(point, current); | ||
|  |       boundingBox.addPoint(x, y); | ||
|  | 
 | ||
|  |       if (ctx) { | ||
|  |         ctx.lineTo(x, y); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathV", | ||
|  |     value: function pathV(ctx, boundingBox) { | ||
|  |       var pathParser = this.pathParser; | ||
|  | 
 | ||
|  |       var _PathElement$pathV = PathElement.pathV(pathParser), | ||
|  |           current = _PathElement$pathV.current, | ||
|  |           point = _PathElement$pathV.point; | ||
|  | 
 | ||
|  |       var x = point.x, | ||
|  |           y = point.y; | ||
|  |       pathParser.addMarker(point, current); | ||
|  |       boundingBox.addPoint(x, y); | ||
|  | 
 | ||
|  |       if (ctx) { | ||
|  |         ctx.lineTo(x, y); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathC", | ||
|  |     value: function pathC(ctx, boundingBox) { | ||
|  |       var pathParser = this.pathParser; | ||
|  | 
 | ||
|  |       var _PathElement$pathC = PathElement.pathC(pathParser), | ||
|  |           current = _PathElement$pathC.current, | ||
|  |           point = _PathElement$pathC.point, | ||
|  |           controlPoint = _PathElement$pathC.controlPoint, | ||
|  |           currentPoint = _PathElement$pathC.currentPoint; | ||
|  | 
 | ||
|  |       pathParser.addMarker(currentPoint, controlPoint, point); | ||
|  |       boundingBox.addBezierCurve(current.x, current.y, point.x, point.y, controlPoint.x, controlPoint.y, currentPoint.x, currentPoint.y); | ||
|  | 
 | ||
|  |       if (ctx) { | ||
|  |         ctx.bezierCurveTo(point.x, point.y, controlPoint.x, controlPoint.y, currentPoint.x, currentPoint.y); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathS", | ||
|  |     value: function pathS(ctx, boundingBox) { | ||
|  |       var pathParser = this.pathParser; | ||
|  | 
 | ||
|  |       var _PathElement$pathS = PathElement.pathS(pathParser), | ||
|  |           current = _PathElement$pathS.current, | ||
|  |           point = _PathElement$pathS.point, | ||
|  |           controlPoint = _PathElement$pathS.controlPoint, | ||
|  |           currentPoint = _PathElement$pathS.currentPoint; | ||
|  | 
 | ||
|  |       pathParser.addMarker(currentPoint, controlPoint, point); | ||
|  |       boundingBox.addBezierCurve(current.x, current.y, point.x, point.y, controlPoint.x, controlPoint.y, currentPoint.x, currentPoint.y); | ||
|  | 
 | ||
|  |       if (ctx) { | ||
|  |         ctx.bezierCurveTo(point.x, point.y, controlPoint.x, controlPoint.y, currentPoint.x, currentPoint.y); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathQ", | ||
|  |     value: function pathQ(ctx, boundingBox) { | ||
|  |       var pathParser = this.pathParser; | ||
|  | 
 | ||
|  |       var _PathElement$pathQ = PathElement.pathQ(pathParser), | ||
|  |           current = _PathElement$pathQ.current, | ||
|  |           controlPoint = _PathElement$pathQ.controlPoint, | ||
|  |           currentPoint = _PathElement$pathQ.currentPoint; | ||
|  | 
 | ||
|  |       pathParser.addMarker(currentPoint, controlPoint, controlPoint); | ||
|  |       boundingBox.addQuadraticCurve(current.x, current.y, controlPoint.x, controlPoint.y, currentPoint.x, currentPoint.y); | ||
|  | 
 | ||
|  |       if (ctx) { | ||
|  |         ctx.quadraticCurveTo(controlPoint.x, controlPoint.y, currentPoint.x, currentPoint.y); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathT", | ||
|  |     value: function pathT(ctx, boundingBox) { | ||
|  |       var pathParser = this.pathParser; | ||
|  | 
 | ||
|  |       var _PathElement$pathT = PathElement.pathT(pathParser), | ||
|  |           current = _PathElement$pathT.current, | ||
|  |           controlPoint = _PathElement$pathT.controlPoint, | ||
|  |           currentPoint = _PathElement$pathT.currentPoint; | ||
|  | 
 | ||
|  |       pathParser.addMarker(currentPoint, controlPoint, controlPoint); | ||
|  |       boundingBox.addQuadraticCurve(current.x, current.y, controlPoint.x, controlPoint.y, currentPoint.x, currentPoint.y); | ||
|  | 
 | ||
|  |       if (ctx) { | ||
|  |         ctx.quadraticCurveTo(controlPoint.x, controlPoint.y, currentPoint.x, currentPoint.y); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathA", | ||
|  |     value: function pathA(ctx, boundingBox) { | ||
|  |       var pathParser = this.pathParser; | ||
|  | 
 | ||
|  |       var _PathElement$pathA = PathElement.pathA(pathParser), | ||
|  |           currentPoint = _PathElement$pathA.currentPoint, | ||
|  |           rX = _PathElement$pathA.rX, | ||
|  |           rY = _PathElement$pathA.rY, | ||
|  |           sweepFlag = _PathElement$pathA.sweepFlag, | ||
|  |           xAxisRotation = _PathElement$pathA.xAxisRotation, | ||
|  |           centp = _PathElement$pathA.centp, | ||
|  |           a1 = _PathElement$pathA.a1, | ||
|  |           ad = _PathElement$pathA.ad; // for markers
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       var dir = 1 - sweepFlag ? 1.0 : -1.0; | ||
|  |       var ah = a1 + dir * (ad / 2.0); | ||
|  |       var halfWay = new Point(centp.x + rX * Math.cos(ah), centp.y + rY * Math.sin(ah)); | ||
|  |       pathParser.addMarkerAngle(halfWay, ah - dir * Math.PI / 2); | ||
|  |       pathParser.addMarkerAngle(currentPoint, ah - dir * Math.PI); | ||
|  |       boundingBox.addPoint(currentPoint.x, currentPoint.y); // TODO: this is too naive, make it better
 | ||
|  | 
 | ||
|  |       if (ctx && !isNaN(a1) && !isNaN(ad)) { | ||
|  |         var r = rX > rY ? rX : rY; | ||
|  |         var sx = rX > rY ? 1 : rX / rY; | ||
|  |         var sy = rX > rY ? rY / rX : 1; | ||
|  |         ctx.translate(centp.x, centp.y); | ||
|  |         ctx.rotate(xAxisRotation); | ||
|  |         ctx.scale(sx, sy); | ||
|  |         ctx.arc(0, 0, r, a1, a1 + ad, Boolean(1 - sweepFlag)); | ||
|  |         ctx.scale(1 / sx, 1 / sy); | ||
|  |         ctx.rotate(-xAxisRotation); | ||
|  |         ctx.translate(-centp.x, -centp.y); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathZ", | ||
|  |     value: function pathZ(ctx, boundingBox) { | ||
|  |       PathElement.pathZ(this.pathParser); | ||
|  | 
 | ||
|  |       if (ctx) { | ||
|  |         // only close path if it is not a straight line
 | ||
|  |         if (boundingBox.x1 !== boundingBox.x2 && boundingBox.y1 !== boundingBox.y2) { | ||
|  |           ctx.closePath(); | ||
|  |         } | ||
|  |       } | ||
|  |     } | ||
|  |   }], [{ | ||
|  |     key: "pathM", | ||
|  |     value: function pathM(pathParser) { | ||
|  |       var point = pathParser.getAsCurrentPoint(); | ||
|  |       pathParser.start = pathParser.current; | ||
|  |       return { | ||
|  |         point: point | ||
|  |       }; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathL", | ||
|  |     value: function pathL(pathParser) { | ||
|  |       var current = pathParser.current; | ||
|  |       var point = pathParser.getAsCurrentPoint(); | ||
|  |       return { | ||
|  |         current: current, | ||
|  |         point: point | ||
|  |       }; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathH", | ||
|  |     value: function pathH(pathParser) { | ||
|  |       var current = pathParser.current, | ||
|  |           command = pathParser.command; | ||
|  |       var point = new Point((command.relative ? current.x : 0) + command.x, current.y); | ||
|  |       pathParser.current = point; | ||
|  |       return { | ||
|  |         current: current, | ||
|  |         point: point | ||
|  |       }; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathV", | ||
|  |     value: function pathV(pathParser) { | ||
|  |       var current = pathParser.current, | ||
|  |           command = pathParser.command; | ||
|  |       var point = new Point(current.x, (command.relative ? current.y : 0) + command.y); | ||
|  |       pathParser.current = point; | ||
|  |       return { | ||
|  |         current: current, | ||
|  |         point: point | ||
|  |       }; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathC", | ||
|  |     value: function pathC(pathParser) { | ||
|  |       var current = pathParser.current; | ||
|  |       var point = pathParser.getPoint('x1', 'y1'); | ||
|  |       var controlPoint = pathParser.getAsControlPoint('x2', 'y2'); | ||
|  |       var currentPoint = pathParser.getAsCurrentPoint(); | ||
|  |       return { | ||
|  |         current: current, | ||
|  |         point: point, | ||
|  |         controlPoint: controlPoint, | ||
|  |         currentPoint: currentPoint | ||
|  |       }; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathS", | ||
|  |     value: function pathS(pathParser) { | ||
|  |       var current = pathParser.current; | ||
|  |       var point = pathParser.getReflectedControlPoint(); | ||
|  |       var controlPoint = pathParser.getAsControlPoint('x2', 'y2'); | ||
|  |       var currentPoint = pathParser.getAsCurrentPoint(); | ||
|  |       return { | ||
|  |         current: current, | ||
|  |         point: point, | ||
|  |         controlPoint: controlPoint, | ||
|  |         currentPoint: currentPoint | ||
|  |       }; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathQ", | ||
|  |     value: function pathQ(pathParser) { | ||
|  |       var current = pathParser.current; | ||
|  |       var controlPoint = pathParser.getAsControlPoint('x1', 'y1'); | ||
|  |       var currentPoint = pathParser.getAsCurrentPoint(); | ||
|  |       return { | ||
|  |         current: current, | ||
|  |         controlPoint: controlPoint, | ||
|  |         currentPoint: currentPoint | ||
|  |       }; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathT", | ||
|  |     value: function pathT(pathParser) { | ||
|  |       var current = pathParser.current; | ||
|  |       var controlPoint = pathParser.getReflectedControlPoint(); | ||
|  |       pathParser.control = controlPoint; | ||
|  |       var currentPoint = pathParser.getAsCurrentPoint(); | ||
|  |       return { | ||
|  |         current: current, | ||
|  |         controlPoint: controlPoint, | ||
|  |         currentPoint: currentPoint | ||
|  |       }; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathA", | ||
|  |     value: function pathA(pathParser) { | ||
|  |       var current = pathParser.current, | ||
|  |           command = pathParser.command; | ||
|  |       var rX = command.rX, | ||
|  |           rY = command.rY, | ||
|  |           xRot = command.xRot, | ||
|  |           lArcFlag = command.lArcFlag, | ||
|  |           sweepFlag = command.sweepFlag; | ||
|  |       var xAxisRotation = xRot * (Math.PI / 180.0); | ||
|  |       var currentPoint = pathParser.getAsCurrentPoint(); // Conversion from endpoint to center parameterization
 | ||
|  |       // http://www.w3.org/TR/SVG11/implnote.html#ArcImplementationNotes
 | ||
|  |       // x1', y1'
 | ||
|  | 
 | ||
|  |       var currp = new Point(Math.cos(xAxisRotation) * (current.x - currentPoint.x) / 2.0 + Math.sin(xAxisRotation) * (current.y - currentPoint.y) / 2.0, -Math.sin(xAxisRotation) * (current.x - currentPoint.x) / 2.0 + Math.cos(xAxisRotation) * (current.y - currentPoint.y) / 2.0); // adjust radii
 | ||
|  | 
 | ||
|  |       var l = Math.pow(currp.x, 2) / Math.pow(rX, 2) + Math.pow(currp.y, 2) / Math.pow(rY, 2); | ||
|  | 
 | ||
|  |       if (l > 1) { | ||
|  |         rX *= Math.sqrt(l); | ||
|  |         rY *= Math.sqrt(l); | ||
|  |       } // cx', cy'
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       var s = (lArcFlag === sweepFlag ? -1 : 1) * Math.sqrt((Math.pow(rX, 2) * Math.pow(rY, 2) - Math.pow(rX, 2) * Math.pow(currp.y, 2) - Math.pow(rY, 2) * Math.pow(currp.x, 2)) / (Math.pow(rX, 2) * Math.pow(currp.y, 2) + Math.pow(rY, 2) * Math.pow(currp.x, 2))); | ||
|  | 
 | ||
|  |       if (isNaN(s)) { | ||
|  |         s = 0; | ||
|  |       } | ||
|  | 
 | ||
|  |       var cpp = new Point(s * rX * currp.y / rY, s * -rY * currp.x / rX); // cx, cy
 | ||
|  | 
 | ||
|  |       var centp = new Point((current.x + currentPoint.x) / 2.0 + Math.cos(xAxisRotation) * cpp.x - Math.sin(xAxisRotation) * cpp.y, (current.y + currentPoint.y) / 2.0 + Math.sin(xAxisRotation) * cpp.x + Math.cos(xAxisRotation) * cpp.y); // initial angle
 | ||
|  | 
 | ||
|  |       var a1 = vectorsAngle([1, 0], [(currp.x - cpp.x) / rX, (currp.y - cpp.y) / rY]); // θ1
 | ||
|  |       // angle delta
 | ||
|  | 
 | ||
|  |       var u = [(currp.x - cpp.x) / rX, (currp.y - cpp.y) / rY]; | ||
|  |       var v = [(-currp.x - cpp.x) / rX, (-currp.y - cpp.y) / rY]; | ||
|  |       var ad = vectorsAngle(u, v); // Δθ
 | ||
|  | 
 | ||
|  |       if (vectorsRatio(u, v) <= -1) { | ||
|  |         ad = Math.PI; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (vectorsRatio(u, v) >= 1) { | ||
|  |         ad = 0; | ||
|  |       } | ||
|  | 
 | ||
|  |       return { | ||
|  |         currentPoint: currentPoint, | ||
|  |         rX: rX, | ||
|  |         rY: rY, | ||
|  |         sweepFlag: sweepFlag, | ||
|  |         xAxisRotation: xAxisRotation, | ||
|  |         centp: centp, | ||
|  |         a1: a1, | ||
|  |         ad: ad | ||
|  |       }; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathZ", | ||
|  |     value: function pathZ(pathParser) { | ||
|  |       pathParser.current = pathParser.start; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return PathElement; | ||
|  | }(RenderedElement); | ||
|  | 
 | ||
|  | function _createSuper$F(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$F(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$F() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var GlyphElement = /*#__PURE__*/function (_PathElement) { | ||
|  |   _inherits__default['default'](GlyphElement, _PathElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$F(GlyphElement); | ||
|  | 
 | ||
|  |   function GlyphElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, GlyphElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.type = 'glyph'; | ||
|  |     _this.horizAdvX = _this.getAttribute('horiz-adv-x').getNumber(); | ||
|  |     _this.unicode = _this.getAttribute('unicode').getString(); | ||
|  |     _this.arabicForm = _this.getAttribute('arabic-form').getString(); | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   return GlyphElement; | ||
|  | }(PathElement); | ||
|  | 
 | ||
|  | function _createSuper$E(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$E(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$E() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var TextElement = /*#__PURE__*/function (_RenderedElement) { | ||
|  |   _inherits__default['default'](TextElement, _RenderedElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$E(TextElement); | ||
|  | 
 | ||
|  |   function TextElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, TextElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, (this instanceof TextElement ? this.constructor : void 0) === TextElement ? true : captureTextNodes); | ||
|  |     _this.type = 'text'; | ||
|  |     _this.x = 0; | ||
|  |     _this.y = 0; | ||
|  |     _this.measureCache = -1; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](TextElement, [{ | ||
|  |     key: "setContext", | ||
|  |     value: function setContext(ctx) { | ||
|  |       var fromMeasure = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; | ||
|  | 
 | ||
|  |       _get__default['default'](_getPrototypeOf__default['default'](TextElement.prototype), "setContext", this).call(this, ctx, fromMeasure); | ||
|  | 
 | ||
|  |       var textBaseline = this.getStyle('dominant-baseline').getTextBaseline() || this.getStyle('alignment-baseline').getTextBaseline(); | ||
|  | 
 | ||
|  |       if (textBaseline) { | ||
|  |         ctx.textBaseline = textBaseline; | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "initializeCoordinates", | ||
|  |     value: function initializeCoordinates(ctx) { | ||
|  |       this.x = this.getAttribute('x').getPixels('x'); | ||
|  |       this.y = this.getAttribute('y').getPixels('y'); | ||
|  |       var dxAttr = this.getAttribute('dx'); | ||
|  |       var dyAttr = this.getAttribute('dy'); | ||
|  | 
 | ||
|  |       if (dxAttr.hasValue()) { | ||
|  |         this.x += dxAttr.getPixels('x'); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (dyAttr.hasValue()) { | ||
|  |         this.y += dyAttr.getPixels('y'); | ||
|  |       } | ||
|  | 
 | ||
|  |       this.x += this.getAnchorDelta(ctx, this, 0); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getBoundingBox", | ||
|  |     value: function getBoundingBox(ctx) { | ||
|  |       var _this2 = this; | ||
|  | 
 | ||
|  |       if (this.type !== 'text') { | ||
|  |         return this.getTElementBoundingBox(ctx); | ||
|  |       } | ||
|  | 
 | ||
|  |       this.initializeCoordinates(ctx); | ||
|  |       var boundingBox = null; | ||
|  |       this.children.forEach(function (_, i) { | ||
|  |         var childBoundingBox = _this2.getChildBoundingBox(ctx, _this2, _this2, i); | ||
|  | 
 | ||
|  |         if (!boundingBox) { | ||
|  |           boundingBox = childBoundingBox; | ||
|  |         } else { | ||
|  |           boundingBox.addBoundingBox(childBoundingBox); | ||
|  |         } | ||
|  |       }); | ||
|  |       return boundingBox; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getFontSize", | ||
|  |     value: function getFontSize() { | ||
|  |       var document = this.document, | ||
|  |           parent = this.parent; | ||
|  |       var inheritFontSize = Font.parse(document.ctx.font).fontSize; | ||
|  |       var fontSize = parent.getStyle('font-size').getNumber(inheritFontSize); | ||
|  |       return fontSize; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getTElementBoundingBox", | ||
|  |     value: function getTElementBoundingBox(ctx) { | ||
|  |       var fontSize = this.getFontSize(); | ||
|  |       return new BoundingBox(this.x, this.y - fontSize, this.x + this.measureText(ctx), this.y); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getGlyph", | ||
|  |     value: function getGlyph(font, text, i) { | ||
|  |       var char = text[i]; | ||
|  |       var glyph = null; | ||
|  | 
 | ||
|  |       if (font.isArabic) { | ||
|  |         var len = text.length; | ||
|  |         var prevChar = text[i - 1]; | ||
|  |         var nextChar = text[i + 1]; | ||
|  |         var arabicForm = 'isolated'; | ||
|  | 
 | ||
|  |         if ((i === 0 || prevChar === ' ') && i < len - 2 && nextChar !== ' ') { | ||
|  |           arabicForm = 'terminal'; | ||
|  |         } | ||
|  | 
 | ||
|  |         if (i > 0 && prevChar !== ' ' && i < len - 2 && nextChar !== ' ') { | ||
|  |           arabicForm = 'medial'; | ||
|  |         } | ||
|  | 
 | ||
|  |         if (i > 0 && prevChar !== ' ' && (i === len - 1 || nextChar === ' ')) { | ||
|  |           arabicForm = 'initial'; | ||
|  |         } | ||
|  | 
 | ||
|  |         if (typeof font.glyphs[char] !== 'undefined') { | ||
|  |           // NEED TEST
 | ||
|  |           var maybeGlyph = font.glyphs[char]; | ||
|  |           glyph = maybeGlyph instanceof GlyphElement ? maybeGlyph : maybeGlyph[arabicForm]; | ||
|  |         } | ||
|  |       } else { | ||
|  |         glyph = font.glyphs[char]; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (!glyph) { | ||
|  |         glyph = font.missingGlyph; | ||
|  |       } | ||
|  | 
 | ||
|  |       return glyph; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getText", | ||
|  |     value: function getText() { | ||
|  |       return ''; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getTextFromNode", | ||
|  |     value: function getTextFromNode(node) { | ||
|  |       var textNode = node || this.node; | ||
|  |       var childNodes = Array.from(textNode.parentNode.childNodes); | ||
|  |       var index = childNodes.indexOf(textNode); | ||
|  |       var lastIndex = childNodes.length - 1; | ||
|  |       var text = compressSpaces( // textNode.value
 | ||
|  |       // || textNode.text
 | ||
|  |       textNode.textContent || ''); | ||
|  | 
 | ||
|  |       if (index === 0) { | ||
|  |         text = trimLeft(text); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (index === lastIndex) { | ||
|  |         text = trimRight(text); | ||
|  |       } | ||
|  | 
 | ||
|  |       return text; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "renderChildren", | ||
|  |     value: function renderChildren(ctx) { | ||
|  |       var _this3 = this; | ||
|  | 
 | ||
|  |       if (this.type !== 'text') { | ||
|  |         this.renderTElementChildren(ctx); | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       this.initializeCoordinates(ctx); | ||
|  |       this.children.forEach(function (_, i) { | ||
|  |         _this3.renderChild(ctx, _this3, _this3, i); | ||
|  |       }); | ||
|  |       var mouse = this.document.screen.mouse; // Do not calc bounding box if mouse is not working.
 | ||
|  | 
 | ||
|  |       if (mouse.isWorking()) { | ||
|  |         mouse.checkBoundingBox(this, this.getBoundingBox(ctx)); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "renderTElementChildren", | ||
|  |     value: function renderTElementChildren(ctx) { | ||
|  |       var document = this.document, | ||
|  |           parent = this.parent; | ||
|  |       var renderText = this.getText(); | ||
|  |       var customFont = parent.getStyle('font-family').getDefinition(); | ||
|  | 
 | ||
|  |       if (customFont) { | ||
|  |         var unitsPerEm = customFont.fontFace.unitsPerEm; | ||
|  |         var ctxFont = Font.parse(document.ctx.font); | ||
|  |         var fontSize = parent.getStyle('font-size').getNumber(ctxFont.fontSize); | ||
|  |         var fontStyle = parent.getStyle('font-style').getString(ctxFont.fontStyle); | ||
|  |         var scale = fontSize / unitsPerEm; | ||
|  |         var text = customFont.isRTL ? renderText.split('').reverse().join('') : renderText; | ||
|  |         var dx = toNumbers(parent.getAttribute('dx').getString()); | ||
|  |         var len = text.length; | ||
|  | 
 | ||
|  |         for (var i = 0; i < len; i++) { | ||
|  |           var glyph = this.getGlyph(customFont, text, i); | ||
|  |           ctx.translate(this.x, this.y); | ||
|  |           ctx.scale(scale, -scale); | ||
|  |           var lw = ctx.lineWidth; | ||
|  |           ctx.lineWidth = ctx.lineWidth * unitsPerEm / fontSize; | ||
|  | 
 | ||
|  |           if (fontStyle === 'italic') { | ||
|  |             ctx.transform(1, 0, .4, 1, 0, 0); | ||
|  |           } | ||
|  | 
 | ||
|  |           glyph.render(ctx); | ||
|  | 
 | ||
|  |           if (fontStyle === 'italic') { | ||
|  |             ctx.transform(1, 0, -.4, 1, 0, 0); | ||
|  |           } | ||
|  | 
 | ||
|  |           ctx.lineWidth = lw; | ||
|  |           ctx.scale(1 / scale, -1 / scale); | ||
|  |           ctx.translate(-this.x, -this.y); | ||
|  |           this.x += fontSize * (glyph.horizAdvX || customFont.horizAdvX) / unitsPerEm; | ||
|  | 
 | ||
|  |           if (typeof dx[i] !== 'undefined' && !isNaN(dx[i])) { | ||
|  |             this.x += dx[i]; | ||
|  |           } | ||
|  |         } | ||
|  | 
 | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       var x = this.x, | ||
|  |           y = this.y; // NEED TEST
 | ||
|  |       // if (ctx.paintOrder === 'stroke') {
 | ||
|  |       // 	if (ctx.strokeStyle) {
 | ||
|  |       // 		ctx.strokeText(renderText, x, y);
 | ||
|  |       // 	}
 | ||
|  |       // 	if (ctx.fillStyle) {
 | ||
|  |       // 		ctx.fillText(renderText, x, y);
 | ||
|  |       // 	}
 | ||
|  |       // } else {
 | ||
|  | 
 | ||
|  |       if (ctx.fillStyle) { | ||
|  |         ctx.fillText(renderText, x, y); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (ctx.strokeStyle) { | ||
|  |         ctx.strokeText(renderText, x, y); | ||
|  |       } // }
 | ||
|  | 
 | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getAnchorDelta", | ||
|  |     value: function getAnchorDelta(ctx, parent, startI) { | ||
|  |       var textAnchor = this.getStyle('text-anchor').getString('start'); | ||
|  | 
 | ||
|  |       if (textAnchor !== 'start') { | ||
|  |         var children = parent.children; | ||
|  |         var len = children.length; | ||
|  |         var child = null; | ||
|  |         var width = 0; | ||
|  | 
 | ||
|  |         for (var i = startI; i < len; i++) { | ||
|  |           child = children[i]; | ||
|  | 
 | ||
|  |           if (i > startI && child.getAttribute('x').hasValue() || child.getAttribute('text-anchor').hasValue()) { | ||
|  |             break; // new group
 | ||
|  |           } | ||
|  | 
 | ||
|  |           width += child.measureTextRecursive(ctx); | ||
|  |         } | ||
|  | 
 | ||
|  |         return -1 * (textAnchor === 'end' ? width : width / 2.0); | ||
|  |       } | ||
|  | 
 | ||
|  |       return 0; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "adjustChildCoordinates", | ||
|  |     value: function adjustChildCoordinates(ctx, textParent, parent, i) { | ||
|  |       var child = parent.children[i]; | ||
|  | 
 | ||
|  |       if (typeof child.measureText !== 'function') { | ||
|  |         return child; | ||
|  |       } | ||
|  | 
 | ||
|  |       ctx.save(); | ||
|  |       child.setContext(ctx, true); | ||
|  |       var xAttr = child.getAttribute('x'); | ||
|  |       var yAttr = child.getAttribute('y'); | ||
|  |       var dxAttr = child.getAttribute('dx'); | ||
|  |       var dyAttr = child.getAttribute('dy'); | ||
|  |       var textAnchor = child.getAttribute('text-anchor').getString('start'); | ||
|  | 
 | ||
|  |       if (i === 0 && child.type !== 'textNode') { | ||
|  |         if (!xAttr.hasValue()) { | ||
|  |           xAttr.setValue(textParent.getAttribute('x').getValue('0')); | ||
|  |         } | ||
|  | 
 | ||
|  |         if (!yAttr.hasValue()) { | ||
|  |           yAttr.setValue(textParent.getAttribute('y').getValue('0')); | ||
|  |         } | ||
|  | 
 | ||
|  |         if (!dxAttr.hasValue()) { | ||
|  |           dxAttr.setValue(textParent.getAttribute('dx').getValue('0')); | ||
|  |         } | ||
|  | 
 | ||
|  |         if (!dyAttr.hasValue()) { | ||
|  |           dyAttr.setValue(textParent.getAttribute('dy').getValue('0')); | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       if (xAttr.hasValue()) { | ||
|  |         child.x = xAttr.getPixels('x') + textParent.getAnchorDelta(ctx, parent, i); | ||
|  | 
 | ||
|  |         if (textAnchor !== 'start') { | ||
|  |           var width = child.measureTextRecursive(ctx); | ||
|  |           child.x += -1 * (textAnchor === 'end' ? width : width / 2.0); | ||
|  |         } | ||
|  | 
 | ||
|  |         if (dxAttr.hasValue()) { | ||
|  |           child.x += dxAttr.getPixels('x'); | ||
|  |         } | ||
|  |       } else { | ||
|  |         if (textAnchor !== 'start') { | ||
|  |           var _width = child.measureTextRecursive(ctx); | ||
|  | 
 | ||
|  |           textParent.x += -1 * (textAnchor === 'end' ? _width : _width / 2.0); | ||
|  |         } | ||
|  | 
 | ||
|  |         if (dxAttr.hasValue()) { | ||
|  |           textParent.x += dxAttr.getPixels('x'); | ||
|  |         } | ||
|  | 
 | ||
|  |         child.x = textParent.x; | ||
|  |       } | ||
|  | 
 | ||
|  |       textParent.x = child.x + child.measureText(ctx); | ||
|  | 
 | ||
|  |       if (yAttr.hasValue()) { | ||
|  |         child.y = yAttr.getPixels('y'); | ||
|  | 
 | ||
|  |         if (dyAttr.hasValue()) { | ||
|  |           child.y += dyAttr.getPixels('y'); | ||
|  |         } | ||
|  |       } else { | ||
|  |         if (dyAttr.hasValue()) { | ||
|  |           textParent.y += dyAttr.getPixels('y'); | ||
|  |         } | ||
|  | 
 | ||
|  |         child.y = textParent.y; | ||
|  |       } | ||
|  | 
 | ||
|  |       textParent.y = child.y; | ||
|  |       child.clearContext(ctx); | ||
|  |       ctx.restore(); | ||
|  |       return child; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getChildBoundingBox", | ||
|  |     value: function getChildBoundingBox(ctx, textParent, parent, i) { | ||
|  |       var child = this.adjustChildCoordinates(ctx, textParent, parent, i); // not a text node?
 | ||
|  | 
 | ||
|  |       if (typeof child.getBoundingBox !== 'function') { | ||
|  |         return null; | ||
|  |       } | ||
|  | 
 | ||
|  |       var boundingBox = child.getBoundingBox(ctx); | ||
|  | 
 | ||
|  |       if (!boundingBox) { | ||
|  |         return null; | ||
|  |       } | ||
|  | 
 | ||
|  |       child.children.forEach(function (_, i) { | ||
|  |         var childBoundingBox = textParent.getChildBoundingBox(ctx, textParent, child, i); | ||
|  |         boundingBox.addBoundingBox(childBoundingBox); | ||
|  |       }); | ||
|  |       return boundingBox; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "renderChild", | ||
|  |     value: function renderChild(ctx, textParent, parent, i) { | ||
|  |       var child = this.adjustChildCoordinates(ctx, textParent, parent, i); | ||
|  |       child.render(ctx); | ||
|  |       child.children.forEach(function (_, i) { | ||
|  |         textParent.renderChild(ctx, textParent, child, i); | ||
|  |       }); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "measureTextRecursive", | ||
|  |     value: function measureTextRecursive(ctx) { | ||
|  |       var width = this.children.reduce(function (width, child) { | ||
|  |         return width + child.measureTextRecursive(ctx); | ||
|  |       }, this.measureText(ctx)); | ||
|  |       return width; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "measureText", | ||
|  |     value: function measureText(ctx) { | ||
|  |       var measureCache = this.measureCache; | ||
|  | 
 | ||
|  |       if (~measureCache) { | ||
|  |         return measureCache; | ||
|  |       } | ||
|  | 
 | ||
|  |       var renderText = this.getText(); | ||
|  |       var measure = this.measureTargetText(ctx, renderText); | ||
|  |       this.measureCache = measure; | ||
|  |       return measure; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "measureTargetText", | ||
|  |     value: function measureTargetText(ctx, targetText) { | ||
|  |       if (!targetText.length) { | ||
|  |         return 0; | ||
|  |       } | ||
|  | 
 | ||
|  |       var parent = this.parent; | ||
|  |       var customFont = parent.getStyle('font-family').getDefinition(); | ||
|  | 
 | ||
|  |       if (customFont) { | ||
|  |         var fontSize = this.getFontSize(); | ||
|  |         var text = customFont.isRTL ? targetText.split('').reverse().join('') : targetText; | ||
|  |         var dx = toNumbers(parent.getAttribute('dx').getString()); | ||
|  |         var len = text.length; | ||
|  |         var _measure = 0; | ||
|  | 
 | ||
|  |         for (var i = 0; i < len; i++) { | ||
|  |           var glyph = this.getGlyph(customFont, text, i); | ||
|  |           _measure += (glyph.horizAdvX || customFont.horizAdvX) * fontSize / customFont.fontFace.unitsPerEm; | ||
|  | 
 | ||
|  |           if (typeof dx[i] !== 'undefined' && !isNaN(dx[i])) { | ||
|  |             _measure += dx[i]; | ||
|  |           } | ||
|  |         } | ||
|  | 
 | ||
|  |         return _measure; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (!ctx.measureText) { | ||
|  |         return targetText.length * 10; | ||
|  |       } | ||
|  | 
 | ||
|  |       ctx.save(); | ||
|  |       this.setContext(ctx, true); | ||
|  | 
 | ||
|  |       var _ctx$measureText = ctx.measureText(targetText), | ||
|  |           measure = _ctx$measureText.width; | ||
|  | 
 | ||
|  |       this.clearContext(ctx); | ||
|  |       ctx.restore(); | ||
|  |       return measure; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return TextElement; | ||
|  | }(RenderedElement); | ||
|  | 
 | ||
|  | function _createSuper$D(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$D(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$D() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var TSpanElement = /*#__PURE__*/function (_TextElement) { | ||
|  |   _inherits__default['default'](TSpanElement, _TextElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$D(TSpanElement); | ||
|  | 
 | ||
|  |   function TSpanElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, TSpanElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, (this instanceof TSpanElement ? this.constructor : void 0) === TSpanElement ? true : captureTextNodes); | ||
|  |     _this.type = 'tspan'; // if this node has children, then they own the text
 | ||
|  | 
 | ||
|  |     _this.text = _this.children.length > 0 ? '' : _this.getTextFromNode(); | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](TSpanElement, [{ | ||
|  |     key: "getText", | ||
|  |     value: function getText() { | ||
|  |       return this.text; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return TSpanElement; | ||
|  | }(TextElement); | ||
|  | 
 | ||
|  | function _createSuper$C(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$C(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$C() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var TextNode = /*#__PURE__*/function (_TSpanElement) { | ||
|  |   _inherits__default['default'](TextNode, _TSpanElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$C(TextNode); | ||
|  | 
 | ||
|  |   function TextNode() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, TextNode); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'textNode'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   return TextNode; | ||
|  | }(TSpanElement); | ||
|  | 
 | ||
|  | function _createSuper$B(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$B(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$B() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var SVGElement = /*#__PURE__*/function (_RenderedElement) { | ||
|  |   _inherits__default['default'](SVGElement, _RenderedElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$B(SVGElement); | ||
|  | 
 | ||
|  |   function SVGElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, SVGElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'svg'; | ||
|  |     _this.root = false; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](SVGElement, [{ | ||
|  |     key: "setContext", | ||
|  |     value: function setContext(ctx) { | ||
|  |       var _this$node$parentNode; | ||
|  | 
 | ||
|  |       var document = this.document; | ||
|  |       var screen = document.screen, | ||
|  |           window = document.window; | ||
|  |       var canvas = ctx.canvas; | ||
|  |       screen.setDefaults(ctx); | ||
|  | 
 | ||
|  |       if (canvas.style && typeof ctx.font !== 'undefined' && window && typeof window.getComputedStyle !== 'undefined') { | ||
|  |         ctx.font = window.getComputedStyle(canvas).getPropertyValue('font'); | ||
|  |         var fontSizeProp = new Property(document, 'fontSize', Font.parse(ctx.font).fontSize); | ||
|  | 
 | ||
|  |         if (fontSizeProp.hasValue()) { | ||
|  |           document.rootEmSize = fontSizeProp.getPixels('y'); | ||
|  |           document.emSize = document.rootEmSize; | ||
|  |         } | ||
|  |       } // create new view port
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       if (!this.getAttribute('x').hasValue()) { | ||
|  |         this.getAttribute('x', true).setValue(0); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (!this.getAttribute('y').hasValue()) { | ||
|  |         this.getAttribute('y', true).setValue(0); | ||
|  |       } | ||
|  | 
 | ||
|  |       var _screen$viewPort = screen.viewPort, | ||
|  |           width = _screen$viewPort.width, | ||
|  |           height = _screen$viewPort.height; | ||
|  | 
 | ||
|  |       if (!this.getStyle('width').hasValue()) { | ||
|  |         this.getStyle('width', true).setValue('100%'); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (!this.getStyle('height').hasValue()) { | ||
|  |         this.getStyle('height', true).setValue('100%'); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (!this.getStyle('color').hasValue()) { | ||
|  |         this.getStyle('color', true).setValue('black'); | ||
|  |       } | ||
|  | 
 | ||
|  |       var refXAttr = this.getAttribute('refX'); | ||
|  |       var refYAttr = this.getAttribute('refY'); | ||
|  |       var viewBoxAttr = this.getAttribute('viewBox'); | ||
|  |       var viewBox = viewBoxAttr.hasValue() ? toNumbers(viewBoxAttr.getString()) : null; | ||
|  |       var clip = !this.root && this.getStyle('overflow').getValue('hidden') !== 'visible'; | ||
|  |       var minX = 0; | ||
|  |       var minY = 0; | ||
|  |       var clipX = 0; | ||
|  |       var clipY = 0; | ||
|  | 
 | ||
|  |       if (viewBox) { | ||
|  |         minX = viewBox[0]; | ||
|  |         minY = viewBox[1]; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (!this.root) { | ||
|  |         width = this.getStyle('width').getPixels('x'); | ||
|  |         height = this.getStyle('height').getPixels('y'); | ||
|  | 
 | ||
|  |         if (this.type === 'marker') { | ||
|  |           clipX = minX; | ||
|  |           clipY = minY; | ||
|  |           minX = 0; | ||
|  |           minY = 0; | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       screen.viewPort.setCurrent(width, height); // Default value of transform-origin is center only for root SVG elements
 | ||
|  |       // https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/transform-origin
 | ||
|  | 
 | ||
|  |       if (this.node // is not temporary SVGElement
 | ||
|  |       && (!this.parent || ((_this$node$parentNode = this.node.parentNode) === null || _this$node$parentNode === void 0 ? void 0 : _this$node$parentNode.nodeName) === 'foreignObject') && this.getStyle('transform', false, true).hasValue() && !this.getStyle('transform-origin', false, true).hasValue()) { | ||
|  |         this.getStyle('transform-origin', true, true).setValue('50% 50%'); | ||
|  |       } | ||
|  | 
 | ||
|  |       _get__default['default'](_getPrototypeOf__default['default'](SVGElement.prototype), "setContext", this).call(this, ctx); | ||
|  | 
 | ||
|  |       ctx.translate(this.getAttribute('x').getPixels('x'), this.getAttribute('y').getPixels('y')); | ||
|  | 
 | ||
|  |       if (viewBox) { | ||
|  |         width = viewBox[2]; | ||
|  |         height = viewBox[3]; | ||
|  |       } | ||
|  | 
 | ||
|  |       document.setViewBox({ | ||
|  |         ctx: ctx, | ||
|  |         aspectRatio: this.getAttribute('preserveAspectRatio').getString(), | ||
|  |         width: screen.viewPort.width, | ||
|  |         desiredWidth: width, | ||
|  |         height: screen.viewPort.height, | ||
|  |         desiredHeight: height, | ||
|  |         minX: minX, | ||
|  |         minY: minY, | ||
|  |         refX: refXAttr.getValue(), | ||
|  |         refY: refYAttr.getValue(), | ||
|  |         clip: clip, | ||
|  |         clipX: clipX, | ||
|  |         clipY: clipY | ||
|  |       }); | ||
|  | 
 | ||
|  |       if (viewBox) { | ||
|  |         screen.viewPort.removeCurrent(); | ||
|  |         screen.viewPort.setCurrent(width, height); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "clearContext", | ||
|  |     value: function clearContext(ctx) { | ||
|  |       _get__default['default'](_getPrototypeOf__default['default'](SVGElement.prototype), "clearContext", this).call(this, ctx); | ||
|  | 
 | ||
|  |       this.document.screen.viewPort.removeCurrent(); | ||
|  |     } | ||
|  |     /** | ||
|  |      * Resize SVG to fit in given size. | ||
|  |      * @param width | ||
|  |      * @param height | ||
|  |      * @param preserveAspectRatio | ||
|  |      */ | ||
|  | 
 | ||
|  |   }, { | ||
|  |     key: "resize", | ||
|  |     value: function resize(width) { | ||
|  |       var height = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : width; | ||
|  |       var preserveAspectRatio = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; | ||
|  |       var widthAttr = this.getAttribute('width', true); | ||
|  |       var heightAttr = this.getAttribute('height', true); | ||
|  |       var viewBoxAttr = this.getAttribute('viewBox'); | ||
|  |       var styleAttr = this.getAttribute('style'); | ||
|  |       var originWidth = widthAttr.getNumber(0); | ||
|  |       var originHeight = heightAttr.getNumber(0); | ||
|  | 
 | ||
|  |       if (preserveAspectRatio) { | ||
|  |         if (typeof preserveAspectRatio === 'string') { | ||
|  |           this.getAttribute('preserveAspectRatio', true).setValue(preserveAspectRatio); | ||
|  |         } else { | ||
|  |           var preserveAspectRatioAttr = this.getAttribute('preserveAspectRatio'); | ||
|  | 
 | ||
|  |           if (preserveAspectRatioAttr.hasValue()) { | ||
|  |             preserveAspectRatioAttr.setValue(preserveAspectRatioAttr.getString().replace(/^\s*(\S.*\S)\s*$/, '$1')); | ||
|  |           } | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       widthAttr.setValue(width); | ||
|  |       heightAttr.setValue(height); | ||
|  | 
 | ||
|  |       if (!viewBoxAttr.hasValue()) { | ||
|  |         viewBoxAttr.setValue("0 0 ".concat(originWidth || width, " ").concat(originHeight || height)); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (styleAttr.hasValue()) { | ||
|  |         var widthStyle = this.getStyle('width'); | ||
|  |         var heightStyle = this.getStyle('height'); | ||
|  | 
 | ||
|  |         if (widthStyle.hasValue()) { | ||
|  |           widthStyle.setValue("".concat(width, "px")); | ||
|  |         } | ||
|  | 
 | ||
|  |         if (heightStyle.hasValue()) { | ||
|  |           heightStyle.setValue("".concat(height, "px")); | ||
|  |         } | ||
|  |       } | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return SVGElement; | ||
|  | }(RenderedElement); | ||
|  | 
 | ||
|  | function _createSuper$A(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$A(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$A() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var RectElement = /*#__PURE__*/function (_PathElement) { | ||
|  |   _inherits__default['default'](RectElement, _PathElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$A(RectElement); | ||
|  | 
 | ||
|  |   function RectElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, RectElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'rect'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](RectElement, [{ | ||
|  |     key: "path", | ||
|  |     value: function path(ctx) { | ||
|  |       var x = this.getAttribute('x').getPixels('x'); | ||
|  |       var y = this.getAttribute('y').getPixels('y'); | ||
|  |       var width = this.getStyle('width', false, true).getPixels('x'); | ||
|  |       var height = this.getStyle('height', false, true).getPixels('y'); | ||
|  |       var rxAttr = this.getAttribute('rx'); | ||
|  |       var ryAttr = this.getAttribute('ry'); | ||
|  |       var rx = rxAttr.getPixels('x'); | ||
|  |       var ry = ryAttr.getPixels('y'); | ||
|  | 
 | ||
|  |       if (rxAttr.hasValue() && !ryAttr.hasValue()) { | ||
|  |         ry = rx; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (ryAttr.hasValue() && !rxAttr.hasValue()) { | ||
|  |         rx = ry; | ||
|  |       } | ||
|  | 
 | ||
|  |       rx = Math.min(rx, width / 2.0); | ||
|  |       ry = Math.min(ry, height / 2.0); | ||
|  | 
 | ||
|  |       if (ctx) { | ||
|  |         var KAPPA = 4 * ((Math.sqrt(2) - 1) / 3); | ||
|  |         ctx.beginPath(); // always start the path so we don't fill prior paths
 | ||
|  | 
 | ||
|  |         if (height > 0 && width > 0) { | ||
|  |           ctx.moveTo(x + rx, y); | ||
|  |           ctx.lineTo(x + width - rx, y); | ||
|  |           ctx.bezierCurveTo(x + width - rx + KAPPA * rx, y, x + width, y + ry - KAPPA * ry, x + width, y + ry); | ||
|  |           ctx.lineTo(x + width, y + height - ry); | ||
|  |           ctx.bezierCurveTo(x + width, y + height - ry + KAPPA * ry, x + width - rx + KAPPA * rx, y + height, x + width - rx, y + height); | ||
|  |           ctx.lineTo(x + rx, y + height); | ||
|  |           ctx.bezierCurveTo(x + rx - KAPPA * rx, y + height, x, y + height - ry + KAPPA * ry, x, y + height - ry); | ||
|  |           ctx.lineTo(x, y + ry); | ||
|  |           ctx.bezierCurveTo(x, y + ry - KAPPA * ry, x + rx - KAPPA * rx, y, x + rx, y); | ||
|  |           ctx.closePath(); | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       return new BoundingBox(x, y, x + width, y + height); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getMarkers", | ||
|  |     value: function getMarkers() { | ||
|  |       return null; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return RectElement; | ||
|  | }(PathElement); | ||
|  | 
 | ||
|  | function _createSuper$z(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$z(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$z() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var CircleElement = /*#__PURE__*/function (_PathElement) { | ||
|  |   _inherits__default['default'](CircleElement, _PathElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$z(CircleElement); | ||
|  | 
 | ||
|  |   function CircleElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, CircleElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'circle'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](CircleElement, [{ | ||
|  |     key: "path", | ||
|  |     value: function path(ctx) { | ||
|  |       var cx = this.getAttribute('cx').getPixels('x'); | ||
|  |       var cy = this.getAttribute('cy').getPixels('y'); | ||
|  |       var r = this.getAttribute('r').getPixels(); | ||
|  | 
 | ||
|  |       if (ctx && r > 0) { | ||
|  |         ctx.beginPath(); | ||
|  |         ctx.arc(cx, cy, r, 0, Math.PI * 2, false); | ||
|  |         ctx.closePath(); | ||
|  |       } | ||
|  | 
 | ||
|  |       return new BoundingBox(cx - r, cy - r, cx + r, cy + r); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getMarkers", | ||
|  |     value: function getMarkers() { | ||
|  |       return null; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return CircleElement; | ||
|  | }(PathElement); | ||
|  | 
 | ||
|  | function _createSuper$y(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$y(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$y() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var EllipseElement = /*#__PURE__*/function (_PathElement) { | ||
|  |   _inherits__default['default'](EllipseElement, _PathElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$y(EllipseElement); | ||
|  | 
 | ||
|  |   function EllipseElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, EllipseElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'ellipse'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](EllipseElement, [{ | ||
|  |     key: "path", | ||
|  |     value: function path(ctx) { | ||
|  |       var KAPPA = 4 * ((Math.sqrt(2) - 1) / 3); | ||
|  |       var rx = this.getAttribute('rx').getPixels('x'); | ||
|  |       var ry = this.getAttribute('ry').getPixels('y'); | ||
|  |       var cx = this.getAttribute('cx').getPixels('x'); | ||
|  |       var cy = this.getAttribute('cy').getPixels('y'); | ||
|  | 
 | ||
|  |       if (ctx && rx > 0 && ry > 0) { | ||
|  |         ctx.beginPath(); | ||
|  |         ctx.moveTo(cx + rx, cy); | ||
|  |         ctx.bezierCurveTo(cx + rx, cy + KAPPA * ry, cx + KAPPA * rx, cy + ry, cx, cy + ry); | ||
|  |         ctx.bezierCurveTo(cx - KAPPA * rx, cy + ry, cx - rx, cy + KAPPA * ry, cx - rx, cy); | ||
|  |         ctx.bezierCurveTo(cx - rx, cy - KAPPA * ry, cx - KAPPA * rx, cy - ry, cx, cy - ry); | ||
|  |         ctx.bezierCurveTo(cx + KAPPA * rx, cy - ry, cx + rx, cy - KAPPA * ry, cx + rx, cy); | ||
|  |         ctx.closePath(); | ||
|  |       } | ||
|  | 
 | ||
|  |       return new BoundingBox(cx - rx, cy - ry, cx + rx, cy + ry); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getMarkers", | ||
|  |     value: function getMarkers() { | ||
|  |       return null; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return EllipseElement; | ||
|  | }(PathElement); | ||
|  | 
 | ||
|  | function _createSuper$x(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$x(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$x() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var LineElement = /*#__PURE__*/function (_PathElement) { | ||
|  |   _inherits__default['default'](LineElement, _PathElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$x(LineElement); | ||
|  | 
 | ||
|  |   function LineElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, LineElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'line'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](LineElement, [{ | ||
|  |     key: "getPoints", | ||
|  |     value: function getPoints() { | ||
|  |       return [new Point(this.getAttribute('x1').getPixels('x'), this.getAttribute('y1').getPixels('y')), new Point(this.getAttribute('x2').getPixels('x'), this.getAttribute('y2').getPixels('y'))]; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "path", | ||
|  |     value: function path(ctx) { | ||
|  |       var _this$getPoints = this.getPoints(), | ||
|  |           _this$getPoints2 = _slicedToArray__default['default'](_this$getPoints, 2), | ||
|  |           _this$getPoints2$ = _this$getPoints2[0], | ||
|  |           x0 = _this$getPoints2$.x, | ||
|  |           y0 = _this$getPoints2$.y, | ||
|  |           _this$getPoints2$2 = _this$getPoints2[1], | ||
|  |           x1 = _this$getPoints2$2.x, | ||
|  |           y1 = _this$getPoints2$2.y; | ||
|  | 
 | ||
|  |       if (ctx) { | ||
|  |         ctx.beginPath(); | ||
|  |         ctx.moveTo(x0, y0); | ||
|  |         ctx.lineTo(x1, y1); | ||
|  |       } | ||
|  | 
 | ||
|  |       return new BoundingBox(x0, y0, x1, y1); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getMarkers", | ||
|  |     value: function getMarkers() { | ||
|  |       var _this$getPoints3 = this.getPoints(), | ||
|  |           _this$getPoints4 = _slicedToArray__default['default'](_this$getPoints3, 2), | ||
|  |           p0 = _this$getPoints4[0], | ||
|  |           p1 = _this$getPoints4[1]; | ||
|  | 
 | ||
|  |       var a = p0.angleTo(p1); | ||
|  |       return [[p0, a], [p1, a]]; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return LineElement; | ||
|  | }(PathElement); | ||
|  | 
 | ||
|  | function _createSuper$w(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$w(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$w() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var PolylineElement = /*#__PURE__*/function (_PathElement) { | ||
|  |   _inherits__default['default'](PolylineElement, _PathElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$w(PolylineElement); | ||
|  | 
 | ||
|  |   function PolylineElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, PolylineElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.type = 'polyline'; | ||
|  |     _this.points = []; | ||
|  |     _this.points = Point.parsePath(_this.getAttribute('points').getString()); | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](PolylineElement, [{ | ||
|  |     key: "path", | ||
|  |     value: function path(ctx) { | ||
|  |       var points = this.points; | ||
|  | 
 | ||
|  |       var _points = _slicedToArray__default['default'](points, 1), | ||
|  |           _points$ = _points[0], | ||
|  |           x0 = _points$.x, | ||
|  |           y0 = _points$.y; | ||
|  | 
 | ||
|  |       var boundingBox = new BoundingBox(x0, y0); | ||
|  | 
 | ||
|  |       if (ctx) { | ||
|  |         ctx.beginPath(); | ||
|  |         ctx.moveTo(x0, y0); | ||
|  |       } | ||
|  | 
 | ||
|  |       points.forEach(function (_ref) { | ||
|  |         var x = _ref.x, | ||
|  |             y = _ref.y; | ||
|  |         boundingBox.addPoint(x, y); | ||
|  | 
 | ||
|  |         if (ctx) { | ||
|  |           ctx.lineTo(x, y); | ||
|  |         } | ||
|  |       }); | ||
|  |       return boundingBox; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getMarkers", | ||
|  |     value: function getMarkers() { | ||
|  |       var points = this.points; | ||
|  |       var lastIndex = points.length - 1; | ||
|  |       var markers = []; | ||
|  |       points.forEach(function (point, i) { | ||
|  |         if (i === lastIndex) { | ||
|  |           return; | ||
|  |         } | ||
|  | 
 | ||
|  |         markers.push([point, point.angleTo(points[i + 1])]); | ||
|  |       }); | ||
|  | 
 | ||
|  |       if (markers.length > 0) { | ||
|  |         markers.push([points[points.length - 1], markers[markers.length - 1][1]]); | ||
|  |       } | ||
|  | 
 | ||
|  |       return markers; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return PolylineElement; | ||
|  | }(PathElement); | ||
|  | 
 | ||
|  | function _createSuper$v(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$v(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$v() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var PolygonElement = /*#__PURE__*/function (_PolylineElement) { | ||
|  |   _inherits__default['default'](PolygonElement, _PolylineElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$v(PolygonElement); | ||
|  | 
 | ||
|  |   function PolygonElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, PolygonElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'polygon'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](PolygonElement, [{ | ||
|  |     key: "path", | ||
|  |     value: function path(ctx) { | ||
|  |       var boundingBox = _get__default['default'](_getPrototypeOf__default['default'](PolygonElement.prototype), "path", this).call(this, ctx); | ||
|  | 
 | ||
|  |       var _this$points = _slicedToArray__default['default'](this.points, 1), | ||
|  |           _this$points$ = _this$points[0], | ||
|  |           x = _this$points$.x, | ||
|  |           y = _this$points$.y; | ||
|  | 
 | ||
|  |       if (ctx) { | ||
|  |         ctx.lineTo(x, y); | ||
|  |         ctx.closePath(); | ||
|  |       } | ||
|  | 
 | ||
|  |       return boundingBox; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return PolygonElement; | ||
|  | }(PolylineElement); | ||
|  | 
 | ||
|  | function _createSuper$u(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$u(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$u() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var PatternElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](PatternElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$u(PatternElement); | ||
|  | 
 | ||
|  |   function PatternElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, PatternElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'pattern'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](PatternElement, [{ | ||
|  |     key: "createPattern", | ||
|  |     value: function createPattern(ctx, _, parentOpacityProp) { | ||
|  |       var width = this.getStyle('width').getPixels('x', true); | ||
|  |       var height = this.getStyle('height').getPixels('y', true); // render me using a temporary svg element
 | ||
|  | 
 | ||
|  |       var patternSvg = new SVGElement(this.document, null); | ||
|  |       patternSvg.attributes.viewBox = new Property(this.document, 'viewBox', this.getAttribute('viewBox').getValue()); | ||
|  |       patternSvg.attributes.width = new Property(this.document, 'width', "".concat(width, "px")); | ||
|  |       patternSvg.attributes.height = new Property(this.document, 'height', "".concat(height, "px")); | ||
|  |       patternSvg.attributes.transform = new Property(this.document, 'transform', this.getAttribute('patternTransform').getValue()); | ||
|  |       patternSvg.children = this.children; | ||
|  |       var patternCanvas = this.document.createCanvas(width, height); | ||
|  |       var patternCtx = patternCanvas.getContext('2d'); | ||
|  |       var xAttr = this.getAttribute('x'); | ||
|  |       var yAttr = this.getAttribute('y'); | ||
|  | 
 | ||
|  |       if (xAttr.hasValue() && yAttr.hasValue()) { | ||
|  |         patternCtx.translate(xAttr.getPixels('x', true), yAttr.getPixels('y', true)); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (parentOpacityProp.hasValue()) { | ||
|  |         this.styles['fill-opacity'] = parentOpacityProp; | ||
|  |       } else { | ||
|  |         Reflect.deleteProperty(this.styles, 'fill-opacity'); | ||
|  |       } // render 3x3 grid so when we transform there's no white space on edges
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       for (var x = -1; x <= 1; x++) { | ||
|  |         for (var y = -1; y <= 1; y++) { | ||
|  |           patternCtx.save(); | ||
|  |           patternSvg.attributes.x = new Property(this.document, 'x', x * patternCanvas.width); | ||
|  |           patternSvg.attributes.y = new Property(this.document, 'y', y * patternCanvas.height); | ||
|  |           patternSvg.render(patternCtx); | ||
|  |           patternCtx.restore(); | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       var pattern = ctx.createPattern(patternCanvas, 'repeat'); | ||
|  |       return pattern; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return PatternElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function _createSuper$t(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$t(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$t() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var MarkerElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](MarkerElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$t(MarkerElement); | ||
|  | 
 | ||
|  |   function MarkerElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, MarkerElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'marker'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](MarkerElement, [{ | ||
|  |     key: "render", | ||
|  |     value: function render(ctx, point, angle) { | ||
|  |       if (!point) { | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       var x = point.x, | ||
|  |           y = point.y; | ||
|  |       var orient = this.getAttribute('orient').getString('auto'); | ||
|  |       var markerUnits = this.getAttribute('markerUnits').getString('strokeWidth'); | ||
|  |       ctx.translate(x, y); | ||
|  | 
 | ||
|  |       if (orient === 'auto') { | ||
|  |         ctx.rotate(angle); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (markerUnits === 'strokeWidth') { | ||
|  |         ctx.scale(ctx.lineWidth, ctx.lineWidth); | ||
|  |       } | ||
|  | 
 | ||
|  |       ctx.save(); // render me using a temporary svg element
 | ||
|  | 
 | ||
|  |       var markerSvg = new SVGElement(this.document, null); | ||
|  |       markerSvg.type = this.type; | ||
|  |       markerSvg.attributes.viewBox = new Property(this.document, 'viewBox', this.getAttribute('viewBox').getValue()); | ||
|  |       markerSvg.attributes.refX = new Property(this.document, 'refX', this.getAttribute('refX').getValue()); | ||
|  |       markerSvg.attributes.refY = new Property(this.document, 'refY', this.getAttribute('refY').getValue()); | ||
|  |       markerSvg.attributes.width = new Property(this.document, 'width', this.getAttribute('markerWidth').getValue()); | ||
|  |       markerSvg.attributes.height = new Property(this.document, 'height', this.getAttribute('markerHeight').getValue()); | ||
|  |       markerSvg.attributes.overflow = new Property(this.document, 'overflow', this.getAttribute('overflow').getValue()); | ||
|  |       markerSvg.attributes.fill = new Property(this.document, 'fill', this.getAttribute('fill').getColor('black')); | ||
|  |       markerSvg.attributes.stroke = new Property(this.document, 'stroke', this.getAttribute('stroke').getValue('none')); | ||
|  |       markerSvg.children = this.children; | ||
|  |       markerSvg.render(ctx); | ||
|  |       ctx.restore(); | ||
|  | 
 | ||
|  |       if (markerUnits === 'strokeWidth') { | ||
|  |         ctx.scale(1 / ctx.lineWidth, 1 / ctx.lineWidth); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (orient === 'auto') { | ||
|  |         ctx.rotate(-angle); | ||
|  |       } | ||
|  | 
 | ||
|  |       ctx.translate(-x, -y); | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return MarkerElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function _createSuper$s(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$s(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$s() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var DefsElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](DefsElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$s(DefsElement); | ||
|  | 
 | ||
|  |   function DefsElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, DefsElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'defs'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](DefsElement, [{ | ||
|  |     key: "render", | ||
|  |     value: function render() {// NOOP
 | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return DefsElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function _createSuper$r(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$r(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$r() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var GElement = /*#__PURE__*/function (_RenderedElement) { | ||
|  |   _inherits__default['default'](GElement, _RenderedElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$r(GElement); | ||
|  | 
 | ||
|  |   function GElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, GElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'g'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](GElement, [{ | ||
|  |     key: "getBoundingBox", | ||
|  |     value: function getBoundingBox(ctx) { | ||
|  |       var boundingBox = new BoundingBox(); | ||
|  |       this.children.forEach(function (child) { | ||
|  |         boundingBox.addBoundingBox(child.getBoundingBox(ctx)); | ||
|  |       }); | ||
|  |       return boundingBox; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return GElement; | ||
|  | }(RenderedElement); | ||
|  | 
 | ||
|  | function _createSuper$q(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$q(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$q() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var GradientElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](GradientElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$q(GradientElement); | ||
|  | 
 | ||
|  |   function GradientElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, GradientElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.attributesToInherit = ['gradientUnits']; | ||
|  |     _this.stops = []; | ||
|  | 
 | ||
|  |     var _assertThisInitialize = _assertThisInitialized__default['default'](_this), | ||
|  |         stops = _assertThisInitialize.stops, | ||
|  |         children = _assertThisInitialize.children; | ||
|  | 
 | ||
|  |     children.forEach(function (child) { | ||
|  |       if (child.type === 'stop') { | ||
|  |         stops.push(child); | ||
|  |       } | ||
|  |     }); | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](GradientElement, [{ | ||
|  |     key: "getGradientUnits", | ||
|  |     value: function getGradientUnits() { | ||
|  |       return this.getAttribute('gradientUnits').getString('objectBoundingBox'); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "createGradient", | ||
|  |     value: function createGradient(ctx, element, parentOpacityProp) { | ||
|  |       var _this2 = this; | ||
|  | 
 | ||
|  |       // eslint-disable-next-line @typescript-eslint/no-this-alias, consistent-this
 | ||
|  |       var stopsContainer = this; | ||
|  | 
 | ||
|  |       if (this.getHrefAttribute().hasValue()) { | ||
|  |         stopsContainer = this.getHrefAttribute().getDefinition(); | ||
|  |         this.inheritStopContainer(stopsContainer); | ||
|  |       } | ||
|  | 
 | ||
|  |       var _stopsContainer = stopsContainer, | ||
|  |           stops = _stopsContainer.stops; | ||
|  |       var gradient = this.getGradient(ctx, element); | ||
|  | 
 | ||
|  |       if (!gradient) { | ||
|  |         return this.addParentOpacity(parentOpacityProp, stops[stops.length - 1].color); | ||
|  |       } | ||
|  | 
 | ||
|  |       stops.forEach(function (stop) { | ||
|  |         gradient.addColorStop(stop.offset, _this2.addParentOpacity(parentOpacityProp, stop.color)); | ||
|  |       }); | ||
|  | 
 | ||
|  |       if (this.getAttribute('gradientTransform').hasValue()) { | ||
|  |         // render as transformed pattern on temporary canvas
 | ||
|  |         var document = this.document; | ||
|  |         var _document$screen = document.screen, | ||
|  |             MAX_VIRTUAL_PIXELS = _document$screen.MAX_VIRTUAL_PIXELS, | ||
|  |             viewPort = _document$screen.viewPort; | ||
|  | 
 | ||
|  |         var _viewPort$viewPorts = _slicedToArray__default['default'](viewPort.viewPorts, 1), | ||
|  |             rootView = _viewPort$viewPorts[0]; | ||
|  | 
 | ||
|  |         var rect = new RectElement(document, null); | ||
|  |         rect.attributes.x = new Property(document, 'x', -MAX_VIRTUAL_PIXELS / 3.0); | ||
|  |         rect.attributes.y = new Property(document, 'y', -MAX_VIRTUAL_PIXELS / 3.0); | ||
|  |         rect.attributes.width = new Property(document, 'width', MAX_VIRTUAL_PIXELS); | ||
|  |         rect.attributes.height = new Property(document, 'height', MAX_VIRTUAL_PIXELS); | ||
|  |         var group = new GElement(document, null); | ||
|  |         group.attributes.transform = new Property(document, 'transform', this.getAttribute('gradientTransform').getValue()); | ||
|  |         group.children = [rect]; | ||
|  |         var patternSvg = new SVGElement(document, null); | ||
|  |         patternSvg.attributes.x = new Property(document, 'x', 0); | ||
|  |         patternSvg.attributes.y = new Property(document, 'y', 0); | ||
|  |         patternSvg.attributes.width = new Property(document, 'width', rootView.width); | ||
|  |         patternSvg.attributes.height = new Property(document, 'height', rootView.height); | ||
|  |         patternSvg.children = [group]; | ||
|  |         var patternCanvas = document.createCanvas(rootView.width, rootView.height); | ||
|  |         var patternCtx = patternCanvas.getContext('2d'); | ||
|  |         patternCtx.fillStyle = gradient; | ||
|  |         patternSvg.render(patternCtx); | ||
|  |         return patternCtx.createPattern(patternCanvas, 'no-repeat'); | ||
|  |       } | ||
|  | 
 | ||
|  |       return gradient; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "inheritStopContainer", | ||
|  |     value: function inheritStopContainer(stopsContainer) { | ||
|  |       var _this3 = this; | ||
|  | 
 | ||
|  |       this.attributesToInherit.forEach(function (attributeToInherit) { | ||
|  |         if (!_this3.getAttribute(attributeToInherit).hasValue() && stopsContainer.getAttribute(attributeToInherit).hasValue()) { | ||
|  |           _this3.getAttribute(attributeToInherit, true).setValue(stopsContainer.getAttribute(attributeToInherit).getValue()); | ||
|  |         } | ||
|  |       }); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "addParentOpacity", | ||
|  |     value: function addParentOpacity(parentOpacityProp, color) { | ||
|  |       if (parentOpacityProp.hasValue()) { | ||
|  |         var colorProp = new Property(this.document, 'color', color); | ||
|  |         return colorProp.addOpacity(parentOpacityProp).getColor(); | ||
|  |       } | ||
|  | 
 | ||
|  |       return color; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return GradientElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function _createSuper$p(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$p(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$p() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var LinearGradientElement = /*#__PURE__*/function (_GradientElement) { | ||
|  |   _inherits__default['default'](LinearGradientElement, _GradientElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$p(LinearGradientElement); | ||
|  | 
 | ||
|  |   function LinearGradientElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, LinearGradientElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.type = 'linearGradient'; | ||
|  | 
 | ||
|  |     _this.attributesToInherit.push('x1', 'y1', 'x2', 'y2'); | ||
|  | 
 | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](LinearGradientElement, [{ | ||
|  |     key: "getGradient", | ||
|  |     value: function getGradient(ctx, element) { | ||
|  |       var isBoundingBoxUnits = this.getGradientUnits() === 'objectBoundingBox'; | ||
|  |       var boundingBox = isBoundingBoxUnits ? element.getBoundingBox(ctx) : null; | ||
|  | 
 | ||
|  |       if (isBoundingBoxUnits && !boundingBox) { | ||
|  |         return null; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (!this.getAttribute('x1').hasValue() && !this.getAttribute('y1').hasValue() && !this.getAttribute('x2').hasValue() && !this.getAttribute('y2').hasValue()) { | ||
|  |         this.getAttribute('x1', true).setValue(0); | ||
|  |         this.getAttribute('y1', true).setValue(0); | ||
|  |         this.getAttribute('x2', true).setValue(1); | ||
|  |         this.getAttribute('y2', true).setValue(0); | ||
|  |       } | ||
|  | 
 | ||
|  |       var x1 = isBoundingBoxUnits ? boundingBox.x + boundingBox.width * this.getAttribute('x1').getNumber() : this.getAttribute('x1').getPixels('x'); | ||
|  |       var y1 = isBoundingBoxUnits ? boundingBox.y + boundingBox.height * this.getAttribute('y1').getNumber() : this.getAttribute('y1').getPixels('y'); | ||
|  |       var x2 = isBoundingBoxUnits ? boundingBox.x + boundingBox.width * this.getAttribute('x2').getNumber() : this.getAttribute('x2').getPixels('x'); | ||
|  |       var y2 = isBoundingBoxUnits ? boundingBox.y + boundingBox.height * this.getAttribute('y2').getNumber() : this.getAttribute('y2').getPixels('y'); | ||
|  | 
 | ||
|  |       if (x1 === x2 && y1 === y2) { | ||
|  |         return null; | ||
|  |       } | ||
|  | 
 | ||
|  |       return ctx.createLinearGradient(x1, y1, x2, y2); | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return LinearGradientElement; | ||
|  | }(GradientElement); | ||
|  | 
 | ||
|  | function _createSuper$o(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$o(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$o() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var RadialGradientElement = /*#__PURE__*/function (_GradientElement) { | ||
|  |   _inherits__default['default'](RadialGradientElement, _GradientElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$o(RadialGradientElement); | ||
|  | 
 | ||
|  |   function RadialGradientElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, RadialGradientElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.type = 'radialGradient'; | ||
|  | 
 | ||
|  |     _this.attributesToInherit.push('cx', 'cy', 'r', 'fx', 'fy', 'fr'); | ||
|  | 
 | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](RadialGradientElement, [{ | ||
|  |     key: "getGradient", | ||
|  |     value: function getGradient(ctx, element) { | ||
|  |       var isBoundingBoxUnits = this.getGradientUnits() === 'objectBoundingBox'; | ||
|  |       var boundingBox = element.getBoundingBox(ctx); | ||
|  | 
 | ||
|  |       if (isBoundingBoxUnits && !boundingBox) { | ||
|  |         return null; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (!this.getAttribute('cx').hasValue()) { | ||
|  |         this.getAttribute('cx', true).setValue('50%'); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (!this.getAttribute('cy').hasValue()) { | ||
|  |         this.getAttribute('cy', true).setValue('50%'); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (!this.getAttribute('r').hasValue()) { | ||
|  |         this.getAttribute('r', true).setValue('50%'); | ||
|  |       } | ||
|  | 
 | ||
|  |       var cx = isBoundingBoxUnits ? boundingBox.x + boundingBox.width * this.getAttribute('cx').getNumber() : this.getAttribute('cx').getPixels('x'); | ||
|  |       var cy = isBoundingBoxUnits ? boundingBox.y + boundingBox.height * this.getAttribute('cy').getNumber() : this.getAttribute('cy').getPixels('y'); | ||
|  |       var fx = cx; | ||
|  |       var fy = cy; | ||
|  | 
 | ||
|  |       if (this.getAttribute('fx').hasValue()) { | ||
|  |         fx = isBoundingBoxUnits ? boundingBox.x + boundingBox.width * this.getAttribute('fx').getNumber() : this.getAttribute('fx').getPixels('x'); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (this.getAttribute('fy').hasValue()) { | ||
|  |         fy = isBoundingBoxUnits ? boundingBox.y + boundingBox.height * this.getAttribute('fy').getNumber() : this.getAttribute('fy').getPixels('y'); | ||
|  |       } | ||
|  | 
 | ||
|  |       var r = isBoundingBoxUnits ? (boundingBox.width + boundingBox.height) / 2.0 * this.getAttribute('r').getNumber() : this.getAttribute('r').getPixels(); | ||
|  |       var fr = this.getAttribute('fr').getPixels(); | ||
|  |       return ctx.createRadialGradient(fx, fy, fr, cx, cy, r); | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return RadialGradientElement; | ||
|  | }(GradientElement); | ||
|  | 
 | ||
|  | function _createSuper$n(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$n(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$n() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var StopElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](StopElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$n(StopElement); | ||
|  | 
 | ||
|  |   function StopElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, StopElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.type = 'stop'; | ||
|  |     var offset = Math.max(0, Math.min(1, _this.getAttribute('offset').getNumber())); | ||
|  | 
 | ||
|  |     var stopOpacity = _this.getStyle('stop-opacity'); | ||
|  | 
 | ||
|  |     var stopColor = _this.getStyle('stop-color', true); | ||
|  | 
 | ||
|  |     if (stopColor.getString() === '') { | ||
|  |       stopColor.setValue('#000'); | ||
|  |     } | ||
|  | 
 | ||
|  |     if (stopOpacity.hasValue()) { | ||
|  |       stopColor = stopColor.addOpacity(stopOpacity); | ||
|  |     } | ||
|  | 
 | ||
|  |     _this.offset = offset; | ||
|  |     _this.color = stopColor.getColor(); | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   return StopElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function _createSuper$m(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$m(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$m() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var AnimateElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](AnimateElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$m(AnimateElement); | ||
|  | 
 | ||
|  |   function AnimateElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, AnimateElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.type = 'animate'; | ||
|  |     _this.duration = 0; | ||
|  |     _this.initialValue = null; | ||
|  |     _this.initialUnits = ''; | ||
|  |     _this.removed = false; | ||
|  |     _this.frozen = false; | ||
|  |     document.screen.animations.push(_assertThisInitialized__default['default'](_this)); | ||
|  |     _this.begin = _this.getAttribute('begin').getMilliseconds(); | ||
|  |     _this.maxDuration = _this.begin + _this.getAttribute('dur').getMilliseconds(); | ||
|  |     _this.from = _this.getAttribute('from'); | ||
|  |     _this.to = _this.getAttribute('to'); | ||
|  |     _this.values = new Property(document, 'values', null); | ||
|  | 
 | ||
|  |     var valuesAttr = _this.getAttribute('values'); | ||
|  | 
 | ||
|  |     if (valuesAttr.hasValue()) { | ||
|  |       _this.values.setValue(valuesAttr.getString().split(';')); | ||
|  |     } | ||
|  | 
 | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](AnimateElement, [{ | ||
|  |     key: "getProperty", | ||
|  |     value: function getProperty() { | ||
|  |       var attributeType = this.getAttribute('attributeType').getString(); | ||
|  |       var attributeName = this.getAttribute('attributeName').getString(); | ||
|  | 
 | ||
|  |       if (attributeType === 'CSS') { | ||
|  |         return this.parent.getStyle(attributeName, true); | ||
|  |       } | ||
|  | 
 | ||
|  |       return this.parent.getAttribute(attributeName, true); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "calcValue", | ||
|  |     value: function calcValue() { | ||
|  |       var initialUnits = this.initialUnits; | ||
|  | 
 | ||
|  |       var _this$getProgress = this.getProgress(), | ||
|  |           progress = _this$getProgress.progress, | ||
|  |           from = _this$getProgress.from, | ||
|  |           to = _this$getProgress.to; // tween value linearly
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       var newValue = from.getNumber() + (to.getNumber() - from.getNumber()) * progress; | ||
|  | 
 | ||
|  |       if (initialUnits === '%') { | ||
|  |         newValue *= 100.0; // numValue() returns 0-1 whereas properties are 0-100
 | ||
|  |       } | ||
|  | 
 | ||
|  |       return "".concat(newValue).concat(initialUnits); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "update", | ||
|  |     value: function update(delta) { | ||
|  |       var parent = this.parent; | ||
|  |       var prop = this.getProperty(); // set initial value
 | ||
|  | 
 | ||
|  |       if (!this.initialValue) { | ||
|  |         this.initialValue = prop.getString(); | ||
|  |         this.initialUnits = prop.getUnits(); | ||
|  |       } // if we're past the end time
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       if (this.duration > this.maxDuration) { | ||
|  |         var fill = this.getAttribute('fill').getString('remove'); // loop for indefinitely repeating animations
 | ||
|  | 
 | ||
|  |         if (this.getAttribute('repeatCount').getString() === 'indefinite' || this.getAttribute('repeatDur').getString() === 'indefinite') { | ||
|  |           this.duration = 0; | ||
|  |         } else if (fill === 'freeze' && !this.frozen) { | ||
|  |           this.frozen = true; | ||
|  |           parent.animationFrozen = true; | ||
|  |           parent.animationFrozenValue = prop.getString(); | ||
|  |         } else if (fill === 'remove' && !this.removed) { | ||
|  |           this.removed = true; | ||
|  |           prop.setValue(parent.animationFrozen ? parent.animationFrozenValue : this.initialValue); | ||
|  |           return true; | ||
|  |         } | ||
|  | 
 | ||
|  |         return false; | ||
|  |       } | ||
|  | 
 | ||
|  |       this.duration += delta; // if we're past the begin time
 | ||
|  | 
 | ||
|  |       var updated = false; | ||
|  | 
 | ||
|  |       if (this.begin < this.duration) { | ||
|  |         var newValue = this.calcValue(); // tween
 | ||
|  | 
 | ||
|  |         var typeAttr = this.getAttribute('type'); | ||
|  | 
 | ||
|  |         if (typeAttr.hasValue()) { | ||
|  |           // for transform, etc.
 | ||
|  |           var type = typeAttr.getString(); | ||
|  |           newValue = "".concat(type, "(").concat(newValue, ")"); | ||
|  |         } | ||
|  | 
 | ||
|  |         prop.setValue(newValue); | ||
|  |         updated = true; | ||
|  |       } | ||
|  | 
 | ||
|  |       return updated; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getProgress", | ||
|  |     value: function getProgress() { | ||
|  |       var document = this.document, | ||
|  |           values = this.values; | ||
|  |       var result = { | ||
|  |         progress: (this.duration - this.begin) / (this.maxDuration - this.begin) | ||
|  |       }; | ||
|  | 
 | ||
|  |       if (values.hasValue()) { | ||
|  |         var p = result.progress * (values.getValue().length - 1); | ||
|  |         var lb = Math.floor(p); | ||
|  |         var ub = Math.ceil(p); | ||
|  |         result.from = new Property(document, 'from', parseFloat(values.getValue()[lb])); | ||
|  |         result.to = new Property(document, 'to', parseFloat(values.getValue()[ub])); | ||
|  |         result.progress = (p - lb) / (ub - lb); | ||
|  |       } else { | ||
|  |         result.from = this.from; | ||
|  |         result.to = this.to; | ||
|  |       } | ||
|  | 
 | ||
|  |       return result; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return AnimateElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function _createSuper$l(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$l(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$l() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var AnimateColorElement = /*#__PURE__*/function (_AnimateElement) { | ||
|  |   _inherits__default['default'](AnimateColorElement, _AnimateElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$l(AnimateColorElement); | ||
|  | 
 | ||
|  |   function AnimateColorElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, AnimateColorElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'animateColor'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](AnimateColorElement, [{ | ||
|  |     key: "calcValue", | ||
|  |     value: function calcValue() { | ||
|  |       var _this$getProgress = this.getProgress(), | ||
|  |           progress = _this$getProgress.progress, | ||
|  |           from = _this$getProgress.from, | ||
|  |           to = _this$getProgress.to; | ||
|  | 
 | ||
|  |       var colorFrom = new RGBColor__default['default'](from.getColor()); | ||
|  |       var colorTo = new RGBColor__default['default'](to.getColor()); | ||
|  | 
 | ||
|  |       if (colorFrom.ok && colorTo.ok) { | ||
|  |         // tween color linearly
 | ||
|  |         var r = colorFrom.r + (colorTo.r - colorFrom.r) * progress; | ||
|  |         var g = colorFrom.g + (colorTo.g - colorFrom.g) * progress; | ||
|  |         var b = colorFrom.b + (colorTo.b - colorFrom.b) * progress; // ? alpha
 | ||
|  | 
 | ||
|  |         return "rgb(".concat(Math.floor(r), ", ").concat(Math.floor(g), ", ").concat(Math.floor(b), ")"); | ||
|  |       } | ||
|  | 
 | ||
|  |       return this.getAttribute('from').getColor(); | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return AnimateColorElement; | ||
|  | }(AnimateElement); | ||
|  | 
 | ||
|  | function _createSuper$k(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$k(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$k() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var AnimateTransformElement = /*#__PURE__*/function (_AnimateElement) { | ||
|  |   _inherits__default['default'](AnimateTransformElement, _AnimateElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$k(AnimateTransformElement); | ||
|  | 
 | ||
|  |   function AnimateTransformElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, AnimateTransformElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'animateTransform'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](AnimateTransformElement, [{ | ||
|  |     key: "calcValue", | ||
|  |     value: function calcValue() { | ||
|  |       var _this$getProgress = this.getProgress(), | ||
|  |           progress = _this$getProgress.progress, | ||
|  |           from = _this$getProgress.from, | ||
|  |           to = _this$getProgress.to; // tween value linearly
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       var transformFrom = toNumbers(from.getString()); | ||
|  |       var transformTo = toNumbers(to.getString()); | ||
|  |       var newValue = transformFrom.map(function (from, i) { | ||
|  |         var to = transformTo[i]; | ||
|  |         return from + (to - from) * progress; | ||
|  |       }).join(' '); | ||
|  |       return newValue; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return AnimateTransformElement; | ||
|  | }(AnimateElement); | ||
|  | 
 | ||
|  | function _createForOfIteratorHelper$1(o, allowArrayLike) { var it; if (typeof Symbol === "undefined" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$1(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = o[Symbol.iterator](); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; } | ||
|  | 
 | ||
|  | function _unsupportedIterableToArray$1(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$1(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$1(o, minLen); } | ||
|  | 
 | ||
|  | function _arrayLikeToArray$1(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } | ||
|  | 
 | ||
|  | function _createSuper$j(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$j(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$j() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var FontElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](FontElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$j(FontElement); | ||
|  | 
 | ||
|  |   function FontElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, FontElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.type = 'font'; | ||
|  |     _this.glyphs = {}; | ||
|  |     _this.horizAdvX = _this.getAttribute('horiz-adv-x').getNumber(); | ||
|  |     var definitions = document.definitions; | ||
|  | 
 | ||
|  |     var _assertThisInitialize = _assertThisInitialized__default['default'](_this), | ||
|  |         children = _assertThisInitialize.children; | ||
|  | 
 | ||
|  |     var _iterator = _createForOfIteratorHelper$1(children), | ||
|  |         _step; | ||
|  | 
 | ||
|  |     try { | ||
|  |       for (_iterator.s(); !(_step = _iterator.n()).done;) { | ||
|  |         var child = _step.value; | ||
|  | 
 | ||
|  |         switch (child.type) { | ||
|  |           case 'font-face': | ||
|  |             { | ||
|  |               _this.fontFace = child; | ||
|  |               var fontFamilyStyle = child.getStyle('font-family'); | ||
|  | 
 | ||
|  |               if (fontFamilyStyle.hasValue()) { | ||
|  |                 definitions[fontFamilyStyle.getString()] = _assertThisInitialized__default['default'](_this); | ||
|  |               } | ||
|  | 
 | ||
|  |               break; | ||
|  |             } | ||
|  | 
 | ||
|  |           case 'missing-glyph': | ||
|  |             _this.missingGlyph = child; | ||
|  |             break; | ||
|  | 
 | ||
|  |           case 'glyph': | ||
|  |             { | ||
|  |               var glyph = child; | ||
|  | 
 | ||
|  |               if (glyph.arabicForm) { | ||
|  |                 _this.isRTL = true; | ||
|  |                 _this.isArabic = true; | ||
|  | 
 | ||
|  |                 if (typeof _this.glyphs[glyph.unicode] === 'undefined') { | ||
|  |                   _this.glyphs[glyph.unicode] = {}; | ||
|  |                 } | ||
|  | 
 | ||
|  |                 _this.glyphs[glyph.unicode][glyph.arabicForm] = glyph; | ||
|  |               } else { | ||
|  |                 _this.glyphs[glyph.unicode] = glyph; | ||
|  |               } | ||
|  | 
 | ||
|  |               break; | ||
|  |             } | ||
|  | 
 | ||
|  |           default: | ||
|  |         } | ||
|  |       } | ||
|  |     } catch (err) { | ||
|  |       _iterator.e(err); | ||
|  |     } finally { | ||
|  |       _iterator.f(); | ||
|  |     } | ||
|  | 
 | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](FontElement, [{ | ||
|  |     key: "render", | ||
|  |     value: function render() {// NO RENDER
 | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return FontElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function _createSuper$i(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$i(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$i() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var FontFaceElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](FontFaceElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$i(FontFaceElement); | ||
|  | 
 | ||
|  |   function FontFaceElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, FontFaceElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.type = 'font-face'; | ||
|  |     _this.ascent = _this.getAttribute('ascent').getNumber(); | ||
|  |     _this.descent = _this.getAttribute('descent').getNumber(); | ||
|  |     _this.unitsPerEm = _this.getAttribute('units-per-em').getNumber(); | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   return FontFaceElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function _createSuper$h(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$h(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$h() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var MissingGlyphElement = /*#__PURE__*/function (_PathElement) { | ||
|  |   _inherits__default['default'](MissingGlyphElement, _PathElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$h(MissingGlyphElement); | ||
|  | 
 | ||
|  |   function MissingGlyphElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, MissingGlyphElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'missing-glyph'; | ||
|  |     _this.horizAdvX = 0; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   return MissingGlyphElement; | ||
|  | }(PathElement); | ||
|  | 
 | ||
|  | function _createSuper$g(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$g(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$g() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var TRefElement = /*#__PURE__*/function (_TextElement) { | ||
|  |   _inherits__default['default'](TRefElement, _TextElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$g(TRefElement); | ||
|  | 
 | ||
|  |   function TRefElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, TRefElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'tref'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](TRefElement, [{ | ||
|  |     key: "getText", | ||
|  |     value: function getText() { | ||
|  |       var element = this.getHrefAttribute().getDefinition(); | ||
|  | 
 | ||
|  |       if (element) { | ||
|  |         var firstChild = element.children[0]; | ||
|  | 
 | ||
|  |         if (firstChild) { | ||
|  |           return firstChild.getText(); | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       return ''; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return TRefElement; | ||
|  | }(TextElement); | ||
|  | 
 | ||
|  | function _createSuper$f(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$f(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$f() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var AElement = /*#__PURE__*/function (_TextElement) { | ||
|  |   _inherits__default['default'](AElement, _TextElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$f(AElement); | ||
|  | 
 | ||
|  |   function AElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, AElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.type = 'a'; | ||
|  |     var childNodes = node.childNodes; | ||
|  |     var firstChild = childNodes[0]; | ||
|  |     var hasText = childNodes.length > 0 && Array.from(childNodes).every(function (node) { | ||
|  |       return node.nodeType === 3; | ||
|  |     }); | ||
|  |     _this.hasText = hasText; | ||
|  |     _this.text = hasText ? _this.getTextFromNode(firstChild) : ''; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](AElement, [{ | ||
|  |     key: "getText", | ||
|  |     value: function getText() { | ||
|  |       return this.text; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "renderChildren", | ||
|  |     value: function renderChildren(ctx) { | ||
|  |       if (this.hasText) { | ||
|  |         // render as text element
 | ||
|  |         _get__default['default'](_getPrototypeOf__default['default'](AElement.prototype), "renderChildren", this).call(this, ctx); | ||
|  | 
 | ||
|  |         var document = this.document, | ||
|  |             x = this.x, | ||
|  |             y = this.y; | ||
|  |         var mouse = document.screen.mouse; | ||
|  |         var fontSize = new Property(document, 'fontSize', Font.parse(document.ctx.font).fontSize); // Do not calc bounding box if mouse is not working.
 | ||
|  | 
 | ||
|  |         if (mouse.isWorking()) { | ||
|  |           mouse.checkBoundingBox(this, new BoundingBox(x, y - fontSize.getPixels('y'), x + this.measureText(ctx), y)); | ||
|  |         } | ||
|  |       } else if (this.children.length > 0) { | ||
|  |         // render as temporary group
 | ||
|  |         var g = new GElement(this.document, null); | ||
|  |         g.children = this.children; | ||
|  |         g.parent = this; | ||
|  |         g.render(ctx); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "onClick", | ||
|  |     value: function onClick() { | ||
|  |       var window = this.document.window; | ||
|  | 
 | ||
|  |       if (window) { | ||
|  |         window.open(this.getHrefAttribute().getString()); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "onMouseMove", | ||
|  |     value: function onMouseMove() { | ||
|  |       var ctx = this.document.ctx; | ||
|  |       ctx.canvas.style.cursor = 'pointer'; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return AElement; | ||
|  | }(TextElement); | ||
|  | 
 | ||
|  | function _createForOfIteratorHelper(o, allowArrayLike) { var it; if (typeof Symbol === "undefined" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = o[Symbol.iterator](); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; } | ||
|  | 
 | ||
|  | function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } | ||
|  | 
 | ||
|  | function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } | ||
|  | 
 | ||
|  | function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } | ||
|  | 
 | ||
|  | function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$2(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } | ||
|  | 
 | ||
|  | function _createSuper$e(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$e(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$e() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var TextPathElement = /*#__PURE__*/function (_TextElement) { | ||
|  |   _inherits__default['default'](TextPathElement, _TextElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$e(TextPathElement); | ||
|  | 
 | ||
|  |   function TextPathElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, TextPathElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.type = 'textPath'; | ||
|  |     _this.textWidth = 0; | ||
|  |     _this.textHeight = 0; | ||
|  |     _this.pathLength = -1; | ||
|  |     _this.glyphInfo = null; | ||
|  |     _this.letterSpacingCache = []; | ||
|  |     _this.measuresCache = new Map([['', 0]]); | ||
|  | 
 | ||
|  |     var pathElement = _this.getHrefAttribute().getDefinition(); | ||
|  | 
 | ||
|  |     _this.text = _this.getTextFromNode(); | ||
|  |     _this.dataArray = _this.parsePathData(pathElement); | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](TextPathElement, [{ | ||
|  |     key: "getText", | ||
|  |     value: function getText() { | ||
|  |       return this.text; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "path", | ||
|  |     value: function path(ctx) { | ||
|  |       var dataArray = this.dataArray; | ||
|  | 
 | ||
|  |       if (ctx) { | ||
|  |         ctx.beginPath(); | ||
|  |       } | ||
|  | 
 | ||
|  |       dataArray.forEach(function (_ref) { | ||
|  |         var type = _ref.type, | ||
|  |             points = _ref.points; | ||
|  | 
 | ||
|  |         switch (type) { | ||
|  |           case PathParser.LINE_TO: | ||
|  |             if (ctx) { | ||
|  |               ctx.lineTo(points[0], points[1]); | ||
|  |             } | ||
|  | 
 | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.MOVE_TO: | ||
|  |             if (ctx) { | ||
|  |               ctx.moveTo(points[0], points[1]); | ||
|  |             } | ||
|  | 
 | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.CURVE_TO: | ||
|  |             if (ctx) { | ||
|  |               ctx.bezierCurveTo(points[0], points[1], points[2], points[3], points[4], points[5]); | ||
|  |             } | ||
|  | 
 | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.QUAD_TO: | ||
|  |             if (ctx) { | ||
|  |               ctx.quadraticCurveTo(points[0], points[1], points[2], points[3]); | ||
|  |             } | ||
|  | 
 | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.ARC: | ||
|  |             { | ||
|  |               var _points = _slicedToArray__default['default'](points, 8), | ||
|  |                   cx = _points[0], | ||
|  |                   cy = _points[1], | ||
|  |                   rx = _points[2], | ||
|  |                   ry = _points[3], | ||
|  |                   theta = _points[4], | ||
|  |                   dTheta = _points[5], | ||
|  |                   psi = _points[6], | ||
|  |                   fs = _points[7]; | ||
|  | 
 | ||
|  |               var r = rx > ry ? rx : ry; | ||
|  |               var scaleX = rx > ry ? 1 : rx / ry; | ||
|  |               var scaleY = rx > ry ? ry / rx : 1; | ||
|  | 
 | ||
|  |               if (ctx) { | ||
|  |                 ctx.translate(cx, cy); | ||
|  |                 ctx.rotate(psi); | ||
|  |                 ctx.scale(scaleX, scaleY); | ||
|  |                 ctx.arc(0, 0, r, theta, theta + dTheta, Boolean(1 - fs)); | ||
|  |                 ctx.scale(1 / scaleX, 1 / scaleY); | ||
|  |                 ctx.rotate(-psi); | ||
|  |                 ctx.translate(-cx, -cy); | ||
|  |               } | ||
|  | 
 | ||
|  |               break; | ||
|  |             } | ||
|  | 
 | ||
|  |           case PathParser.CLOSE_PATH: | ||
|  |             if (ctx) { | ||
|  |               ctx.closePath(); | ||
|  |             } | ||
|  | 
 | ||
|  |             break; | ||
|  |         } | ||
|  |       }); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "renderChildren", | ||
|  |     value: function renderChildren(ctx) { | ||
|  |       this.setTextData(ctx); | ||
|  |       ctx.save(); | ||
|  |       var textDecoration = this.parent.getStyle('text-decoration').getString(); | ||
|  |       var fontSize = this.getFontSize(); | ||
|  |       var glyphInfo = this.glyphInfo; | ||
|  |       var fill = ctx.fillStyle; | ||
|  | 
 | ||
|  |       if (textDecoration === 'underline') { | ||
|  |         ctx.beginPath(); | ||
|  |       } | ||
|  | 
 | ||
|  |       glyphInfo.forEach(function (glyph, i) { | ||
|  |         var p0 = glyph.p0, | ||
|  |             p1 = glyph.p1, | ||
|  |             rotation = glyph.rotation, | ||
|  |             partialText = glyph.text; | ||
|  |         ctx.save(); | ||
|  |         ctx.translate(p0.x, p0.y); | ||
|  |         ctx.rotate(rotation); | ||
|  | 
 | ||
|  |         if (ctx.fillStyle) { | ||
|  |           ctx.fillText(partialText, 0, 0); | ||
|  |         } | ||
|  | 
 | ||
|  |         if (ctx.strokeStyle) { | ||
|  |           ctx.strokeText(partialText, 0, 0); | ||
|  |         } | ||
|  | 
 | ||
|  |         ctx.restore(); | ||
|  | 
 | ||
|  |         if (textDecoration === 'underline') { | ||
|  |           if (i === 0) { | ||
|  |             ctx.moveTo(p0.x, p0.y + fontSize / 8); | ||
|  |           } | ||
|  | 
 | ||
|  |           ctx.lineTo(p1.x, p1.y + fontSize / 5); | ||
|  |         } // // To assist with debugging visually, uncomment following
 | ||
|  |         //
 | ||
|  |         // ctx.beginPath();
 | ||
|  |         // if (i % 2)
 | ||
|  |         // 	ctx.strokeStyle = 'red';
 | ||
|  |         // else
 | ||
|  |         // 	ctx.strokeStyle = 'green';
 | ||
|  |         // ctx.moveTo(p0.x, p0.y);
 | ||
|  |         // ctx.lineTo(p1.x, p1.y);
 | ||
|  |         // ctx.stroke();
 | ||
|  |         // ctx.closePath();
 | ||
|  | 
 | ||
|  |       }); | ||
|  | 
 | ||
|  |       if (textDecoration === 'underline') { | ||
|  |         ctx.lineWidth = fontSize / 20; | ||
|  |         ctx.strokeStyle = fill; | ||
|  |         ctx.stroke(); | ||
|  |         ctx.closePath(); | ||
|  |       } | ||
|  | 
 | ||
|  |       ctx.restore(); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getLetterSpacingAt", | ||
|  |     value: function getLetterSpacingAt() { | ||
|  |       var idx = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0; | ||
|  |       return this.letterSpacingCache[idx] || 0; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "findSegmentToFitChar", | ||
|  |     value: function findSegmentToFitChar(ctx, anchor, textFullWidth, fullPathWidth, spacesNumber, inputOffset, dy, c, charI) { | ||
|  |       var offset = inputOffset; | ||
|  |       var glyphWidth = this.measureText(ctx, c); | ||
|  | 
 | ||
|  |       if (c === ' ' && anchor === 'justify' && textFullWidth < fullPathWidth) { | ||
|  |         glyphWidth += (fullPathWidth - textFullWidth) / spacesNumber; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (charI > -1) { | ||
|  |         offset += this.getLetterSpacingAt(charI); | ||
|  |       } | ||
|  | 
 | ||
|  |       var splineStep = this.textHeight / 20; | ||
|  |       var p0 = this.getEquidistantPointOnPath(offset, splineStep, 0); | ||
|  |       var p1 = this.getEquidistantPointOnPath(offset + glyphWidth, splineStep, 0); | ||
|  |       var segment = { | ||
|  |         p0: p0, | ||
|  |         p1: p1 | ||
|  |       }; | ||
|  |       var rotation = p0 && p1 ? Math.atan2(p1.y - p0.y, p1.x - p0.x) : 0; | ||
|  | 
 | ||
|  |       if (dy) { | ||
|  |         var dyX = Math.cos(Math.PI / 2 + rotation) * dy; | ||
|  |         var dyY = Math.cos(-rotation) * dy; | ||
|  |         segment.p0 = _objectSpread$2(_objectSpread$2({}, p0), {}, { | ||
|  |           x: p0.x + dyX, | ||
|  |           y: p0.y + dyY | ||
|  |         }); | ||
|  |         segment.p1 = _objectSpread$2(_objectSpread$2({}, p1), {}, { | ||
|  |           x: p1.x + dyX, | ||
|  |           y: p1.y + dyY | ||
|  |         }); | ||
|  |       } | ||
|  | 
 | ||
|  |       offset += glyphWidth; | ||
|  |       return { | ||
|  |         offset: offset, | ||
|  |         segment: segment, | ||
|  |         rotation: rotation | ||
|  |       }; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "measureText", | ||
|  |     value: function measureText(ctx, text) { | ||
|  |       var measuresCache = this.measuresCache; | ||
|  |       var targetText = text || this.getText(); | ||
|  | 
 | ||
|  |       if (measuresCache.has(targetText)) { | ||
|  |         return measuresCache.get(targetText); | ||
|  |       } | ||
|  | 
 | ||
|  |       var measure = this.measureTargetText(ctx, targetText); | ||
|  |       measuresCache.set(targetText, measure); | ||
|  |       return measure; | ||
|  |     } // This method supposes what all custom fonts already loaded.
 | ||
|  |     // If some font will be loaded after this method call, <textPath> will not be rendered correctly.
 | ||
|  |     // You need to call this method manually to update glyphs cache.
 | ||
|  | 
 | ||
|  |   }, { | ||
|  |     key: "setTextData", | ||
|  |     value: function setTextData(ctx) { | ||
|  |       var _this2 = this; | ||
|  | 
 | ||
|  |       if (this.glyphInfo) { | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       var renderText = this.getText(); | ||
|  |       var chars = renderText.split(''); | ||
|  |       var spacesNumber = renderText.split(' ').length - 1; | ||
|  |       var dx = this.parent.getAttribute('dx').split().map(function (_) { | ||
|  |         return _.getPixels('x'); | ||
|  |       }); | ||
|  |       var dy = this.parent.getAttribute('dy').getPixels('y'); | ||
|  |       var anchor = this.parent.getStyle('text-anchor').getString('start'); | ||
|  |       var thisSpacing = this.getStyle('letter-spacing'); | ||
|  |       var parentSpacing = this.parent.getStyle('letter-spacing'); | ||
|  |       var letterSpacing = 0; | ||
|  | 
 | ||
|  |       if (!thisSpacing.hasValue() || thisSpacing.getValue() === 'inherit') { | ||
|  |         letterSpacing = parentSpacing.getPixels(); | ||
|  |       } else if (thisSpacing.hasValue()) { | ||
|  |         if (thisSpacing.getValue() !== 'initial' && thisSpacing.getValue() !== 'unset') { | ||
|  |           letterSpacing = thisSpacing.getPixels(); | ||
|  |         } | ||
|  |       } // fill letter-spacing cache
 | ||
|  | 
 | ||
|  | 
 | ||
|  |       var letterSpacingCache = []; | ||
|  |       var textLen = renderText.length; | ||
|  |       this.letterSpacingCache = letterSpacingCache; | ||
|  | 
 | ||
|  |       for (var i = 0; i < textLen; i++) { | ||
|  |         letterSpacingCache.push(typeof dx[i] !== 'undefined' ? dx[i] : letterSpacing); | ||
|  |       } | ||
|  | 
 | ||
|  |       var dxSum = letterSpacingCache.reduce(function (acc, cur, i) { | ||
|  |         return i === 0 ? 0 : acc + cur || 0; | ||
|  |       }, 0); | ||
|  |       var textWidth = this.measureText(ctx); | ||
|  |       var textFullWidth = Math.max(textWidth + dxSum, 0); | ||
|  |       this.textWidth = textWidth; | ||
|  |       this.textHeight = this.getFontSize(); | ||
|  |       this.glyphInfo = []; | ||
|  |       var fullPathWidth = this.getPathLength(); | ||
|  |       var startOffset = this.getStyle('startOffset').getNumber(0) * fullPathWidth; | ||
|  |       var offset = 0; | ||
|  | 
 | ||
|  |       if (anchor === 'middle' || anchor === 'center') { | ||
|  |         offset = -textFullWidth / 2; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (anchor === 'end' || anchor === 'right') { | ||
|  |         offset = -textFullWidth; | ||
|  |       } | ||
|  | 
 | ||
|  |       offset += startOffset; | ||
|  |       chars.forEach(function (char, i) { | ||
|  |         // Find such segment what distance between p0 and p1 is approx. width of glyph
 | ||
|  |         var _this2$findSegmentToF = _this2.findSegmentToFitChar(ctx, anchor, textFullWidth, fullPathWidth, spacesNumber, offset, dy, char, i), | ||
|  |             nextOffset = _this2$findSegmentToF.offset, | ||
|  |             segment = _this2$findSegmentToF.segment, | ||
|  |             rotation = _this2$findSegmentToF.rotation; | ||
|  | 
 | ||
|  |         offset = nextOffset; | ||
|  | 
 | ||
|  |         if (!segment.p0 || !segment.p1) { | ||
|  |           return; | ||
|  |         } // const width = this.getLineLength(
 | ||
|  |         // 	segment.p0.x,
 | ||
|  |         // 	segment.p0.y,
 | ||
|  |         // 	segment.p1.x,
 | ||
|  |         // 	segment.p1.y
 | ||
|  |         // );
 | ||
|  |         // Note: Since glyphs are rendered one at a time, any kerning pair data built into the font will not be used.
 | ||
|  |         // Can foresee having a rough pair table built in that the developer can override as needed.
 | ||
|  |         // Or use "dx" attribute of the <text> node as a naive replacement
 | ||
|  |         // const kern = 0;
 | ||
|  |         // placeholder for future implementation
 | ||
|  |         // const midpoint = this.getPointOnLine(
 | ||
|  |         // 	kern + width / 2.0,
 | ||
|  |         // 	segment.p0.x, segment.p0.y, segment.p1.x, segment.p1.y
 | ||
|  |         // );
 | ||
|  | 
 | ||
|  | 
 | ||
|  |         _this2.glyphInfo.push({ | ||
|  |           // transposeX: midpoint.x,
 | ||
|  |           // transposeY: midpoint.y,
 | ||
|  |           text: chars[i], | ||
|  |           p0: segment.p0, | ||
|  |           p1: segment.p1, | ||
|  |           rotation: rotation | ||
|  |         }); | ||
|  |       }); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "parsePathData", | ||
|  |     value: function parsePathData(path) { | ||
|  |       this.pathLength = -1; // reset path length
 | ||
|  | 
 | ||
|  |       if (!path) { | ||
|  |         return []; | ||
|  |       } | ||
|  | 
 | ||
|  |       var pathCommands = []; | ||
|  |       var pathParser = path.pathParser; | ||
|  |       pathParser.reset(); // convert l, H, h, V, and v to L
 | ||
|  | 
 | ||
|  |       while (!pathParser.isEnd()) { | ||
|  |         var current = pathParser.current; | ||
|  |         var startX = current ? current.x : 0; | ||
|  |         var startY = current ? current.y : 0; | ||
|  |         var command = pathParser.next(); | ||
|  |         var nextCommandType = command.type; | ||
|  |         var points = []; | ||
|  | 
 | ||
|  |         switch (command.type) { | ||
|  |           case PathParser.MOVE_TO: | ||
|  |             this.pathM(pathParser, points); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.LINE_TO: | ||
|  |             nextCommandType = this.pathL(pathParser, points); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.HORIZ_LINE_TO: | ||
|  |             nextCommandType = this.pathH(pathParser, points); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.VERT_LINE_TO: | ||
|  |             nextCommandType = this.pathV(pathParser, points); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.CURVE_TO: | ||
|  |             this.pathC(pathParser, points); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.SMOOTH_CURVE_TO: | ||
|  |             nextCommandType = this.pathS(pathParser, points); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.QUAD_TO: | ||
|  |             this.pathQ(pathParser, points); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.SMOOTH_QUAD_TO: | ||
|  |             nextCommandType = this.pathT(pathParser, points); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.ARC: | ||
|  |             points = this.pathA(pathParser); | ||
|  |             break; | ||
|  | 
 | ||
|  |           case PathParser.CLOSE_PATH: | ||
|  |             PathElement.pathZ(pathParser); | ||
|  |             break; | ||
|  |         } | ||
|  | 
 | ||
|  |         if (command.type !== PathParser.CLOSE_PATH) { | ||
|  |           pathCommands.push({ | ||
|  |             type: nextCommandType, | ||
|  |             points: points, | ||
|  |             start: { | ||
|  |               x: startX, | ||
|  |               y: startY | ||
|  |             }, | ||
|  |             pathLength: this.calcLength(startX, startY, nextCommandType, points) | ||
|  |           }); | ||
|  |         } else { | ||
|  |           pathCommands.push({ | ||
|  |             type: PathParser.CLOSE_PATH, | ||
|  |             points: [], | ||
|  |             pathLength: 0 | ||
|  |           }); | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       return pathCommands; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathM", | ||
|  |     value: function pathM(pathParser, points) { | ||
|  |       var _PathElement$pathM$po = PathElement.pathM(pathParser).point, | ||
|  |           x = _PathElement$pathM$po.x, | ||
|  |           y = _PathElement$pathM$po.y; | ||
|  |       points.push(x, y); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathL", | ||
|  |     value: function pathL(pathParser, points) { | ||
|  |       var _PathElement$pathL$po = PathElement.pathL(pathParser).point, | ||
|  |           x = _PathElement$pathL$po.x, | ||
|  |           y = _PathElement$pathL$po.y; | ||
|  |       points.push(x, y); | ||
|  |       return PathParser.LINE_TO; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathH", | ||
|  |     value: function pathH(pathParser, points) { | ||
|  |       var _PathElement$pathH$po = PathElement.pathH(pathParser).point, | ||
|  |           x = _PathElement$pathH$po.x, | ||
|  |           y = _PathElement$pathH$po.y; | ||
|  |       points.push(x, y); | ||
|  |       return PathParser.LINE_TO; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathV", | ||
|  |     value: function pathV(pathParser, points) { | ||
|  |       var _PathElement$pathV$po = PathElement.pathV(pathParser).point, | ||
|  |           x = _PathElement$pathV$po.x, | ||
|  |           y = _PathElement$pathV$po.y; | ||
|  |       points.push(x, y); | ||
|  |       return PathParser.LINE_TO; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathC", | ||
|  |     value: function pathC(pathParser, points) { | ||
|  |       var _PathElement$pathC = PathElement.pathC(pathParser), | ||
|  |           point = _PathElement$pathC.point, | ||
|  |           controlPoint = _PathElement$pathC.controlPoint, | ||
|  |           currentPoint = _PathElement$pathC.currentPoint; | ||
|  | 
 | ||
|  |       points.push(point.x, point.y, controlPoint.x, controlPoint.y, currentPoint.x, currentPoint.y); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathS", | ||
|  |     value: function pathS(pathParser, points) { | ||
|  |       var _PathElement$pathS = PathElement.pathS(pathParser), | ||
|  |           point = _PathElement$pathS.point, | ||
|  |           controlPoint = _PathElement$pathS.controlPoint, | ||
|  |           currentPoint = _PathElement$pathS.currentPoint; | ||
|  | 
 | ||
|  |       points.push(point.x, point.y, controlPoint.x, controlPoint.y, currentPoint.x, currentPoint.y); | ||
|  |       return PathParser.CURVE_TO; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathQ", | ||
|  |     value: function pathQ(pathParser, points) { | ||
|  |       var _PathElement$pathQ = PathElement.pathQ(pathParser), | ||
|  |           controlPoint = _PathElement$pathQ.controlPoint, | ||
|  |           currentPoint = _PathElement$pathQ.currentPoint; | ||
|  | 
 | ||
|  |       points.push(controlPoint.x, controlPoint.y, currentPoint.x, currentPoint.y); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathT", | ||
|  |     value: function pathT(pathParser, points) { | ||
|  |       var _PathElement$pathT = PathElement.pathT(pathParser), | ||
|  |           controlPoint = _PathElement$pathT.controlPoint, | ||
|  |           currentPoint = _PathElement$pathT.currentPoint; | ||
|  | 
 | ||
|  |       points.push(controlPoint.x, controlPoint.y, currentPoint.x, currentPoint.y); | ||
|  |       return PathParser.QUAD_TO; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "pathA", | ||
|  |     value: function pathA(pathParser) { | ||
|  |       var _PathElement$pathA = PathElement.pathA(pathParser), | ||
|  |           rX = _PathElement$pathA.rX, | ||
|  |           rY = _PathElement$pathA.rY, | ||
|  |           sweepFlag = _PathElement$pathA.sweepFlag, | ||
|  |           xAxisRotation = _PathElement$pathA.xAxisRotation, | ||
|  |           centp = _PathElement$pathA.centp, | ||
|  |           a1 = _PathElement$pathA.a1, | ||
|  |           ad = _PathElement$pathA.ad; | ||
|  | 
 | ||
|  |       if (sweepFlag === 0 && ad > 0) { | ||
|  |         ad -= 2 * Math.PI; | ||
|  |       } | ||
|  | 
 | ||
|  |       if (sweepFlag === 1 && ad < 0) { | ||
|  |         ad += 2 * Math.PI; | ||
|  |       } | ||
|  | 
 | ||
|  |       return [centp.x, centp.y, rX, rY, a1, ad, xAxisRotation, sweepFlag]; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "calcLength", | ||
|  |     value: function calcLength(x, y, commandType, points) { | ||
|  |       var len = 0; | ||
|  |       var p1 = null; | ||
|  |       var p2 = null; | ||
|  |       var t = 0; | ||
|  | 
 | ||
|  |       switch (commandType) { | ||
|  |         case PathParser.LINE_TO: | ||
|  |           return this.getLineLength(x, y, points[0], points[1]); | ||
|  | 
 | ||
|  |         case PathParser.CURVE_TO: | ||
|  |           // Approximates by breaking curve into 100 line segments
 | ||
|  |           len = 0.0; | ||
|  |           p1 = this.getPointOnCubicBezier(0, x, y, points[0], points[1], points[2], points[3], points[4], points[5]); | ||
|  | 
 | ||
|  |           for (t = 0.01; t <= 1; t += 0.01) { | ||
|  |             p2 = this.getPointOnCubicBezier(t, x, y, points[0], points[1], points[2], points[3], points[4], points[5]); | ||
|  |             len += this.getLineLength(p1.x, p1.y, p2.x, p2.y); | ||
|  |             p1 = p2; | ||
|  |           } | ||
|  | 
 | ||
|  |           return len; | ||
|  | 
 | ||
|  |         case PathParser.QUAD_TO: | ||
|  |           // Approximates by breaking curve into 100 line segments
 | ||
|  |           len = 0.0; | ||
|  |           p1 = this.getPointOnQuadraticBezier(0, x, y, points[0], points[1], points[2], points[3]); | ||
|  | 
 | ||
|  |           for (t = 0.01; t <= 1; t += 0.01) { | ||
|  |             p2 = this.getPointOnQuadraticBezier(t, x, y, points[0], points[1], points[2], points[3]); | ||
|  |             len += this.getLineLength(p1.x, p1.y, p2.x, p2.y); | ||
|  |             p1 = p2; | ||
|  |           } | ||
|  | 
 | ||
|  |           return len; | ||
|  | 
 | ||
|  |         case PathParser.ARC: | ||
|  |           { | ||
|  |             // Approximates by breaking curve into line segments
 | ||
|  |             len = 0.0; | ||
|  |             var start = points[4]; // 4 = theta
 | ||
|  | 
 | ||
|  |             var dTheta = points[5]; // 5 = dTheta
 | ||
|  | 
 | ||
|  |             var end = points[4] + dTheta; | ||
|  |             var inc = Math.PI / 180.0; // 1 degree resolution
 | ||
|  | 
 | ||
|  |             if (Math.abs(start - end) < inc) { | ||
|  |               inc = Math.abs(start - end); | ||
|  |             } // Note: for purpose of calculating arc length, not going to worry about rotating X-axis by angle psi
 | ||
|  | 
 | ||
|  | 
 | ||
|  |             p1 = this.getPointOnEllipticalArc(points[0], points[1], points[2], points[3], start, 0); | ||
|  | 
 | ||
|  |             if (dTheta < 0) { | ||
|  |               // clockwise
 | ||
|  |               for (t = start - inc; t > end; t -= inc) { | ||
|  |                 p2 = this.getPointOnEllipticalArc(points[0], points[1], points[2], points[3], t, 0); | ||
|  |                 len += this.getLineLength(p1.x, p1.y, p2.x, p2.y); | ||
|  |                 p1 = p2; | ||
|  |               } | ||
|  |             } else { | ||
|  |               // counter-clockwise
 | ||
|  |               for (t = start + inc; t < end; t += inc) { | ||
|  |                 p2 = this.getPointOnEllipticalArc(points[0], points[1], points[2], points[3], t, 0); | ||
|  |                 len += this.getLineLength(p1.x, p1.y, p2.x, p2.y); | ||
|  |                 p1 = p2; | ||
|  |               } | ||
|  |             } | ||
|  | 
 | ||
|  |             p2 = this.getPointOnEllipticalArc(points[0], points[1], points[2], points[3], end, 0); | ||
|  |             len += this.getLineLength(p1.x, p1.y, p2.x, p2.y); | ||
|  |             return len; | ||
|  |           } | ||
|  |       } | ||
|  | 
 | ||
|  |       return 0; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getPointOnLine", | ||
|  |     value: function getPointOnLine(dist, p1x, p1y, p2x, p2y) { | ||
|  |       var fromX = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : p1x; | ||
|  |       var fromY = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : p1y; | ||
|  |       var m = (p2y - p1y) / (p2x - p1x + PSEUDO_ZERO); | ||
|  |       var run = Math.sqrt(dist * dist / (1 + m * m)); | ||
|  | 
 | ||
|  |       if (p2x < p1x) { | ||
|  |         run *= -1; | ||
|  |       } | ||
|  | 
 | ||
|  |       var rise = m * run; | ||
|  |       var pt = null; | ||
|  | 
 | ||
|  |       if (p2x === p1x) { | ||
|  |         // vertical line
 | ||
|  |         pt = { | ||
|  |           x: fromX, | ||
|  |           y: fromY + rise | ||
|  |         }; | ||
|  |       } else if ((fromY - p1y) / (fromX - p1x + PSEUDO_ZERO) === m) { | ||
|  |         pt = { | ||
|  |           x: fromX + run, | ||
|  |           y: fromY + rise | ||
|  |         }; | ||
|  |       } else { | ||
|  |         var ix = 0; | ||
|  |         var iy = 0; | ||
|  |         var len = this.getLineLength(p1x, p1y, p2x, p2y); | ||
|  | 
 | ||
|  |         if (len < PSEUDO_ZERO) { | ||
|  |           return null; | ||
|  |         } | ||
|  | 
 | ||
|  |         var u = (fromX - p1x) * (p2x - p1x) + (fromY - p1y) * (p2y - p1y); | ||
|  |         u /= len * len; | ||
|  |         ix = p1x + u * (p2x - p1x); | ||
|  |         iy = p1y + u * (p2y - p1y); | ||
|  |         var pRise = this.getLineLength(fromX, fromY, ix, iy); | ||
|  |         var pRun = Math.sqrt(dist * dist - pRise * pRise); | ||
|  |         run = Math.sqrt(pRun * pRun / (1 + m * m)); | ||
|  | 
 | ||
|  |         if (p2x < p1x) { | ||
|  |           run *= -1; | ||
|  |         } | ||
|  | 
 | ||
|  |         rise = m * run; | ||
|  |         pt = { | ||
|  |           x: ix + run, | ||
|  |           y: iy + rise | ||
|  |         }; | ||
|  |       } | ||
|  | 
 | ||
|  |       return pt; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getPointOnPath", | ||
|  |     value: function getPointOnPath(distance) { | ||
|  |       var fullLen = this.getPathLength(); | ||
|  |       var cumulativePathLength = 0; | ||
|  |       var p = null; | ||
|  | 
 | ||
|  |       if (distance < -0.00005 || distance - 0.00005 > fullLen) { | ||
|  |         return null; | ||
|  |       } | ||
|  | 
 | ||
|  |       var dataArray = this.dataArray; | ||
|  | 
 | ||
|  |       var _iterator = _createForOfIteratorHelper(dataArray), | ||
|  |           _step; | ||
|  | 
 | ||
|  |       try { | ||
|  |         for (_iterator.s(); !(_step = _iterator.n()).done;) { | ||
|  |           var command = _step.value; | ||
|  | 
 | ||
|  |           if (command && (command.pathLength < 0.00005 || cumulativePathLength + command.pathLength + 0.00005 < distance)) { | ||
|  |             cumulativePathLength += command.pathLength; | ||
|  |             continue; | ||
|  |           } | ||
|  | 
 | ||
|  |           var delta = distance - cumulativePathLength; | ||
|  |           var currentT = 0; | ||
|  | 
 | ||
|  |           switch (command.type) { | ||
|  |             case PathParser.LINE_TO: | ||
|  |               p = this.getPointOnLine(delta, command.start.x, command.start.y, command.points[0], command.points[1], command.start.x, command.start.y); | ||
|  |               break; | ||
|  | 
 | ||
|  |             case PathParser.ARC: | ||
|  |               { | ||
|  |                 var start = command.points[4]; // 4 = theta
 | ||
|  | 
 | ||
|  |                 var dTheta = command.points[5]; // 5 = dTheta
 | ||
|  | 
 | ||
|  |                 var end = command.points[4] + dTheta; | ||
|  |                 currentT = start + delta / command.pathLength * dTheta; | ||
|  | 
 | ||
|  |                 if (dTheta < 0 && currentT < end || dTheta >= 0 && currentT > end) { | ||
|  |                   break; | ||
|  |                 } | ||
|  | 
 | ||
|  |                 p = this.getPointOnEllipticalArc(command.points[0], command.points[1], command.points[2], command.points[3], currentT, command.points[6]); | ||
|  |                 break; | ||
|  |               } | ||
|  | 
 | ||
|  |             case PathParser.CURVE_TO: | ||
|  |               currentT = delta / command.pathLength; | ||
|  | 
 | ||
|  |               if (currentT > 1) { | ||
|  |                 currentT = 1; | ||
|  |               } | ||
|  | 
 | ||
|  |               p = this.getPointOnCubicBezier(currentT, command.start.x, command.start.y, command.points[0], command.points[1], command.points[2], command.points[3], command.points[4], command.points[5]); | ||
|  |               break; | ||
|  | 
 | ||
|  |             case PathParser.QUAD_TO: | ||
|  |               currentT = delta / command.pathLength; | ||
|  | 
 | ||
|  |               if (currentT > 1) { | ||
|  |                 currentT = 1; | ||
|  |               } | ||
|  | 
 | ||
|  |               p = this.getPointOnQuadraticBezier(currentT, command.start.x, command.start.y, command.points[0], command.points[1], command.points[2], command.points[3]); | ||
|  |               break; | ||
|  | 
 | ||
|  |             default: | ||
|  |           } | ||
|  | 
 | ||
|  |           if (p) { | ||
|  |             return p; | ||
|  |           } | ||
|  | 
 | ||
|  |           break; | ||
|  |         } | ||
|  |       } catch (err) { | ||
|  |         _iterator.e(err); | ||
|  |       } finally { | ||
|  |         _iterator.f(); | ||
|  |       } | ||
|  | 
 | ||
|  |       return null; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getLineLength", | ||
|  |     value: function getLineLength(x1, y1, x2, y2) { | ||
|  |       return Math.sqrt((x2 - x1) * (x2 - x1) + (y2 - y1) * (y2 - y1)); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getPathLength", | ||
|  |     value: function getPathLength() { | ||
|  |       if (this.pathLength === -1) { | ||
|  |         this.pathLength = this.dataArray.reduce(function (length, command) { | ||
|  |           return command.pathLength > 0 ? length + command.pathLength : length; | ||
|  |         }, 0); | ||
|  |       } | ||
|  | 
 | ||
|  |       return this.pathLength; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getPointOnCubicBezier", | ||
|  |     value: function getPointOnCubicBezier(pct, p1x, p1y, p2x, p2y, p3x, p3y, p4x, p4y) { | ||
|  |       var x = p4x * CB1(pct) + p3x * CB2(pct) + p2x * CB3(pct) + p1x * CB4(pct); | ||
|  |       var y = p4y * CB1(pct) + p3y * CB2(pct) + p2y * CB3(pct) + p1y * CB4(pct); | ||
|  |       return { | ||
|  |         x: x, | ||
|  |         y: y | ||
|  |       }; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getPointOnQuadraticBezier", | ||
|  |     value: function getPointOnQuadraticBezier(pct, p1x, p1y, p2x, p2y, p3x, p3y) { | ||
|  |       var x = p3x * QB1(pct) + p2x * QB2(pct) + p1x * QB3(pct); | ||
|  |       var y = p3y * QB1(pct) + p2y * QB2(pct) + p1y * QB3(pct); | ||
|  |       return { | ||
|  |         x: x, | ||
|  |         y: y | ||
|  |       }; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getPointOnEllipticalArc", | ||
|  |     value: function getPointOnEllipticalArc(cx, cy, rx, ry, theta, psi) { | ||
|  |       var cosPsi = Math.cos(psi); | ||
|  |       var sinPsi = Math.sin(psi); | ||
|  |       var pt = { | ||
|  |         x: rx * Math.cos(theta), | ||
|  |         y: ry * Math.sin(theta) | ||
|  |       }; | ||
|  |       return { | ||
|  |         x: cx + (pt.x * cosPsi - pt.y * sinPsi), | ||
|  |         y: cy + (pt.x * sinPsi + pt.y * cosPsi) | ||
|  |       }; | ||
|  |     } // TODO need some optimisations. possibly build cache only for curved segments?
 | ||
|  | 
 | ||
|  |   }, { | ||
|  |     key: "buildEquidistantCache", | ||
|  |     value: function buildEquidistantCache(inputStep, inputPrecision) { | ||
|  |       var fullLen = this.getPathLength(); | ||
|  |       var precision = inputPrecision || 0.25; // accuracy vs performance
 | ||
|  | 
 | ||
|  |       var step = inputStep || fullLen / 100; | ||
|  | 
 | ||
|  |       if (!this.equidistantCache || this.equidistantCache.step !== step || this.equidistantCache.precision !== precision) { | ||
|  |         // Prepare cache
 | ||
|  |         this.equidistantCache = { | ||
|  |           step: step, | ||
|  |           precision: precision, | ||
|  |           points: [] | ||
|  |         }; // Calculate points
 | ||
|  | 
 | ||
|  |         var s = 0; | ||
|  | 
 | ||
|  |         for (var l = 0; l <= fullLen; l += precision) { | ||
|  |           var p0 = this.getPointOnPath(l); | ||
|  |           var p1 = this.getPointOnPath(l + precision); | ||
|  | 
 | ||
|  |           if (!p0 || !p1) { | ||
|  |             continue; | ||
|  |           } | ||
|  | 
 | ||
|  |           s += this.getLineLength(p0.x, p0.y, p1.x, p1.y); | ||
|  | 
 | ||
|  |           if (s >= step) { | ||
|  |             this.equidistantCache.points.push({ | ||
|  |               x: p0.x, | ||
|  |               y: p0.y, | ||
|  |               distance: l | ||
|  |             }); | ||
|  |             s -= step; | ||
|  |           } | ||
|  |         } | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getEquidistantPointOnPath", | ||
|  |     value: function getEquidistantPointOnPath(targetDistance, step, precision) { | ||
|  |       this.buildEquidistantCache(step, precision); | ||
|  | 
 | ||
|  |       if (targetDistance < 0 || targetDistance - this.getPathLength() > 0.00005) { | ||
|  |         return null; | ||
|  |       } | ||
|  | 
 | ||
|  |       var idx = Math.round(targetDistance / this.getPathLength() * (this.equidistantCache.points.length - 1)); | ||
|  |       return this.equidistantCache.points[idx] || null; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return TextPathElement; | ||
|  | }(TextElement); | ||
|  | 
 | ||
|  | function _createSuper$d(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$d(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$d() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var dataUriRegex = /^\s*data:(([^/,;]+\/[^/,;]+)(?:;([^,;=]+=[^,;=]+))?)?(?:;(base64))?,(.*)$/i; | ||
|  | 
 | ||
|  | var ImageElement = /*#__PURE__*/function (_RenderedElement) { | ||
|  |   _inherits__default['default'](ImageElement, _RenderedElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$d(ImageElement); | ||
|  | 
 | ||
|  |   function ImageElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, ImageElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.type = 'image'; | ||
|  |     _this.loaded = false; | ||
|  | 
 | ||
|  |     var href = _this.getHrefAttribute().getString(); | ||
|  | 
 | ||
|  |     if (!href) { | ||
|  |       return _possibleConstructorReturn__default['default'](_this); | ||
|  |     } | ||
|  | 
 | ||
|  |     var isSvg = href.endsWith('.svg') || /^\s*data:image\/svg\+xml/i.test(href); | ||
|  |     document.images.push(_assertThisInitialized__default['default'](_this)); | ||
|  | 
 | ||
|  |     if (!isSvg) { | ||
|  |       void _this.loadImage(href); | ||
|  |     } else { | ||
|  |       void _this.loadSvg(href); | ||
|  |     } | ||
|  | 
 | ||
|  |     _this.isSvg = isSvg; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](ImageElement, [{ | ||
|  |     key: "loadImage", | ||
|  |     value: function () { | ||
|  |       var _loadImage = _asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee(href) { | ||
|  |         var image; | ||
|  |         return _regeneratorRuntime__default['default'].wrap(function _callee$(_context) { | ||
|  |           while (1) { | ||
|  |             switch (_context.prev = _context.next) { | ||
|  |               case 0: | ||
|  |                 _context.prev = 0; | ||
|  |                 _context.next = 3; | ||
|  |                 return this.document.createImage(href); | ||
|  | 
 | ||
|  |               case 3: | ||
|  |                 image = _context.sent; | ||
|  |                 this.image = image; | ||
|  |                 _context.next = 10; | ||
|  |                 break; | ||
|  | 
 | ||
|  |               case 7: | ||
|  |                 _context.prev = 7; | ||
|  |                 _context.t0 = _context["catch"](0); | ||
|  |                 console.error("Error while loading image \"".concat(href, "\":"), _context.t0); | ||
|  | 
 | ||
|  |               case 10: | ||
|  |                 this.loaded = true; | ||
|  | 
 | ||
|  |               case 11: | ||
|  |               case "end": | ||
|  |                 return _context.stop(); | ||
|  |             } | ||
|  |           } | ||
|  |         }, _callee, this, [[0, 7]]); | ||
|  |       })); | ||
|  | 
 | ||
|  |       function loadImage(_x) { | ||
|  |         return _loadImage.apply(this, arguments); | ||
|  |       } | ||
|  | 
 | ||
|  |       return loadImage; | ||
|  |     }() | ||
|  |   }, { | ||
|  |     key: "loadSvg", | ||
|  |     value: function () { | ||
|  |       var _loadSvg = _asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee2(href) { | ||
|  |         var match, data, response, svg; | ||
|  |         return _regeneratorRuntime__default['default'].wrap(function _callee2$(_context2) { | ||
|  |           while (1) { | ||
|  |             switch (_context2.prev = _context2.next) { | ||
|  |               case 0: | ||
|  |                 match = dataUriRegex.exec(href); | ||
|  | 
 | ||
|  |                 if (!match) { | ||
|  |                   _context2.next = 6; | ||
|  |                   break; | ||
|  |                 } | ||
|  | 
 | ||
|  |                 data = match[5]; | ||
|  | 
 | ||
|  |                 if (match[4] === 'base64') { | ||
|  |                   this.image = atob(data); | ||
|  |                 } else { | ||
|  |                   this.image = decodeURIComponent(data); | ||
|  |                 } | ||
|  | 
 | ||
|  |                 _context2.next = 19; | ||
|  |                 break; | ||
|  | 
 | ||
|  |               case 6: | ||
|  |                 _context2.prev = 6; | ||
|  |                 _context2.next = 9; | ||
|  |                 return this.document.fetch(href); | ||
|  | 
 | ||
|  |               case 9: | ||
|  |                 response = _context2.sent; | ||
|  |                 _context2.next = 12; | ||
|  |                 return response.text(); | ||
|  | 
 | ||
|  |               case 12: | ||
|  |                 svg = _context2.sent; | ||
|  |                 this.image = svg; | ||
|  |                 _context2.next = 19; | ||
|  |                 break; | ||
|  | 
 | ||
|  |               case 16: | ||
|  |                 _context2.prev = 16; | ||
|  |                 _context2.t0 = _context2["catch"](6); | ||
|  |                 console.error("Error while loading image \"".concat(href, "\":"), _context2.t0); | ||
|  | 
 | ||
|  |               case 19: | ||
|  |                 this.loaded = true; | ||
|  | 
 | ||
|  |               case 20: | ||
|  |               case "end": | ||
|  |                 return _context2.stop(); | ||
|  |             } | ||
|  |           } | ||
|  |         }, _callee2, this, [[6, 16]]); | ||
|  |       })); | ||
|  | 
 | ||
|  |       function loadSvg(_x2) { | ||
|  |         return _loadSvg.apply(this, arguments); | ||
|  |       } | ||
|  | 
 | ||
|  |       return loadSvg; | ||
|  |     }() | ||
|  |   }, { | ||
|  |     key: "renderChildren", | ||
|  |     value: function renderChildren(ctx) { | ||
|  |       var document = this.document, | ||
|  |           image = this.image, | ||
|  |           loaded = this.loaded; | ||
|  |       var x = this.getAttribute('x').getPixels('x'); | ||
|  |       var y = this.getAttribute('y').getPixels('y'); | ||
|  |       var width = this.getStyle('width').getPixels('x'); | ||
|  |       var height = this.getStyle('height').getPixels('y'); | ||
|  | 
 | ||
|  |       if (!loaded || !image || !width || !height) { | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       ctx.save(); | ||
|  |       ctx.translate(x, y); | ||
|  | 
 | ||
|  |       if (this.isSvg) { | ||
|  |         var subDocument = document.canvg.forkString(ctx, this.image, { | ||
|  |           ignoreMouse: true, | ||
|  |           ignoreAnimation: true, | ||
|  |           ignoreDimensions: true, | ||
|  |           ignoreClear: true, | ||
|  |           offsetX: 0, | ||
|  |           offsetY: 0, | ||
|  |           scaleWidth: width, | ||
|  |           scaleHeight: height | ||
|  |         }); | ||
|  |         subDocument.document.documentElement.parent = this; | ||
|  |         void subDocument.render(); | ||
|  |       } else { | ||
|  |         var _image = this.image; | ||
|  |         document.setViewBox({ | ||
|  |           ctx: ctx, | ||
|  |           aspectRatio: this.getAttribute('preserveAspectRatio').getString(), | ||
|  |           width: width, | ||
|  |           desiredWidth: _image.width, | ||
|  |           height: height, | ||
|  |           desiredHeight: _image.height | ||
|  |         }); | ||
|  | 
 | ||
|  |         if (this.loaded) { | ||
|  |           if (typeof _image.complete === 'undefined' || _image.complete) { | ||
|  |             ctx.drawImage(_image, 0, 0); | ||
|  |           } | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       ctx.restore(); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getBoundingBox", | ||
|  |     value: function getBoundingBox() { | ||
|  |       var x = this.getAttribute('x').getPixels('x'); | ||
|  |       var y = this.getAttribute('y').getPixels('y'); | ||
|  |       var width = this.getStyle('width').getPixels('x'); | ||
|  |       var height = this.getStyle('height').getPixels('y'); | ||
|  |       return new BoundingBox(x, y, x + width, y + height); | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return ImageElement; | ||
|  | }(RenderedElement); | ||
|  | 
 | ||
|  | function _createSuper$c(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$c(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$c() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var SymbolElement = /*#__PURE__*/function (_RenderedElement) { | ||
|  |   _inherits__default['default'](SymbolElement, _RenderedElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$c(SymbolElement); | ||
|  | 
 | ||
|  |   function SymbolElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, SymbolElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'symbol'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](SymbolElement, [{ | ||
|  |     key: "render", | ||
|  |     value: function render(_) {// NO RENDER
 | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return SymbolElement; | ||
|  | }(RenderedElement); | ||
|  | 
 | ||
|  | var SVGFontLoader = /*#__PURE__*/function () { | ||
|  |   function SVGFontLoader(document) { | ||
|  |     _classCallCheck__default['default'](this, SVGFontLoader); | ||
|  | 
 | ||
|  |     this.document = document; | ||
|  |     this.loaded = false; | ||
|  |     document.fonts.push(this); | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](SVGFontLoader, [{ | ||
|  |     key: "load", | ||
|  |     value: function () { | ||
|  |       var _load = _asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee(fontFamily, url) { | ||
|  |         var document, svgDocument, fonts; | ||
|  |         return _regeneratorRuntime__default['default'].wrap(function _callee$(_context) { | ||
|  |           while (1) { | ||
|  |             switch (_context.prev = _context.next) { | ||
|  |               case 0: | ||
|  |                 _context.prev = 0; | ||
|  |                 document = this.document; | ||
|  |                 _context.next = 4; | ||
|  |                 return document.canvg.parser.load(url); | ||
|  | 
 | ||
|  |               case 4: | ||
|  |                 svgDocument = _context.sent; | ||
|  |                 fonts = svgDocument.getElementsByTagName('font'); | ||
|  |                 Array.from(fonts).forEach(function (fontNode) { | ||
|  |                   var font = document.createElement(fontNode); | ||
|  |                   document.definitions[fontFamily] = font; | ||
|  |                 }); | ||
|  |                 _context.next = 12; | ||
|  |                 break; | ||
|  | 
 | ||
|  |               case 9: | ||
|  |                 _context.prev = 9; | ||
|  |                 _context.t0 = _context["catch"](0); | ||
|  |                 console.error("Error while loading font \"".concat(url, "\":"), _context.t0); | ||
|  | 
 | ||
|  |               case 12: | ||
|  |                 this.loaded = true; | ||
|  | 
 | ||
|  |               case 13: | ||
|  |               case "end": | ||
|  |                 return _context.stop(); | ||
|  |             } | ||
|  |           } | ||
|  |         }, _callee, this, [[0, 9]]); | ||
|  |       })); | ||
|  | 
 | ||
|  |       function load(_x, _x2) { | ||
|  |         return _load.apply(this, arguments); | ||
|  |       } | ||
|  | 
 | ||
|  |       return load; | ||
|  |     }() | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return SVGFontLoader; | ||
|  | }(); | ||
|  | 
 | ||
|  | function _createSuper$b(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$b(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$b() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var StyleElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](StyleElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$b(StyleElement); | ||
|  | 
 | ||
|  |   function StyleElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, StyleElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.type = 'style'; | ||
|  |     var css = compressSpaces(Array.from(node.childNodes) // NEED TEST
 | ||
|  |     .map(function (_) { | ||
|  |       return _.textContent; | ||
|  |     }).join('').replace(/(\/\*([^*]|[\r\n]|(\*+([^*/]|[\r\n])))*\*+\/)|(^[\s]*\/\/.*)/gm, '') // remove comments
 | ||
|  |     .replace(/@import.*;/g, '') // remove imports
 | ||
|  |     ); | ||
|  |     var cssDefs = css.split('}'); | ||
|  |     cssDefs.forEach(function (_) { | ||
|  |       var def = _.trim(); | ||
|  | 
 | ||
|  |       if (!def) { | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       var cssParts = def.split('{'); | ||
|  |       var cssClasses = cssParts[0].split(','); | ||
|  |       var cssProps = cssParts[1].split(';'); | ||
|  |       cssClasses.forEach(function (_) { | ||
|  |         var cssClass = _.trim(); | ||
|  | 
 | ||
|  |         if (!cssClass) { | ||
|  |           return; | ||
|  |         } | ||
|  | 
 | ||
|  |         var props = document.styles[cssClass] || {}; | ||
|  |         cssProps.forEach(function (cssProp) { | ||
|  |           var prop = cssProp.indexOf(':'); | ||
|  |           var name = cssProp.substr(0, prop).trim(); | ||
|  |           var value = cssProp.substr(prop + 1, cssProp.length - prop).trim(); | ||
|  | 
 | ||
|  |           if (name && value) { | ||
|  |             props[name] = new Property(document, name, value); | ||
|  |           } | ||
|  |         }); | ||
|  |         document.styles[cssClass] = props; | ||
|  |         document.stylesSpecificity[cssClass] = getSelectorSpecificity(cssClass); | ||
|  | 
 | ||
|  |         if (cssClass === '@font-face') { | ||
|  |           //  && !nodeEnv
 | ||
|  |           var fontFamily = props['font-family'].getString().replace(/"|'/g, ''); | ||
|  |           var srcs = props.src.getString().split(','); | ||
|  |           srcs.forEach(function (src) { | ||
|  |             if (src.indexOf('format("svg")') > 0) { | ||
|  |               var url = parseExternalUrl(src); | ||
|  | 
 | ||
|  |               if (url) { | ||
|  |                 void new SVGFontLoader(document).load(fontFamily, url); | ||
|  |               } | ||
|  |             } | ||
|  |           }); | ||
|  |         } | ||
|  |       }); | ||
|  |     }); | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   return StyleElement; | ||
|  | }(Element); | ||
|  | StyleElement.parseExternalUrl = parseExternalUrl; | ||
|  | 
 | ||
|  | function _createSuper$a(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$a(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$a() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var UseElement = /*#__PURE__*/function (_RenderedElement) { | ||
|  |   _inherits__default['default'](UseElement, _RenderedElement); | ||
|  | 
 | ||
|  |   var _super = _createSuper$a(UseElement); | ||
|  | 
 | ||
|  |   function UseElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, UseElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'use'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](UseElement, [{ | ||
|  |     key: "setContext", | ||
|  |     value: function setContext(ctx) { | ||
|  |       _get__default['default'](_getPrototypeOf__default['default'](UseElement.prototype), "setContext", this).call(this, ctx); | ||
|  | 
 | ||
|  |       var xAttr = this.getAttribute('x'); | ||
|  |       var yAttr = this.getAttribute('y'); | ||
|  | 
 | ||
|  |       if (xAttr.hasValue()) { | ||
|  |         ctx.translate(xAttr.getPixels('x'), 0); | ||
|  |       } | ||
|  | 
 | ||
|  |       if (yAttr.hasValue()) { | ||
|  |         ctx.translate(0, yAttr.getPixels('y')); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "path", | ||
|  |     value: function path(ctx) { | ||
|  |       var element = this.element; | ||
|  | 
 | ||
|  |       if (element) { | ||
|  |         element.path(ctx); | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "renderChildren", | ||
|  |     value: function renderChildren(ctx) { | ||
|  |       var document = this.document, | ||
|  |           element = this.element; | ||
|  | 
 | ||
|  |       if (element) { | ||
|  |         var tempSvg = element; | ||
|  | 
 | ||
|  |         if (element.type === 'symbol') { | ||
|  |           // render me using a temporary svg element in symbol cases (http://www.w3.org/TR/SVG/struct.html#UseElement)
 | ||
|  |           tempSvg = new SVGElement(document, null); | ||
|  |           tempSvg.attributes.viewBox = new Property(document, 'viewBox', element.getAttribute('viewBox').getString()); | ||
|  |           tempSvg.attributes.preserveAspectRatio = new Property(document, 'preserveAspectRatio', element.getAttribute('preserveAspectRatio').getString()); | ||
|  |           tempSvg.attributes.overflow = new Property(document, 'overflow', element.getAttribute('overflow').getString()); | ||
|  |           tempSvg.children = element.children; // element is still the parent of the children
 | ||
|  | 
 | ||
|  |           element.styles.opacity = new Property(document, 'opacity', this.calculateOpacity()); | ||
|  |         } | ||
|  | 
 | ||
|  |         if (tempSvg.type === 'svg') { | ||
|  |           var widthStyle = this.getStyle('width', false, true); | ||
|  |           var heightStyle = this.getStyle('height', false, true); // if symbol or svg, inherit width/height from me
 | ||
|  | 
 | ||
|  |           if (widthStyle.hasValue()) { | ||
|  |             tempSvg.attributes.width = new Property(document, 'width', widthStyle.getString()); | ||
|  |           } | ||
|  | 
 | ||
|  |           if (heightStyle.hasValue()) { | ||
|  |             tempSvg.attributes.height = new Property(document, 'height', heightStyle.getString()); | ||
|  |           } | ||
|  |         } | ||
|  | 
 | ||
|  |         var oldParent = tempSvg.parent; | ||
|  |         tempSvg.parent = this; | ||
|  |         tempSvg.render(ctx); | ||
|  |         tempSvg.parent = oldParent; | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getBoundingBox", | ||
|  |     value: function getBoundingBox(ctx) { | ||
|  |       var element = this.element; | ||
|  | 
 | ||
|  |       if (element) { | ||
|  |         return element.getBoundingBox(ctx); | ||
|  |       } | ||
|  | 
 | ||
|  |       return null; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "elementTransform", | ||
|  |     value: function elementTransform() { | ||
|  |       var document = this.document, | ||
|  |           element = this.element; | ||
|  |       return Transform.fromElement(document, element); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "element", | ||
|  |     get: function get() { | ||
|  |       if (!this.cachedElement) { | ||
|  |         this.cachedElement = this.getHrefAttribute().getDefinition(); | ||
|  |       } | ||
|  | 
 | ||
|  |       return this.cachedElement; | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return UseElement; | ||
|  | }(RenderedElement); | ||
|  | 
 | ||
|  | function _createSuper$9(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$9(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$9() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | function imGet(img, x, y, width, _height, rgba) { | ||
|  |   return img[y * width * 4 + x * 4 + rgba]; | ||
|  | } | ||
|  | 
 | ||
|  | function imSet(img, x, y, width, _height, rgba, val) { | ||
|  |   img[y * width * 4 + x * 4 + rgba] = val; | ||
|  | } | ||
|  | 
 | ||
|  | function m(matrix, i, v) { | ||
|  |   var mi = matrix[i]; | ||
|  |   return mi * v; | ||
|  | } | ||
|  | 
 | ||
|  | function c(a, m1, m2, m3) { | ||
|  |   return m1 + Math.cos(a) * m2 + Math.sin(a) * m3; | ||
|  | } | ||
|  | 
 | ||
|  | var FeColorMatrixElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](FeColorMatrixElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$9(FeColorMatrixElement); | ||
|  | 
 | ||
|  |   function FeColorMatrixElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, FeColorMatrixElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.type = 'feColorMatrix'; | ||
|  |     var matrix = toNumbers(_this.getAttribute('values').getString()); | ||
|  | 
 | ||
|  |     switch (_this.getAttribute('type').getString('matrix')) { | ||
|  |       // http://www.w3.org/TR/SVG/filters.html#feColorMatrixElement
 | ||
|  |       case 'saturate': | ||
|  |         { | ||
|  |           var s = matrix[0]; | ||
|  |           /* eslint-disable array-element-newline */ | ||
|  | 
 | ||
|  |           matrix = [0.213 + 0.787 * s, 0.715 - 0.715 * s, 0.072 - 0.072 * s, 0, 0, 0.213 - 0.213 * s, 0.715 + 0.285 * s, 0.072 - 0.072 * s, 0, 0, 0.213 - 0.213 * s, 0.715 - 0.715 * s, 0.072 + 0.928 * s, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1]; | ||
|  |           /* eslint-enable array-element-newline */ | ||
|  | 
 | ||
|  |           break; | ||
|  |         } | ||
|  | 
 | ||
|  |       case 'hueRotate': | ||
|  |         { | ||
|  |           var a = matrix[0] * Math.PI / 180.0; | ||
|  |           /* eslint-disable array-element-newline */ | ||
|  | 
 | ||
|  |           matrix = [c(a, 0.213, 0.787, -0.213), c(a, 0.715, -0.715, -0.715), c(a, 0.072, -0.072, 0.928), 0, 0, c(a, 0.213, -0.213, 0.143), c(a, 0.715, 0.285, 0.140), c(a, 0.072, -0.072, -0.283), 0, 0, c(a, 0.213, -0.213, -0.787), c(a, 0.715, -0.715, 0.715), c(a, 0.072, 0.928, 0.072), 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1]; | ||
|  |           /* eslint-enable array-element-newline */ | ||
|  | 
 | ||
|  |           break; | ||
|  |         } | ||
|  | 
 | ||
|  |       case 'luminanceToAlpha': | ||
|  |         /* eslint-disable array-element-newline */ | ||
|  |         matrix = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.2125, 0.7154, 0.0721, 0, 0, 0, 0, 0, 0, 1]; | ||
|  |         /* eslint-enable array-element-newline */ | ||
|  | 
 | ||
|  |         break; | ||
|  |     } | ||
|  | 
 | ||
|  |     _this.matrix = matrix; | ||
|  |     _this.includeOpacity = _this.getAttribute('includeOpacity').hasValue(); | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](FeColorMatrixElement, [{ | ||
|  |     key: "apply", | ||
|  |     value: function apply(ctx, _x, _y, width, height) { | ||
|  |       // assuming x==0 && y==0 for now
 | ||
|  |       var includeOpacity = this.includeOpacity, | ||
|  |           matrix = this.matrix; | ||
|  |       var srcData = ctx.getImageData(0, 0, width, height); | ||
|  | 
 | ||
|  |       for (var y = 0; y < height; y++) { | ||
|  |         for (var x = 0; x < width; x++) { | ||
|  |           var r = imGet(srcData.data, x, y, width, height, 0); | ||
|  |           var g = imGet(srcData.data, x, y, width, height, 1); | ||
|  |           var b = imGet(srcData.data, x, y, width, height, 2); | ||
|  |           var a = imGet(srcData.data, x, y, width, height, 3); | ||
|  |           var nr = m(matrix, 0, r) + m(matrix, 1, g) + m(matrix, 2, b) + m(matrix, 3, a) + m(matrix, 4, 1); | ||
|  |           var ng = m(matrix, 5, r) + m(matrix, 6, g) + m(matrix, 7, b) + m(matrix, 8, a) + m(matrix, 9, 1); | ||
|  |           var nb = m(matrix, 10, r) + m(matrix, 11, g) + m(matrix, 12, b) + m(matrix, 13, a) + m(matrix, 14, 1); | ||
|  |           var na = m(matrix, 15, r) + m(matrix, 16, g) + m(matrix, 17, b) + m(matrix, 18, a) + m(matrix, 19, 1); | ||
|  | 
 | ||
|  |           if (includeOpacity) { | ||
|  |             nr = 0; | ||
|  |             ng = 0; | ||
|  |             nb = 0; | ||
|  |             na *= a / 255; | ||
|  |           } | ||
|  | 
 | ||
|  |           imSet(srcData.data, x, y, width, height, 0, nr); | ||
|  |           imSet(srcData.data, x, y, width, height, 1, ng); | ||
|  |           imSet(srcData.data, x, y, width, height, 2, nb); | ||
|  |           imSet(srcData.data, x, y, width, height, 3, na); | ||
|  |         } | ||
|  |       } | ||
|  | 
 | ||
|  |       ctx.clearRect(0, 0, width, height); | ||
|  |       ctx.putImageData(srcData, 0, 0); | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return FeColorMatrixElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function _createSuper$8(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$8(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$8() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var MaskElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](MaskElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$8(MaskElement); | ||
|  | 
 | ||
|  |   function MaskElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, MaskElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'mask'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](MaskElement, [{ | ||
|  |     key: "apply", | ||
|  |     value: function apply(ctx, element) { | ||
|  |       var document = this.document; // render as temp svg
 | ||
|  | 
 | ||
|  |       var x = this.getAttribute('x').getPixels('x'); | ||
|  |       var y = this.getAttribute('y').getPixels('y'); | ||
|  |       var width = this.getStyle('width').getPixels('x'); | ||
|  |       var height = this.getStyle('height').getPixels('y'); | ||
|  | 
 | ||
|  |       if (!width && !height) { | ||
|  |         var boundingBox = new BoundingBox(); | ||
|  |         this.children.forEach(function (child) { | ||
|  |           boundingBox.addBoundingBox(child.getBoundingBox(ctx)); | ||
|  |         }); | ||
|  |         x = Math.floor(boundingBox.x1); | ||
|  |         y = Math.floor(boundingBox.y1); | ||
|  |         width = Math.floor(boundingBox.width); | ||
|  |         height = Math.floor(boundingBox.height); | ||
|  |       } | ||
|  | 
 | ||
|  |       var ignoredStyles = this.removeStyles(element, MaskElement.ignoreStyles); | ||
|  |       var maskCanvas = document.createCanvas(x + width, y + height); | ||
|  |       var maskCtx = maskCanvas.getContext('2d'); | ||
|  |       document.screen.setDefaults(maskCtx); | ||
|  |       this.renderChildren(maskCtx); // convert mask to alpha with a fake node
 | ||
|  |       // TODO: refactor out apply from feColorMatrix
 | ||
|  | 
 | ||
|  |       new FeColorMatrixElement(document, { | ||
|  |         nodeType: 1, | ||
|  |         childNodes: [], | ||
|  |         attributes: [{ | ||
|  |           nodeName: 'type', | ||
|  |           value: 'luminanceToAlpha' | ||
|  |         }, { | ||
|  |           nodeName: 'includeOpacity', | ||
|  |           value: 'true' | ||
|  |         }] | ||
|  |       }).apply(maskCtx, 0, 0, x + width, y + height); | ||
|  |       var tmpCanvas = document.createCanvas(x + width, y + height); | ||
|  |       var tmpCtx = tmpCanvas.getContext('2d'); | ||
|  |       document.screen.setDefaults(tmpCtx); | ||
|  |       element.render(tmpCtx); | ||
|  |       tmpCtx.globalCompositeOperation = 'destination-in'; | ||
|  |       tmpCtx.fillStyle = maskCtx.createPattern(maskCanvas, 'no-repeat'); | ||
|  |       tmpCtx.fillRect(0, 0, x + width, y + height); | ||
|  |       ctx.fillStyle = tmpCtx.createPattern(tmpCanvas, 'no-repeat'); | ||
|  |       ctx.fillRect(0, 0, x + width, y + height); // reassign mask
 | ||
|  | 
 | ||
|  |       this.restoreStyles(element, ignoredStyles); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "render", | ||
|  |     value: function render(_) {// NO RENDER
 | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return MaskElement; | ||
|  | }(Element); | ||
|  | MaskElement.ignoreStyles = ['mask', 'transform', 'clip-path']; | ||
|  | 
 | ||
|  | function _createSuper$7(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$7(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$7() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var noop = function noop() {// NOOP
 | ||
|  | }; | ||
|  | 
 | ||
|  | var ClipPathElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](ClipPathElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$7(ClipPathElement); | ||
|  | 
 | ||
|  |   function ClipPathElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, ClipPathElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'clipPath'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](ClipPathElement, [{ | ||
|  |     key: "apply", | ||
|  |     value: function apply(ctx) { | ||
|  |       var document = this.document; | ||
|  |       var contextProto = Reflect.getPrototypeOf(ctx); | ||
|  |       var beginPath = ctx.beginPath, | ||
|  |           closePath = ctx.closePath; | ||
|  | 
 | ||
|  |       if (contextProto) { | ||
|  |         contextProto.beginPath = noop; | ||
|  |         contextProto.closePath = noop; | ||
|  |       } | ||
|  | 
 | ||
|  |       Reflect.apply(beginPath, ctx, []); | ||
|  |       this.children.forEach(function (child) { | ||
|  |         if (typeof child.path === 'undefined') { | ||
|  |           return; | ||
|  |         } | ||
|  | 
 | ||
|  |         var transform = typeof child.elementTransform !== 'undefined' ? child.elementTransform() : null; // handle <use />
 | ||
|  | 
 | ||
|  |         if (!transform) { | ||
|  |           transform = Transform.fromElement(document, child); | ||
|  |         } | ||
|  | 
 | ||
|  |         if (transform) { | ||
|  |           transform.apply(ctx); | ||
|  |         } | ||
|  | 
 | ||
|  |         child.path(ctx); | ||
|  | 
 | ||
|  |         if (contextProto) { | ||
|  |           contextProto.closePath = closePath; | ||
|  |         } | ||
|  | 
 | ||
|  |         if (transform) { | ||
|  |           transform.unapply(ctx); | ||
|  |         } | ||
|  |       }); | ||
|  |       Reflect.apply(closePath, ctx, []); | ||
|  |       ctx.clip(); | ||
|  | 
 | ||
|  |       if (contextProto) { | ||
|  |         contextProto.beginPath = beginPath; | ||
|  |         contextProto.closePath = closePath; | ||
|  |       } | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "render", | ||
|  |     value: function render(_) {// NO RENDER
 | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return ClipPathElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function _createSuper$6(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$6(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$6() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var FilterElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](FilterElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$6(FilterElement); | ||
|  | 
 | ||
|  |   function FilterElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, FilterElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'filter'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](FilterElement, [{ | ||
|  |     key: "apply", | ||
|  |     value: function apply(ctx, element) { | ||
|  |       // render as temp svg
 | ||
|  |       var document = this.document, | ||
|  |           children = this.children; | ||
|  |       var boundingBox = element.getBoundingBox(ctx); | ||
|  | 
 | ||
|  |       if (!boundingBox) { | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       var px = 0; | ||
|  |       var py = 0; | ||
|  |       children.forEach(function (child) { | ||
|  |         var efd = child.extraFilterDistance || 0; | ||
|  |         px = Math.max(px, efd); | ||
|  |         py = Math.max(py, efd); | ||
|  |       }); | ||
|  |       var width = Math.floor(boundingBox.width); | ||
|  |       var height = Math.floor(boundingBox.height); | ||
|  |       var tmpCanvasWidth = width + 2 * px; | ||
|  |       var tmpCanvasHeight = height + 2 * py; | ||
|  | 
 | ||
|  |       if (tmpCanvasWidth < 1 || tmpCanvasHeight < 1) { | ||
|  |         return; | ||
|  |       } | ||
|  | 
 | ||
|  |       var x = Math.floor(boundingBox.x); | ||
|  |       var y = Math.floor(boundingBox.y); | ||
|  |       var ignoredStyles = this.removeStyles(element, FilterElement.ignoreStyles); | ||
|  |       var tmpCanvas = document.createCanvas(tmpCanvasWidth, tmpCanvasHeight); | ||
|  |       var tmpCtx = tmpCanvas.getContext('2d'); | ||
|  |       document.screen.setDefaults(tmpCtx); | ||
|  |       tmpCtx.translate(-x + px, -y + py); | ||
|  |       element.render(tmpCtx); // apply filters
 | ||
|  | 
 | ||
|  |       children.forEach(function (child) { | ||
|  |         if (typeof child.apply === 'function') { | ||
|  |           child.apply(tmpCtx, 0, 0, tmpCanvasWidth, tmpCanvasHeight); | ||
|  |         } | ||
|  |       }); // render on me
 | ||
|  | 
 | ||
|  |       ctx.drawImage(tmpCanvas, 0, 0, tmpCanvasWidth, tmpCanvasHeight, x - px, y - py, tmpCanvasWidth, tmpCanvasHeight); | ||
|  |       this.restoreStyles(element, ignoredStyles); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "render", | ||
|  |     value: function render(_) {// NO RENDER
 | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return FilterElement; | ||
|  | }(Element); | ||
|  | FilterElement.ignoreStyles = ['filter', 'transform', 'clip-path']; | ||
|  | 
 | ||
|  | function _createSuper$5(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$5(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$5() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var FeDropShadowElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](FeDropShadowElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$5(FeDropShadowElement); | ||
|  | 
 | ||
|  |   function FeDropShadowElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, FeDropShadowElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.type = 'feDropShadow'; | ||
|  | 
 | ||
|  |     _this.addStylesFromStyleDefinition(); | ||
|  | 
 | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](FeDropShadowElement, [{ | ||
|  |     key: "apply", | ||
|  |     value: function apply(_, _x, _y, _width, _height) {// TODO: implement
 | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return FeDropShadowElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function _createSuper$4(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$4(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$4() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var FeMorphologyElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](FeMorphologyElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$4(FeMorphologyElement); | ||
|  | 
 | ||
|  |   function FeMorphologyElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, FeMorphologyElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'feMorphology'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](FeMorphologyElement, [{ | ||
|  |     key: "apply", | ||
|  |     value: function apply(_, _x, _y, _width, _height) {// TODO: implement
 | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return FeMorphologyElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function _createSuper$3(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$3(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$3() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var FeCompositeElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](FeCompositeElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$3(FeCompositeElement); | ||
|  | 
 | ||
|  |   function FeCompositeElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, FeCompositeElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'feComposite'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](FeCompositeElement, [{ | ||
|  |     key: "apply", | ||
|  |     value: function apply(_, _x, _y, _width, _height) {// TODO: implement
 | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return FeCompositeElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function _createSuper$2(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$2() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var FeGaussianBlurElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](FeGaussianBlurElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$2(FeGaussianBlurElement); | ||
|  | 
 | ||
|  |   function FeGaussianBlurElement(document, node, captureTextNodes) { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, FeGaussianBlurElement); | ||
|  | 
 | ||
|  |     _this = _super.call(this, document, node, captureTextNodes); | ||
|  |     _this.type = 'feGaussianBlur'; | ||
|  |     _this.blurRadius = Math.floor(_this.getAttribute('stdDeviation').getNumber()); | ||
|  |     _this.extraFilterDistance = _this.blurRadius; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](FeGaussianBlurElement, [{ | ||
|  |     key: "apply", | ||
|  |     value: function apply(ctx, x, y, width, height) { | ||
|  |       var document = this.document, | ||
|  |           blurRadius = this.blurRadius; | ||
|  |       var body = document.window ? document.window.document.body : null; | ||
|  |       var canvas = ctx.canvas; // StackBlur requires canvas be on document
 | ||
|  | 
 | ||
|  |       canvas.id = document.getUniqueId(); | ||
|  | 
 | ||
|  |       if (body) { | ||
|  |         canvas.style.display = 'none'; | ||
|  |         body.appendChild(canvas); | ||
|  |       } | ||
|  | 
 | ||
|  |       stackblurCanvas.canvasRGBA(canvas, x, y, width, height, blurRadius); | ||
|  | 
 | ||
|  |       if (body) { | ||
|  |         body.removeChild(canvas); | ||
|  |       } | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return FeGaussianBlurElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function _createSuper$1(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct$1() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var TitleElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](TitleElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper$1(TitleElement); | ||
|  | 
 | ||
|  |   function TitleElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, TitleElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'title'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   return TitleElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; } | ||
|  | 
 | ||
|  | function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } | ||
|  | 
 | ||
|  | var DescElement = /*#__PURE__*/function (_Element) { | ||
|  |   _inherits__default['default'](DescElement, _Element); | ||
|  | 
 | ||
|  |   var _super = _createSuper(DescElement); | ||
|  | 
 | ||
|  |   function DescElement() { | ||
|  |     var _this; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, DescElement); | ||
|  | 
 | ||
|  |     _this = _super.apply(this, arguments); | ||
|  |     _this.type = 'desc'; | ||
|  |     return _this; | ||
|  |   } | ||
|  | 
 | ||
|  |   return DescElement; | ||
|  | }(Element); | ||
|  | 
 | ||
|  | var elements = { | ||
|  |   'svg': SVGElement, | ||
|  |   'rect': RectElement, | ||
|  |   'circle': CircleElement, | ||
|  |   'ellipse': EllipseElement, | ||
|  |   'line': LineElement, | ||
|  |   'polyline': PolylineElement, | ||
|  |   'polygon': PolygonElement, | ||
|  |   'path': PathElement, | ||
|  |   'pattern': PatternElement, | ||
|  |   'marker': MarkerElement, | ||
|  |   'defs': DefsElement, | ||
|  |   'linearGradient': LinearGradientElement, | ||
|  |   'radialGradient': RadialGradientElement, | ||
|  |   'stop': StopElement, | ||
|  |   'animate': AnimateElement, | ||
|  |   'animateColor': AnimateColorElement, | ||
|  |   'animateTransform': AnimateTransformElement, | ||
|  |   'font': FontElement, | ||
|  |   'font-face': FontFaceElement, | ||
|  |   'missing-glyph': MissingGlyphElement, | ||
|  |   'glyph': GlyphElement, | ||
|  |   'text': TextElement, | ||
|  |   'tspan': TSpanElement, | ||
|  |   'tref': TRefElement, | ||
|  |   'a': AElement, | ||
|  |   'textPath': TextPathElement, | ||
|  |   'image': ImageElement, | ||
|  |   'g': GElement, | ||
|  |   'symbol': SymbolElement, | ||
|  |   'style': StyleElement, | ||
|  |   'use': UseElement, | ||
|  |   'mask': MaskElement, | ||
|  |   'clipPath': ClipPathElement, | ||
|  |   'filter': FilterElement, | ||
|  |   'feDropShadow': FeDropShadowElement, | ||
|  |   'feMorphology': FeMorphologyElement, | ||
|  |   'feComposite': FeCompositeElement, | ||
|  |   'feColorMatrix': FeColorMatrixElement, | ||
|  |   'feGaussianBlur': FeGaussianBlurElement, | ||
|  |   'title': TitleElement, | ||
|  |   'desc': DescElement | ||
|  | }; | ||
|  | 
 | ||
|  | function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } | ||
|  | 
 | ||
|  | function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$1(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } | ||
|  | 
 | ||
|  | function createCanvas(width, height) { | ||
|  |   var canvas = document.createElement('canvas'); | ||
|  |   canvas.width = width; | ||
|  |   canvas.height = height; | ||
|  |   return canvas; | ||
|  | } | ||
|  | 
 | ||
|  | function createImage(_x) { | ||
|  |   return _createImage.apply(this, arguments); | ||
|  | } | ||
|  | 
 | ||
|  | function _createImage() { | ||
|  |   _createImage = _asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee(src) { | ||
|  |     var anonymousCrossOrigin, | ||
|  |         image, | ||
|  |         _args = arguments; | ||
|  |     return _regeneratorRuntime__default['default'].wrap(function _callee$(_context) { | ||
|  |       while (1) { | ||
|  |         switch (_context.prev = _context.next) { | ||
|  |           case 0: | ||
|  |             anonymousCrossOrigin = _args.length > 1 && _args[1] !== undefined ? _args[1] : false; | ||
|  |             image = document.createElement('img'); | ||
|  | 
 | ||
|  |             if (anonymousCrossOrigin) { | ||
|  |               image.crossOrigin = 'Anonymous'; | ||
|  |             } | ||
|  | 
 | ||
|  |             return _context.abrupt("return", new Promise(function (resolve, reject) { | ||
|  |               image.onload = function () { | ||
|  |                 resolve(image); | ||
|  |               }; | ||
|  | 
 | ||
|  |               image.onerror = function (_event, _source, _lineno, _colno, error) { | ||
|  |                 reject(error); | ||
|  |               }; | ||
|  | 
 | ||
|  |               image.src = src; | ||
|  |             })); | ||
|  | 
 | ||
|  |           case 4: | ||
|  |           case "end": | ||
|  |             return _context.stop(); | ||
|  |         } | ||
|  |       } | ||
|  |     }, _callee); | ||
|  |   })); | ||
|  |   return _createImage.apply(this, arguments); | ||
|  | } | ||
|  | 
 | ||
|  | var Document = /*#__PURE__*/function () { | ||
|  |   function Document(canvg) { | ||
|  |     var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}, | ||
|  |         _ref$rootEmSize = _ref.rootEmSize, | ||
|  |         rootEmSize = _ref$rootEmSize === void 0 ? 12 : _ref$rootEmSize, | ||
|  |         _ref$emSize = _ref.emSize, | ||
|  |         emSize = _ref$emSize === void 0 ? 12 : _ref$emSize, | ||
|  |         _ref$createCanvas = _ref.createCanvas, | ||
|  |         createCanvas = _ref$createCanvas === void 0 ? Document.createCanvas : _ref$createCanvas, | ||
|  |         _ref$createImage = _ref.createImage, | ||
|  |         createImage = _ref$createImage === void 0 ? Document.createImage : _ref$createImage, | ||
|  |         anonymousCrossOrigin = _ref.anonymousCrossOrigin; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, Document); | ||
|  | 
 | ||
|  |     this.canvg = canvg; | ||
|  |     this.definitions = {}; | ||
|  |     this.styles = {}; | ||
|  |     this.stylesSpecificity = {}; | ||
|  |     this.images = []; | ||
|  |     this.fonts = []; | ||
|  |     this.emSizeStack = []; | ||
|  |     this.uniqueId = 0; | ||
|  |     this.screen = canvg.screen; | ||
|  |     this.rootEmSize = rootEmSize; | ||
|  |     this.emSize = emSize; | ||
|  |     this.createCanvas = createCanvas; | ||
|  |     this.createImage = this.bindCreateImage(createImage, anonymousCrossOrigin); | ||
|  |     this.screen.wait(this.isImagesLoaded.bind(this)); | ||
|  |     this.screen.wait(this.isFontsLoaded.bind(this)); | ||
|  |   } | ||
|  | 
 | ||
|  |   _createClass__default['default'](Document, [{ | ||
|  |     key: "bindCreateImage", | ||
|  |     value: function bindCreateImage(createImage, anonymousCrossOrigin) { | ||
|  |       if (typeof anonymousCrossOrigin === 'boolean') { | ||
|  |         return function (source, forceAnonymousCrossOrigin) { | ||
|  |           return createImage(source, typeof forceAnonymousCrossOrigin === 'boolean' ? forceAnonymousCrossOrigin : anonymousCrossOrigin); | ||
|  |         }; | ||
|  |       } | ||
|  | 
 | ||
|  |       return createImage; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "popEmSize", | ||
|  |     value: function popEmSize() { | ||
|  |       var emSizeStack = this.emSizeStack; | ||
|  |       emSizeStack.pop(); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "getUniqueId", | ||
|  |     value: function getUniqueId() { | ||
|  |       return "canvg".concat(++this.uniqueId); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "isImagesLoaded", | ||
|  |     value: function isImagesLoaded() { | ||
|  |       return this.images.every(function (_) { | ||
|  |         return _.loaded; | ||
|  |       }); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "isFontsLoaded", | ||
|  |     value: function isFontsLoaded() { | ||
|  |       return this.fonts.every(function (_) { | ||
|  |         return _.loaded; | ||
|  |       }); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "createDocumentElement", | ||
|  |     value: function createDocumentElement(document) { | ||
|  |       var documentElement = this.createElement(document.documentElement); | ||
|  |       documentElement.root = true; | ||
|  |       documentElement.addStylesFromStyleDefinition(); | ||
|  |       this.documentElement = documentElement; | ||
|  |       return documentElement; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "createElement", | ||
|  |     value: function createElement(node) { | ||
|  |       var elementType = node.nodeName.replace(/^[^:]+:/, ''); | ||
|  |       var ElementType = Document.elementTypes[elementType]; | ||
|  | 
 | ||
|  |       if (typeof ElementType !== 'undefined') { | ||
|  |         return new ElementType(this, node); | ||
|  |       } | ||
|  | 
 | ||
|  |       return new UnknownElement(this, node); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "createTextNode", | ||
|  |     value: function createTextNode(node) { | ||
|  |       return new TextNode(this, node); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "setViewBox", | ||
|  |     value: function setViewBox(config) { | ||
|  |       this.screen.setViewBox(_objectSpread$1({ | ||
|  |         document: this | ||
|  |       }, config)); | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "window", | ||
|  |     get: function get() { | ||
|  |       return this.screen.window; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "fetch", | ||
|  |     get: function get() { | ||
|  |       return this.screen.fetch; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "ctx", | ||
|  |     get: function get() { | ||
|  |       return this.screen.ctx; | ||
|  |     } | ||
|  |   }, { | ||
|  |     key: "emSize", | ||
|  |     get: function get() { | ||
|  |       var emSizeStack = this.emSizeStack; | ||
|  |       return emSizeStack[emSizeStack.length - 1]; | ||
|  |     }, | ||
|  |     set: function set(value) { | ||
|  |       var emSizeStack = this.emSizeStack; | ||
|  |       emSizeStack.push(value); | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return Document; | ||
|  | }(); | ||
|  | Document.createCanvas = createCanvas; | ||
|  | Document.createImage = createImage; | ||
|  | Document.elementTypes = elements; | ||
|  | 
 | ||
|  | function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } | ||
|  | 
 | ||
|  | function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } | ||
|  | /** | ||
|  |  * SVG renderer on canvas. | ||
|  |  */ | ||
|  | 
 | ||
|  | var Canvg = /*#__PURE__*/function () { | ||
|  |   /** | ||
|  |    * Main constructor. | ||
|  |    * @param ctx - Rendering context. | ||
|  |    * @param svg - SVG Document. | ||
|  |    * @param options - Rendering options. | ||
|  |    */ | ||
|  |   function Canvg(ctx, svg) { | ||
|  |     var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; | ||
|  | 
 | ||
|  |     _classCallCheck__default['default'](this, Canvg); | ||
|  | 
 | ||
|  |     this.parser = new Parser(options); | ||
|  |     this.screen = new Screen(ctx, options); | ||
|  |     this.options = options; | ||
|  |     var document = new Document(this, options); | ||
|  |     var documentElement = document.createDocumentElement(svg); | ||
|  |     this.document = document; | ||
|  |     this.documentElement = documentElement; | ||
|  |   } | ||
|  |   /** | ||
|  |    * Create Canvg instance from SVG source string or URL. | ||
|  |    * @param ctx - Rendering context. | ||
|  |    * @param svg - SVG source string or URL. | ||
|  |    * @param options - Rendering options. | ||
|  |    * @returns Canvg instance. | ||
|  |    */ | ||
|  | 
 | ||
|  | 
 | ||
|  |   _createClass__default['default'](Canvg, [{ | ||
|  |     key: "fork", | ||
|  | 
 | ||
|  |     /** | ||
|  |      * Create new Canvg instance with inherited options. | ||
|  |      * @param ctx - Rendering context. | ||
|  |      * @param svg - SVG source string or URL. | ||
|  |      * @param options - Rendering options. | ||
|  |      * @returns Canvg instance. | ||
|  |      */ | ||
|  |     value: function fork(ctx, svg) { | ||
|  |       var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; | ||
|  |       return Canvg.from(ctx, svg, _objectSpread(_objectSpread({}, this.options), options)); | ||
|  |     } | ||
|  |     /** | ||
|  |      * Create new Canvg instance with inherited options. | ||
|  |      * @param ctx - Rendering context. | ||
|  |      * @param svg - SVG source string. | ||
|  |      * @param options - Rendering options. | ||
|  |      * @returns Canvg instance. | ||
|  |      */ | ||
|  | 
 | ||
|  |   }, { | ||
|  |     key: "forkString", | ||
|  |     value: function forkString(ctx, svg) { | ||
|  |       var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; | ||
|  |       return Canvg.fromString(ctx, svg, _objectSpread(_objectSpread({}, this.options), options)); | ||
|  |     } | ||
|  |     /** | ||
|  |      * Document is ready promise. | ||
|  |      * @returns Ready promise. | ||
|  |      */ | ||
|  | 
 | ||
|  |   }, { | ||
|  |     key: "ready", | ||
|  |     value: function ready() { | ||
|  |       return this.screen.ready(); | ||
|  |     } | ||
|  |     /** | ||
|  |      * Document is ready value. | ||
|  |      * @returns Is ready or not. | ||
|  |      */ | ||
|  | 
 | ||
|  |   }, { | ||
|  |     key: "isReady", | ||
|  |     value: function isReady() { | ||
|  |       return this.screen.isReady(); | ||
|  |     } | ||
|  |     /** | ||
|  |      * Render only first frame, ignoring animations and mouse. | ||
|  |      * @param options - Rendering options. | ||
|  |      */ | ||
|  | 
 | ||
|  |   }, { | ||
|  |     key: "render", | ||
|  |     value: function () { | ||
|  |       var _render = _asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee() { | ||
|  |         var options, | ||
|  |             _args = arguments; | ||
|  |         return _regeneratorRuntime__default['default'].wrap(function _callee$(_context) { | ||
|  |           while (1) { | ||
|  |             switch (_context.prev = _context.next) { | ||
|  |               case 0: | ||
|  |                 options = _args.length > 0 && _args[0] !== undefined ? _args[0] : {}; | ||
|  |                 this.start(_objectSpread({ | ||
|  |                   enableRedraw: true, | ||
|  |                   ignoreAnimation: true, | ||
|  |                   ignoreMouse: true | ||
|  |                 }, options)); | ||
|  |                 _context.next = 4; | ||
|  |                 return this.ready(); | ||
|  | 
 | ||
|  |               case 4: | ||
|  |                 this.stop(); | ||
|  | 
 | ||
|  |               case 5: | ||
|  |               case "end": | ||
|  |                 return _context.stop(); | ||
|  |             } | ||
|  |           } | ||
|  |         }, _callee, this); | ||
|  |       })); | ||
|  | 
 | ||
|  |       function render() { | ||
|  |         return _render.apply(this, arguments); | ||
|  |       } | ||
|  | 
 | ||
|  |       return render; | ||
|  |     }() | ||
|  |     /** | ||
|  |      * Start rendering. | ||
|  |      * @param options - Render options. | ||
|  |      */ | ||
|  | 
 | ||
|  |   }, { | ||
|  |     key: "start", | ||
|  |     value: function start() { | ||
|  |       var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; | ||
|  |       var documentElement = this.documentElement, | ||
|  |           screen = this.screen, | ||
|  |           baseOptions = this.options; | ||
|  |       screen.start(documentElement, _objectSpread(_objectSpread({ | ||
|  |         enableRedraw: true | ||
|  |       }, baseOptions), options)); | ||
|  |     } | ||
|  |     /** | ||
|  |      * Stop rendering. | ||
|  |      */ | ||
|  | 
 | ||
|  |   }, { | ||
|  |     key: "stop", | ||
|  |     value: function stop() { | ||
|  |       this.screen.stop(); | ||
|  |     } | ||
|  |     /** | ||
|  |      * Resize SVG to fit in given size. | ||
|  |      * @param width | ||
|  |      * @param height | ||
|  |      * @param preserveAspectRatio | ||
|  |      */ | ||
|  | 
 | ||
|  |   }, { | ||
|  |     key: "resize", | ||
|  |     value: function resize(width) { | ||
|  |       var height = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : width; | ||
|  |       var preserveAspectRatio = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; | ||
|  |       this.documentElement.resize(width, height, preserveAspectRatio); | ||
|  |     } | ||
|  |   }], [{ | ||
|  |     key: "from", | ||
|  |     value: function () { | ||
|  |       var _from = _asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee2(ctx, svg) { | ||
|  |         var options, | ||
|  |             parser, | ||
|  |             svgDocument, | ||
|  |             _args2 = arguments; | ||
|  |         return _regeneratorRuntime__default['default'].wrap(function _callee2$(_context2) { | ||
|  |           while (1) { | ||
|  |             switch (_context2.prev = _context2.next) { | ||
|  |               case 0: | ||
|  |                 options = _args2.length > 2 && _args2[2] !== undefined ? _args2[2] : {}; | ||
|  |                 parser = new Parser(options); | ||
|  |                 _context2.next = 4; | ||
|  |                 return parser.parse(svg); | ||
|  | 
 | ||
|  |               case 4: | ||
|  |                 svgDocument = _context2.sent; | ||
|  |                 return _context2.abrupt("return", new Canvg(ctx, svgDocument, options)); | ||
|  | 
 | ||
|  |               case 6: | ||
|  |               case "end": | ||
|  |                 return _context2.stop(); | ||
|  |             } | ||
|  |           } | ||
|  |         }, _callee2); | ||
|  |       })); | ||
|  | 
 | ||
|  |       function from(_x, _x2) { | ||
|  |         return _from.apply(this, arguments); | ||
|  |       } | ||
|  | 
 | ||
|  |       return from; | ||
|  |     }() | ||
|  |     /** | ||
|  |      * Create Canvg instance from SVG source string. | ||
|  |      * @param ctx - Rendering context. | ||
|  |      * @param svg - SVG source string. | ||
|  |      * @param options - Rendering options. | ||
|  |      * @returns Canvg instance. | ||
|  |      */ | ||
|  | 
 | ||
|  |   }, { | ||
|  |     key: "fromString", | ||
|  |     value: function fromString(ctx, svg) { | ||
|  |       var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; | ||
|  |       var parser = new Parser(options); | ||
|  |       var svgDocument = parser.parseFromString(svg); | ||
|  |       return new Canvg(ctx, svgDocument, options); | ||
|  |     } | ||
|  |   }]); | ||
|  | 
 | ||
|  |   return Canvg; | ||
|  | }(); | ||
|  | 
 | ||
|  | exports.AElement = AElement; | ||
|  | exports.AnimateColorElement = AnimateColorElement; | ||
|  | exports.AnimateElement = AnimateElement; | ||
|  | exports.AnimateTransformElement = AnimateTransformElement; | ||
|  | exports.BoundingBox = BoundingBox; | ||
|  | exports.CB1 = CB1; | ||
|  | exports.CB2 = CB2; | ||
|  | exports.CB3 = CB3; | ||
|  | exports.CB4 = CB4; | ||
|  | exports.Canvg = Canvg; | ||
|  | exports.CircleElement = CircleElement; | ||
|  | exports.ClipPathElement = ClipPathElement; | ||
|  | exports.DefsElement = DefsElement; | ||
|  | exports.DescElement = DescElement; | ||
|  | exports.Document = Document; | ||
|  | exports.Element = Element; | ||
|  | exports.EllipseElement = EllipseElement; | ||
|  | exports.FeColorMatrixElement = FeColorMatrixElement; | ||
|  | exports.FeCompositeElement = FeCompositeElement; | ||
|  | exports.FeDropShadowElement = FeDropShadowElement; | ||
|  | exports.FeGaussianBlurElement = FeGaussianBlurElement; | ||
|  | exports.FeMorphologyElement = FeMorphologyElement; | ||
|  | exports.FilterElement = FilterElement; | ||
|  | exports.Font = Font; | ||
|  | exports.FontElement = FontElement; | ||
|  | exports.FontFaceElement = FontFaceElement; | ||
|  | exports.GElement = GElement; | ||
|  | exports.GlyphElement = GlyphElement; | ||
|  | exports.GradientElement = GradientElement; | ||
|  | exports.ImageElement = ImageElement; | ||
|  | exports.LineElement = LineElement; | ||
|  | exports.LinearGradientElement = LinearGradientElement; | ||
|  | exports.MarkerElement = MarkerElement; | ||
|  | exports.MaskElement = MaskElement; | ||
|  | exports.Matrix = Matrix; | ||
|  | exports.MissingGlyphElement = MissingGlyphElement; | ||
|  | exports.Mouse = Mouse; | ||
|  | exports.PSEUDO_ZERO = PSEUDO_ZERO; | ||
|  | exports.Parser = Parser; | ||
|  | exports.PathElement = PathElement; | ||
|  | exports.PathParser = PathParser; | ||
|  | exports.PatternElement = PatternElement; | ||
|  | exports.Point = Point; | ||
|  | exports.PolygonElement = PolygonElement; | ||
|  | exports.PolylineElement = PolylineElement; | ||
|  | exports.Property = Property; | ||
|  | exports.QB1 = QB1; | ||
|  | exports.QB2 = QB2; | ||
|  | exports.QB3 = QB3; | ||
|  | exports.RadialGradientElement = RadialGradientElement; | ||
|  | exports.RectElement = RectElement; | ||
|  | exports.RenderedElement = RenderedElement; | ||
|  | exports.Rotate = Rotate; | ||
|  | exports.SVGElement = SVGElement; | ||
|  | exports.SVGFontLoader = SVGFontLoader; | ||
|  | exports.Scale = Scale; | ||
|  | exports.Screen = Screen; | ||
|  | exports.Skew = Skew; | ||
|  | exports.SkewX = SkewX; | ||
|  | exports.SkewY = SkewY; | ||
|  | exports.StopElement = StopElement; | ||
|  | exports.StyleElement = StyleElement; | ||
|  | exports.SymbolElement = SymbolElement; | ||
|  | exports.TRefElement = TRefElement; | ||
|  | exports.TSpanElement = TSpanElement; | ||
|  | exports.TextElement = TextElement; | ||
|  | exports.TextPathElement = TextPathElement; | ||
|  | exports.TitleElement = TitleElement; | ||
|  | exports.Transform = Transform; | ||
|  | exports.Translate = Translate; | ||
|  | exports.UnknownElement = UnknownElement; | ||
|  | exports.UseElement = UseElement; | ||
|  | exports.ViewPort = ViewPort; | ||
|  | exports.compressSpaces = compressSpaces; | ||
|  | exports.default = Canvg; | ||
|  | exports.getSelectorSpecificity = getSelectorSpecificity; | ||
|  | exports.normalizeAttributeName = normalizeAttributeName; | ||
|  | exports.normalizeColor = normalizeColor; | ||
|  | exports.parseExternalUrl = parseExternalUrl; | ||
|  | exports.presets = index; | ||
|  | exports.toNumbers = toNumbers; | ||
|  | exports.trimLeft = trimLeft; | ||
|  | exports.trimRight = trimRight; | ||
|  | exports.vectorMagnitude = vectorMagnitude; | ||
|  | exports.vectorsAngle = vectorsAngle; | ||
|  | exports.vectorsRatio = vectorsRatio; | ||
|  | //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VzIjpbXSwic291cmNlc0NvbnRlbnQiOltdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs
 |