* @copyright Wout Fierens <wout@mick-wout.com>
* @license MIT
*
-* BUILT: Mon Nov 05 2018 18:59:11 GMT+0100 (GMT+01:00)
+* BUILT: Mon Nov 05 2018 21:52:42 GMT+0100 (GMT+01:00)
*/;
var SVG = (function () {
'use strict';
throw new TypeError("Invalid attempt to destructure non-iterable instance");
}
- var Base = function Base() {
- _classCallCheck(this, Base);
+ var Queue =
+ /*#__PURE__*/
+ function () {
+ function Queue() {
+ _classCallCheck(this, Queue);
+
+ this._first = null;
+ this._last = null;
+ }
+
+ _createClass(Queue, [{
+ key: "push",
+ value: function push(value) {
+ // An item stores an id and the provided value
+ var item = value.next ? value : {
+ value: value,
+ next: null,
+ prev: null // Deal with the queue being empty or populated
+
+ };
+
+ if (this._last) {
+ item.prev = this._last;
+ this._last.next = item;
+ this._last = item;
+ } else {
+ this._last = item;
+ this._first = item;
+ } // Update the length and return the current item
+
+
+ return item;
+ }
+ }, {
+ key: "shift",
+ value: function shift() {
+ // Check if we have a value
+ var remove = this._first;
+ if (!remove) return null; // If we do, remove it and relink things
+
+ this._first = remove.next;
+ if (this._first) this._first.prev = null;
+ this._last = this._first ? this._last : null;
+ return remove.value;
+ } // Shows us the first item in the list
+
+ }, {
+ key: "first",
+ value: function first() {
+ return this._first && this._first.value;
+ } // Shows us the last item in the list
+
+ }, {
+ key: "last",
+ value: function last() {
+ return this._last && this._last.value;
+ } // Removes the item that was returned from the push
+
+ }, {
+ key: "remove",
+ value: function remove(item) {
+ // Relink the previous item
+ if (item.prev) item.prev.next = item.next;
+ if (item.next) item.next.prev = item.prev;
+ if (item === this._last) this._last = item.prev;
+ if (item === this._first) this._first = item.next; // Invalidate item
+
+ item.prev = null;
+ item.next = null;
+ }
+ }]);
+
+ return Queue;
+ }();
+
+ var Animator = {
+ nextDraw: null,
+ frames: new Queue(),
+ timeouts: new Queue(),
+ timer: window.performance || window.Date,
+ transforms: [],
+ frame: function frame(fn) {
+ // Store the node
+ var node = Animator.frames.push({
+ run: fn
+ }); // Request an animation frame if we don't have one
+
+ if (Animator.nextDraw === null) {
+ Animator.nextDraw = window.requestAnimationFrame(Animator._draw);
+ } // Return the node so we can remove it easily
+
+
+ return node;
+ },
+ transform_frame: function transform_frame(fn, id) {
+ Animator.transforms[id] = fn;
+ },
+ timeout: function timeout(fn, delay) {
+ delay = delay || 0; // Work out when the event should fire
+
+ var time = Animator.timer.now() + delay; // Add the timeout to the end of the queue
+
+ var node = Animator.timeouts.push({
+ run: fn,
+ time: time
+ }); // Request another animation frame if we need one
+
+ if (Animator.nextDraw === null) {
+ Animator.nextDraw = window.requestAnimationFrame(Animator._draw);
+ }
+
+ return node;
+ },
+ cancelFrame: function cancelFrame(node) {
+ Animator.frames.remove(node);
+ },
+ clearTimeout: function clearTimeout(node) {
+ Animator.timeouts.remove(node);
+ },
+ _draw: function _draw(now) {
+ // Run all the timeouts we can run, if they are not ready yet, add them
+ // to the end of the queue immediately! (bad timeouts!!! [sarcasm])
+ var nextTimeout = null;
+ var lastTimeout = Animator.timeouts.last();
+
+ while (nextTimeout = Animator.timeouts.shift()) {
+ // Run the timeout if its time, or push it to the end
+ if (now >= nextTimeout.time) {
+ nextTimeout.run();
+ } else {
+ Animator.timeouts.push(nextTimeout);
+ } // If we hit the last item, we should stop shifting out more items
+
+
+ if (nextTimeout === lastTimeout) break;
+ } // Run all of the animation frames
+
+
+ var nextFrame = null;
+ var lastFrame = Animator.frames.last();
+
+ while (nextFrame !== lastFrame && (nextFrame = Animator.frames.shift())) {
+ nextFrame.run();
+ }
+
+ Animator.transforms.forEach(function (el) {
+ el();
+ }); // If we have remaining timeouts or frames, draw until we don't anymore
+
+ Animator.nextDraw = Animator.timeouts.first() || Animator.frames.first() ? window.requestAnimationFrame(Animator._draw) : null;
+ }
};
// Parse unit value
dots: dots
});
+ /* eslint no-new-func: "off" */
+ var subClassArray = function () {
+ try {
+ // try es6 subclassing
+ return Function('name', 'baseClass', '_constructor', ['baseClass = baseClass || Array', 'return {', '[name]: class extends baseClass {', 'constructor (...args) {', 'super(...args)', '_constructor && _constructor.apply(this, args)', '}', '}', '}[name]'].join('\n'));
+ } catch (e) {
+ // Use es5 approach
+ return function (name) {
+ var baseClass = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : Array;
+
+ var _constructor = arguments.length > 2 ? arguments[2] : undefined;
+
+ var Arr = function Arr() {
+ baseClass.apply(this, arguments);
+ _constructor && _constructor.apply(this, arguments);
+ };
+
+ Arr.prototype = Object.create(baseClass.prototype);
+ Arr.prototype.constructor = Arr;
+ return Arr;
+ };
+ }
+ }();
+
+ // Default namespaces
+ var ns = 'http://www.w3.org/2000/svg';
+ var xmlns = 'http://www.w3.org/2000/xmlns/';
+ var xlink = 'http://www.w3.org/1999/xlink';
+ var svgjs = 'http://svgjs.com/svgjs';
+
+ var ns$1 = /*#__PURE__*/Object.freeze({
+ ns: ns,
+ xmlns: xmlns,
+ xlink: xlink,
+ svgjs: svgjs
+ });
+
+ var Base = function Base() {
+ _classCallCheck(this, Base);
+ };
+
function isNulledBox(box) {
return !box.w && !box.h && !box.x && !box.y;
}
return [ox, oy];
}
- // Default namespaces
- var ns = 'http://www.w3.org/2000/svg';
- var xmlns = 'http://www.w3.org/2000/xmlns/';
- var xlink = 'http://www.w3.org/1999/xlink';
- var svgjs = 'http://svgjs.com/svgjs';
-
- var ns$1 = /*#__PURE__*/Object.freeze({
- ns: ns,
- xmlns: xmlns,
- xlink: xlink,
- svgjs: svgjs
- });
-
- function nodeOrNew(name, node) {
- return node || makeNode(name);
- } // Method for element creation
+ var elements = {};
+ var root = Symbol('root');
+ function makeInstance(element) {
+ if (element instanceof Base) return element;
- function makeNode(name) {
- // create element
- return document.createElementNS(ns, name);
- } // Method for extending objects
+ if (_typeof(element) === 'object') {
+ return adopt(element);
+ }
- function extend(modules, methods) {
- var key, i;
- modules = Array.isArray(modules) ? modules : [modules];
+ if (element == null) {
+ return new elements[root]();
+ }
- for (i = modules.length - 1; i >= 0; i--) {
- for (key in methods) {
- modules[i].prototype[key] = methods[key];
- }
+ if (typeof element === 'string' && element.charAt(0) !== '<') {
+ return adopt(document.querySelector(element));
}
- } // FIXME: enhanced constructors here
- function addFactory(modules, methods) {
- extend(modules, methods);
- } // Invent new element
+ var node = makeNode('svg');
+ node.innerHTML = element; // We can use firstChild here because we know,
+ // that the first char is < and thus an element
- function invent(config) {
- // Create element initializer
- var initializer = typeof config.create === 'function' ? config.create : function (node) {
- config.inherit.call(this, node || makeNode(config.create));
- }; // Inherit prototype
+ element = adopt(node.firstChild);
+ return element;
+ } // Adopt existing svg elements
- if (config.inherit) {
- /* eslint new-cap: "off" */
- initializer.prototype = new config.inherit();
- initializer.prototype.constructor = initializer;
- } // Extend with methods
-
-
- if (config.extend) {
- extend(initializer, config.extend);
- } // Attach construct method to parent
-
-
- if (config.construct) {
- extend(config.parent || getClass('Container'), config.construct);
- }
-
- return initializer;
- }
-
- var tools = /*#__PURE__*/Object.freeze({
- nodeOrNew: nodeOrNew,
- makeNode: makeNode,
- extend: extend,
- addFactory: addFactory,
- invent: invent
- });
-
- var elements = {};
- var root = Symbol('root');
- function makeInstance(element) {
- if (element instanceof Base) return element;
-
- if (_typeof(element) === 'object') {
- return adopt(element);
- }
-
- if (element == null) {
- return new elements[root]();
- }
-
- if (typeof element === 'string' && element.charAt(0) !== '<') {
- return adopt(document.querySelector(element));
- }
-
- var node = makeNode('svg');
- node.innerHTML = element; // We can use firstChild here because we know,
- // that the first char is < and thus an element
-
- element = adopt(node.firstChild);
- return element;
- } // Adopt existing svg elements
-
- function adopt(node) {
- // check for presence of node
- if (!node) return null; // make sure a node isn't already adopted
+ function adopt(node) {
+ // check for presence of node
+ if (!node) return null; // make sure a node isn't already adopted
if (node.instance instanceof Base) return node.instance;
assignNewId: assignNewId
});
+ function nodeOrNew(name, node) {
+ return node || makeNode(name);
+ } // Method for element creation
+
+ function makeNode(name) {
+ // create element
+ return document.createElementNS(ns, name);
+ } // Method for extending objects
+
+ function extend(modules, methods) {
+ var key, i;
+ modules = Array.isArray(modules) ? modules : [modules];
+
+ for (i = modules.length - 1; i >= 0; i--) {
+ for (key in methods) {
+ modules[i].prototype[key] = methods[key];
+ }
+ }
+ } // FIXME: enhanced constructors here
+
+ function addFactory(modules, methods) {
+ extend(modules, methods);
+ } // Invent new element
+
+ function invent(config) {
+ // Create element initializer
+ var initializer = typeof config.create === 'function' ? config.create : function (node) {
+ config.inherit.call(this, node || makeNode(config.create));
+ }; // Inherit prototype
+
+ if (config.inherit) {
+ /* eslint new-cap: "off" */
+ initializer.prototype = new config.inherit();
+ initializer.prototype.constructor = initializer;
+ } // Extend with methods
+
+
+ if (config.extend) {
+ extend(initializer, config.extend);
+ } // Attach construct method to parent
+
+
+ if (config.construct) {
+ extend(config.parent || getClass('Container'), config.construct);
+ }
+
+ return initializer;
+ }
+
+ var tools = /*#__PURE__*/Object.freeze({
+ nodeOrNew: nodeOrNew,
+ makeNode: makeNode,
+ extend: extend,
+ addFactory: addFactory,
+ invent: invent
+ });
+
+ var SVGArray = subClassArray('SVGArray', Array, function () {
+ this.init.apply(this, arguments);
+ });
+ extend(SVGArray, {
+ init: function init() {
+ this.length = 0;
+ this.push.apply(this, _toConsumableArray(this.parse.apply(this, arguments)));
+ },
+ toArray: function toArray() {
+ return Array.prototype.concat.apply([], this);
+ },
+ toString: function toString() {
+ return this.join(' ');
+ },
+ // Flattens the array if needed
+ valueOf: function valueOf() {
+ var ret = [];
+ ret.push.apply(ret, _toConsumableArray(this));
+ return ret;
+ },
+ // Parse whitespace separated string
+ parse: function parse() {
+ var array = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+ // If already is an array, no need to parse it
+ if (array instanceof Array) return array;
+ return array.trim().split(delimiter).map(parseFloat);
+ },
+ clone: function clone() {
+ return new this.constructor(this);
+ },
+ toSet: function toSet() {
+ return new Set(this);
+ }
+ });
+
+ var SVGNumber =
+ /*#__PURE__*/
+ function () {
+ // Initialize
+ function SVGNumber() {
+ _classCallCheck(this, SVGNumber);
+
+ this.init.apply(this, arguments);
+ }
+
+ _createClass(SVGNumber, [{
+ key: "init",
+ value: function init(value, unit) {
+ unit = Array.isArray(value) ? value[1] : unit;
+ value = Array.isArray(value) ? value[0] : value; // initialize defaults
+
+ this.value = 0;
+ this.unit = unit || ''; // parse value
+
+ if (typeof value === 'number') {
+ // ensure a valid numeric value
+ this.value = isNaN(value) ? 0 : !isFinite(value) ? value < 0 ? -3.4e+38 : +3.4e+38 : value;
+ } else if (typeof value === 'string') {
+ unit = value.match(numberAndUnit);
+
+ if (unit) {
+ // make value numeric
+ this.value = parseFloat(unit[1]); // normalize
+
+ if (unit[5] === '%') {
+ this.value /= 100;
+ } else if (unit[5] === 's') {
+ this.value *= 1000;
+ } // store unit
+
+
+ this.unit = unit[5];
+ }
+ } else {
+ if (value instanceof SVGNumber) {
+ this.value = value.valueOf();
+ this.unit = value.unit;
+ }
+ }
+ }
+ }, {
+ key: "toString",
+ value: function toString() {
+ return (this.unit === '%' ? ~~(this.value * 1e8) / 1e6 : this.unit === 's' ? this.value / 1e3 : this.value) + this.unit;
+ }
+ }, {
+ key: "toJSON",
+ value: function toJSON() {
+ return this.toString();
+ }
+ }, {
+ key: "toArray",
+ value: function toArray() {
+ return [this.value, this.unit];
+ }
+ }, {
+ key: "valueOf",
+ value: function valueOf() {
+ return this.value;
+ } // Add number
+
+ }, {
+ key: "plus",
+ value: function plus(number) {
+ number = new SVGNumber(number);
+ return new SVGNumber(this + number, this.unit || number.unit);
+ } // Subtract number
+
+ }, {
+ key: "minus",
+ value: function minus(number) {
+ number = new SVGNumber(number);
+ return new SVGNumber(this - number, this.unit || number.unit);
+ } // Multiply number
+
+ }, {
+ key: "times",
+ value: function times(number) {
+ number = new SVGNumber(number);
+ return new SVGNumber(this * number, this.unit || number.unit);
+ } // Divide number
+
+ }, {
+ key: "divide",
+ value: function divide(number) {
+ number = new SVGNumber(number);
+ return new SVGNumber(this / number, this.unit || number.unit);
+ }
+ }]);
+
+ return SVGNumber;
+ }();
+
var listenerId = 0;
function getEvents(node) {
var bag = getEvents(node);
var n = getEventTarget(node); // events can be an array of events or a string of events
- events = Array.isArray(events) ? events : events.split(delimiter); // ensure instance object for nodes which are not adopted
- // n.instance = n.instance || {events: {}}
- // pull event handlers from the element
- // var bag = n.instance.events
- // add id to listener
+ events = Array.isArray(events) ? events : events.split(delimiter); // add id to listener
if (!listener._svgjsListenerId) {
listener._svgjsListenerId = ++listenerId;
function off(node, events, listener, options) {
var bag = getEvents(node);
- var n = getEventTarget(node); // we cannot remove an event if its not an svg.js instance
- // if (!n.instance) return
- // listener can be a function or a number
+ var n = getEventTarget(node); // listener can be a function or a number
if (typeof listener === 'function') {
listener = listener._svgjsListenerId;
if (!listener) return;
- } // pull event handlers from the element
- // var bag = n.instance.events
- // events can be an array of events or a string or undefined
+ } // events can be an array of events or a string or undefined
events = Array.isArray(events) ? events : (events || '').split(delimiter);
dispatch: dispatch
});
- var EventTarget =
- /*#__PURE__*/
- function (_Base) {
- _inherits(EventTarget, _Base);
-
- function EventTarget() {
- var _this;
-
- var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
- _ref$events = _ref.events,
- events = _ref$events === void 0 ? {} : _ref$events;
+ var methods = {};
+ function registerMethods(name, m) {
+ if (Array.isArray(name)) {
+ var _iteratorNormalCompletion = true;
+ var _didIteratorError = false;
+ var _iteratorError = undefined;
+
+ try {
+ for (var _iterator = name[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+ var _name = _step.value;
+ registerMethods(_name, m);
+ }
+ } catch (err) {
+ _didIteratorError = true;
+ _iteratorError = err;
+ } finally {
+ try {
+ if (!_iteratorNormalCompletion && _iterator.return != null) {
+ _iterator.return();
+ }
+ } finally {
+ if (_didIteratorError) {
+ throw _iteratorError;
+ }
+ }
+ }
+
+ return;
+ }
+
+ if (_typeof(name) === 'object') {
+ var _arr = Object.entries(name);
+
+ for (var _i = 0; _i < _arr.length; _i++) {
+ var _arr$_i = _slicedToArray(_arr[_i], 2),
+ _name2 = _arr$_i[0],
+ _m = _arr$_i[1];
+
+ registerMethods(_name2, _m);
+ }
+
+ return;
+ }
+
+ methods[name] = Object.assign(methods[name] || {}, m);
+ }
+ function getMethodsFor(name) {
+ return methods[name] || {};
+ }
+
+ var EventTarget =
+ /*#__PURE__*/
+ function (_Base) {
+ _inherits(EventTarget, _Base);
+
+ function EventTarget() {
+ var _this;
+
+ var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+ _ref$events = _ref.events,
+ events = _ref$events === void 0 ? {} : _ref$events;
_classCallCheck(this, EventTarget);
return EventTarget;
}(Base); // Add events to elements
- var methods = ['click', 'dblclick', 'mousedown', 'mouseup', 'mouseover', 'mouseout', 'mousemove', 'mouseenter', 'mouseleave', 'touchstart', 'touchmove', 'touchleave', 'touchend', 'touchcancel'].reduce(function (last, event) {
+ var methods$1 = ['click', 'dblclick', 'mousedown', 'mouseup', 'mouseover', 'mouseout', 'mousemove', 'mouseenter', 'mouseleave', 'touchstart', 'touchmove', 'touchleave', 'touchend', 'touchcancel'].reduce(function (last, event) {
// add event to Element
var fn = function fn(f) {
if (f === null) {
last[event] = fn;
return last;
}, {});
- extend(EventTarget, methods); // registerMethods('EventTarget', {
- // on, off, dispatch, fire
- // })
- //
- // registerConstructor('EventTarget', setup)
+ registerMethods('Element', methods$1);
// Map function
function map(array, block) {
return Color;
}();
- /* eslint no-new-func: "off" */
- var subClassArray = function () {
- try {
- // try es6 subclassing
- return Function('name', 'baseClass', '_constructor', ['baseClass = baseClass || Array', 'return {', '[name]: class extends baseClass {', 'constructor (...args) {', 'super(...args)', '_constructor && _constructor.apply(this, args)', '}', '}', '}[name]'].join('\n'));
- } catch (e) {
- // Use es5 approach
- return function (name) {
- var baseClass = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : Array;
-
- var _constructor = arguments.length > 2 ? arguments[2] : undefined;
-
- var Arr = function Arr() {
- baseClass.apply(this, arguments);
- _constructor && _constructor.apply(this, arguments);
- };
-
- Arr.prototype = Object.create(baseClass.prototype);
- Arr.prototype.constructor = Arr;
- return Arr;
- };
- }
- }();
-
- var SVGArray = subClassArray('SVGArray', Array, function () {
- this.init.apply(this, arguments);
- });
- extend(SVGArray, {
- init: function init() {
- // this.splice(0, this.length)
- this.length = 0;
- this.push.apply(this, _toConsumableArray(this.parse.apply(this, arguments)));
- },
- toArray: function toArray() {
- // const ret = []
- // ret.push(...this)
- // return ret
- return Array.prototype.concat.apply([], this);
- },
- toString: function toString() {
- return this.join(' ');
- },
- // Flattens the array if needed
- valueOf: function valueOf() {
- var ret = [];
- ret.push.apply(ret, _toConsumableArray(this));
- return ret; // return this.toArray()
- },
- // Parse whitespace separated string
- parse: function parse() {
- var array = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
- // array = array.valueOf()
- // If already is an array, no need to parse it
- if (array instanceof Array) return array;
- return array.trim().split(delimiter).map(parseFloat);
- },
- clone: function clone() {
- return new this.constructor(this);
- },
- toSet: function toSet() {
- return new Set(this);
- }
- }); // export default class SVGArray extends BaseArray {
- // constructor (...args) {
- // super()
- // this.init(...args)
- // }
- //
- // init (array, fallback = []) {
- // //this.splice(0, this.length)
- // this.length = 0
- // this.push(...this.parse(array || fallback))
- // }
- //
- // toArray () {
- // return [].concat(this)
- // }
- //
- // toString () {
- // return this.join(' ')
- // }
- //
- // valueOf () {
- // return this.toArray()
- // }
- //
- // // Parse whitespace separated string
- // parse (array) {
- // array = array.valueOf()
- //
- // // if already is an array, no need to parse it
- // if (Array.isArray(array)) return array
- //
- // return array.trim().split(delimiter).map(parseFloat)
- // }
- //
- // clone () {
- // return new this.constructor(this)
- // }
- //
- // toSet () {
- // return new Set(this)
- // }
- // }
-
- var SVGNumber =
- /*#__PURE__*/
- function () {
- // Initialize
- function SVGNumber() {
- _classCallCheck(this, SVGNumber);
-
- this.init.apply(this, arguments);
- }
-
- _createClass(SVGNumber, [{
- key: "init",
- value: function init(value, unit) {
- unit = Array.isArray(value) ? value[1] : unit;
- value = Array.isArray(value) ? value[0] : value; // initialize defaults
-
- this.value = 0;
- this.unit = unit || ''; // parse value
-
- if (typeof value === 'number') {
- // ensure a valid numeric value
- this.value = isNaN(value) ? 0 : !isFinite(value) ? value < 0 ? -3.4e+38 : +3.4e+38 : value;
- } else if (typeof value === 'string') {
- unit = value.match(numberAndUnit);
-
- if (unit) {
- // make value numeric
- this.value = parseFloat(unit[1]); // normalize
-
- if (unit[5] === '%') {
- this.value /= 100;
- } else if (unit[5] === 's') {
- this.value *= 1000;
- } // store unit
-
-
- this.unit = unit[5];
- }
- } else {
- if (value instanceof SVGNumber) {
- this.value = value.valueOf();
- this.unit = value.unit;
- }
- }
- }
- }, {
- key: "toString",
- value: function toString() {
- return (this.unit === '%' ? ~~(this.value * 1e8) / 1e6 : this.unit === 's' ? this.value / 1e3 : this.value) + this.unit;
- }
- }, {
- key: "toJSON",
- value: function toJSON() {
- return this.toString();
- }
- }, {
- key: "toArray",
- value: function toArray() {
- return [this.value, this.unit];
- }
- }, {
- key: "valueOf",
- value: function valueOf() {
- return this.value;
- } // Add number
-
- }, {
- key: "plus",
- value: function plus(number) {
- number = new SVGNumber(number);
- return new SVGNumber(this + number, this.unit || number.unit);
- } // Subtract number
-
- }, {
- key: "minus",
- value: function minus(number) {
- number = new SVGNumber(number);
- return new SVGNumber(this - number, this.unit || number.unit);
- } // Multiply number
-
- }, {
- key: "times",
- value: function times(number) {
- number = new SVGNumber(number);
- return new SVGNumber(this * number, this.unit || number.unit);
- } // Divide number
-
- }, {
- key: "divide",
- value: function divide(number) {
- number = new SVGNumber(number);
- return new SVGNumber(this / number, this.unit || number.unit);
- }
- }]);
-
- return SVGNumber;
- }();
-
// Set svg element attribute
function attr(attr, val, ns) {
}
return this;
- } // registerMethods('Element', {attr})
+ }
var Dom =
/*#__PURE__*/
}, {
key: "replace",
value: function replace(element) {
- // FIXME: after might not be available here
+ // FIXME: after() might not be available here
this.after(element).remove();
return element;
} // Return id on string conversion
}]);
return Element;
- }(Dom); // registerMethods('Element', {
-
- var Shape =
- /*#__PURE__*/
- function (_Element) {
- _inherits(Shape, _Element);
-
- function Shape() {
- _classCallCheck(this, Shape);
-
- return _possibleConstructorReturn(this, _getPrototypeOf(Shape).apply(this, arguments));
- }
-
- return Shape;
- }(Element);
+ }(Dom);
var Container =
/*#__PURE__*/
return Container;
}(Element);
- var HtmlNode =
+ var Bare =
/*#__PURE__*/
- function (_Dom) {
- _inherits(HtmlNode, _Dom);
+ function (_Container) {
+ _inherits(Bare, _Container);
- function HtmlNode(node) {
- _classCallCheck(this, HtmlNode);
+ function Bare(node) {
+ _classCallCheck(this, Bare);
- return _possibleConstructorReturn(this, _getPrototypeOf(HtmlNode).call(this, node, HtmlNode));
+ return _possibleConstructorReturn(this, _getPrototypeOf(Bare).call(this, nodeOrNew(node, typeof node === 'string' ? null : node), Bare));
}
- return HtmlNode;
- }(Dom);
- register(HtmlNode);
-
- var Defs =
- /*#__PURE__*/
- function (_Container) {
- _inherits(Defs, _Container);
+ _createClass(Bare, [{
+ key: "words",
+ value: function words(text) {
+ // remove contents
+ while (this.node.hasChildNodes()) {
+ this.node.removeChild(this.node.lastChild);
+ } // create text node
- function Defs(node) {
- _classCallCheck(this, Defs);
- return _possibleConstructorReturn(this, _getPrototypeOf(Defs).call(this, nodeOrNew('defs', node), Defs));
- }
+ this.node.appendChild(document.createTextNode(text));
+ return this;
+ }
+ }]);
+
+ return Bare;
+ }(Container);
+ register(Bare);
+ registerMethods('Container', {
+ // Create an element that is not described by SVG.js
+ element: function element(node, inherit) {
+ return this.put(new Bare(node, inherit));
+ }
+ });
+
+ var Defs =
+ /*#__PURE__*/
+ function (_Container) {
+ _inherits(Defs, _Container);
+
+ function Defs(node) {
+ _classCallCheck(this, Defs);
+
+ return _possibleConstructorReturn(this, _getPrototypeOf(Defs).call(this, nodeOrNew('defs', node), Defs));
+ }
_createClass(Defs, [{
key: "flatten",
}(Container);
register(Defs);
- var methods$1 = {};
- function registerMethods(name, m) {
- if (Array.isArray(name)) {
- var _iteratorNormalCompletion = true;
- var _didIteratorError = false;
- var _iteratorError = undefined;
-
- try {
- for (var _iterator = name[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
- var _name = _step.value;
- registerMethods(_name, m);
- }
- } catch (err) {
- _didIteratorError = true;
- _iteratorError = err;
- } finally {
- try {
- if (!_iteratorNormalCompletion && _iterator.return != null) {
- _iterator.return();
- }
- } finally {
- if (_didIteratorError) {
- throw _iteratorError;
- }
- }
- }
-
- return;
- }
-
- if (_typeof(name) === 'object') {
- var _arr = Object.entries(name);
-
- for (var _i = 0; _i < _arr.length; _i++) {
- var _arr$_i = _slicedToArray(_arr[_i], 2),
- _name2 = _arr$_i[0],
- _m = _arr$_i[1];
-
- registerMethods(_name2, _m);
- }
-
- return;
- }
-
- methods$1[name] = Object.assign(methods$1[name] || {}, m);
- }
- function getMethodsFor(name) {
- return methods$1[name] || {};
- } // FIXME: save memory?
-
var Doc$1 =
/*#__PURE__*/
function (_Container) {
key: "doc",
value: function doc() {
if (this.isRoot()) return this;
- return _get(_getPrototypeOf(Doc.prototype), "doc", this).call(this); // return doc.call(this)
+ return _get(_getPrototypeOf(Doc.prototype), "doc", this).call(this);
} // Add namespaces
}, {
return this.node.parentNode.nodeName === '#document' ? null : adopt(this.node.parentNode);
}
- return _get(_getPrototypeOf(Doc.prototype), "parent", this).call(this, type); // return parent.call(this, type)
- } // Removes the doc from the DOM
- // remove() {
- // if (!this.isRoot()) {
- // return super.remove()
- // }
- //
- // if (this.parent()) {
- // this.parent().remove(this)
- // }
- //
- // return this
- // }
-
+ return _get(_getPrototypeOf(Doc.prototype), "parent", this).call(this, type);
+ }
}, {
key: "clear",
value: function clear() {
});
register(Doc$1, 'Doc', true);
- var G =
- /*#__PURE__*/
- function (_Container) {
- _inherits(G, _Container);
-
- function G(node) {
- _classCallCheck(this, G);
-
- return _possibleConstructorReturn(this, _getPrototypeOf(G).call(this, nodeOrNew('g', node), G));
+ function parser() {
+ // Reuse cached element if possible
+ if (!parser.nodes) {
+ var svg = new Doc$1().size(2, 0).css({
+ opacity: 0,
+ position: 'absolute',
+ left: '-100%',
+ top: '-100%',
+ overflow: 'hidden'
+ });
+ var path = svg.path().node;
+ parser.nodes = {
+ svg: svg,
+ path: path
+ };
}
- return G;
- }(Container);
- registerMethods({
- Element: {
- // Create a group element
- group: function group() {
- return this.put(new G());
- }
+ if (!parser.nodes.svg.node.parentNode) {
+ var b = document.body || document.documentElement;
+ parser.nodes.svg.addTo(b);
}
- });
- register(G);
- var Queue =
+ return parser.nodes;
+ }
+
+ var Point =
/*#__PURE__*/
function () {
- function Queue() {
- _classCallCheck(this, Queue);
-
- this._first = null;
- this._last = null;
- }
-
- _createClass(Queue, [{
- key: "push",
- value: function push(value) {
- // An item stores an id and the provided value
- var item = value.next ? value : {
- value: value,
- next: null,
- prev: null // Deal with the queue being empty or populated
+ // Initialize
+ function Point(x, y, base) {
+ _classCallCheck(this, Point);
- };
+ var source;
+ base = base || {
+ x: 0,
+ y: 0 // ensure source as object
- if (this._last) {
- item.prev = this._last;
- this._last.next = item;
- this._last = item;
- } else {
- this._last = item;
- this._first = item;
- } // Update the length and return the current item
+ };
+ source = Array.isArray(x) ? {
+ x: x[0],
+ y: x[1]
+ } : _typeof(x) === 'object' ? {
+ x: x.x,
+ y: x.y
+ } : {
+ x: x,
+ y: y // merge source
+ };
+ this.x = source.x == null ? base.x : source.x;
+ this.y = source.y == null ? base.y : source.y;
+ } // Clone point
- return item;
- }
- }, {
- key: "shift",
- value: function shift() {
- // Check if we have a value
- var remove = this._first;
- if (!remove) return null; // If we do, remove it and relink things
- this._first = remove.next;
- if (this._first) this._first.prev = null;
- this._last = this._first ? this._last : null;
- return remove.value;
- } // Shows us the first item in the list
+ _createClass(Point, [{
+ key: "clone",
+ value: function clone() {
+ return new Point(this);
+ } // Convert to native SVGPoint
}, {
- key: "first",
- value: function first() {
- return this._first && this._first.value;
- } // Shows us the last item in the list
+ key: "native",
+ value: function native() {
+ // create new point
+ var point = parser().svg.node.createSVGPoint(); // update with current values
- }, {
- key: "last",
- value: function last() {
- return this._last && this._last.value;
- } // Removes the item that was returned from the push
+ point.x = this.x;
+ point.y = this.y;
+ return point;
+ } // transform point with matrix
}, {
- key: "remove",
- value: function remove(item) {
- // Relink the previous item
- if (item.prev) item.prev.next = item.next;
- if (item.next) item.next.prev = item.prev;
- if (item === this._last) this._last = item.prev;
- if (item === this._first) this._first = item.next; // Invalidate item
+ key: "transform",
+ value: function transform(m) {
+ // Perform the matrix multiplication
+ var x = m.a * this.x + m.c * this.y + m.e;
+ var y = m.b * this.x + m.d * this.y + m.f; // Return the required point
- item.prev = null;
- item.next = null;
+ return new Point(x, y);
}
}]);
- return Queue;
+ return Point;
}();
+ registerMethods({
+ Element: {
+ // Get point
+ point: function point(x, y) {
+ return new Point(x, y).transform(this.screenCTM().inverse());
+ }
+ }
+ });
- var Animator = {
- nextDraw: null,
- frames: new Queue(),
- timeouts: new Queue(),
- timer: window.performance || window.Date,
- transforms: [],
- frame: function frame(fn) {
- // Store the node
- var node = Animator.frames.push({
- run: fn
- }); // Request an animation frame if we don't have one
+ var Box =
+ /*#__PURE__*/
+ function () {
+ function Box() {
+ _classCallCheck(this, Box);
- if (Animator.nextDraw === null) {
- Animator.nextDraw = window.requestAnimationFrame(Animator._draw);
- } // Return the node so we can remove it easily
+ this.init.apply(this, arguments);
+ }
+ _createClass(Box, [{
+ key: "init",
+ value: function init(source) {
+ var base = [0, 0, 0, 0];
+ source = typeof source === 'string' ? source.split(delimiter).map(parseFloat) : Array.isArray(source) ? source : _typeof(source) === 'object' ? [source.left != null ? source.left : source.x, source.top != null ? source.top : source.y, source.width, source.height] : arguments.length === 4 ? [].slice.call(arguments) : base;
+ this.x = source[0];
+ this.y = source[1];
+ this.width = source[2];
+ this.height = source[3]; // add center, right, bottom...
- return node;
- },
- transform_frame: function transform_frame(fn, id) {
- Animator.transforms[id] = fn;
- },
- timeout: function timeout(fn, delay) {
- delay = delay || 0; // Work out when the event should fire
-
- var time = Animator.timer.now() + delay; // Add the timeout to the end of the queue
-
- var node = Animator.timeouts.push({
- run: fn,
- time: time
- }); // Request another animation frame if we need one
+ fullBox(this);
+ } // Merge rect box with another, return a new instance
- if (Animator.nextDraw === null) {
- Animator.nextDraw = window.requestAnimationFrame(Animator._draw);
+ }, {
+ key: "merge",
+ value: function merge(box) {
+ var x = Math.min(this.x, box.x);
+ var y = Math.min(this.y, box.y);
+ var width = Math.max(this.x + this.width, box.x + box.width) - x;
+ var height = Math.max(this.y + this.height, box.y + box.height) - y;
+ return new Box(x, y, width, height);
}
+ }, {
+ key: "transform",
+ value: function transform(m) {
+ var xMin = Infinity;
+ var xMax = -Infinity;
+ var yMin = Infinity;
+ var yMax = -Infinity;
+ var pts = [new Point(this.x, this.y), new Point(this.x2, this.y), new Point(this.x, this.y2), new Point(this.x2, this.y2)];
+ pts.forEach(function (p) {
+ p = p.transform(m);
+ xMin = Math.min(xMin, p.x);
+ xMax = Math.max(xMax, p.x);
+ yMin = Math.min(yMin, p.y);
+ yMax = Math.max(yMax, p.y);
+ });
+ return new Box(xMin, yMin, xMax - xMin, yMax - yMin);
+ }
+ }, {
+ key: "addOffset",
+ value: function addOffset() {
+ // offset by window scroll position, because getBoundingClientRect changes when window is scrolled
+ this.x += window.pageXOffset;
+ this.y += window.pageYOffset;
+ return this;
+ }
+ }, {
+ key: "toString",
+ value: function toString() {
+ return this.x + ' ' + this.y + ' ' + this.width + ' ' + this.height;
+ }
+ }, {
+ key: "toArray",
+ value: function toArray() {
+ return [this.x, this.y, this.width, this.height];
+ }
+ }]);
- return node;
- },
- cancelFrame: function cancelFrame(node) {
- Animator.frames.remove(node);
- },
- clearTimeout: function clearTimeout(node) {
- Animator.timeouts.remove(node);
- },
- _draw: function _draw(now) {
- // Run all the timeouts we can run, if they are not ready yet, add them
- // to the end of the queue immediately! (bad timeouts!!! [sarcasm])
- var nextTimeout = null;
- var lastTimeout = Animator.timeouts.last();
-
- while (nextTimeout = Animator.timeouts.shift()) {
- // Run the timeout if its time, or push it to the end
- if (now >= nextTimeout.time) {
- nextTimeout.run();
- } else {
- Animator.timeouts.push(nextTimeout);
- } // If we hit the last item, we should stop shifting out more items
+ return Box;
+ }();
+ function getBox(cb) {
+ var box;
- if (nextTimeout === lastTimeout) break;
- } // Run all of the animation frames
+ try {
+ box = cb(this.node);
+ if (isNulledBox(box) && !domContains(this.node)) {
+ throw new Error('Element not in the dom');
+ }
+ } catch (e) {
+ try {
+ var clone = this.clone(parser().svg).show();
+ box = cb(clone.node);
+ clone.remove();
+ } catch (e) {
+ console.warn('Getting a bounding box of this element is not possible');
+ }
+ }
- var nextFrame = null;
- var lastFrame = Animator.frames.last();
+ return box;
+ }
- while (nextFrame !== lastFrame && (nextFrame = Animator.frames.shift())) {
- nextFrame.run();
+ registerMethods({
+ Element: {
+ // Get bounding box
+ bbox: function bbox() {
+ return new Box(getBox.call(this, function (node) {
+ return node.getBBox();
+ }));
+ },
+ rbox: function rbox(el) {
+ var box = new Box(getBox.call(this, function (node) {
+ return node.getBoundingClientRect();
+ }));
+ if (el) return box.transform(el.screenCTM().inverse());
+ return box.addOffset();
}
+ },
+ viewbox: {
+ viewbox: function viewbox(x, y, width, height) {
+ // act as getter
+ if (x == null) return new Box(this.attr('viewBox')); // act as setter
- Animator.transforms.forEach(function (el) {
- el();
- }); // If we have remaining timeouts or frames, draw until we don't anymore
-
- Animator.nextDraw = Animator.timeouts.first() || Animator.frames.first() ? window.requestAnimationFrame(Animator._draw) : null;
+ return this.attr('viewBox', new Box(x, y, width, height));
+ }
}
- };
+ });
- var Bare =
+ var Shape =
/*#__PURE__*/
- function (_Container) {
- _inherits(Bare, _Container);
+ function (_Element) {
+ _inherits(Shape, _Element);
- function Bare(node) {
- _classCallCheck(this, Bare);
+ function Shape() {
+ _classCallCheck(this, Shape);
- return _possibleConstructorReturn(this, _getPrototypeOf(Bare).call(this, nodeOrNew(node, typeof node === 'string' ? null : node), Bare));
+ return _possibleConstructorReturn(this, _getPrototypeOf(Shape).apply(this, arguments));
}
- _createClass(Bare, [{
- key: "words",
- value: function words(text) {
- // remove contents
- while (this.node.hasChildNodes()) {
- this.node.removeChild(this.node.lastChild);
- } // create text node
-
-
- this.node.appendChild(document.createTextNode(text));
- return this;
- }
- }]);
-
- return Bare;
- }(Container);
- register(Bare);
- registerMethods('Container', {
- // Create an element that is not described by SVG.js
- element: function element(node, inherit) {
- return this.put(new Bare(node, inherit));
- }
- });
+ return Shape;
+ }(Element);
// FIXME: import this to runner
});
register(Circle);
- // SVG.get = function (id) {
- // var node = document.getElementById(idFromReference(id) || id)
- // return SVG.adopt(node)
- // }
- //
- // // Select elements by query string
- // SVG.select = function (query, parent) {
- // return SVG.utils.map((parent || document).querySelectorAll(query), function (node) {
- // return SVG.adopt(node)
- // })
- // }
- //
- // SVG.$$ = function (query, parent) {
- // return SVG.utils.map((parent || document).querySelectorAll(query), function (node) {
- // return SVG.adopt(node)
- // })
- // }
- //
- // SVG.$ = function (query, parent) {
- // return SVG.adopt((parent || document).querySelector(query))
- // }
-
function baseFind(query, parent) {
return map((parent || document).querySelectorAll(query), function (node) {
return adopt(node);
el.unclip();
}); // remove clipPath from parent
- return _get(_getPrototypeOf(ClipPath.prototype), "remove", this).call(this); // return remove.call(this)
+ return _get(_getPrototypeOf(ClipPath.prototype), "remove", this).call(this);
}
}, {
key: "targets",
});
register(ClipPath);
- var A =
- /*#__PURE__*/
- function (_Container) {
- _inherits(A, _Container);
-
- function A(node) {
- _classCallCheck(this, A);
-
- return _possibleConstructorReturn(this, _getPrototypeOf(A).call(this, nodeOrNew('a', node), A));
- } // Link url
+ /***\r
+ Base Class\r
+ ==========\r
+ The base stepper class that will be\r
+ ***/
+ function makeSetterGetter(k, f) {
+ return function (v) {
+ if (v == null) return this[v];
+ this[k] = v;
+ if (f) f.call(this);
+ return this;
+ };
+ }
- _createClass(A, [{
- key: "to",
- value: function to(url) {
- return this.attr('href', url, xlink);
- } // Link target attribute
+ var easing = {
+ '-': function _(pos) {
+ return pos;
+ },
+ '<>': function _(pos) {
+ return -Math.cos(pos * Math.PI) / 2 + 0.5;
+ },
+ '>': function _(pos) {
+ return Math.sin(pos * Math.PI / 2);
+ },
+ '<': function _(pos) {
+ return -Math.cos(pos * Math.PI / 2) + 1;
+ },
+ bezier: function bezier(t0, x0, t1, x1) {
+ return function (t) {// TODO: FINISH
+ };
+ }
+ };
+ var Stepper =
+ /*#__PURE__*/
+ function () {
+ function Stepper() {
+ _classCallCheck(this, Stepper);
+ }
- }, {
- key: "target",
- value: function target(_target) {
- return this.attr('target', _target);
+ _createClass(Stepper, [{
+ key: "done",
+ value: function done() {
+ return false;
}
}]);
- return A;
- }(Container);
- registerMethods({
- Container: {
- // Create a hyperlink element
- link: function link(url) {
- return this.put(new A()).to(url);
- }
- },
- Element: {
- // Create a hyperlink element
- linkTo: function linkTo(url) {
- var link = new A();
+ return Stepper;
+ }();
+ /***\r
+ Easing Functions\r
+ ================\r
+ ***/
- if (typeof url === 'function') {
- url.call(link, link);
- } else {
- link.to(url);
+ var Ease =
+ /*#__PURE__*/
+ function (_Stepper) {
+ _inherits(Ease, _Stepper);
+
+ function Ease(fn) {
+ var _this;
+
+ _classCallCheck(this, Ease);
+
+ _this = _possibleConstructorReturn(this, _getPrototypeOf(Ease).call(this));
+ _this.ease = easing[fn || timeline.ease] || fn;
+ return _this;
+ }
+
+ _createClass(Ease, [{
+ key: "step",
+ value: function step(from, to, pos) {
+ if (typeof from !== 'number') {
+ return pos < 1 ? from : to;
}
- return this.parent().put(link).put(this);
+ return from + (to - from) * this.ease(pos);
+ }
+ }]);
+
+ return Ease;
+ }(Stepper);
+ /***\r
+ Controller Types\r
+ ================\r
+ ***/
+
+ var Controller =
+ /*#__PURE__*/
+ function (_Stepper2) {
+ _inherits(Controller, _Stepper2);
+
+ function Controller(fn) {
+ var _this2;
+
+ _classCallCheck(this, Controller);
+
+ _this2 = _possibleConstructorReturn(this, _getPrototypeOf(Controller).call(this));
+ _this2.stepper = fn;
+ return _this2;
+ }
+
+ _createClass(Controller, [{
+ key: "step",
+ value: function step(current, target, dt, c) {
+ return this.stepper(current, target, dt, c);
+ }
+ }, {
+ key: "done",
+ value: function done(c) {
+ return c.done;
}
+ }]);
+
+ return Controller;
+ }(Stepper);
+
+ function recalculate() {
+ // Apply the default parameters
+ var duration = (this._duration || 500) / 1000;
+ var overshoot = this._overshoot || 0; // Calculate the PID natural response
+
+ var eps = 1e-10;
+ var pi = Math.PI;
+ var os = Math.log(overshoot / 100 + eps);
+ var zeta = -os / Math.sqrt(pi * pi + os * os);
+ var wn = 3.9 / (zeta * duration); // Calculate the Spring values
+
+ this.d = 2 * zeta * wn;
+ this.k = wn * wn;
+ }
+
+ var Spring =
+ /*#__PURE__*/
+ function (_Controller) {
+ _inherits(Spring, _Controller);
+
+ function Spring(duration, overshoot) {
+ var _this3;
+
+ _classCallCheck(this, Spring);
+
+ _this3 = _possibleConstructorReturn(this, _getPrototypeOf(Spring).call(this));
+
+ _this3.duration(duration || 500).overshoot(overshoot || 0);
+
+ return _this3;
}
+
+ _createClass(Spring, [{
+ key: "step",
+ value: function step(current, target, dt, c) {
+ if (typeof current === 'string') return current;
+ c.done = dt === Infinity;
+ if (dt === Infinity) return target;
+ if (dt === 0) return current;
+ if (dt > 100) dt = 16;
+ dt /= 1000; // Get the previous velocity
+
+ var velocity = c.velocity || 0; // Apply the control to get the new position and store it
+
+ var acceleration = -this.d * velocity - this.k * (current - target);
+ var newPosition = current + velocity * dt + acceleration * dt * dt / 2; // Store the velocity
+
+ c.velocity = velocity + acceleration * dt; // Figure out if we have converged, and if so, pass the value
+
+ c.done = Math.abs(target - newPosition) + Math.abs(velocity) < 0.002;
+ return c.done ? target : newPosition;
+ }
+ }]);
+
+ return Spring;
+ }(Controller);
+ extend(Spring, {
+ duration: makeSetterGetter('_duration', recalculate),
+ overshoot: makeSetterGetter('_overshoot', recalculate)
+ });
+ var PID =
+ /*#__PURE__*/
+ function (_Controller2) {
+ _inherits(PID, _Controller2);
+
+ function PID(p, i, d, windup) {
+ var _this4;
+
+ _classCallCheck(this, PID);
+
+ _this4 = _possibleConstructorReturn(this, _getPrototypeOf(PID).call(this));
+ p = p == null ? 0.1 : p;
+ i = i == null ? 0.01 : i;
+ d = d == null ? 0 : d;
+ windup = windup == null ? 1000 : windup;
+
+ _this4.p(p).i(i).d(d).windup(windup);
+
+ return _this4;
+ }
+
+ _createClass(PID, [{
+ key: "step",
+ value: function step(current, target, dt, c) {
+ if (typeof current === 'string') return current;
+ c.done = dt === Infinity;
+ if (dt === Infinity) return target;
+ if (dt === 0) return current;
+ var p = target - current;
+ var i = (c.integral || 0) + p * dt;
+ var d = (p - (c.error || 0)) / dt;
+ var windup = this.windup; // antiwindup
+
+ if (windup !== false) {
+ i = Math.max(-windup, Math.min(i, windup));
+ }
+
+ c.error = p;
+ c.integral = i;
+ c.done = Math.abs(p) < 0.001;
+ return c.done ? target : current + (this.P * p + this.I * i + this.D * d);
+ }
+ }]);
+
+ return PID;
+ }(Controller);
+ extend(PID, {
+ windup: makeSetterGetter('windup'),
+ p: makeSetterGetter('P'),
+ i: makeSetterGetter('I'),
+ d: makeSetterGetter('D')
});
- register(A);
var Ellipse =
/*#__PURE__*/
to: to
});
- function parser() {
- // Reuse cached element if possible
- if (!parser.nodes) {
- var svg = new Doc$1().size(2, 0).css({
- opacity: 0,
- position: 'absolute',
- left: '-100%',
- top: '-100%',
- overflow: 'hidden'
- });
- var path = svg.path().node;
- parser.nodes = {
- svg: svg,
- path: path
- };
- }
-
- if (!parser.nodes.svg.node.parentNode) {
- var b = document.body || document.documentElement;
- parser.nodes.svg.addTo(b);
- }
-
- return parser.nodes;
- }
-
- var Point =
+ var Gradient =
/*#__PURE__*/
- function () {
- // Initialize
- function Point(x, y, base) {
- _classCallCheck(this, Point);
-
- var source;
- base = base || {
- x: 0,
- y: 0 // ensure source as object
+ function (_Container) {
+ _inherits(Gradient, _Container);
- };
- source = Array.isArray(x) ? {
- x: x[0],
- y: x[1]
- } : _typeof(x) === 'object' ? {
- x: x.x,
- y: x.y
- } : {
- x: x,
- y: y // merge source
+ function Gradient(type) {
+ _classCallCheck(this, Gradient);
- };
- this.x = source.x == null ? base.x : source.x;
- this.y = source.y == null ? base.y : source.y;
- } // Clone point
+ return _possibleConstructorReturn(this, _getPrototypeOf(Gradient).call(this, nodeOrNew(type + 'Gradient', typeof type === 'string' ? null : type), Gradient));
+ } // Add a color stop
- _createClass(Point, [{
- key: "clone",
- value: function clone() {
- return new Point(this);
- } // Convert to native SVGPoint
+ _createClass(Gradient, [{
+ key: "stop",
+ value: function stop(offset, color, opacity) {
+ return this.put(new Stop()).update(offset, color, opacity);
+ } // Update gradient
}, {
- key: "native",
- value: function native() {
- // create new point
- var point = parser().svg.node.createSVGPoint(); // update with current values
+ key: "update",
+ value: function update(block) {
+ // remove all stops
+ this.clear(); // invoke passed block
- point.x = this.x;
- point.y = this.y;
- return point;
- } // transform point with matrix
+ if (typeof block === 'function') {
+ block.call(this, this);
+ }
+
+ return this;
+ } // Return the fill id
}, {
- key: "transform",
- value: function transform(m) {
- // Perform the matrix multiplication
- var x = m.a * this.x + m.c * this.y + m.e;
- var y = m.b * this.x + m.d * this.y + m.f; // Return the required point
+ key: "url",
+ value: function url() {
+ return 'url(#' + this.id() + ')';
+ } // Alias string convertion to fill
- return new Point(x, y);
+ }, {
+ key: "toString",
+ value: function toString() {
+ return this.url();
+ } // custom attr to handle transform
+
+ }, {
+ key: "attr",
+ value: function attr(a, b, c) {
+ if (a === 'transform') a = 'gradientTransform';
+ return _get(_getPrototypeOf(Gradient.prototype), "attr", this).call(this, a, b, c);
+ }
+ }, {
+ key: "targets",
+ value: function targets() {
+ return find('svg [fill*="' + this.id() + '"]');
+ }
+ }, {
+ key: "bbox",
+ value: function bbox() {
+ return new Box();
}
}]);
- return Point;
- }();
+ return Gradient;
+ }(Container);
+ extend(Gradient, gradiented);
+ registerMethods({
+ Container: {
+ // Create gradient element in defs
+ gradient: function gradient(type, block) {
+ return this.defs().gradient(type, block);
+ }
+ },
+ // define gradient
+ Defs: {
+ gradient: function gradient(type, block) {
+ return this.put(new Gradient(type)).update(block);
+ }
+ }
+ });
+ register(Gradient);
+
+ var G =
+ /*#__PURE__*/
+ function (_Container) {
+ _inherits(G, _Container);
+
+ function G(node) {
+ _classCallCheck(this, G);
+
+ return _possibleConstructorReturn(this, _getPrototypeOf(G).call(this, nodeOrNew('g', node), G));
+ }
+
+ return G;
+ }(Container);
registerMethods({
Element: {
- // Get point
- point: function point(x, y) {
- return new Point(x, y).transform(this.screenCTM().inverse());
+ // Create a group element
+ group: function group() {
+ return this.put(new G());
}
}
});
+ register(G);
- var Box =
+ var HtmlNode =
/*#__PURE__*/
- function () {
- function Box() {
- _classCallCheck(this, Box);
+ function (_Dom) {
+ _inherits(HtmlNode, _Dom);
- this.init.apply(this, arguments);
+ function HtmlNode(node) {
+ _classCallCheck(this, HtmlNode);
+
+ return _possibleConstructorReturn(this, _getPrototypeOf(HtmlNode).call(this, node, HtmlNode));
}
- _createClass(Box, [{
- key: "init",
- value: function init(source) {
- var base = [0, 0, 0, 0];
- source = typeof source === 'string' ? source.split(delimiter).map(parseFloat) : Array.isArray(source) ? source : _typeof(source) === 'object' ? [source.left != null ? source.left : source.x, source.top != null ? source.top : source.y, source.width, source.height] : arguments.length === 4 ? [].slice.call(arguments) : base;
- this.x = source[0];
- this.y = source[1];
- this.width = source[2];
- this.height = source[3]; // add center, right, bottom...
+ return HtmlNode;
+ }(Dom);
+ register(HtmlNode);
- fullBox(this);
- } // Merge rect box with another, return a new instance
+ var A =
+ /*#__PURE__*/
+ function (_Container) {
+ _inherits(A, _Container);
- }, {
- key: "merge",
- value: function merge(box) {
- var x = Math.min(this.x, box.x);
- var y = Math.min(this.y, box.y);
- var width = Math.max(this.x + this.width, box.x + box.width) - x;
- var height = Math.max(this.y + this.height, box.y + box.height) - y;
- return new Box(x, y, width, height);
- }
- }, {
- key: "transform",
- value: function transform(m) {
- var xMin = Infinity;
- var xMax = -Infinity;
- var yMin = Infinity;
- var yMax = -Infinity;
- var pts = [new Point(this.x, this.y), new Point(this.x2, this.y), new Point(this.x, this.y2), new Point(this.x2, this.y2)];
- pts.forEach(function (p) {
- p = p.transform(m);
- xMin = Math.min(xMin, p.x);
- xMax = Math.max(xMax, p.x);
- yMin = Math.min(yMin, p.y);
- yMax = Math.max(yMax, p.y);
- });
- return new Box(xMin, yMin, xMax - xMin, yMax - yMin);
- }
- }, {
- key: "addOffset",
- value: function addOffset() {
- // offset by window scroll position, because getBoundingClientRect changes when window is scrolled
- this.x += window.pageXOffset;
- this.y += window.pageYOffset;
- return this;
- }
- }, {
- key: "toString",
- value: function toString() {
- return this.x + ' ' + this.y + ' ' + this.width + ' ' + this.height;
- }
- }, {
- key: "toArray",
- value: function toArray() {
- return [this.x, this.y, this.width, this.height];
- }
- }]);
+ function A(node) {
+ _classCallCheck(this, A);
- return Box;
- }();
+ return _possibleConstructorReturn(this, _getPrototypeOf(A).call(this, nodeOrNew('a', node), A));
+ } // Link url
- function getBox(cb) {
- var box;
- try {
- box = cb(this.node);
+ _createClass(A, [{
+ key: "to",
+ value: function to(url) {
+ return this.attr('href', url, xlink);
+ } // Link target attribute
- if (isNulledBox(box) && !domContains(this.node)) {
- throw new Error('Element not in the dom');
- }
- } catch (e) {
- try {
- var clone = this.clone(parser().svg).show();
- box = cb(clone.node);
- clone.remove();
- } catch (e) {
- console.warn('Getting a bounding box of this element is not possible');
+ }, {
+ key: "target",
+ value: function target(_target) {
+ return this.attr('target', _target);
}
- }
-
- return box;
- }
+ }]);
+ return A;
+ }(Container);
registerMethods({
- Element: {
- // Get bounding box
- bbox: function bbox() {
- return new Box(getBox.call(this, function (node) {
- return node.getBBox();
- }));
- },
- rbox: function rbox(el) {
- var box = new Box(getBox.call(this, function (node) {
- return node.getBoundingClientRect();
- }));
- if (el) return box.transform(el.screenCTM().inverse());
- return box.addOffset();
+ Container: {
+ // Create a hyperlink element
+ link: function link(url) {
+ return this.put(new A()).to(url);
}
},
- viewbox: {
- viewbox: function viewbox(x, y, width, height) {
- // act as getter
- if (x == null) return new Box(this.attr('viewBox')); // act as setter
+ Element: {
+ // Create a hyperlink element
+ linkTo: function linkTo(url) {
+ var link = new A();
- return this.attr('viewBox', new Box(x, y, width, height));
+ if (typeof url === 'function') {
+ url.call(link, link);
+ } else {
+ link.to(url);
+ }
+
+ return this.parent().put(link).put(this);
}
}
});
+ register(A);
- var Gradient =
+ var Pattern =
/*#__PURE__*/
function (_Container) {
- _inherits(Gradient, _Container);
+ _inherits(Pattern, _Container);
- function Gradient(type) {
- _classCallCheck(this, Gradient);
+ // Initialize node
+ function Pattern(node) {
+ _classCallCheck(this, Pattern);
- return _possibleConstructorReturn(this, _getPrototypeOf(Gradient).call(this, nodeOrNew(type + 'Gradient', typeof type === 'string' ? null : type), Gradient));
- } // Add a color stop
+ return _possibleConstructorReturn(this, _getPrototypeOf(Pattern).call(this, nodeOrNew('pattern', node), Pattern));
+ } // Return the fill id
- _createClass(Gradient, [{
- key: "stop",
- value: function stop(offset, color, opacity) {
- return this.put(new Stop()).update(offset, color, opacity);
- } // Update gradient
+ _createClass(Pattern, [{
+ key: "url",
+ value: function url() {
+ return 'url(#' + this.id() + ')';
+ } // Update pattern by rebuilding
}, {
key: "update",
value: function update(block) {
- // remove all stops
+ // remove content
this.clear(); // invoke passed block
if (typeof block === 'function') {
}
return this;
- } // Return the fill id
-
- }, {
- key: "url",
- value: function url() {
- return 'url(#' + this.id() + ')';
} // Alias string convertion to fill
}, {
}, {
key: "attr",
value: function attr(a, b, c) {
- if (a === 'transform') a = 'gradientTransform';
- return _get(_getPrototypeOf(Gradient.prototype), "attr", this).call(this, a, b, c); // return attr.call(this, a, b, c)
+ if (a === 'transform') a = 'patternTransform';
+ return _get(_getPrototypeOf(Pattern.prototype), "attr", this).call(this, a, b, c);
}
}, {
key: "targets",
}
}]);
- return Gradient;
- }(Container);
- extend(Gradient, gradiented);
- registerMethods({
- Container: {
- // Create gradient element in defs
- gradient: function gradient(type, block) {
- return this.defs().gradient(type, block);
- }
- },
- // define gradient
- Defs: {
- gradient: function gradient(type, block) {
- return this.put(new Gradient(type)).update(block);
- }
- }
- });
- register(Gradient);
-
- var Pattern =
- /*#__PURE__*/
- function (_Container) {
- _inherits(Pattern, _Container);
-
- // Initialize node
- function Pattern(node) {
- _classCallCheck(this, Pattern);
-
- return _possibleConstructorReturn(this, _getPrototypeOf(Pattern).call(this, nodeOrNew('pattern', node), Pattern));
- } // Return the fill id
-
-
- _createClass(Pattern, [{
- key: "url",
- value: function url() {
- return 'url(#' + this.id() + ')';
- } // Update pattern by rebuilding
-
- }, {
- key: "update",
- value: function update(block) {
- // remove content
- this.clear(); // invoke passed block
-
- if (typeof block === 'function') {
- block.call(this, this);
- }
-
- return this;
- } // Alias string convertion to fill
-
- }, {
- key: "toString",
- value: function toString() {
- return this.url();
- } // custom attr to handle transform
-
- }, {
- key: "attr",
- value: function attr(a, b, c) {
- if (a === 'transform') a = 'patternTransform';
- return _get(_getPrototypeOf(Pattern.prototype), "attr", this).call(this, a, b, c); // return attr.call(this, a, b, c)
- }
- }, {
- key: "targets",
- value: function targets() {
- return find('svg [fill*="' + this.id() + '"]');
- }
- }, {
- key: "bbox",
- value: function bbox() {
- return new Box();
- }
- }]);
-
- return Pattern;
+ return Pattern;
}(Container);
registerMethods({
Container: {
height: maxY - minY
};
}
- }); // export default class PointArray extends SVGArray {
- // constructor (array, fallback = [[0, 0]]) {
- // super(array, fallback)
- // }
- //
- // // Convert array to string
- // toString () {
- // // convert to a poly point string
- // for (var i = 0, il = this.length, array = []; i < il; i++) {
- // array.push(this[i].join(','))
- // }
- //
- // return array.join(' ')
- // }
- //
- // // toArray () {
- // // return this.reduce(function (prev, curr) {
- // // return [].concat.call(prev, curr)
- // // }, [])
- // // }
- //
- // // Convert array to line object
- // toLine () {
- // return {
- // x1: this[0][0],
- // y1: this[0][1],
- // x2: this[1][0],
- // y2: this[1][1]
- // }
- // }
- //
- // // Get morphed array at given position
- // at (pos) {
- // // make sure a destination is defined
- // if (!this.destination) return this
- //
- // // generate morphed point string
- // for (var i = 0, il = this.length, array = []; i < il; i++) {
- // array.push([
- // this[i][0] + (this.destination[i][0] - this[i][0]) * pos,
- // this[i][1] + (this.destination[i][1] - this[i][1]) * pos
- // ])
- // }
- //
- // return new PointArray(array)
- // }
- //
- // // Parse point string and flat array
- // parse (array) {
- // var points = []
- //
- // array = array.valueOf()
- //
- // // if it is an array
- // if (Array.isArray(array)) {
- // // and it is not flat, there is no need to parse it
- // if (Array.isArray(array[0])) {
- // return array
- // }
- // } else { // Else, it is considered as a string
- // // parse points
- // array = array.trim().split(delimiter).map(parseFloat)
- // }
- //
- // // validate points - https://svgwg.org/svg2-draft/shapes.html#DataTypePoints
- // // Odd number of coordinates is an error. In such cases, drop the last odd coordinate.
- // if (array.length % 2 !== 0) array.pop()
- //
- // // wrap points in two-tuples and parse points as floats
- // for (var i = 0, len = array.length; i < len; i = i + 2) {
- // points.push([ array[i], array[i + 1] ])
- // }
- //
- // return points
- // }
- //
- // // Move point string
- // move (x, y) {
- // var box = this.bbox()
- //
- // // get relative offset
- // x -= box.x
- // y -= box.y
- //
- // // move every point
- // if (!isNaN(x) && !isNaN(y)) {
- // for (var i = this.length - 1; i >= 0; i--) {
- // this[i] = [this[i][0] + x, this[i][1] + y]
- // }
- // }
- //
- // return this
- // }
- //
- // // Resize poly string
- // size (width, height) {
- // var i
- // var box = this.bbox()
- //
- // // recalculate position of all points according to new size
- // for (i = this.length - 1; i >= 0; i--) {
- // if (box.width) this[i][0] = ((this[i][0] - box.x) * width) / box.width + box.x
- // if (box.height) this[i][1] = ((this[i][1] - box.y) * height) / box.height + box.y
- // }
- //
- // return this
- // }
- //
- // // Get bounding box of points
- // bbox () {
- // var maxX = -Infinity
- // var maxY = -Infinity
- // var minX = Infinity
- // var minY = Infinity
- // this.forEach(function (el) {
- // maxX = Math.max(el[0], maxX)
- // maxY = Math.max(el[1], maxY)
- // minX = Math.min(el[0], minX)
- // minY = Math.min(el[1], minY)
- // })
- // return {x: minX, y: minY, width: maxX - minX, height: maxY - minY}
- // }
- // }
+ });
var MorphArray = PointArray; // Move by left top corner over x-axis
el.unmask();
}); // remove mask from parent
- return _get(_getPrototypeOf(Mask.prototype), "remove", this).call(this); // return remove.call(this)
+ return _get(_getPrototypeOf(Mask.prototype), "remove", this).call(this);
}
}, {
key: "targets",
});
register(Mask);
- var PathArray = subClassArray('PathArray', SVGArray);
- var pathHandlers = {
- M: function M(c, p, p0) {
- p.x = p0.x = c[0];
- p.y = p0.y = c[1];
- return ['M', p.x, p.y];
- },
- L: function L(c, p) {
- p.x = c[0];
- p.y = c[1];
- return ['L', c[0], c[1]];
- },
- H: function H(c, p) {
- p.x = c[0];
- return ['H', c[0]];
- },
- V: function V(c, p) {
- p.y = c[0];
- return ['V', c[0]];
- },
- C: function C(c, p) {
- p.x = c[4];
- p.y = c[5];
- return ['C', c[0], c[1], c[2], c[3], c[4], c[5]];
- },
- S: function S(c, p) {
- p.x = c[2];
- p.y = c[3];
- return ['S', c[0], c[1], c[2], c[3]];
- },
- Q: function Q(c, p) {
- p.x = c[2];
- p.y = c[3];
- return ['Q', c[0], c[1], c[2], c[3]];
- },
- T: function T(c, p) {
- p.x = c[0];
- p.y = c[1];
- return ['T', c[0], c[1]];
- },
- Z: function Z(c, p, p0) {
- p.x = p0.x;
- p.y = p0.y;
- return ['Z'];
- },
- A: function A(c, p) {
- p.x = c[5];
- p.y = c[6];
- return ['A', c[0], c[1], c[2], c[3], c[4], c[5], c[6]];
- }
- };
- var mlhvqtcsaz = 'mlhvqtcsaz'.split('');
+ var Matrix =
+ /*#__PURE__*/
+ function () {
+ function Matrix() {
+ _classCallCheck(this, Matrix);
- for (var i = 0, il = mlhvqtcsaz.length; i < il; ++i) {
- pathHandlers[mlhvqtcsaz[i]] = function (i) {
- return function (c, p, p0) {
- if (i === 'H') c[0] = c[0] + p.x;else if (i === 'V') c[0] = c[0] + p.y;else if (i === 'A') {
- c[5] = c[5] + p.x;
- c[6] = c[6] + p.y;
- } else {
- for (var j = 0, jl = c.length; j < jl; ++j) {
- c[j] = c[j] + (j % 2 ? p.y : p.x);
- }
- }
- return pathHandlers[i](c, p, p0);
- };
- }(mlhvqtcsaz[i].toUpperCase());
- }
+ this.init.apply(this, arguments);
+ } // Initialize
- extend(PathArray, {
- // Convert array to string
- toString: function toString() {
- return arrayToString(this);
- },
- // Move path string
- move: function move(x, y) {
- // get bounding box of current situation
- var box = this.bbox(); // get relative offset
- x -= box.x;
- y -= box.y;
+ _createClass(Matrix, [{
+ key: "init",
+ value: function init(source) {
+ var base = arrayToMatrix([1, 0, 0, 1, 0, 0]); // ensure source as object
- if (!isNaN(x) && !isNaN(y)) {
- // move every point
- for (var l, i = this.length - 1; i >= 0; i--) {
- l = this[i][0];
+ source = source instanceof Element ? source.matrixify() : typeof source === 'string' ? arrayToMatrix(source.split(delimiter).map(parseFloat)) : Array.isArray(source) ? arrayToMatrix(source) : _typeof(source) === 'object' && isMatrixLike(source) ? source : _typeof(source) === 'object' ? new Matrix().transform(source) : arguments.length === 6 ? arrayToMatrix([].slice.call(arguments)) : base; // Merge the source matrix with the base matrix
- if (l === 'M' || l === 'L' || l === 'T') {
- this[i][1] += x;
- this[i][2] += y;
- } else if (l === 'H') {
- this[i][1] += x;
- } else if (l === 'V') {
- this[i][1] += y;
- } else if (l === 'C' || l === 'S' || l === 'Q') {
- this[i][1] += x;
- this[i][2] += y;
- this[i][3] += x;
- this[i][4] += y;
+ this.a = source.a != null ? source.a : base.a;
+ this.b = source.b != null ? source.b : base.b;
+ this.c = source.c != null ? source.c : base.c;
+ this.d = source.d != null ? source.d : base.d;
+ this.e = source.e != null ? source.e : base.e;
+ this.f = source.f != null ? source.f : base.f;
+ } // Clones this matrix
- if (l === 'C') {
- this[i][5] += x;
- this[i][6] += y;
- }
- } else if (l === 'A') {
- this[i][6] += x;
- this[i][7] += y;
- }
- }
- }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new Matrix(this);
+ } // Transform a matrix into another matrix by manipulating the space
- return this;
- },
- // Resize path string
- size: function size(width, height) {
- // get bounding box of current situation
- var box = this.bbox();
- var i, l; // recalculate position of all points according to new size
+ }, {
+ key: "transform",
+ value: function transform(o) {
+ // Check if o is a matrix and then left multiply it directly
+ if (isMatrixLike(o)) {
+ var matrix = new Matrix(o);
+ return matrix.multiplyO(this);
+ } // Get the proposed transformations and the current transformations
- for (i = this.length - 1; i >= 0; i--) {
- l = this[i][0];
- if (l === 'M' || l === 'L' || l === 'T') {
- this[i][1] = (this[i][1] - box.x) * width / box.width + box.x;
- this[i][2] = (this[i][2] - box.y) * height / box.height + box.y;
- } else if (l === 'H') {
- this[i][1] = (this[i][1] - box.x) * width / box.width + box.x;
- } else if (l === 'V') {
- this[i][1] = (this[i][1] - box.y) * height / box.height + box.y;
- } else if (l === 'C' || l === 'S' || l === 'Q') {
- this[i][1] = (this[i][1] - box.x) * width / box.width + box.x;
- this[i][2] = (this[i][2] - box.y) * height / box.height + box.y;
- this[i][3] = (this[i][3] - box.x) * width / box.width + box.x;
- this[i][4] = (this[i][4] - box.y) * height / box.height + box.y;
+ var t = Matrix.formatTransforms(o);
+ var current = this;
- if (l === 'C') {
- this[i][5] = (this[i][5] - box.x) * width / box.width + box.x;
- this[i][6] = (this[i][6] - box.y) * height / box.height + box.y;
- }
- } else if (l === 'A') {
- // resize radii
- this[i][1] = this[i][1] * width / box.width;
- this[i][2] = this[i][2] * height / box.height; // move position values
+ var _transform = new Point(t.ox, t.oy).transform(current),
+ ox = _transform.x,
+ oy = _transform.y; // Construct the resulting matrix
- this[i][6] = (this[i][6] - box.x) * width / box.width + box.x;
- this[i][7] = (this[i][7] - box.y) * height / box.height + box.y;
- }
- }
- return this;
- },
- // Test if the passed path array use the same path data commands as this path array
- equalCommands: function equalCommands(pathArray) {
- var i, il, equalCommands;
- pathArray = new PathArray(pathArray);
- equalCommands = this.length === pathArray.length;
+ var transformer = new Matrix().translateO(t.rx, t.ry).lmultiplyO(current).translateO(-ox, -oy).scaleO(t.scaleX, t.scaleY).skewO(t.skewX, t.skewY).shearO(t.shear).rotateO(t.theta).translateO(ox, oy); // If we want the origin at a particular place, we force it there
- for (i = 0, il = this.length; equalCommands && i < il; i++) {
- equalCommands = this[i][0] === pathArray[i][0];
- }
-
- return equalCommands;
- },
- // Make path array morphable
- morph: function morph(pathArray) {
- pathArray = new PathArray(pathArray);
-
- if (this.equalCommands(pathArray)) {
- this.destination = pathArray;
- } else {
- this.destination = null;
- }
-
- return this;
- },
- // Get morphed path array at given position
- at: function at(pos) {
- // make sure a destination is defined
- if (!this.destination) return this;
- var sourceArray = this;
- var destinationArray = this.destination.value;
- var array = [];
- var pathArray = new PathArray();
- var i, il, j, jl; // Animate has specified in the SVG spec
- // See: https://www.w3.org/TR/SVG11/paths.html#PathElement
+ if (isFinite(t.px) || isFinite(t.py)) {
+ var origin = new Point(ox, oy).transform(transformer); // TODO: Replace t.px with isFinite(t.px)
- for (i = 0, il = sourceArray.length; i < il; i++) {
- array[i] = [sourceArray[i][0]];
+ var dx = t.px ? t.px - origin.x : 0;
+ var dy = t.py ? t.py - origin.y : 0;
+ transformer.translateO(dx, dy);
+ } // Translate now after positioning
- for (j = 1, jl = sourceArray[i].length; j < jl; j++) {
- array[i][j] = sourceArray[i][j] + (destinationArray[i][j] - sourceArray[i][j]) * pos;
- } // For the two flags of the elliptical arc command, the SVG spec say:
- // Flags and booleans are interpolated as fractions between zero and one, with any non-zero value considered to be a value of one/true
- // Elliptical arc command as an array followed by corresponding indexes:
- // ['A', rx, ry, x-axis-rotation, large-arc-flag, sweep-flag, x, y]
- // 0 1 2 3 4 5 6 7
+ transformer.translateO(t.tx, t.ty);
+ return transformer;
+ } // Applies a matrix defined by its affine parameters
- if (array[i][0] === 'A') {
- array[i][4] = +(array[i][4] !== 0);
- array[i][5] = +(array[i][5] !== 0);
- }
- } // Directly modify the value of a path array, this is done this way for performance
+ }, {
+ key: "compose",
+ value: function compose(o) {
+ if (o.origin) {
+ o.originX = o.origin[0];
+ o.originY = o.origin[1];
+ } // Get the parameters
- pathArray.value = array;
- return pathArray;
- },
- // Absolutize and parse path to array
- parse: function parse() {
- var array = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [['M', 0, 0]];
- // if it's already a patharray, no need to parse it
- if (array instanceof PathArray) return array; // prepare for parsing
+ var ox = o.originX || 0;
+ var oy = o.originY || 0;
+ var sx = o.scaleX || 1;
+ var sy = o.scaleY || 1;
+ var lam = o.shear || 0;
+ var theta = o.rotate || 0;
+ var tx = o.translateX || 0;
+ var ty = o.translateY || 0; // Apply the standard matrix
- var s;
- var paramCnt = {
- 'M': 2,
- 'L': 2,
- 'H': 1,
- 'V': 1,
- 'C': 6,
- 'S': 4,
- 'Q': 4,
- 'T': 2,
- 'A': 7,
- 'Z': 0
- };
+ var result = new Matrix().translateO(-ox, -oy).scaleO(sx, sy).shearO(lam).rotateO(theta).translateO(tx, ty).lmultiplyO(this).translateO(ox, oy);
+ return result;
+ } // Decomposes this matrix into its affine parameters
- if (typeof array === 'string') {
- array = array.replace(numbersWithDots, pathRegReplace) // convert 45.123.123 to 45.123 .123
- .replace(pathLetters, ' $& ') // put some room between letters and numbers
- .replace(hyphen, '$1 -') // add space before hyphen
- .trim() // trim
- .split(delimiter); // split into array
- } else {
- array = array.reduce(function (prev, curr) {
- return [].concat.call(prev, curr);
- }, []);
- } // array now is an array containing all parts of a path e.g. ['M', '0', '0', 'L', '30', '30' ...]
+ }, {
+ key: "decompose",
+ value: function decompose() {
+ var cx = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
+ var cy = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+ // Get the parameters from the matrix
+ var a = this.a;
+ var b = this.b;
+ var c = this.c;
+ var d = this.d;
+ var e = this.e;
+ var f = this.f; // Figure out if the winding direction is clockwise or counterclockwise
+ var determinant = a * d - b * c;
+ var ccw = determinant > 0 ? 1 : -1; // Since we only shear in x, we can use the x basis to get the x scale
+ // and the rotation of the resulting matrix
- var result = [];
- var p = new Point();
- var p0 = new Point();
- var index = 0;
- var len = array.length;
+ var sx = ccw * Math.sqrt(a * a + b * b);
+ var thetaRad = Math.atan2(ccw * b, ccw * a);
+ var theta = 180 / Math.PI * thetaRad;
+ var ct = Math.cos(thetaRad);
+ var st = Math.sin(thetaRad); // We can then solve the y basis vector simultaneously to get the other
+ // two affine parameters directly from these parameters
- do {
- // Test if we have a path letter
- if (isPathLetter.test(array[index])) {
- s = array[index];
- ++index; // If last letter was a move command and we got no new, it defaults to [L]ine
- } else if (s === 'M') {
- s = 'L';
- } else if (s === 'm') {
- s = 'l';
- }
+ var lam = (a * c + b * d) / determinant;
+ var sy = c * sx / (lam * a - b) || d * sx / (lam * b + a); // Use the translations
- result.push(pathHandlers[s].call(null, array.slice(index, index = index + paramCnt[s.toUpperCase()]).map(parseFloat), p, p0));
- } while (len > index);
+ var tx = e - cx + cx * ct * sx + cy * (lam * ct * sx - st * sy);
+ var ty = f - cy + cx * st * sx + cy * (lam * st * sx + ct * sy); // Construct the decomposition and return it
- return result;
- },
- // Get bounding box of path
- bbox: function bbox() {
- parser().path.setAttribute('d', this.toString());
- return parser.nodes.path.getBBox();
- }
- }); // export default class PathArray extends SVGArray {
- // constructor (array, fallback = [['M', 0, 0]]) {
- // super(array, fallback)
- // }
- //
- // // Convert array to string
- // toString () {
- // return arrayToString(this)
- // }
- //
- // toArray () {
- // return this.reduce(function (prev, curr) {
- // return [].concat.call(prev, curr)
- // }, [])
- // }
- //
- // // Move path string
- // move (x, y) {
- // // get bounding box of current situation
- // var box = this.bbox()
- //
- // // get relative offset
- // x -= box.x
- // y -= box.y
- //
- // if (!isNaN(x) && !isNaN(y)) {
- // // move every point
- // for (var l, i = this.length - 1; i >= 0; i--) {
- // l = this[i][0]
- //
- // if (l === 'M' || l === 'L' || l === 'T') {
- // this[i][1] += x
- // this[i][2] += y
- // } else if (l === 'H') {
- // this[i][1] += x
- // } else if (l === 'V') {
- // this[i][1] += y
- // } else if (l === 'C' || l === 'S' || l === 'Q') {
- // this[i][1] += x
- // this[i][2] += y
- // this[i][3] += x
- // this[i][4] += y
- //
- // if (l === 'C') {
- // this[i][5] += x
- // this[i][6] += y
- // }
- // } else if (l === 'A') {
- // this[i][6] += x
- // this[i][7] += y
- // }
- // }
- // }
- //
- // return this
- // }
- //
- // // Resize path string
- // size (width, height) {
- // // get bounding box of current situation
- // var box = this.bbox()
- // var i, l
- //
- // // recalculate position of all points according to new size
- // for (i = this.length - 1; i >= 0; i--) {
- // l = this[i][0]
- //
- // if (l === 'M' || l === 'L' || l === 'T') {
- // this[i][1] = ((this[i][1] - box.x) * width) / box.width + box.x
- // this[i][2] = ((this[i][2] - box.y) * height) / box.height + box.y
- // } else if (l === 'H') {
- // this[i][1] = ((this[i][1] - box.x) * width) / box.width + box.x
- // } else if (l === 'V') {
- // this[i][1] = ((this[i][1] - box.y) * height) / box.height + box.y
- // } else if (l === 'C' || l === 'S' || l === 'Q') {
- // this[i][1] = ((this[i][1] - box.x) * width) / box.width + box.x
- // this[i][2] = ((this[i][2] - box.y) * height) / box.height + box.y
- // this[i][3] = ((this[i][3] - box.x) * width) / box.width + box.x
- // this[i][4] = ((this[i][4] - box.y) * height) / box.height + box.y
- //
- // if (l === 'C') {
- // this[i][5] = ((this[i][5] - box.x) * width) / box.width + box.x
- // this[i][6] = ((this[i][6] - box.y) * height) / box.height + box.y
- // }
- // } else if (l === 'A') {
- // // resize radii
- // this[i][1] = (this[i][1] * width) / box.width
- // this[i][2] = (this[i][2] * height) / box.height
- //
- // // move position values
- // this[i][6] = ((this[i][6] - box.x) * width) / box.width + box.x
- // this[i][7] = ((this[i][7] - box.y) * height) / box.height + box.y
- // }
- // }
- //
- // return this
- // }
- //
- // // Test if the passed path array use the same path data commands as this path array
- // equalCommands (pathArray) {
- // var i, il, equalCommands
- //
- // pathArray = new PathArray(pathArray)
- //
- // equalCommands = this.length === pathArray.value.length
- // for (i = 0, il = this.length; equalCommands && i < il; i++) {
- // equalCommands = this[i][0] === pathArray.value[i][0]
- // }
- //
- // return equalCommands
- // }
- //
- // // Make path array morphable
- // morph (pathArray) {
- // pathArray = new PathArray(pathArray)
- //
- // if (this.equalCommands(pathArray)) {
- // this.destination = pathArray
- // } else {
- // this.destination = null
- // }
- //
- // return this
- // }
- //
- // // Get morphed path array at given position
- // at (pos) {
- // // make sure a destination is defined
- // if (!this.destination) return this
- //
- // var sourceArray = this
- // var destinationArray = this.destination.value
- // var array = []
- // var pathArray = new PathArray()
- // var i, il, j, jl
- //
- // // Animate has specified in the SVG spec
- // // See: https://www.w3.org/TR/SVG11/paths.html#PathElement
- // for (i = 0, il = sourceArray.length; i < il; i++) {
- // array[i] = [sourceArray[i][0]]
- // for (j = 1, jl = sourceArray[i].length; j < jl; j++) {
- // array[i][j] = sourceArray[i][j] + (destinationArray[i][j] - sourceArray[i][j]) * pos
- // }
- // // For the two flags of the elliptical arc command, the SVG spec say:
- // // Flags and booleans are interpolated as fractions between zero and one, with any non-zero value considered to be a value of one/true
- // // Elliptical arc command as an array followed by corresponding indexes:
- // // ['A', rx, ry, x-axis-rotation, large-arc-flag, sweep-flag, x, y]
- // // 0 1 2 3 4 5 6 7
- // if (array[i][0] === 'A') {
- // array[i][4] = +(array[i][4] !== 0)
- // array[i][5] = +(array[i][5] !== 0)
- // }
- // }
- //
- // // Directly modify the value of a path array, this is done this way for performance
- // pathArray.value = array
- // return pathArray
- // }
- //
- // // Absolutize and parse path to array
- // parse (array) {
- // // if it's already a patharray, no need to parse it
- // if (array instanceof PathArray) return array.valueOf()
- //
- // // prepare for parsing
- // var s
- // var paramCnt = { 'M': 2, 'L': 2, 'H': 1, 'V': 1, 'C': 6, 'S': 4, 'Q': 4, 'T': 2, 'A': 7, 'Z': 0 }
- //
- // if (typeof array === 'string') {
- // array = array
- // .replace(numbersWithDots, pathRegReplace) // convert 45.123.123 to 45.123 .123
- // .replace(pathLetters, ' $& ') // put some room between letters and numbers
- // .replace(hyphen, '$1 -') // add space before hyphen
- // .trim() // trim
- // .split(delimiter) // split into array
- // } else {
- // array = array.reduce(function (prev, curr) {
- // return [].concat.call(prev, curr)
- // }, [])
- // }
- //
- // // array now is an array containing all parts of a path e.g. ['M', '0', '0', 'L', '30', '30' ...]
- // var result = []
- // var p = new Point()
- // var p0 = new Point()
- // var index = 0
- // var len = array.length
- //
- // do {
- // // Test if we have a path letter
- // if (isPathLetter.test(array[index])) {
- // s = array[index]
- // ++index
- // // If last letter was a move command and we got no new, it defaults to [L]ine
- // } else if (s === 'M') {
- // s = 'L'
- // } else if (s === 'm') {
- // s = 'l'
- // }
- //
- // result.push(pathHandlers[s].call(null,
- // array.slice(index, (index = index + paramCnt[s.toUpperCase()])).map(parseFloat),
- // p, p0
- // )
- // )
- // } while (len > index)
- //
- // return result
- // }
- //
- // // Get bounding box of path
- // bbox () {
- // parser().path.setAttribute('d', this.toString())
- // return parser.nodes.path.getBBox()
- // }
- // }
+ return {
+ // Return the affine parameters
+ scaleX: sx,
+ scaleY: sy,
+ shear: lam,
+ rotate: theta,
+ translateX: tx,
+ translateY: ty,
+ originX: cx,
+ originY: cy,
+ // Return the matrix parameters
+ a: this.a,
+ b: this.b,
+ c: this.c,
+ d: this.d,
+ e: this.e,
+ f: this.f
+ };
+ } // Left multiplies by the given matrix
- var Path =
- /*#__PURE__*/
- function (_Shape) {
- _inherits(Path, _Shape);
+ }, {
+ key: "multiply",
+ value: function multiply(matrix) {
+ return this.clone().multiplyO(matrix);
+ }
+ }, {
+ key: "multiplyO",
+ value: function multiplyO(matrix) {
+ // Get the matrices
+ var l = this;
+ var r = matrix instanceof Matrix ? matrix : new Matrix(matrix);
+ return Matrix.matrixMultiply(l, r, this);
+ }
+ }, {
+ key: "lmultiply",
+ value: function lmultiply(matrix) {
+ return this.clone().lmultiplyO(matrix);
+ }
+ }, {
+ key: "lmultiplyO",
+ value: function lmultiplyO(matrix) {
+ var r = this;
+ var l = matrix instanceof Matrix ? matrix : new Matrix(matrix);
+ return Matrix.matrixMultiply(l, r, this);
+ } // Inverses matrix
- // Initialize node
- function Path(node) {
- _classCallCheck(this, Path);
+ }, {
+ key: "inverseO",
+ value: function inverseO() {
+ // Get the current parameters out of the matrix
+ var a = this.a;
+ var b = this.b;
+ var c = this.c;
+ var d = this.d;
+ var e = this.e;
+ var f = this.f; // Invert the 2x2 matrix in the top left
- return _possibleConstructorReturn(this, _getPrototypeOf(Path).call(this, nodeOrNew('path', node), Path));
- } // Get array
+ var det = a * d - b * c;
+ if (!det) throw new Error('Cannot invert ' + this); // Calculate the top 2x2 matrix
+ var na = d / det;
+ var nb = -b / det;
+ var nc = -c / det;
+ var nd = a / det; // Apply the inverted matrix to the top right
- _createClass(Path, [{
- key: "array",
- value: function array() {
- return this._array || (this._array = new PathArray(this.attr('d')));
- } // Plot new path
+ var ne = -(na * e + nc * f);
+ var nf = -(nb * e + nd * f); // Construct the inverted matrix
+ this.a = na;
+ this.b = nb;
+ this.c = nc;
+ this.d = nd;
+ this.e = ne;
+ this.f = nf;
+ return this;
+ }
}, {
- key: "plot",
- value: function plot(d) {
- return d == null ? this.array() : this.clear().attr('d', typeof d === 'string' ? d : this._array = new PathArray(d));
- } // Clear array cache
+ key: "inverse",
+ value: function inverse() {
+ return this.clone().inverseO();
+ } // Translate matrix
}, {
- key: "clear",
- value: function clear() {
- delete this._array;
+ key: "translate",
+ value: function translate(x, y) {
+ return this.clone().translateO(x, y);
+ }
+ }, {
+ key: "translateO",
+ value: function translateO(x, y) {
+ this.e += x || 0;
+ this.f += y || 0;
return this;
- } // Move by left top corner
+ } // Scale matrix
}, {
- key: "move",
- value: function move(x, y) {
- return this.attr('d', this.array().move(x, y));
- } // Move by left top corner over x-axis
+ key: "scale",
+ value: function scale(x, y, cx, cy) {
+ var _this$clone;
+ return (_this$clone = this.clone()).scaleO.apply(_this$clone, arguments);
+ }
}, {
- key: "x",
- value: function x(_x) {
- return _x == null ? this.bbox().x : this.move(_x, this.bbox().y);
- } // Move by left top corner over y-axis
+ key: "scaleO",
+ value: function scaleO(x) {
+ var y = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : x;
+ var cx = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+ var cy = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
- }, {
- key: "y",
- value: function y(_y) {
- return _y == null ? this.bbox().y : this.move(this.bbox().x, _y);
- } // Set element size to given width and height
+ // Support uniform scaling
+ if (arguments.length === 3) {
+ cy = cx;
+ cx = y;
+ y = x;
+ }
- }, {
- key: "size",
- value: function size(width, height) {
- var p = proportionalSize(this, width, height);
- return this.attr('d', this.array().size(p.width, p.height));
- } // Set width of element
+ var a = this.a,
+ b = this.b,
+ c = this.c,
+ d = this.d,
+ e = this.e,
+ f = this.f;
+ this.a = a * x;
+ this.b = b * y;
+ this.c = c * x;
+ this.d = d * y;
+ this.e = e * x - cx * x + cx;
+ this.f = f * y - cy * y + cy;
+ return this;
+ } // Rotate matrix
}, {
- key: "width",
- value: function width(_width) {
- return _width == null ? this.bbox().width : this.size(_width, this.bbox().height);
- } // Set height of element
+ key: "rotate",
+ value: function rotate(r, cx, cy) {
+ return this.clone().rotateO(r, cx, cy);
+ }
+ }, {
+ key: "rotateO",
+ value: function rotateO(r) {
+ var cx = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+ var cy = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+ // Convert degrees to radians
+ r = radians(r);
+ var cos = Math.cos(r);
+ var sin = Math.sin(r);
+ var a = this.a,
+ b = this.b,
+ c = this.c,
+ d = this.d,
+ e = this.e,
+ f = this.f;
+ this.a = a * cos - b * sin;
+ this.b = b * cos + a * sin;
+ this.c = c * cos - d * sin;
+ this.d = d * cos + c * sin;
+ this.e = e * cos - f * sin + cy * sin - cx * cos + cx;
+ this.f = f * cos + e * sin - cx * sin - cy * cos + cy;
+ return this;
+ } // Flip matrix on x or y, at a given offset
}, {
- key: "height",
- value: function height(_height) {
- return _height == null ? this.bbox().height : this.size(this.bbox().width, _height);
+ key: "flip",
+ value: function flip(axis, around) {
+ return this.clone().flipO(axis, around);
}
}, {
- key: "targets",
- value: function targets() {
- return baseFind('svg textpath [href*="' + this.id() + '"]');
+ key: "flipO",
+ value: function flipO(axis, around) {
+ return axis === 'x' ? this.scaleO(-1, 1, around, 0) : axis === 'y' ? this.scaleO(1, -1, 0, around) : this.scaleO(-1, -1, axis, around || axis); // Define an x, y flip point
+ } // Shear matrix
+
+ }, {
+ key: "shear",
+ value: function shear(a, cx, cy) {
+ return this.clone().shearO(a, cx, cy);
}
- }]);
+ }, {
+ key: "shearO",
+ value: function shearO(lx) {
+ var cy = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+ var a = this.a,
+ b = this.b,
+ c = this.c,
+ d = this.d,
+ e = this.e,
+ f = this.f;
+ this.a = a + b * lx;
+ this.c = c + d * lx;
+ this.e = e + f * lx - cy * lx;
+ return this;
+ } // Skew Matrix
- return Path;
- }(Shape); // Define morphable array
- Path.prototype.MorphArray = PathArray; // Add parent method
+ }, {
+ key: "skew",
+ value: function skew(x, y, cx, cy) {
+ var _this$clone2;
- registerMethods({
- Container: {
- // Create a wrapped path element
- path: function path(d) {
- // make sure plot is called as a setter
- return this.put(new Path()).plot(d || new PathArray());
+ return (_this$clone2 = this.clone()).skewO.apply(_this$clone2, arguments);
}
- }
- });
- register(Path);
+ }, {
+ key: "skewO",
+ value: function skewO(x) {
+ var y = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : x;
+ var cx = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+ var cy = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
- // Add polygon-specific functions
+ // support uniformal skew
+ if (arguments.length === 3) {
+ cy = cx;
+ cx = y;
+ y = x;
+ } // Convert degrees to radians
- function array() {
- return this._array || (this._array = new PointArray(this.attr('points')));
- } // Plot new path
- function plot(p) {
- return p == null ? this.array() : this.clear().attr('points', typeof p === 'string' ? p : this._array = new PointArray(p));
- } // Clear array cache
+ x = radians(x);
+ y = radians(y);
+ var lx = Math.tan(x);
+ var ly = Math.tan(y);
+ var a = this.a,
+ b = this.b,
+ c = this.c,
+ d = this.d,
+ e = this.e,
+ f = this.f;
+ this.a = a + b * lx;
+ this.b = b + a * ly;
+ this.c = c + d * lx;
+ this.d = d + c * ly;
+ this.e = e + f * lx - cy * lx;
+ this.f = f + e * ly - cx * ly;
+ return this;
+ } // SkewX
- function clear() {
- delete this._array;
- return this;
- } // Move by left top corner
+ }, {
+ key: "skewX",
+ value: function skewX(x, cx, cy) {
+ return this.skew(x, 0, cx, cy);
+ }
+ }, {
+ key: "skewXO",
+ value: function skewXO(x, cx, cy) {
+ return this.skewO(x, 0, cx, cy);
+ } // SkewY
- function move(x, y) {
- return this.attr('points', this.array().move(x, y));
- } // Set element size to given width and height
+ }, {
+ key: "skewY",
+ value: function skewY(y, cx, cy) {
+ return this.skew(0, y, cx, cy);
+ }
+ }, {
+ key: "skewYO",
+ value: function skewYO(y, cx, cy) {
+ return this.skewO(0, y, cx, cy);
+ } // Transform around a center point
- function size$1(width, height) {
- var p = proportionalSize(this, width, height);
- return this.attr('points', this.array().size(p.width, p.height));
- }
+ }, {
+ key: "aroundO",
+ value: function aroundO(cx, cy, matrix) {
+ var dx = cx || 0;
+ var dy = cy || 0;
+ return this.translateO(-dx, -dy).lmultiplyO(matrix).translateO(dx, dy);
+ }
+ }, {
+ key: "around",
+ value: function around(cx, cy, matrix) {
+ return this.clone().aroundO(cx, cy, matrix);
+ } // Convert to native SVGMatrix
- var poly = /*#__PURE__*/Object.freeze({
- array: array,
- plot: plot,
- clear: clear,
- move: move,
- size: size$1
- });
+ }, {
+ key: "native",
+ value: function native() {
+ // create new matrix
+ var matrix = parser().svg.node.createSVGMatrix(); // update with current values
- var Polygon =
- /*#__PURE__*/
- function (_Shape) {
- _inherits(Polygon, _Shape);
+ for (var i = abcdef.length - 1; i >= 0; i--) {
+ matrix[abcdef[i]] = this[abcdef[i]];
+ }
- // Initialize node
- function Polygon(node) {
- _classCallCheck(this, Polygon);
+ return matrix;
+ } // Check if two matrices are equal
- return _possibleConstructorReturn(this, _getPrototypeOf(Polygon).call(this, nodeOrNew('polygon', node), Polygon));
- }
+ }, {
+ key: "equals",
+ value: function equals(other) {
+ var comp = new Matrix(other);
+ return closeEnough(this.a, comp.a) && closeEnough(this.b, comp.b) && closeEnough(this.c, comp.c) && closeEnough(this.d, comp.d) && closeEnough(this.e, comp.e) && closeEnough(this.f, comp.f);
+ } // Convert matrix to string
- return Polygon;
- }(Shape);
- registerMethods({
- Container: {
- // Create a wrapped polygon element
- polygon: function polygon(p) {
- // make sure plot is called as a setter
- return this.put(new Polygon()).plot(p || new PointArray());
+ }, {
+ key: "toString",
+ value: function toString() {
+ return 'matrix(' + this.a + ',' + this.b + ',' + this.c + ',' + this.d + ',' + this.e + ',' + this.f + ')';
}
- }
- });
- extend(Polygon, pointed);
- extend(Polygon, poly);
- register(Polygon);
-
- var Polyline =
- /*#__PURE__*/
- function (_Shape) {
- _inherits(Polyline, _Shape);
-
- // Initialize node
- function Polyline(node) {
- _classCallCheck(this, Polyline);
-
- return _possibleConstructorReturn(this, _getPrototypeOf(Polyline).call(this, nodeOrNew('polyline', node), Polyline));
- }
-
- return Polyline;
- }(Shape);
- registerMethods({
- Container: {
- // Create a wrapped polygon element
- polyline: function polyline(p) {
- // make sure plot is called as a setter
- return this.put(new Polyline()).plot(p || new PointArray());
+ }, {
+ key: "toArray",
+ value: function toArray() {
+ return [this.a, this.b, this.c, this.d, this.e, this.f];
}
- }
- });
- extend(Polyline, pointed);
- extend(Polyline, poly);
- register(Polyline);
-
- var Rect =
- /*#__PURE__*/
- function (_Shape) {
- _inherits(Rect, _Shape);
-
- // Initialize node
- function Rect(node) {
- _classCallCheck(this, Rect);
-
- return _possibleConstructorReturn(this, _getPrototypeOf(Rect).call(this, nodeOrNew('rect', node), Rect));
- } // FIXME: unify with circle
- // Radius x value
+ }, {
+ key: "valueOf",
+ value: function valueOf() {
+ return {
+ a: this.a,
+ b: this.b,
+ c: this.c,
+ d: this.d,
+ e: this.e,
+ f: this.f
+ };
+ } // TODO: Refactor this to a static function of matrix.js
+ }], [{
+ key: "formatTransforms",
+ value: function formatTransforms(o) {
+ // Get all of the parameters required to form the matrix
+ var flipBoth = o.flip === 'both' || o.flip === true;
+ var flipX = o.flip && (flipBoth || o.flip === 'x') ? -1 : 1;
+ var flipY = o.flip && (flipBoth || o.flip === 'y') ? -1 : 1;
+ var skewX = o.skew && o.skew.length ? o.skew[0] : isFinite(o.skew) ? o.skew : isFinite(o.skewX) ? o.skewX : 0;
+ var skewY = o.skew && o.skew.length ? o.skew[1] : isFinite(o.skew) ? o.skew : isFinite(o.skewY) ? o.skewY : 0;
+ var scaleX = o.scale && o.scale.length ? o.scale[0] * flipX : isFinite(o.scale) ? o.scale * flipX : isFinite(o.scaleX) ? o.scaleX * flipX : flipX;
+ var scaleY = o.scale && o.scale.length ? o.scale[1] * flipY : isFinite(o.scale) ? o.scale * flipY : isFinite(o.scaleY) ? o.scaleY * flipY : flipY;
+ var shear = o.shear || 0;
+ var theta = o.rotate || o.theta || 0;
+ var origin = new Point(o.origin || o.around || o.ox || o.originX, o.oy || o.originY);
+ var ox = origin.x;
+ var oy = origin.y;
+ var position = new Point(o.position || o.px || o.positionX, o.py || o.positionY);
+ var px = position.x;
+ var py = position.y;
+ var translate = new Point(o.translate || o.tx || o.translateX, o.ty || o.translateY);
+ var tx = translate.x;
+ var ty = translate.y;
+ var relative = new Point(o.relative || o.rx || o.relativeX, o.ry || o.relativeY);
+ var rx = relative.x;
+ var ry = relative.y; // Populate all of the values
- _createClass(Rect, [{
- key: "rx",
- value: function rx(_rx) {
- return this.attr('rx', _rx);
- } // Radius y value
+ return {
+ scaleX: scaleX,
+ scaleY: scaleY,
+ skewX: skewX,
+ skewY: skewY,
+ shear: shear,
+ theta: theta,
+ rx: rx,
+ ry: ry,
+ tx: tx,
+ ty: ty,
+ ox: ox,
+ oy: oy,
+ px: px,
+ py: py
+ };
+ } // left matrix, right matrix, target matrix which is overwritten
}, {
- key: "ry",
- value: function ry(_ry) {
- return this.attr('ry', _ry);
+ key: "matrixMultiply",
+ value: function matrixMultiply(l, r, o) {
+ // Work out the product directly
+ var a = l.a * r.a + l.c * r.b;
+ var b = l.b * r.a + l.d * r.b;
+ var c = l.a * r.c + l.c * r.d;
+ var d = l.b * r.c + l.d * r.d;
+ var e = l.e + l.a * r.e + l.c * r.f;
+ var f = l.f + l.b * r.e + l.d * r.f; // make sure to use local variables because l/r and o could be the same
+
+ o.a = a;
+ o.b = b;
+ o.c = c;
+ o.d = d;
+ o.e = e;
+ o.f = f;
+ return o;
}
}]);
- return Rect;
- }(Shape);
+ return Matrix;
+ }();
registerMethods({
- Container: {
- // Create a rect element
- rect: function rect(width, height) {
- return this.put(new Rect()).size(width, height);
+ Element: {
+ // Get current matrix
+ ctm: function ctm() {
+ return new Matrix(this.node.getCTM());
+ },
+ // Get current screen matrix
+ screenCTM: function screenCTM() {
+ /* https://bugzilla.mozilla.org/show_bug.cgi?id=1344537\r
+ This is needed because FF does not return the transformation matrix\r
+ for the inner coordinate system when getScreenCTM() is called on nested svgs.\r
+ However all other Browsers do that */
+ if (typeof this.isRoot === 'function' && !this.isRoot()) {
+ var rect = this.rect(1, 1);
+ var m = rect.node.getScreenCTM();
+ rect.remove();
+ return new Matrix(m);
+ }
+
+ return new Matrix(this.node.getScreenCTM());
}
}
});
- register(Rect);
-
- var _Symbol =
- /*#__PURE__*/
- function (_Container) {
- _inherits(_Symbol, _Container);
-
- // Initialize node
- function _Symbol(node) {
- _classCallCheck(this, _Symbol);
- return _possibleConstructorReturn(this, _getPrototypeOf(_Symbol).call(this, nodeOrNew('symbol', node), _Symbol));
+ var PathArray = subClassArray('PathArray', SVGArray);
+ var pathHandlers = {
+ M: function M(c, p, p0) {
+ p.x = p0.x = c[0];
+ p.y = p0.y = c[1];
+ return ['M', p.x, p.y];
+ },
+ L: function L(c, p) {
+ p.x = c[0];
+ p.y = c[1];
+ return ['L', c[0], c[1]];
+ },
+ H: function H(c, p) {
+ p.x = c[0];
+ return ['H', c[0]];
+ },
+ V: function V(c, p) {
+ p.y = c[0];
+ return ['V', c[0]];
+ },
+ C: function C(c, p) {
+ p.x = c[4];
+ p.y = c[5];
+ return ['C', c[0], c[1], c[2], c[3], c[4], c[5]];
+ },
+ S: function S(c, p) {
+ p.x = c[2];
+ p.y = c[3];
+ return ['S', c[0], c[1], c[2], c[3]];
+ },
+ Q: function Q(c, p) {
+ p.x = c[2];
+ p.y = c[3];
+ return ['Q', c[0], c[1], c[2], c[3]];
+ },
+ T: function T(c, p) {
+ p.x = c[0];
+ p.y = c[1];
+ return ['T', c[0], c[1]];
+ },
+ Z: function Z(c, p, p0) {
+ p.x = p0.x;
+ p.y = p0.y;
+ return ['Z'];
+ },
+ A: function A(c, p) {
+ p.x = c[5];
+ p.y = c[6];
+ return ['A', c[0], c[1], c[2], c[3], c[4], c[5], c[6]];
}
+ };
+ var mlhvqtcsaz = 'mlhvqtcsaz'.split('');
- return _Symbol;
- }(Container);
- registerMethods({
- Container: {
- symbol: function symbol() {
- return this.put(new _Symbol());
- }
- }
- });
- register(_Symbol);
+ for (var i = 0, il = mlhvqtcsaz.length; i < il; ++i) {
+ pathHandlers[mlhvqtcsaz[i]] = function (i) {
+ return function (c, p, p0) {
+ if (i === 'H') c[0] = c[0] + p.x;else if (i === 'V') c[0] = c[0] + p.y;else if (i === 'A') {
+ c[5] = c[5] + p.x;
+ c[6] = c[6] + p.y;
+ } else {
+ for (var j = 0, jl = c.length; j < jl; ++j) {
+ c[j] = c[j] + (j % 2 ? p.y : p.x);
+ }
+ }
+ return pathHandlers[i](c, p, p0);
+ };
+ }(mlhvqtcsaz[i].toUpperCase());
+ }
- // Create plain text node
- function plain(text) {
- // clear if build mode is disabled
- if (this._build === false) {
- this.clear();
- } // create text node
+ extend(PathArray, {
+ // Convert array to string
+ toString: function toString() {
+ return arrayToString(this);
+ },
+ // Move path string
+ move: function move(x, y) {
+ // get bounding box of current situation
+ var box = this.bbox(); // get relative offset
+ x -= box.x;
+ y -= box.y;
- this.node.appendChild(document.createTextNode(text));
- return this;
- } // FIXME: Does this also work for textpath?
- // Get length of text element
+ if (!isNaN(x) && !isNaN(y)) {
+ // move every point
+ for (var l, i = this.length - 1; i >= 0; i--) {
+ l = this[i][0];
- function length() {
- return this.node.getComputedTextLength();
- }
+ if (l === 'M' || l === 'L' || l === 'T') {
+ this[i][1] += x;
+ this[i][2] += y;
+ } else if (l === 'H') {
+ this[i][1] += x;
+ } else if (l === 'V') {
+ this[i][1] += y;
+ } else if (l === 'C' || l === 'S' || l === 'Q') {
+ this[i][1] += x;
+ this[i][2] += y;
+ this[i][3] += x;
+ this[i][4] += y;
- var textable = /*#__PURE__*/Object.freeze({
- plain: plain,
- length: length
- });
+ if (l === 'C') {
+ this[i][5] += x;
+ this[i][6] += y;
+ }
+ } else if (l === 'A') {
+ this[i][6] += x;
+ this[i][7] += y;
+ }
+ }
+ }
- var Text =
- /*#__PURE__*/
- function (_Shape) {
- _inherits(Text, _Shape);
+ return this;
+ },
+ // Resize path string
+ size: function size(width, height) {
+ // get bounding box of current situation
+ var box = this.bbox();
+ var i, l; // recalculate position of all points according to new size
- // Initialize node
- function Text(node) {
- var _this;
+ for (i = this.length - 1; i >= 0; i--) {
+ l = this[i][0];
- _classCallCheck(this, Text);
+ if (l === 'M' || l === 'L' || l === 'T') {
+ this[i][1] = (this[i][1] - box.x) * width / box.width + box.x;
+ this[i][2] = (this[i][2] - box.y) * height / box.height + box.y;
+ } else if (l === 'H') {
+ this[i][1] = (this[i][1] - box.x) * width / box.width + box.x;
+ } else if (l === 'V') {
+ this[i][1] = (this[i][1] - box.y) * height / box.height + box.y;
+ } else if (l === 'C' || l === 'S' || l === 'Q') {
+ this[i][1] = (this[i][1] - box.x) * width / box.width + box.x;
+ this[i][2] = (this[i][2] - box.y) * height / box.height + box.y;
+ this[i][3] = (this[i][3] - box.x) * width / box.width + box.x;
+ this[i][4] = (this[i][4] - box.y) * height / box.height + box.y;
- _this = _possibleConstructorReturn(this, _getPrototypeOf(Text).call(this, nodeOrNew('text', node), Text));
- _this.dom.leading = new SVGNumber(1.3); // store leading value for rebuilding
+ if (l === 'C') {
+ this[i][5] = (this[i][5] - box.x) * width / box.width + box.x;
+ this[i][6] = (this[i][6] - box.y) * height / box.height + box.y;
+ }
+ } else if (l === 'A') {
+ // resize radii
+ this[i][1] = this[i][1] * width / box.width;
+ this[i][2] = this[i][2] * height / box.height; // move position values
- _this._rebuild = true; // enable automatic updating of dy values
+ this[i][6] = (this[i][6] - box.x) * width / box.width + box.x;
+ this[i][7] = (this[i][7] - box.y) * height / box.height + box.y;
+ }
+ }
- _this._build = false; // disable build mode for adding multiple lines
- // set default font
+ return this;
+ },
+ // Test if the passed path array use the same path data commands as this path array
+ equalCommands: function equalCommands(pathArray) {
+ var i, il, equalCommands;
+ pathArray = new PathArray(pathArray);
+ equalCommands = this.length === pathArray.length;
- _this.attr('font-family', attrs['font-family']);
+ for (i = 0, il = this.length; equalCommands && i < il; i++) {
+ equalCommands = this[i][0] === pathArray[i][0];
+ }
- return _this;
- } // Move over x-axis
+ return equalCommands;
+ },
+ // Make path array morphable
+ morph: function morph(pathArray) {
+ pathArray = new PathArray(pathArray);
+ if (this.equalCommands(pathArray)) {
+ this.destination = pathArray;
+ } else {
+ this.destination = null;
+ }
- _createClass(Text, [{
- key: "x",
- value: function x(_x) {
- // act as getter
- if (_x == null) {
- return this.attr('x');
- }
+ return this;
+ },
+ // Get morphed path array at given position
+ at: function at(pos) {
+ // make sure a destination is defined
+ if (!this.destination) return this;
+ var sourceArray = this;
+ var destinationArray = this.destination.value;
+ var array = [];
+ var pathArray = new PathArray();
+ var i, il, j, jl; // Animate has specified in the SVG spec
+ // See: https://www.w3.org/TR/SVG11/paths.html#PathElement
- return this.attr('x', _x);
- } // Move over y-axis
+ for (i = 0, il = sourceArray.length; i < il; i++) {
+ array[i] = [sourceArray[i][0]];
- }, {
- key: "y",
- value: function y(_y) {
- var oy = this.attr('y');
- var o = typeof oy === 'number' ? oy - this.bbox().y : 0; // act as getter
+ for (j = 1, jl = sourceArray[i].length; j < jl; j++) {
+ array[i][j] = sourceArray[i][j] + (destinationArray[i][j] - sourceArray[i][j]) * pos;
+ } // For the two flags of the elliptical arc command, the SVG spec say:
+ // Flags and booleans are interpolated as fractions between zero and one, with any non-zero value considered to be a value of one/true
+ // Elliptical arc command as an array followed by corresponding indexes:
+ // ['A', rx, ry, x-axis-rotation, large-arc-flag, sweep-flag, x, y]
+ // 0 1 2 3 4 5 6 7
- if (_y == null) {
- return typeof oy === 'number' ? oy - o : oy;
- }
- return this.attr('y', typeof _y === 'number' ? _y + o : _y);
- } // Move center over x-axis
+ if (array[i][0] === 'A') {
+ array[i][4] = +(array[i][4] !== 0);
+ array[i][5] = +(array[i][5] !== 0);
+ }
+ } // Directly modify the value of a path array, this is done this way for performance
- }, {
- key: "cx",
- value: function cx(x) {
- return x == null ? this.bbox().cx : this.x(x - this.bbox().width / 2);
- } // Move center over y-axis
- }, {
- key: "cy",
- value: function cy(y) {
- return y == null ? this.bbox().cy : this.y(y - this.bbox().height / 2);
- } // Set the text content
+ pathArray.value = array;
+ return pathArray;
+ },
+ // Absolutize and parse path to array
+ parse: function parse() {
+ var array = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [['M', 0, 0]];
+ // if it's already a patharray, no need to parse it
+ if (array instanceof PathArray) return array; // prepare for parsing
- }, {
- key: "text",
- value: function text(_text) {
- // act as getter
- if (_text === undefined) {
- // FIXME use children() or each()
- var children = this.node.childNodes;
- var firstLine = 0;
- _text = '';
+ var s;
+ var paramCnt = {
+ 'M': 2,
+ 'L': 2,
+ 'H': 1,
+ 'V': 1,
+ 'C': 6,
+ 'S': 4,
+ 'Q': 4,
+ 'T': 2,
+ 'A': 7,
+ 'Z': 0
+ };
- for (var i = 0, len = children.length; i < len; ++i) {
- // skip textPaths - they are no lines
- if (children[i].nodeName === 'textPath') {
- if (i === 0) firstLine = 1;
- continue;
- } // add newline if its not the first child and newLined is set to true
+ if (typeof array === 'string') {
+ array = array.replace(numbersWithDots, pathRegReplace) // convert 45.123.123 to 45.123 .123
+ .replace(pathLetters, ' $& ') // put some room between letters and numbers
+ .replace(hyphen, '$1 -') // add space before hyphen
+ .trim() // trim
+ .split(delimiter); // split into array
+ } else {
+ array = array.reduce(function (prev, curr) {
+ return [].concat.call(prev, curr);
+ }, []);
+ } // array now is an array containing all parts of a path e.g. ['M', '0', '0', 'L', '30', '30' ...]
- if (i !== firstLine && children[i].nodeType !== 3 && adopt(children[i]).dom.newLined === true) {
- _text += '\n';
- } // add content of this node
+ var result = [];
+ var p = new Point();
+ var p0 = new Point();
+ var index = 0;
+ var len = array.length;
+ do {
+ // Test if we have a path letter
+ if (isPathLetter.test(array[index])) {
+ s = array[index];
+ ++index; // If last letter was a move command and we got no new, it defaults to [L]ine
+ } else if (s === 'M') {
+ s = 'L';
+ } else if (s === 'm') {
+ s = 'l';
+ }
- _text += children[i].textContent;
- }
+ result.push(pathHandlers[s].call(null, array.slice(index, index = index + paramCnt[s.toUpperCase()]).map(parseFloat), p, p0));
+ } while (len > index);
- return _text;
- } // remove existing content
+ return result;
+ },
+ // Get bounding box of path
+ bbox: function bbox() {
+ parser().path.setAttribute('d', this.toString());
+ return parser.nodes.path.getBBox();
+ }
+ });
+ var Morphable =
+ /*#__PURE__*/
+ function () {
+ function Morphable(stepper) {
+ _classCallCheck(this, Morphable);
- this.clear().build(true);
+ // FIXME: the default stepper does not know about easing
+ this._stepper = stepper || new Ease('-');
+ this._from = null;
+ this._to = null;
+ this._type = null;
+ this._context = null;
+ this._morphObj = null;
+ }
- if (typeof _text === 'function') {
- // call block
- _text.call(this, this);
- } else {
- // store text and make sure text is not blank
- _text = _text.split('\n'); // build new lines
-
- for (var j = 0, jl = _text.length; j < jl; j++) {
- this.tspan(_text[j]).newLine();
- }
- } // disable build mode and rebuild lines
-
-
- return this.build(false).rebuild();
- } // Set / get leading
+ _createClass(Morphable, [{
+ key: "from",
+ value: function from(val) {
+ if (val == null) {
+ return this._from;
+ }
+ this._from = this._set(val);
+ return this;
+ }
}, {
- key: "leading",
- value: function leading(value) {
- // act as getter
- if (value == null) {
- return this.dom.leading;
- } // act as setter
-
-
- this.dom.leading = new SVGNumber(value);
- return this.rebuild();
- } // Rebuild appearance type
+ key: "to",
+ value: function to(val) {
+ if (val == null) {
+ return this._to;
+ }
+ this._to = this._set(val);
+ return this;
+ }
}, {
- key: "rebuild",
- value: function rebuild(_rebuild) {
- // store new rebuild flag if given
- if (typeof _rebuild === 'boolean') {
- this._rebuild = _rebuild;
- } // define position of all lines
+ key: "type",
+ value: function type(_type) {
+ // getter
+ if (_type == null) {
+ return this._type;
+ } // setter
- if (this._rebuild) {
- var self = this;
- var blankLineOffset = 0;
- var dy = this.dom.leading * new SVGNumber(this.attr('font-size'));
- this.each(function () {
- if (this.dom.newLined) {
- this.attr('x', self.attr('x'));
+ this._type = _type;
+ return this;
+ }
+ }, {
+ key: "_set",
+ value: function _set$$1(value) {
+ if (!this._type) {
+ var type = _typeof(value);
- if (this.text() === '\n') {
- blankLineOffset += dy;
- } else {
- this.attr('dy', dy + blankLineOffset);
- blankLineOffset = 0;
- }
+ if (type === 'number') {
+ this.type(SVGNumber);
+ } else if (type === 'string') {
+ if (Color.isColor(value)) {
+ this.type(Color);
+ } else if (delimiter.test(value)) {
+ this.type(pathLetters.test(value) ? PathArray : SVGArray);
+ } else if (numberAndUnit.test(value)) {
+ this.type(SVGNumber);
+ } else {
+ this.type(NonMorphable);
}
- });
- this.fire('rebuild');
+ } else if (morphableTypes.indexOf(value.constructor) > -1) {
+ this.type(value.constructor);
+ } else if (Array.isArray(value)) {
+ this.type(SVGArray);
+ } else if (type === 'object') {
+ this.type(ObjectBag);
+ } else {
+ this.type(NonMorphable);
+ }
}
- return this;
- } // Enable / disable build mode
-
+ var result = new this._type(value).toArray();
+ this._morphObj = this._morphObj || new this._type();
+ this._context = this._context || Array.apply(null, Array(result.length)).map(Object);
+ return result;
+ }
}, {
- key: "build",
- value: function build(_build) {
- this._build = !!_build;
+ key: "stepper",
+ value: function stepper(_stepper) {
+ if (_stepper == null) return this._stepper;
+ this._stepper = _stepper;
return this;
- } // overwrite method from parent to set data properly
-
+ }
}, {
- key: "setData",
- value: function setData(o) {
- this.dom = o;
- this.dom.leading = new SVGNumber(o.leading || 1.3);
- return this;
+ key: "done",
+ value: function done() {
+ var complete = this._context.map(this._stepper.done).reduce(function (last, curr) {
+ return last && curr;
+ }, true);
+
+ return complete;
}
- }]);
+ }, {
+ key: "at",
+ value: function at(pos) {
+ var _this = this;
- return Text;
- }(Shape);
- extend(Text, textable);
- registerMethods({
- Container: {
- // Create text element
- text: function text(_text2) {
- return this.put(new Text()).text(_text2);
- },
- // Create plain text element
- plain: function plain$$1(text) {
- return this.put(new Text()).plain(text);
+ return this._morphObj.fromArray(this._from.map(function (i, index) {
+ return _this._stepper.step(i, _this._to[index], pos, _this._context[index], _this._context);
+ }));
}
- }
- });
- register(Text);
+ }]);
- var TextPath =
+ return Morphable;
+ }();
+ var NonMorphable =
/*#__PURE__*/
- function (_Text) {
- _inherits(TextPath, _Text);
-
- // Initialize node
- function TextPath(node) {
- _classCallCheck(this, TextPath);
-
- return _possibleConstructorReturn(this, _getPrototypeOf(TextPath).call(this, nodeOrNew('textPath', node), TextPath));
- } // return the array of the path track element
-
+ function () {
+ function NonMorphable() {
+ _classCallCheck(this, NonMorphable);
- _createClass(TextPath, [{
- key: "array",
- value: function array() {
- var track = this.track();
- return track ? track.array() : null;
- } // Plot path if any
+ this.init.apply(this, arguments);
+ }
+ _createClass(NonMorphable, [{
+ key: "init",
+ value: function init(val) {
+ val = Array.isArray(val) ? val[0] : val;
+ this.value = val;
+ }
}, {
- key: "plot",
- value: function plot(d) {
- var track = this.track();
- var pathArray = null;
-
- if (track) {
- pathArray = track.plot(d);
- }
-
- return d == null ? pathArray : this;
- } // Get the path element
-
+ key: "valueOf",
+ value: function valueOf() {
+ return this.value;
+ }
}, {
- key: "track",
- value: function track() {
- return this.reference('href');
+ key: "toArray",
+ value: function toArray() {
+ return [this.value];
}
}]);
- return TextPath;
- }(Text);
- registerMethods({
- Container: {
- textPath: function textPath(text, path) {
- return this.defs().path(path).text(text).addTo(this);
- }
- },
- Text: {
- // Create path for text to run on
- path: function path(track) {
- var path = new TextPath(); // if d is a path, reuse it
-
- if (!(track instanceof Path)) {
- // create path element
- track = this.doc().defs().path(track);
- } // link textPath to path and add content
+ return NonMorphable;
+ }();
+ var TransformBag =
+ /*#__PURE__*/
+ function () {
+ function TransformBag() {
+ _classCallCheck(this, TransformBag);
+ this.init.apply(this, arguments);
+ }
- path.attr('href', '#' + track, xlink); // add textPath element as child node and return textPath
+ _createClass(TransformBag, [{
+ key: "init",
+ value: function init(obj) {
+ if (Array.isArray(obj)) {
+ obj = {
+ scaleX: obj[0],
+ scaleY: obj[1],
+ shear: obj[2],
+ rotate: obj[3],
+ translateX: obj[4],
+ translateY: obj[5],
+ originX: obj[6],
+ originY: obj[7]
+ };
+ }
- return this.put(path);
- },
- // FIXME: make this plural?
- // Get the textPath children
- textPath: function textPath() {
- return this.find('textPath');
+ Object.assign(this, TransformBag.defaults, obj);
}
- },
- Path: {
- // creates a textPath from this path
- text: function text(_text) {
- if (_text instanceof Text) {
- var txt = _text.text();
+ }, {
+ key: "toArray",
+ value: function toArray() {
+ var v = this;
+ return [v.scaleX, v.scaleY, v.shear, v.rotate, v.translateX, v.translateY, v.originX, v.originY];
+ }
+ }]);
- return _text.clear().path(this).text(txt);
+ return TransformBag;
+ }();
+ TransformBag.defaults = {
+ scaleX: 1,
+ scaleY: 1,
+ shear: 0,
+ rotate: 0,
+ translateX: 0,
+ translateY: 0,
+ originX: 0,
+ originY: 0
+ };
+ var ObjectBag =
+ /*#__PURE__*/
+ function () {
+ function ObjectBag() {
+ _classCallCheck(this, ObjectBag);
+
+ this.init.apply(this, arguments);
+ }
+
+ _createClass(ObjectBag, [{
+ key: "init",
+ value: function init(objOrArr) {
+ this.values = [];
+
+ if (Array.isArray(objOrArr)) {
+ this.values = objOrArr;
+ return;
}
- return this.parent().put(new Text()).path(this).text(_text);
- } // FIXME: Maybe add `targets` to get all textPaths associated with this path
+ var entries = Object.entries(objOrArr || {}).sort(function (a, b) {
+ return a[0] - b[0];
+ });
+ this.values = entries.reduce(function (last, curr) {
+ return last.concat(curr);
+ }, []);
+ }
+ }, {
+ key: "valueOf",
+ value: function valueOf() {
+ var obj = {};
+ var arr = this.values;
- }
- });
- TextPath.prototype.MorphArray = PathArray;
- register(TextPath);
+ for (var i = 0, len = arr.length; i < len; i += 2) {
+ obj[arr[i]] = arr[i + 1];
+ }
- var Tspan =
+ return obj;
+ }
+ }, {
+ key: "toArray",
+ value: function toArray() {
+ return this.values;
+ }
+ }]);
+
+ return ObjectBag;
+ }();
+ var morphableTypes = [NonMorphable, TransformBag, ObjectBag];
+ function registerMorphableType() {
+ var type = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+ morphableTypes.push.apply(morphableTypes, _toConsumableArray([].concat(type)));
+ }
+ function makeMorphable() {
+ extend(morphableTypes, {
+ to: function to(val, args) {
+ return new Morphable().type(this.constructor).from(this.valueOf()).to(val, args);
+ },
+ fromArray: function fromArray(arr) {
+ this.init(arr);
+ return this;
+ }
+ });
+ }
+
+ var Path =
/*#__PURE__*/
- function (_Text) {
- _inherits(Tspan, _Text);
+ function (_Shape) {
+ _inherits(Path, _Shape);
// Initialize node
- function Tspan(node) {
- _classCallCheck(this, Tspan);
+ function Path(node) {
+ _classCallCheck(this, Path);
- return _possibleConstructorReturn(this, _getPrototypeOf(Tspan).call(this, nodeOrNew('tspan', node), Tspan));
- } // Set text content
+ return _possibleConstructorReturn(this, _getPrototypeOf(Path).call(this, nodeOrNew('path', node), Path));
+ } // Get array
- _createClass(Tspan, [{
- key: "text",
- value: function text(_text) {
- if (_text == null) return this.node.textContent + (this.dom.newLined ? '\n' : '');
- typeof _text === 'function' ? _text.call(this, this) : this.plain(_text);
- return this;
- } // Shortcut dx
+ _createClass(Path, [{
+ key: "array",
+ value: function array() {
+ return this._array || (this._array = new PathArray(this.attr('d')));
+ } // Plot new path
}, {
- key: "dx",
- value: function dx(_dx) {
- return this.attr('dx', _dx);
- } // Shortcut dy
+ key: "plot",
+ value: function plot(d) {
+ return d == null ? this.array() : this.clear().attr('d', typeof d === 'string' ? d : this._array = new PathArray(d));
+ } // Clear array cache
}, {
- key: "dy",
- value: function dy(_dy) {
- return this.attr('dy', _dy);
- } // Create new line
+ key: "clear",
+ value: function clear() {
+ delete this._array;
+ return this;
+ } // Move by left top corner
}, {
- key: "newLine",
- value: function newLine() {
- // fetch text parent
- var t = this.parent(Text); // mark new line
-
- this.dom.newLined = true; // apply new position
+ key: "move",
+ value: function move(x, y) {
+ return this.attr('d', this.array().move(x, y));
+ } // Move by left top corner over x-axis
- return this.dy(t.dom.leading * t.attr('font-size')).attr('x', t.x());
- }
- }]);
+ }, {
+ key: "x",
+ value: function x(_x) {
+ return _x == null ? this.bbox().x : this.move(_x, this.bbox().y);
+ } // Move by left top corner over y-axis
- return Tspan;
- }(Text);
- extend(Tspan, textable);
- registerMethods({
- Tspan: {
- tspan: function tspan(text) {
- var tspan = new Tspan(); // clear if build mode is disabled
+ }, {
+ key: "y",
+ value: function y(_y) {
+ return _y == null ? this.bbox().y : this.move(this.bbox().x, _y);
+ } // Set element size to given width and height
- if (!this._build) {
- this.clear();
- } // add new tspan
+ }, {
+ key: "size",
+ value: function size(width, height) {
+ var p = proportionalSize(this, width, height);
+ return this.attr('d', this.array().size(p.width, p.height));
+ } // Set width of element
+ }, {
+ key: "width",
+ value: function width(_width) {
+ return _width == null ? this.bbox().width : this.size(_width, this.bbox().height);
+ } // Set height of element
- this.node.appendChild(tspan.node);
- return tspan.text(text);
+ }, {
+ key: "height",
+ value: function height(_height) {
+ return _height == null ? this.bbox().height : this.size(this.bbox().width, _height);
}
- }
- });
- register(Tspan);
-
- var Use =
- /*#__PURE__*/
- function (_Shape) {
- _inherits(Use, _Shape);
-
- function Use(node) {
- _classCallCheck(this, Use);
-
- return _possibleConstructorReturn(this, _getPrototypeOf(Use).call(this, nodeOrNew('use', node), Use));
- } // Use element as a reference
-
-
- _createClass(Use, [{
- key: "element",
- value: function element(_element, file) {
- // Set lined element
- return this.attr('href', (file || '') + '#' + _element, xlink);
+ }, {
+ key: "targets",
+ value: function targets() {
+ return baseFind('svg textpath [href*="' + this.id() + '"]');
}
}]);
- return Use;
- }(Shape);
+ return Path;
+ }(Shape); // Define morphable array
+ Path.prototype.MorphArray = PathArray; // Add parent method
+
registerMethods({
Container: {
- // Create a use element
- use: function use(element, file) {
- return this.put(new Use()).element(element, file);
+ // Create a wrapped path element
+ path: function path(d) {
+ // make sure plot is called as a setter
+ return this.put(new Path()).plot(d || new PathArray());
}
}
});
- register(Use);
-
- var Matrix =
- /*#__PURE__*/
- function () {
- function Matrix() {
- _classCallCheck(this, Matrix);
+ register(Path);
- this.init.apply(this, arguments);
- } // Initialize
+ // Add polygon-specific functions
+ function array() {
+ return this._array || (this._array = new PointArray(this.attr('points')));
+ } // Plot new path
- _createClass(Matrix, [{
- key: "init",
- value: function init(source) {
- var base = arrayToMatrix([1, 0, 0, 1, 0, 0]); // ensure source as object
+ function plot(p) {
+ return p == null ? this.array() : this.clear().attr('points', typeof p === 'string' ? p : this._array = new PointArray(p));
+ } // Clear array cache
- source = source instanceof Element ? source.matrixify() : typeof source === 'string' ? arrayToMatrix(source.split(delimiter).map(parseFloat)) : Array.isArray(source) ? arrayToMatrix(source) : _typeof(source) === 'object' && isMatrixLike(source) ? source : _typeof(source) === 'object' ? new Matrix().transform(source) : arguments.length === 6 ? arrayToMatrix([].slice.call(arguments)) : base; // Merge the source matrix with the base matrix
+ function clear() {
+ delete this._array;
+ return this;
+ } // Move by left top corner
- this.a = source.a != null ? source.a : base.a;
- this.b = source.b != null ? source.b : base.b;
- this.c = source.c != null ? source.c : base.c;
- this.d = source.d != null ? source.d : base.d;
- this.e = source.e != null ? source.e : base.e;
- this.f = source.f != null ? source.f : base.f;
- } // Clones this matrix
+ function move(x, y) {
+ return this.attr('points', this.array().move(x, y));
+ } // Set element size to given width and height
- }, {
- key: "clone",
- value: function clone() {
- return new Matrix(this);
- } // Transform a matrix into another matrix by manipulating the space
+ function size$1(width, height) {
+ var p = proportionalSize(this, width, height);
+ return this.attr('points', this.array().size(p.width, p.height));
+ }
- }, {
- key: "transform",
- value: function transform(o) {
- // Check if o is a matrix and then left multiply it directly
- if (isMatrixLike(o)) {
- var matrix = new Matrix(o);
- return matrix.multiplyO(this);
- } // Get the proposed transformations and the current transformations
+ var poly = /*#__PURE__*/Object.freeze({
+ array: array,
+ plot: plot,
+ clear: clear,
+ move: move,
+ size: size$1
+ });
+ var Polygon =
+ /*#__PURE__*/
+ function (_Shape) {
+ _inherits(Polygon, _Shape);
- var t = Matrix.formatTransforms(o);
- var current = this;
+ // Initialize node
+ function Polygon(node) {
+ _classCallCheck(this, Polygon);
- var _transform = new Point(t.ox, t.oy).transform(current),
- ox = _transform.x,
- oy = _transform.y; // Construct the resulting matrix
+ return _possibleConstructorReturn(this, _getPrototypeOf(Polygon).call(this, nodeOrNew('polygon', node), Polygon));
+ }
+ return Polygon;
+ }(Shape);
+ registerMethods({
+ Container: {
+ // Create a wrapped polygon element
+ polygon: function polygon(p) {
+ // make sure plot is called as a setter
+ return this.put(new Polygon()).plot(p || new PointArray());
+ }
+ }
+ });
+ extend(Polygon, pointed);
+ extend(Polygon, poly);
+ register(Polygon);
- var transformer = new Matrix().translateO(t.rx, t.ry).lmultiplyO(current).translateO(-ox, -oy).scaleO(t.scaleX, t.scaleY).skewO(t.skewX, t.skewY).shearO(t.shear).rotateO(t.theta).translateO(ox, oy); // If we want the origin at a particular place, we force it there
+ var Polyline =
+ /*#__PURE__*/
+ function (_Shape) {
+ _inherits(Polyline, _Shape);
- if (isFinite(t.px) || isFinite(t.py)) {
- var origin = new Point(ox, oy).transform(transformer); // TODO: Replace t.px with isFinite(t.px)
+ // Initialize node
+ function Polyline(node) {
+ _classCallCheck(this, Polyline);
- var dx = t.px ? t.px - origin.x : 0;
- var dy = t.py ? t.py - origin.y : 0;
- transformer.translateO(dx, dy);
- } // Translate now after positioning
+ return _possibleConstructorReturn(this, _getPrototypeOf(Polyline).call(this, nodeOrNew('polyline', node), Polyline));
+ }
+ return Polyline;
+ }(Shape);
+ registerMethods({
+ Container: {
+ // Create a wrapped polygon element
+ polyline: function polyline(p) {
+ // make sure plot is called as a setter
+ return this.put(new Polyline()).plot(p || new PointArray());
+ }
+ }
+ });
+ extend(Polyline, pointed);
+ extend(Polyline, poly);
+ register(Polyline);
- transformer.translateO(t.tx, t.ty);
- return transformer;
- } // Applies a matrix defined by its affine parameters
+ var Rect =
+ /*#__PURE__*/
+ function (_Shape) {
+ _inherits(Rect, _Shape);
- }, {
- key: "compose",
- value: function compose(o) {
- if (o.origin) {
- o.originX = o.origin[0];
- o.originY = o.origin[1];
- } // Get the parameters
+ // Initialize node
+ function Rect(node) {
+ _classCallCheck(this, Rect);
+ return _possibleConstructorReturn(this, _getPrototypeOf(Rect).call(this, nodeOrNew('rect', node), Rect));
+ } // FIXME: unify with circle
+ // Radius x value
- var ox = o.originX || 0;
- var oy = o.originY || 0;
- var sx = o.scaleX || 1;
- var sy = o.scaleY || 1;
- var lam = o.shear || 0;
- var theta = o.rotate || 0;
- var tx = o.translateX || 0;
- var ty = o.translateY || 0; // Apply the standard matrix
- var result = new Matrix().translateO(-ox, -oy).scaleO(sx, sy).shearO(lam).rotateO(theta).translateO(tx, ty).lmultiplyO(this).translateO(ox, oy);
- return result;
- } // Decomposes this matrix into its affine parameters
+ _createClass(Rect, [{
+ key: "rx",
+ value: function rx(_rx) {
+ return this.attr('rx', _rx);
+ } // Radius y value
}, {
- key: "decompose",
- value: function decompose() {
- var cx = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
- var cy = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
- // Get the parameters from the matrix
- var a = this.a;
- var b = this.b;
- var c = this.c;
- var d = this.d;
- var e = this.e;
- var f = this.f; // Figure out if the winding direction is clockwise or counterclockwise
-
- var determinant = a * d - b * c;
- var ccw = determinant > 0 ? 1 : -1; // Since we only shear in x, we can use the x basis to get the x scale
- // and the rotation of the resulting matrix
+ key: "ry",
+ value: function ry(_ry) {
+ return this.attr('ry', _ry);
+ }
+ }]);
- var sx = ccw * Math.sqrt(a * a + b * b);
- var thetaRad = Math.atan2(ccw * b, ccw * a);
- var theta = 180 / Math.PI * thetaRad;
- var ct = Math.cos(thetaRad);
- var st = Math.sin(thetaRad); // We can then solve the y basis vector simultaneously to get the other
- // two affine parameters directly from these parameters
+ return Rect;
+ }(Shape);
+ registerMethods({
+ Container: {
+ // Create a rect element
+ rect: function rect(width, height) {
+ return this.put(new Rect()).size(width, height);
+ }
+ }
+ });
+ register(Rect);
- var lam = (a * c + b * d) / determinant;
- var sy = c * sx / (lam * a - b) || d * sx / (lam * b + a); // Use the translations
+ var time = window.performance || Date;
- var tx = e - cx + cx * ct * sx + cy * (lam * ct * sx - st * sy);
- var ty = f - cy + cx * st * sx + cy * (lam * st * sx + ct * sy); // Construct the decomposition and return it
+ var makeSchedule = function makeSchedule(runnerInfo) {
+ var start = runnerInfo.start;
+ var duration = runnerInfo.runner.duration();
+ var end = start + duration;
+ return {
+ start: start,
+ duration: duration,
+ end: end,
+ runner: runnerInfo.runner
+ };
+ };
- return {
- // Return the affine parameters
- scaleX: sx,
- scaleY: sy,
- shear: lam,
- rotate: theta,
- translateX: tx,
- translateY: ty,
- originX: cx,
- originY: cy,
- // Return the matrix parameters
- a: this.a,
- b: this.b,
- c: this.c,
- d: this.d,
- e: this.e,
- f: this.f
- };
- } // Left multiplies by the given matrix
+ var Timeline =
+ /*#__PURE__*/
+ function () {
+ // Construct a new timeline on the given element
+ function Timeline() {
+ _classCallCheck(this, Timeline);
- }, {
- key: "multiply",
- value: function multiply(matrix) {
- return this.clone().multiplyO(matrix);
- }
- }, {
- key: "multiplyO",
- value: function multiplyO(matrix) {
- // Get the matrices
- var l = this;
- var r = matrix instanceof Matrix ? matrix : new Matrix(matrix);
- return Matrix.matrixMultiply(l, r, this);
- }
- }, {
- key: "lmultiply",
- value: function lmultiply(matrix) {
- return this.clone().lmultiplyO(matrix);
- }
- }, {
- key: "lmultiplyO",
- value: function lmultiplyO(matrix) {
- var r = this;
- var l = matrix instanceof Matrix ? matrix : new Matrix(matrix);
- return Matrix.matrixMultiply(l, r, this);
- } // Inverses matrix
+ this._timeSource = function () {
+ return time.now();
+ };
- }, {
- key: "inverseO",
- value: function inverseO() {
- // Get the current parameters out of the matrix
- var a = this.a;
- var b = this.b;
- var c = this.c;
- var d = this.d;
- var e = this.e;
- var f = this.f; // Invert the 2x2 matrix in the top left
+ this._dispatcher = document.createElement('div'); // Store the timing variables
- var det = a * d - b * c;
- if (!det) throw new Error('Cannot invert ' + this); // Calculate the top 2x2 matrix
+ this._startTime = 0;
+ this._speed = 1.0; // Play control variables control how the animation proceeds
- var na = d / det;
- var nb = -b / det;
- var nc = -c / det;
- var nd = a / det; // Apply the inverted matrix to the top right
+ this._reverse = false;
+ this._persist = 0; // Keep track of the running animations and their starting parameters
- var ne = -(na * e + nc * f);
- var nf = -(nb * e + nd * f); // Construct the inverted matrix
+ this._nextFrame = null;
+ this._paused = false;
+ this._runners = [];
+ this._order = [];
+ this._time = 0;
+ this._lastSourceTime = 0;
+ this._lastStepTime = 0;
+ }
- this.a = na;
- this.b = nb;
- this.c = nc;
- this.d = nd;
- this.e = ne;
- this.f = nf;
- return this;
- }
- }, {
- key: "inverse",
- value: function inverse() {
- return this.clone().inverseO();
- } // Translate matrix
-
- }, {
- key: "translate",
- value: function translate(x, y) {
- return this.clone().translateO(x, y);
+ _createClass(Timeline, [{
+ key: "getEventTarget",
+ value: function getEventTarget() {
+ return this._dispatcher;
}
- }, {
- key: "translateO",
- value: function translateO(x, y) {
- this.e += x || 0;
- this.f += y || 0;
- return this;
- } // Scale matrix
+ /**\r
+ *\r
+ */
+ // schedules a runner on the timeline
}, {
- key: "scale",
- value: function scale(x, y, cx, cy) {
- var _this$clone;
+ key: "schedule",
+ value: function schedule(runner, delay, when) {
+ if (runner == null) {
+ return this._runners.map(makeSchedule).sort(function (a, b) {
+ return a.start - b.start || a.duration - b.duration;
+ });
+ }
- return (_this$clone = this.clone()).scaleO.apply(_this$clone, arguments);
- }
- }, {
- key: "scaleO",
- value: function scaleO(x) {
- var y = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : x;
- var cx = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
- var cy = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
+ if (!this.active()) {
+ this._step();
- // Support uniform scaling
- if (arguments.length === 3) {
- cy = cx;
- cx = y;
- y = x;
- }
+ if (when == null) {
+ when = 'now';
+ }
+ } // The start time for the next animation can either be given explicitly,
+ // derived from the current timeline time or it can be relative to the
+ // last start time to chain animations direclty
- var a = this.a,
- b = this.b,
- c = this.c,
- d = this.d,
- e = this.e,
- f = this.f;
- this.a = a * x;
- this.b = b * y;
- this.c = c * x;
- this.d = d * y;
- this.e = e * x - cx * x + cx;
- this.f = f * y - cy * y + cy;
- return this;
- } // Rotate matrix
- }, {
- key: "rotate",
- value: function rotate(r, cx, cy) {
- return this.clone().rotateO(r, cx, cy);
- }
- }, {
- key: "rotateO",
- value: function rotateO(r) {
- var cx = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
- var cy = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
- // Convert degrees to radians
- r = radians(r);
- var cos = Math.cos(r);
- var sin = Math.sin(r);
- var a = this.a,
- b = this.b,
- c = this.c,
- d = this.d,
- e = this.e,
- f = this.f;
- this.a = a * cos - b * sin;
- this.b = b * cos + a * sin;
- this.c = c * cos - d * sin;
- this.d = d * cos + c * sin;
- this.e = e * cos - f * sin + cy * sin - cx * cos + cx;
- this.f = f * cos + e * sin - cx * sin - cy * cos + cy;
- return this;
- } // Flip matrix on x or y, at a given offset
+ var absoluteStartTime = 0;
+ delay = delay || 0; // Work out when to start the animation
- }, {
- key: "flip",
- value: function flip(axis, around) {
- return this.clone().flipO(axis, around);
- }
- }, {
- key: "flipO",
- value: function flipO(axis, around) {
- return axis === 'x' ? this.scaleO(-1, 1, around, 0) : axis === 'y' ? this.scaleO(1, -1, 0, around) : this.scaleO(-1, -1, axis, around || axis); // Define an x, y flip point
- } // Shear matrix
+ if (when == null || when === 'last' || when === 'after') {
+ // Take the last time and increment
+ absoluteStartTime = this._startTime;
+ } else if (when === 'absolute' || when === 'start') {
+ absoluteStartTime = delay;
+ delay = 0;
+ } else if (when === 'now') {
+ absoluteStartTime = this._time;
+ } else if (when === 'relative') {
+ var runnerInfo = this._runners[runner.id];
- }, {
- key: "shear",
- value: function shear(a, cx, cy) {
- return this.clone().shearO(a, cx, cy);
- }
- }, {
- key: "shearO",
- value: function shearO(lx) {
- var cy = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
- var a = this.a,
- b = this.b,
- c = this.c,
- d = this.d,
- e = this.e,
- f = this.f;
- this.a = a + b * lx;
- this.c = c + d * lx;
- this.e = e + f * lx - cy * lx;
- return this;
- } // Skew Matrix
+ if (runnerInfo) {
+ absoluteStartTime = runnerInfo.start + delay;
+ delay = 0;
+ }
+ } else {
+ throw new Error('Invalid value for the "when" parameter');
+ } // Manage runner
- }, {
- key: "skew",
- value: function skew(x, y, cx, cy) {
- var _this$clone2;
- return (_this$clone2 = this.clone()).skewO.apply(_this$clone2, arguments);
- }
- }, {
- key: "skewO",
- value: function skewO(x) {
- var y = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : x;
- var cx = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
- var cy = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
+ runner.unschedule();
+ runner.timeline(this);
+ runner.time(-delay); // Save startTime for next runner
- // support uniformal skew
- if (arguments.length === 3) {
- cy = cx;
- cx = y;
- y = x;
- } // Convert degrees to radians
+ this._startTime = absoluteStartTime + runner.duration() + delay; // Save runnerInfo
+ this._runners[runner.id] = {
+ persist: this.persist(),
+ runner: runner,
+ start: absoluteStartTime // Save order and continue
- x = radians(x);
- y = radians(y);
- var lx = Math.tan(x);
- var ly = Math.tan(y);
- var a = this.a,
- b = this.b,
- c = this.c,
- d = this.d,
- e = this.e,
- f = this.f;
- this.a = a + b * lx;
- this.b = b + a * ly;
- this.c = c + d * lx;
- this.d = d + c * ly;
- this.e = e + f * lx - cy * lx;
- this.f = f + e * ly - cx * ly;
- return this;
- } // SkewX
+ };
- }, {
- key: "skewX",
- value: function skewX(x, cx, cy) {
- return this.skew(x, 0, cx, cy);
- }
- }, {
- key: "skewXO",
- value: function skewXO(x, cx, cy) {
- return this.skewO(x, 0, cx, cy);
- } // SkewY
+ this._order.push(runner.id);
- }, {
- key: "skewY",
- value: function skewY(y, cx, cy) {
- return this.skew(0, y, cx, cy);
- }
- }, {
- key: "skewYO",
- value: function skewYO(y, cx, cy) {
- return this.skewO(0, y, cx, cy);
- } // Transform around a center point
+ this._continue();
- }, {
- key: "aroundO",
- value: function aroundO(cx, cy, matrix) {
- var dx = cx || 0;
- var dy = cy || 0;
- return this.translateO(-dx, -dy).lmultiplyO(matrix).translateO(dx, dy);
- }
- }, {
- key: "around",
- value: function around(cx, cy, matrix) {
- return this.clone().aroundO(cx, cy, matrix);
- } // Convert to native SVGMatrix
+ return this;
+ } // Remove the runner from this timeline
}, {
- key: "native",
- value: function native() {
- // create new matrix
- var matrix = parser().svg.node.createSVGMatrix(); // update with current values
+ key: "unschedule",
+ value: function unschedule(runner) {
+ var index = this._order.indexOf(runner.id);
- for (var i = abcdef.length - 1; i >= 0; i--) {
- matrix[abcdef[i]] = this[abcdef[i]];
- }
+ if (index < 0) return this;
+ delete this._runners[runner.id];
- return matrix;
- } // Check if two matrices are equal
+ this._order.splice(index, 1);
+ runner.timeline(null);
+ return this;
+ }
}, {
- key: "equals",
- value: function equals(other) {
- var comp = new Matrix(other);
- return closeEnough(this.a, comp.a) && closeEnough(this.b, comp.b) && closeEnough(this.c, comp.c) && closeEnough(this.d, comp.d) && closeEnough(this.e, comp.e) && closeEnough(this.f, comp.f);
- } // Convert matrix to string
-
+ key: "play",
+ value: function play() {
+ // Now make sure we are not paused and continue the animation
+ this._paused = false;
+ return this._continue();
+ }
}, {
- key: "toString",
- value: function toString() {
- return 'matrix(' + this.a + ',' + this.b + ',' + this.c + ',' + this.d + ',' + this.e + ',' + this.f + ')';
+ key: "pause",
+ value: function pause() {
+ // Cancel the next animation frame and pause
+ this._nextFrame = null;
+ this._paused = true;
+ return this;
}
}, {
- key: "toArray",
- value: function toArray() {
- return [this.a, this.b, this.c, this.d, this.e, this.f];
+ key: "stop",
+ value: function stop() {
+ // Cancel the next animation frame and go to start
+ this.seek(-this._time);
+ return this.pause();
}
}, {
- key: "valueOf",
- value: function valueOf() {
- return {
- a: this.a,
- b: this.b,
- c: this.c,
- d: this.d,
- e: this.e,
- f: this.f
- };
- } // TODO: Refactor this to a static function of matrix.js
-
- }], [{
- key: "formatTransforms",
- value: function formatTransforms(o) {
- // Get all of the parameters required to form the matrix
- var flipBoth = o.flip === 'both' || o.flip === true;
- var flipX = o.flip && (flipBoth || o.flip === 'x') ? -1 : 1;
- var flipY = o.flip && (flipBoth || o.flip === 'y') ? -1 : 1;
- var skewX = o.skew && o.skew.length ? o.skew[0] : isFinite(o.skew) ? o.skew : isFinite(o.skewX) ? o.skewX : 0;
- var skewY = o.skew && o.skew.length ? o.skew[1] : isFinite(o.skew) ? o.skew : isFinite(o.skewY) ? o.skewY : 0;
- var scaleX = o.scale && o.scale.length ? o.scale[0] * flipX : isFinite(o.scale) ? o.scale * flipX : isFinite(o.scaleX) ? o.scaleX * flipX : flipX;
- var scaleY = o.scale && o.scale.length ? o.scale[1] * flipY : isFinite(o.scale) ? o.scale * flipY : isFinite(o.scaleY) ? o.scaleY * flipY : flipY;
- var shear = o.shear || 0;
- var theta = o.rotate || o.theta || 0;
- var origin = new Point(o.origin || o.around || o.ox || o.originX, o.oy || o.originY);
- var ox = origin.x;
- var oy = origin.y;
- var position = new Point(o.position || o.px || o.positionX, o.py || o.positionY);
- var px = position.x;
- var py = position.y;
- var translate = new Point(o.translate || o.tx || o.translateX, o.ty || o.translateY);
- var tx = translate.x;
- var ty = translate.y;
- var relative = new Point(o.relative || o.rx || o.relativeX, o.ry || o.relativeY);
- var rx = relative.x;
- var ry = relative.y; // Populate all of the values
-
- return {
- scaleX: scaleX,
- scaleY: scaleY,
- skewX: skewX,
- skewY: skewY,
- shear: shear,
- theta: theta,
- rx: rx,
- ry: ry,
- tx: tx,
- ty: ty,
- ox: ox,
- oy: oy,
- px: px,
- py: py
- };
- } // left matrix, right matrix, target matrix which is overwritten
-
+ key: "finish",
+ value: function finish() {
+ this.seek(Infinity);
+ return this.pause();
+ }
}, {
- key: "matrixMultiply",
- value: function matrixMultiply(l, r, o) {
- // Work out the product directly
- var a = l.a * r.a + l.c * r.b;
- var b = l.b * r.a + l.d * r.b;
- var c = l.a * r.c + l.c * r.d;
- var d = l.b * r.c + l.d * r.d;
- var e = l.e + l.a * r.e + l.c * r.f;
- var f = l.f + l.b * r.e + l.d * r.f; // make sure to use local variables because l/r and o could be the same
-
- o.a = a;
- o.b = b;
- o.c = c;
- o.d = d;
- o.e = e;
- o.f = f;
- return o;
+ key: "speed",
+ value: function speed(_speed) {
+ if (_speed == null) return this._speed;
+ this._speed = _speed;
+ return this;
}
- }]);
-
- return Matrix;
- }();
- registerMethods({
- Element: {
- // Get current matrix
- ctm: function ctm() {
- return new Matrix(this.node.getCTM());
- },
- // Get current screen matrix
- screenCTM: function screenCTM() {
- /* https://bugzilla.mozilla.org/show_bug.cgi?id=1344537\r
- This is needed because FF does not return the transformation matrix\r
- for the inner coordinate system when getScreenCTM() is called on nested svgs.\r
- However all other Browsers do that */
- if (typeof this.isRoot === 'function' && !this.isRoot()) {
- var rect = this.rect(1, 1);
- var m = rect.node.getScreenCTM();
- rect.remove();
- return new Matrix(m);
- }
-
- return new Matrix(this.node.getScreenCTM());
+ }, {
+ key: "reverse",
+ value: function reverse(yes) {
+ var currentSpeed = this.speed();
+ if (yes == null) return this.speed(-currentSpeed);
+ var positive = Math.abs(currentSpeed);
+ return this.speed(yes ? positive : -positive);
}
- }
- });
-
- /***\r
- Base Class\r
- ==========\r
- The base stepper class that will be\r
- ***/
-
- function makeSetterGetter(k, f) {
- return function (v) {
- if (v == null) return this[v];
- this[k] = v;
- if (f) f.call(this);
- return this;
- };
- }
-
- var easing = {
- '-': function _(pos) {
- return pos;
- },
- '<>': function _(pos) {
- return -Math.cos(pos * Math.PI) / 2 + 0.5;
- },
- '>': function _(pos) {
- return Math.sin(pos * Math.PI / 2);
- },
- '<': function _(pos) {
- return -Math.cos(pos * Math.PI / 2) + 1;
- },
- bezier: function bezier(t0, x0, t1, x1) {
- return function (t) {// TODO: FINISH
- };
- }
- };
- var Stepper =
- /*#__PURE__*/
- function () {
- function Stepper() {
- _classCallCheck(this, Stepper);
- }
-
- _createClass(Stepper, [{
- key: "done",
- value: function done() {
- return false;
+ }, {
+ key: "seek",
+ value: function seek(dt) {
+ this._time += dt;
+ return this._continue();
}
- }]);
-
- return Stepper;
- }();
- /***\r
- Easing Functions\r
- ================\r
- ***/
-
- var Ease =
- /*#__PURE__*/
- function (_Stepper) {
- _inherits(Ease, _Stepper);
-
- function Ease(fn) {
- var _this;
-
- _classCallCheck(this, Ease);
-
- _this = _possibleConstructorReturn(this, _getPrototypeOf(Ease).call(this));
- _this.ease = easing[fn || timeline.ease] || fn;
- return _this;
- }
-
- _createClass(Ease, [{
- key: "step",
- value: function step(from, to, pos) {
- if (typeof from !== 'number') {
- return pos < 1 ? from : to;
- }
-
- return from + (to - from) * this.ease(pos);
+ }, {
+ key: "time",
+ value: function time(_time) {
+ if (_time == null) return this._time;
+ this._time = _time;
+ return this;
}
- }]);
-
- return Ease;
- }(Stepper);
- /***\r
- Controller Types\r
- ================\r
- ***/
-
- var Controller =
- /*#__PURE__*/
- function (_Stepper2) {
- _inherits(Controller, _Stepper2);
-
- function Controller(fn) {
- var _this2;
-
- _classCallCheck(this, Controller);
-
- _this2 = _possibleConstructorReturn(this, _getPrototypeOf(Controller).call(this));
- _this2.stepper = fn;
- return _this2;
- }
-
- _createClass(Controller, [{
- key: "step",
- value: function step(current, target, dt, c) {
- return this.stepper(current, target, dt, c);
+ }, {
+ key: "persist",
+ value: function persist(dtOrForever) {
+ if (dtOrForever == null) return this._persist;
+ this._persist = dtOrForever;
+ return this;
}
}, {
- key: "done",
- value: function done(c) {
- return c.done;
+ key: "source",
+ value: function source(fn) {
+ if (fn == null) return this._timeSource;
+ this._timeSource = fn;
+ return this;
}
- }]);
+ }, {
+ key: "_step",
+ value: function _step() {
+ // If the timeline is paused, just do nothing
+ if (this._paused) return; // Get the time delta from the last time and update the time
+ // TODO: Deal with window.blur window.focus to pause animations
- return Controller;
- }(Stepper);
+ var time = this._timeSource();
- function recalculate() {
- // Apply the default parameters
- var duration = (this._duration || 500) / 1000;
- var overshoot = this._overshoot || 0; // Calculate the PID natural response
+ var dtSource = time - this._lastSourceTime;
+ var dtTime = this._speed * dtSource + (this._time - this._lastStepTime);
+ this._lastSourceTime = time; // Update the time
- var eps = 1e-10;
- var pi = Math.PI;
- var os = Math.log(overshoot / 100 + eps);
- var zeta = -os / Math.sqrt(pi * pi + os * os);
- var wn = 3.9 / (zeta * duration); // Calculate the Spring values
+ this._time += dtTime;
+ this._lastStepTime = this._time; // this.fire('time', this._time)
+ // Run all of the runners directly
- this.d = 2 * zeta * wn;
- this.k = wn * wn;
- }
+ var runnersLeft = false;
- var Spring =
- /*#__PURE__*/
- function (_Controller) {
- _inherits(Spring, _Controller);
+ for (var i = 0, len = this._order.length; i < len; i++) {
+ // Get and run the current runner and ignore it if its inactive
+ var runnerInfo = this._runners[this._order[i]];
+ var runner = runnerInfo.runner;
+ var dt = dtTime; // Make sure that we give the actual difference
+ // between runner start time and now
- function Spring(duration, overshoot) {
- var _this3;
+ var dtToStart = this._time - runnerInfo.start; // Dont run runner if not started yet
- _classCallCheck(this, Spring);
+ if (dtToStart < 0) {
+ runnersLeft = true;
+ continue;
+ } else if (dtToStart < dt) {
+ // Adjust dt to make sure that animation is on point
+ dt = dtToStart;
+ }
- _this3 = _possibleConstructorReturn(this, _getPrototypeOf(Spring).call(this));
+ if (!runner.active()) continue; // If this runner is still going, signal that we need another animation
+ // frame, otherwise, remove the completed runner
- _this3.duration(duration || 500).overshoot(overshoot || 0);
+ var finished = runner.step(dt).done;
- return _this3;
- }
+ if (!finished) {
+ runnersLeft = true; // continue
+ } else if (runnerInfo.persist !== true) {
+ // runner is finished. And runner might get removed
+ // TODO: Figure out end time of runner
+ var endTime = runner.duration() - runner.time() + this._time;
- _createClass(Spring, [{
- key: "step",
- value: function step(current, target, dt, c) {
- if (typeof current === 'string') return current;
- c.done = dt === Infinity;
- if (dt === Infinity) return target;
- if (dt === 0) return current;
- if (dt > 100) dt = 16;
- dt /= 1000; // Get the previous velocity
+ if (endTime + this._persist < this._time) {
+ // Delete runner and correct index
+ delete this._runners[this._order[i]];
+ this._order.splice(i--, 1) && --len;
+ runner.timeline(null);
+ }
+ }
+ } // Get the next animation frame to keep the simulation going
- var velocity = c.velocity || 0; // Apply the control to get the new position and store it
- var acceleration = -this.d * velocity - this.k * (current - target);
- var newPosition = current + velocity * dt + acceleration * dt * dt / 2; // Store the velocity
+ if (runnersLeft) {
+ this._nextFrame = Animator.frame(this._step.bind(this));
+ } else {
+ this._nextFrame = null;
+ }
- c.velocity = velocity + acceleration * dt; // Figure out if we have converged, and if so, pass the value
+ return this;
+ } // Checks if we are running and continues the animation
- c.done = Math.abs(target - newPosition) + Math.abs(velocity) < 0.002;
- return c.done ? target : newPosition;
+ }, {
+ key: "_continue",
+ value: function _continue() {
+ if (this._paused) return this;
+
+ if (!this._nextFrame) {
+ this._nextFrame = Animator.frame(this._step.bind(this));
+ }
+
+ return this;
+ }
+ }, {
+ key: "active",
+ value: function active() {
+ return !!this._nextFrame;
}
}]);
- return Spring;
- }(Controller);
- extend(Spring, {
- duration: makeSetterGetter('_duration', recalculate),
- overshoot: makeSetterGetter('_overshoot', recalculate)
+ return Timeline;
+ }();
+ registerMethods({
+ Element: {
+ timeline: function timeline() {
+ this._timeline = this._timeline || new Timeline();
+ return this._timeline;
+ }
+ }
});
- var PID =
+
+ // easing = {
+ // '-': function (pos) { return pos },
+ // '<>': function (pos) { return -Math.cos(pos * Math.PI) / 2 + 0.5 },
+ // '>': function (pos) { return Math.sin(pos * Math.PI / 2) },
+ // '<': function (pos) { return -Math.cos(pos * Math.PI / 2) + 1 }
+ // }
+
+ var Runner =
/*#__PURE__*/
- function (_Controller2) {
- _inherits(PID, _Controller2);
+ function (_EventTarget) {
+ _inherits(Runner, _EventTarget);
- function PID(p, i, d, windup) {
- var _this4;
+ function Runner(options) {
+ var _this;
- _classCallCheck(this, PID);
+ _classCallCheck(this, Runner);
- _this4 = _possibleConstructorReturn(this, _getPrototypeOf(PID).call(this));
- p = p == null ? 0.1 : p;
- i = i == null ? 0.01 : i;
- d = d == null ? 0 : d;
- windup = windup == null ? 1000 : windup;
+ _this = _possibleConstructorReturn(this, _getPrototypeOf(Runner).call(this)); // Store a unique id on the runner, so that we can identify it later
- _this4.p(p).i(i).d(d).windup(windup);
+ _this.id = Runner.id++; // Ensure a default value
- return _this4;
- }
+ options = options == null ? timeline.duration : options; // Ensure that we get a controller
- _createClass(PID, [{
- key: "step",
- value: function step(current, target, dt, c) {
- if (typeof current === 'string') return current;
- c.done = dt === Infinity;
- if (dt === Infinity) return target;
- if (dt === 0) return current;
- var p = target - current;
- var i = (c.integral || 0) + p * dt;
- var d = (p - (c.error || 0)) / dt;
- var windup = this.windup; // antiwindup
+ options = typeof options === 'function' ? new Controller(options) : options; // Declare all of the variables
- if (windup !== false) {
- i = Math.max(-windup, Math.min(i, windup));
- }
+ _this._element = null;
+ _this._timeline = null;
+ _this.done = false;
+ _this._queue = []; // Work out the stepper and the duration
+
+ _this._duration = typeof options === 'number' && options;
+ _this._isDeclarative = options instanceof Controller;
+ _this._stepper = _this._isDeclarative ? options : new Ease(); // We copy the current values from the timeline because they can change
- c.error = p;
- c.integral = i;
- c.done = Math.abs(p) < 0.001;
- return c.done ? target : current + (this.P * p + this.I * i + this.D * d);
- }
- }]);
+ _this._history = {}; // Store the state of the runner
- return PID;
- }(Controller);
- extend(PID, {
- windup: makeSetterGetter('windup'),
- p: makeSetterGetter('P'),
- i: makeSetterGetter('I'),
- d: makeSetterGetter('D')
- });
+ _this.enabled = true;
+ _this._time = 0;
+ _this._last = 0; // Save transforms applied to this runner
- var Morphable =
- /*#__PURE__*/
- function () {
- function Morphable(stepper) {
- _classCallCheck(this, Morphable);
+ _this.transforms = new Matrix();
+ _this.transformId = 1; // Looping variables
- // FIXME: the default stepper does not know about easing
- this._stepper = stepper || new Ease('-');
- this._from = null;
- this._to = null;
- this._type = null;
- this._context = null;
- this._morphObj = null;
+ _this._haveReversed = false;
+ _this._reverse = false;
+ _this._loopsDone = 0;
+ _this._swing = false;
+ _this._wait = 0;
+ _this._times = 1;
+ return _this;
}
+ /*\r
+ Runner Definitions\r
+ ==================\r
+ These methods help us define the runtime behaviour of the Runner or they\r
+ help us make new runners from the current runner\r
+ */
- _createClass(Morphable, [{
- key: "from",
- value: function from(val) {
- if (val == null) {
- return this._from;
- }
- this._from = this._set(val);
+ _createClass(Runner, [{
+ key: "element",
+ value: function element(_element) {
+ if (_element == null) return this._element;
+ this._element = _element;
+
+ _element._prepareRunner();
+
return this;
}
}, {
- key: "to",
- value: function to(val) {
- if (val == null) {
- return this._to;
- }
-
- this._to = this._set(val);
+ key: "timeline",
+ value: function timeline$$1(_timeline) {
+ // check explicitly for undefined so we can set the timeline to null
+ if (typeof _timeline === 'undefined') return this._timeline;
+ this._timeline = _timeline;
return this;
}
}, {
- key: "type",
- value: function type(_type) {
- // getter
- if (_type == null) {
- return this._type;
- } // setter
-
-
- this._type = _type;
- return this;
+ key: "animate",
+ value: function animate(duration, delay, when) {
+ var o = Runner.sanitise(duration, delay, when);
+ var runner = new Runner(o.duration);
+ if (this._timeline) runner.timeline(this._timeline);
+ if (this._element) runner.element(this._element);
+ return runner.loop(o).schedule(delay, when);
}
}, {
- key: "_set",
- value: function _set$$1(value) {
- if (!this._type) {
- var type = _typeof(value);
+ key: "schedule",
+ value: function schedule(timeline$$1, delay, when) {
+ // The user doesn't need to pass a timeline if we already have one
+ if (!(timeline$$1 instanceof Timeline)) {
+ when = delay;
+ delay = timeline$$1;
+ timeline$$1 = this.timeline();
+ } // If there is no timeline, yell at the user...
- if (type === 'number') {
- this.type(SVGNumber);
- } else if (type === 'string') {
- if (Color.isColor(value)) {
- this.type(Color);
- } else if (delimiter.test(value)) {
- this.type(pathLetters.test(value) ? PathArray : SVGArray);
- } else if (numberAndUnit.test(value)) {
- this.type(SVGNumber);
- } else {
- this.type(NonMorphable);
- }
- } else if (morphableTypes.indexOf(value.constructor) > -1) {
- this.type(value.constructor);
- } else if (Array.isArray(value)) {
- this.type(SVGArray);
- } else if (type === 'object') {
- this.type(ObjectBag);
- } else {
- this.type(NonMorphable);
- }
- }
- var result = new this._type(value).toArray();
- this._morphObj = this._morphObj || new this._type();
- this._context = this._context || Array.apply(null, Array(result.length)).map(Object);
- return result;
+ if (!timeline$$1) {
+ throw Error('Runner cannot be scheduled without timeline');
+ } // Schedule the runner on the timeline provided
+
+
+ timeline$$1.schedule(this, delay, when);
+ return this;
}
}, {
- key: "stepper",
- value: function stepper(_stepper) {
- if (_stepper == null) return this._stepper;
- this._stepper = _stepper;
+ key: "unschedule",
+ value: function unschedule() {
+ var timeline$$1 = this.timeline();
+ timeline$$1 && timeline$$1.unschedule(this);
return this;
}
}, {
- key: "done",
- value: function done() {
- var complete = this._context.map(this._stepper.done).reduce(function (last, curr) {
- return last && curr;
- }, true);
+ key: "loop",
+ value: function loop(times, swing, wait) {
+ // Deal with the user passing in an object
+ if (_typeof(times) === 'object') {
+ swing = times.swing;
+ wait = times.wait;
+ times = times.times;
+ } // Sanitise the values and store them
- return complete;
+
+ this._times = times || Infinity;
+ this._swing = swing || false;
+ this._wait = wait || 0;
+ return this;
}
}, {
- key: "at",
- value: function at(pos) {
- var _this = this;
-
- return this._morphObj.fromArray(this._from.map(function (i, index) {
- return _this._stepper.step(i, _this._to[index], pos, _this._context[index], _this._context);
- }));
+ key: "delay",
+ value: function delay(_delay) {
+ return this.animate(0, _delay);
}
- }]);
-
- return Morphable;
- }();
- var NonMorphable =
- /*#__PURE__*/
- function () {
- function NonMorphable() {
- _classCallCheck(this, NonMorphable);
+ /*\r
+ Basic Functionality\r
+ ===================\r
+ These methods allow us to attach basic functions to the runner directly\r
+ */
- this.init.apply(this, arguments);
- }
+ }, {
+ key: "queue",
+ value: function queue(initFn, runFn, isTransform) {
+ this._queue.push({
+ initialiser: initFn || noop,
+ runner: runFn || noop,
+ isTransform: isTransform,
+ initialised: false,
+ finished: false
+ });
- _createClass(NonMorphable, [{
- key: "init",
- value: function init(val) {
- val = Array.isArray(val) ? val[0] : val;
- this.value = val;
+ var timeline$$1 = this.timeline();
+ timeline$$1 && this.timeline()._continue();
+ return this;
}
}, {
- key: "valueOf",
- value: function valueOf() {
- return this.value;
+ key: "during",
+ value: function during(fn) {
+ return this.queue(null, fn);
}
}, {
- key: "toArray",
- value: function toArray() {
- return [this.value];
+ key: "after",
+ value: function after(fn) {
+ return this.on('finish', fn);
}
- }]);
-
- return NonMorphable;
- }();
- var TransformBag =
- /*#__PURE__*/
- function () {
- function TransformBag() {
- _classCallCheck(this, TransformBag);
+ /*\r
+ Runner animation methods\r
+ ========================\r
+ Control how the animation plays\r
+ */
- this.init.apply(this, arguments);
- }
+ }, {
+ key: "time",
+ value: function time(_time) {
+ if (_time == null) {
+ return this._time;
+ }
- _createClass(TransformBag, [{
- key: "init",
- value: function init(obj) {
- if (Array.isArray(obj)) {
- obj = {
- scaleX: obj[0],
- scaleY: obj[1],
- shear: obj[2],
- rotate: obj[3],
- translateX: obj[4],
- translateY: obj[5],
- originX: obj[6],
- originY: obj[7]
- };
+ var dt = _time - this._time;
+ this.step(dt);
+ return this;
+ }
+ }, {
+ key: "duration",
+ value: function duration() {
+ return this._times * (this._wait + this._duration) - this._wait;
+ }
+ }, {
+ key: "loops",
+ value: function loops(p) {
+ var loopDuration = this._duration + this._wait;
+
+ if (p == null) {
+ var loopsDone = Math.floor(this._time / loopDuration);
+ var relativeTime = this._time - loopsDone * loopDuration;
+ var position = relativeTime / this._duration;
+ return Math.min(loopsDone + position, this._times);
}
- Object.assign(this, TransformBag.defaults, obj);
+ var whole = Math.floor(p);
+ var partial = p % 1;
+ var time = loopDuration * whole + this._duration * partial;
+ return this.time(time);
}
}, {
- key: "toArray",
- value: function toArray() {
- var v = this;
- return [v.scaleX, v.scaleY, v.shear, v.rotate, v.translateX, v.translateY, v.originX, v.originY];
- }
- }]);
+ key: "position",
+ value: function position(p) {
+ // Get all of the variables we need
+ var x = this._time;
+ var d = this._duration;
+ var w = this._wait;
+ var t = this._times;
+ var s = this._swing;
+ var r = this._reverse;
+ var position;
- return TransformBag;
- }();
- TransformBag.defaults = {
- scaleX: 1,
- scaleY: 1,
- shear: 0,
- rotate: 0,
- translateX: 0,
- translateY: 0,
- originX: 0,
- originY: 0
- };
- var ObjectBag =
- /*#__PURE__*/
- function () {
- function ObjectBag() {
- _classCallCheck(this, ObjectBag);
+ if (p == null) {
+ /*\r
+ This function converts a time to a position in the range [0, 1]\r
+ The full explanation can be found in this desmos demonstration\r
+ https://www.desmos.com/calculator/u4fbavgche\r
+ The logic is slightly simplified here because we can use booleans\r
+ */
+ // Figure out the value without thinking about the start or end time
+ var f = function f(x) {
+ var swinging = s * Math.floor(x % (2 * (w + d)) / (w + d));
+ var backwards = swinging && !r || !swinging && r;
+ var uncliped = Math.pow(-1, backwards) * (x % (w + d)) / d + backwards;
+ var clipped = Math.max(Math.min(uncliped, 1), 0);
+ return clipped;
+ }; // Figure out the value by incorporating the start time
- this.init.apply(this, arguments);
- }
- _createClass(ObjectBag, [{
- key: "init",
- value: function init(objOrArr) {
- this.values = [];
+ var endTime = t * (w + d) - w;
+ position = x <= 0 ? Math.round(f(1e-5)) : x < endTime ? f(x) : Math.round(f(endTime - 1e-5));
+ return position;
+ } // Work out the loops done and add the position to the loops done
- if (Array.isArray(objOrArr)) {
- this.values = objOrArr;
- return;
- }
- var entries = Object.entries(objOrArr || {}).sort(function (a, b) {
- return a[0] - b[0];
- });
- this.values = entries.reduce(function (last, curr) {
- return last.concat(curr);
- }, []);
+ var loopsDone = Math.floor(this.loops());
+ var swingForward = s && loopsDone % 2 === 0;
+ var forwards = swingForward && !r || r && swingForward;
+ position = loopsDone + (forwards ? p : 1 - p);
+ return this.loops(position);
}
}, {
- key: "valueOf",
- value: function valueOf() {
- var obj = {};
- var arr = this.values;
-
- for (var i = 0, len = arr.length; i < len; i += 2) {
- obj[arr[i]] = arr[i + 1];
+ key: "progress",
+ value: function progress(p) {
+ if (p == null) {
+ return Math.min(1, this._time / this.duration());
}
- return obj;
+ return this.time(p * this.duration());
}
}, {
- key: "toArray",
- value: function toArray() {
- return this.values;
- }
- }]);
+ key: "step",
+ value: function step(dt) {
+ // If we are inactive, this stepper just gets skipped
+ if (!this.enabled) return this; // Update the time and get the new position
- return ObjectBag;
- }();
- var morphableTypes = [NonMorphable, TransformBag, ObjectBag];
- function registerMorphableType() {
- var type = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
- morphableTypes.push.apply(morphableTypes, _toConsumableArray([].concat(type)));
- }
- function makeMorphable() {
- extend(morphableTypes, {
- to: function to(val, args) {
- return new Morphable().type(this.constructor).from(this.valueOf()).to(val, args);
- },
- fromArray: function fromArray(arr) {
- this.init(arr);
- return this;
- }
- });
- }
+ dt = dt == null ? 16 : dt;
+ this._time += dt;
+ var position = this.position(); // Figure out if we need to run the stepper in this frame
- var time = window.performance || Date;
+ var running = this._lastPosition !== position && this._time >= 0;
+ this._lastPosition = position; // Figure out if we just started
- var makeSchedule = function makeSchedule(runnerInfo) {
- var start = runnerInfo.start;
- var duration = runnerInfo.runner.duration();
- var end = start + duration;
- return {
- start: start,
- duration: duration,
- end: end,
- runner: runnerInfo.runner
- };
- };
+ var duration = this.duration();
+ var justStarted = this._lastTime < 0 && this._time > 0;
+ var justFinished = this._lastTime < this._time && this.time > duration;
+ this._lastTime = this._time;
- var Timeline =
- /*#__PURE__*/
- function () {
- // Construct a new timeline on the given element
- function Timeline() {
- _classCallCheck(this, Timeline);
+ if (justStarted) {
+ this.fire('start', this);
+ } // Work out if the runner is finished set the done flag here so animations
+ // know, that they are running in the last step (this is good for
+ // transformations which can be merged)
- this._timeSource = function () {
- return time.now();
- };
- this._dispatcher = document.createElement('div'); // Store the timing variables
+ var declarative = this._isDeclarative;
+ this.done = !declarative && !justFinished && this._time >= duration; // Call initialise and the run function
- this._startTime = 0;
- this._speed = 1.0; // Play control variables control how the animation proceeds
+ if (running || declarative) {
+ this._initialise(running); // clear the transforms on this runner so they dont get added again and again
- this._reverse = false;
- this._persist = 0; // Keep track of the running animations and their starting parameters
- this._nextFrame = null;
- this._paused = false;
- this._runners = [];
- this._order = [];
- this._time = 0;
- this._lastSourceTime = 0;
- this._lastStepTime = 0;
- }
+ this.transforms = new Matrix();
- _createClass(Timeline, [{
- key: "getEventTarget",
- value: function getEventTarget() {
- return this._dispatcher;
- }
- /**\r
- *\r
- */
- // schedules a runner on the timeline
+ var converged = this._run(declarative ? dt : position);
- }, {
- key: "schedule",
- value: function schedule(runner, delay, when) {
- if (runner == null) {
- return this._runners.map(makeSchedule).sort(function (a, b) {
- return a.start - b.start || a.duration - b.duration;
- });
+ this.fire('step', this);
+ } // correct the done flag here
+ // declaritive animations itself know when they converged
+
+
+ this.done = this.done || converged && declarative;
+
+ if (this.done) {
+ this.fire('finish', this);
}
- if (!this.active()) {
- this._step();
+ return this;
+ }
+ }, {
+ key: "finish",
+ value: function finish() {
+ return this.step(Infinity);
+ }
+ }, {
+ key: "reverse",
+ value: function reverse(_reverse) {
+ this._reverse = _reverse == null ? !this._reverse : _reverse;
+ return this;
+ }
+ }, {
+ key: "ease",
+ value: function ease(fn) {
+ this._stepper = new Ease(fn);
+ return this;
+ }
+ }, {
+ key: "active",
+ value: function active(enabled) {
+ if (enabled == null) return this.enabled;
+ this.enabled = enabled;
+ return this;
+ }
+ /*\r
+ Private Methods\r
+ ===============\r
+ Methods that shouldn't be used externally\r
+ */
+ // Save a morpher to the morpher list so that we can retarget it later
- if (when == null) {
- when = 'now';
- }
- } // The start time for the next animation can either be given explicitly,
- // derived from the current timeline time or it can be relative to the
- // last start time to chain animations direclty
+ }, {
+ key: "_rememberMorpher",
+ value: function _rememberMorpher(method, morpher) {
+ this._history[method] = {
+ morpher: morpher,
+ caller: this._queue[this._queue.length - 1]
+ };
+ } // Try to set the target for a morpher if the morpher exists, otherwise
+ // do nothing and return false
+ }, {
+ key: "_tryRetarget",
+ value: function _tryRetarget(method, target) {
+ if (this._history[method]) {
+ // if the last method wasnt even initialised, throw it away
+ if (!this._history[method].caller.initialised) {
+ var index = this._queue.indexOf(this._history[method].caller);
- var absoluteStartTime = 0;
- delay = delay || 0; // Work out when to start the animation
+ this._queue.splice(index, 1);
- if (when == null || when === 'last' || when === 'after') {
- // Take the last time and increment
- absoluteStartTime = this._startTime;
- } else if (when === 'absolute' || when === 'start') {
- absoluteStartTime = delay;
- delay = 0;
- } else if (when === 'now') {
- absoluteStartTime = this._time;
- } else if (when === 'relative') {
- var runnerInfo = this._runners[runner.id];
+ return false;
+ } // for the case of transformations, we use the special retarget function
+ // which has access to the outer scope
- if (runnerInfo) {
- absoluteStartTime = runnerInfo.start + delay;
- delay = 0;
- }
- } else {
- throw new Error('Invalid value for the "when" parameter');
- } // Manage runner
+ if (this._history[method].caller.isTransform) {
+ this._history[method].caller.isTransform(target); // for everything else a simple morpher change is sufficient
- runner.unschedule();
- runner.timeline(this);
- runner.time(-delay); // Save startTime for next runner
+ } else {
+ this._history[method].morpher.to(target);
+ }
- this._startTime = absoluteStartTime + runner.duration() + delay; // Save runnerInfo
+ this._history[method].caller.finished = false;
+ var timeline$$1 = this.timeline();
+ timeline$$1 && timeline$$1._continue();
+ return true;
+ }
- this._runners[runner.id] = {
- persist: this.persist(),
- runner: runner,
- start: absoluteStartTime // Save order and continue
+ return false;
+ } // Run each initialise function in the runner if required
- };
+ }, {
+ key: "_initialise",
+ value: function _initialise(running) {
+ // If we aren't running, we shouldn't initialise when not declarative
+ if (!running && !this._isDeclarative) return; // Loop through all of the initialisers
- this._order.push(runner.id);
+ for (var i = 0, len = this._queue.length; i < len; ++i) {
+ // Get the current initialiser
+ var current = this._queue[i]; // Determine whether we need to initialise
- this._continue();
+ var needsIt = this._isDeclarative || !current.initialised && running;
+ running = !current.finished; // Call the initialiser if we need to
- return this;
- } // Remove the runner from this timeline
+ if (needsIt && running) {
+ current.initialiser.call(this);
+ current.initialised = true;
+ }
+ }
+ } // Run each run function for the position or dt given
}, {
- key: "unschedule",
- value: function unschedule(runner) {
- var index = this._order.indexOf(runner.id);
+ key: "_run",
+ value: function _run(positionOrDt) {
+ // Run all of the _queue directly
+ var allfinished = true;
- if (index < 0) return this;
- delete this._runners[runner.id];
+ for (var i = 0, len = this._queue.length; i < len; ++i) {
+ // Get the current function to run
+ var current = this._queue[i]; // Run the function if its not finished, we keep track of the finished
+ // flag for the sake of declarative _queue
- this._order.splice(index, 1);
+ var converged = current.runner.call(this, positionOrDt);
+ current.finished = current.finished || converged === true;
+ allfinished = allfinished && current.finished;
+ } // We report when all of the constructors are finished
- runner.timeline(null);
- return this;
- }
- }, {
- key: "play",
- value: function play() {
- // Now make sure we are not paused and continue the animation
- this._paused = false;
- return this._continue();
+
+ return allfinished;
}
}, {
- key: "pause",
- value: function pause() {
- // Cancel the next animation frame and pause
- this._nextFrame = null;
- this._paused = true;
+ key: "addTransform",
+ value: function addTransform(transform, index) {
+ this.transforms.lmultiplyO(transform);
return this;
}
}, {
- key: "stop",
- value: function stop() {
- // Cancel the next animation frame and go to start
- this.seek(-this._time);
- return this.pause();
- }
- }, {
- key: "finish",
- value: function finish() {
- this.seek(Infinity);
- return this.pause();
- }
- }, {
- key: "speed",
- value: function speed(_speed) {
- if (_speed == null) return this._speed;
- this._speed = _speed;
+ key: "clearTransform",
+ value: function clearTransform() {
+ this.transforms = new Matrix();
return this;
}
- }, {
- key: "reverse",
- value: function reverse(yes) {
- var currentSpeed = this.speed();
- if (yes == null) return this.speed(-currentSpeed);
- var positive = Math.abs(currentSpeed);
- return this.speed(yes ? positive : -positive);
- }
- }, {
- key: "seek",
- value: function seek(dt) {
- this._time += dt;
- return this._continue();
+ }], [{
+ key: "sanitise",
+ value: function sanitise(duration, delay, when) {
+ // Initialise the default parameters
+ var times = 1;
+ var swing = false;
+ var wait = 0;
+ duration = duration || timeline.duration;
+ delay = delay || timeline.delay;
+ when = when || 'last'; // If we have an object, unpack the values
+
+ if (_typeof(duration) === 'object' && !(duration instanceof Stepper)) {
+ delay = duration.delay || delay;
+ when = duration.when || when;
+ swing = duration.swing || swing;
+ times = duration.times || times;
+ wait = duration.wait || wait;
+ duration = duration.duration || timeline.duration;
+ }
+
+ return {
+ duration: duration,
+ delay: delay,
+ swing: swing,
+ times: times,
+ wait: wait,
+ when: when
+ };
}
- }, {
- key: "time",
- value: function time(_time) {
- if (_time == null) return this._time;
- this._time = _time;
+ }]);
+
+ return Runner;
+ }(EventTarget);
+ Runner.id = 0;
+
+ var FakeRunner = function FakeRunner() {
+ var transforms = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : new Matrix();
+ var id = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : -1;
+ var done = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+
+ _classCallCheck(this, FakeRunner);
+
+ this.transforms = transforms;
+ this.id = id;
+ this.done = done;
+ };
+
+ extend([Runner, FakeRunner], {
+ mergeWith: function mergeWith(runner) {
+ return new FakeRunner(runner.transforms.lmultiply(this.transforms), runner.id);
+ }
+ }); // FakeRunner.emptyRunner = new FakeRunner()
+
+ var lmultiply = function lmultiply(last, curr) {
+ return last.lmultiplyO(curr);
+ };
+
+ var getRunnerTransform = function getRunnerTransform(runner) {
+ return runner.transforms;
+ };
+
+ function mergeTransforms() {
+ // Find the matrix to apply to the element and apply it
+ var runners = this._transformationRunners.runners;
+ var netTransform = runners.map(getRunnerTransform).reduce(lmultiply, new Matrix());
+ this.transform(netTransform);
+
+ this._transformationRunners.merge();
+
+ if (this._transformationRunners.length() === 1) {
+ this._frameId = null;
+ }
+ }
+
+ var RunnerArray =
+ /*#__PURE__*/
+ function () {
+ function RunnerArray() {
+ _classCallCheck(this, RunnerArray);
+
+ this.runners = [];
+ this.ids = [];
+ }
+
+ _createClass(RunnerArray, [{
+ key: "add",
+ value: function add(runner) {
+ if (this.runners.includes(runner)) return;
+ var id = runner.id + 1;
+ var leftSibling = this.ids.reduce(function (last, curr) {
+ if (curr > last && curr < id) return curr;
+ return last;
+ }, 0);
+ var index = this.ids.indexOf(leftSibling) + 1;
+ this.ids.splice(index, 0, id);
+ this.runners.splice(index, 0, runner);
return this;
}
}, {
- key: "persist",
- value: function persist(dtOrForever) {
- if (dtOrForever == null) return this._persist;
- this._persist = dtOrForever;
- return this;
+ key: "getByID",
+ value: function getByID(id) {
+ return this.runners[this.ids.indexOf(id + 1)];
}
}, {
- key: "source",
- value: function source(fn) {
- if (fn == null) return this._timeSource;
- this._timeSource = fn;
+ key: "remove",
+ value: function remove(id) {
+ var index = this.ids.indexOf(id + 1);
+ this.ids.splice(index, 1);
+ this.runners.splice(index, 1);
return this;
}
}, {
- key: "_step",
- value: function _step() {
- // If the timeline is paused, just do nothing
- if (this._paused) return; // Get the time delta from the last time and update the time
- // TODO: Deal with window.blur window.focus to pause animations
-
- var time = this._timeSource();
-
- var dtSource = time - this._lastSourceTime;
- var dtTime = this._speed * dtSource + (this._time - this._lastStepTime);
- this._lastSourceTime = time; // Update the time
-
- this._time += dtTime;
- this._lastStepTime = this._time; // this.fire('time', this._time)
- // Run all of the runners directly
-
- var runnersLeft = false;
-
- for (var i = 0, len = this._order.length; i < len; i++) {
- // Get and run the current runner and ignore it if its inactive
- var runnerInfo = this._runners[this._order[i]];
- var runner = runnerInfo.runner;
- var dt = dtTime; // Make sure that we give the actual difference
- // between runner start time and now
-
- var dtToStart = this._time - runnerInfo.start; // Dont run runner if not started yet
-
- if (dtToStart < 0) {
- runnersLeft = true;
- continue;
- } else if (dtToStart < dt) {
- // Adjust dt to make sure that animation is on point
- dt = dtToStart;
- }
-
- if (!runner.active()) continue; // If this runner is still going, signal that we need another animation
- // frame, otherwise, remove the completed runner
-
- var finished = runner.step(dt).done;
+ key: "merge",
+ value: function merge() {
+ var _this2 = this;
- if (!finished) {
- runnersLeft = true; // continue
- } else if (runnerInfo.persist !== true) {
- // runner is finished. And runner might get removed
- // TODO: Figure out end time of runner
- var endTime = runner.duration() - runner.time() + this._time;
+ var lastRunner = null;
+ this.runners.forEach(function (runner, i) {
+ if (lastRunner && runner.done && lastRunner.done) {
+ _this2.remove(runner.id);
- if (endTime + this._persist < this._time) {
- // Delete runner and correct index
- delete this._runners[this._order[i]];
- this._order.splice(i--, 1) && --len;
- runner.timeline(null);
- }
+ _this2.edit(lastRunner.id, runner.mergeWith(lastRunner));
}
- } // Get the next animation frame to keep the simulation going
-
-
- if (runnersLeft) {
- this._nextFrame = Animator.frame(this._step.bind(this));
- } else {
- this._nextFrame = null;
- }
+ lastRunner = runner;
+ });
return this;
- } // Checks if we are running and continues the animation
-
+ }
}, {
- key: "_continue",
- value: function _continue() {
- if (this._paused) return this;
-
- if (!this._nextFrame) {
- this._nextFrame = Animator.frame(this._step.bind(this));
- }
-
+ key: "edit",
+ value: function edit(id, newRunner) {
+ var index = this.ids.indexOf(id + 1);
+ this.ids.splice(index, 1, id);
+ this.runners.splice(index, 1, newRunner);
return this;
}
}, {
- key: "active",
- value: function active() {
- return !!this._nextFrame;
+ key: "length",
+ value: function length() {
+ return this.ids.length;
+ }
+ }, {
+ key: "clearBefore",
+ value: function clearBefore(id) {
+ var deleteCnt = this.ids.indexOf(id + 1) || 1;
+ this.ids.splice(0, deleteCnt, 0);
+ this.runners.splice(0, deleteCnt, new FakeRunner());
+ return this;
}
}]);
- return Timeline;
+ return RunnerArray;
}();
+
+ var frameId = 0;
registerMethods({
Element: {
- timeline: function timeline() {
- this._timeline = this._timeline || new Timeline();
- return this._timeline;
+ animate: function animate(duration, delay, when) {
+ var o = Runner.sanitise(duration, delay, when);
+ var timeline$$1 = this.timeline();
+ return new Runner(o.duration).loop(o).element(this).timeline(timeline$$1).schedule(delay, when);
+ },
+ delay: function delay(by, when) {
+ return this.animate(0, by, when);
+ },
+ // this function searches for all runners on the element and deletes the ones
+ // which run before the current one. This is because absolute transformations
+ // overwfrite anything anyway so there is no need to waste time computing
+ // other runners
+ _clearTransformRunnersBefore: function _clearTransformRunnersBefore(currentRunner) {
+ this._transformationRunners.clearBefore(currentRunner.id);
+ },
+ _currentTransform: function _currentTransform(current) {
+ return this._transformationRunners.runners // we need the equal sign here to make sure, that also transformations
+ // on the same runner which execute before the current transformation are
+ // taken into account
+ .filter(function (runner) {
+ return runner.id <= current.id;
+ }).map(getRunnerTransform).reduce(lmultiply, new Matrix());
+ },
+ addRunner: function addRunner(runner) {
+ this._transformationRunners.add(runner);
+
+ Animator.transform_frame(mergeTransforms.bind(this), this._frameId);
+ },
+ _prepareRunner: function _prepareRunner() {
+ if (this._frameId == null) {
+ this._transformationRunners = new RunnerArray().add(new FakeRunner(new Matrix(this)));
+ this._frameId = frameId++;
+ }
}
}
});
+ extend(Runner, {
+ attr: function attr(a, v) {
+ return this.styleAttr('attr', a, v);
+ },
+ // Add animatable styles
+ css: function css(s, v) {
+ return this.styleAttr('css', s, v);
+ },
+ styleAttr: function styleAttr(type, name, val) {
+ // apply attributes individually
+ if (_typeof(name) === 'object') {
+ for (var key in val) {
+ this.styleAttr(type, key, val[key]);
+ }
+ }
- // easing = {
- // '-': function (pos) { return pos },
- // '<>': function (pos) { return -Math.cos(pos * Math.PI) / 2 + 0.5 },
- // '>': function (pos) { return Math.sin(pos * Math.PI / 2) },
- // '<': function (pos) { return -Math.cos(pos * Math.PI / 2) + 1 }
- // }
-
- var Runner =
- /*#__PURE__*/
- function (_EventTarget) {
- _inherits(Runner, _EventTarget);
-
- function Runner(options) {
- var _this;
-
- _classCallCheck(this, Runner);
-
- _this = _possibleConstructorReturn(this, _getPrototypeOf(Runner).call(this)); // Store a unique id on the runner, so that we can identify it later
-
- _this.id = Runner.id++; // Ensure a default value
-
- options = options == null ? timeline.duration : options; // Ensure that we get a controller
-
- options = typeof options === 'function' ? new Controller(options) : options; // Declare all of the variables
-
- _this._element = null;
- _this._timeline = null;
- _this.done = false;
- _this._queue = []; // Work out the stepper and the duration
-
- _this._duration = typeof options === 'number' && options;
- _this._isDeclarative = options instanceof Controller;
- _this._stepper = _this._isDeclarative ? options : new Ease(); // We copy the current values from the timeline because they can change
-
- _this._history = {}; // Store the state of the runner
-
- _this.enabled = true;
- _this._time = 0;
- _this._last = 0; // Save transforms applied to this runner
+ var morpher = new Morphable(this._stepper).to(val);
+ this.queue(function () {
+ morpher = morpher.from(this.element()[type](name));
+ }, function (pos) {
+ this.element()[type](name, morpher.at(pos));
+ return morpher.done();
+ });
+ return this;
+ },
+ zoom: function zoom(level, point) {
+ var morpher = new Morphable(this._stepper).to(new SVGNumber(level));
+ this.queue(function () {
+ morpher = morpher.from(this.zoom());
+ }, function (pos) {
+ this.element().zoom(morpher.at(pos), point);
+ return morpher.done();
+ });
+ return this;
+ },
- _this.transforms = new Matrix();
- _this.transformId = 1; // Looping variables
+ /**\r
+ ** absolute transformations\r
+ **/
+ //
+ // M v -----|-----(D M v = F v)------|-----> T v
+ //
+ // 1. define the final state (T) and decompose it (once)
+ // t = [tx, ty, the, lam, sy, sx]
+ // 2. on every frame: pull the current state of all previous transforms
+ // (M - m can change)
+ // and then write this as m = [tx0, ty0, the0, lam0, sy0, sx0]
+ // 3. Find the interpolated matrix F(pos) = m + pos * (t - m)
+ // - Note F(0) = M
+ // - Note F(1) = T
+ // 4. Now you get the delta matrix as a result: D = F * inv(M)
+ transform: function transform(transforms, relative, affine) {
+ // If we have a declarative function, we should retarget it if possible
+ relative = transforms.relative || relative;
- _this._haveReversed = false;
- _this._reverse = false;
- _this._loopsDone = 0;
- _this._swing = false;
- _this._wait = 0;
- _this._times = 1;
- return _this;
- }
- /*\r
- Runner Definitions\r
- ==================\r
- These methods help us define the runtime behaviour of the Runner or they\r
- help us make new runners from the current runner\r
- */
+ if (this._isDeclarative && !relative && this._tryRetarget('transform', transforms)) {
+ return this;
+ } // Parse the parameters
- _createClass(Runner, [{
- key: "element",
- value: function element(_element) {
- if (_element == null) return this._element;
- this._element = _element;
+ var isMatrix = isMatrixLike(transforms);
+ affine = transforms.affine != null ? transforms.affine : affine != null ? affine : !isMatrix; // Create a morepher and set its type
- _element._prepareRunner();
+ var morpher = new Morphable().type(affine ? TransformBag : Matrix).stepper(this._stepper);
+ var origin;
+ var element;
+ var current;
+ var currentAngle;
+ var startTransform;
- return this;
- }
- }, {
- key: "timeline",
- value: function timeline$$1(_timeline) {
- // check explicitly for undefined so we can set the timeline to null
- if (typeof _timeline === 'undefined') return this._timeline;
- this._timeline = _timeline;
- return this;
- }
- }, {
- key: "animate",
- value: function animate(duration, delay, when) {
- var o = Runner.sanitise(duration, delay, when);
- var runner = new Runner(o.duration);
- if (this._timeline) runner.timeline(this._timeline);
- if (this._element) runner.element(this._element);
- return runner.loop(o).schedule(delay, when);
- }
- }, {
- key: "schedule",
- value: function schedule(timeline$$1, delay, when) {
- // The user doesn't need to pass a timeline if we already have one
- if (!(timeline$$1 instanceof Timeline)) {
- when = delay;
- delay = timeline$$1;
- timeline$$1 = this.timeline();
- } // If there is no timeline, yell at the user...
+ function setup() {
+ // make sure element and origin is defined
+ element = element || this.element();
+ origin = origin || getOrigin(transforms, element);
+ startTransform = new Matrix(relative ? undefined : element); // add the runner to the element so it can merge transformations
+ element.addRunner(this); // Deactivate all transforms that have run so far if we are absolute
- if (!timeline$$1) {
- throw Error('Runner cannot be scheduled without timeline');
- } // Schedule the runner on the timeline provided
+ if (!relative) {
+ element._clearTransformRunnersBefore(this);
+ }
+ }
+ function run(pos) {
+ // clear all other transforms before this in case something is saved
+ // on this runner. We are absolute. We dont need these!
+ if (!relative) this.clearTransform();
- timeline$$1.schedule(this, delay, when);
- return this;
- }
- }, {
- key: "unschedule",
- value: function unschedule() {
- var timeline$$1 = this.timeline();
- timeline$$1 && timeline$$1.unschedule(this);
- return this;
- }
- }, {
- key: "loop",
- value: function loop(times, swing, wait) {
- // Deal with the user passing in an object
- if (_typeof(times) === 'object') {
- swing = times.swing;
- wait = times.wait;
- times = times.times;
- } // Sanitise the values and store them
+ var _transform = new Point(origin).transform(element._currentTransform(this)),
+ x = _transform.x,
+ y = _transform.y;
+ var target = new Matrix(_objectSpread({}, transforms, {
+ origin: [x, y]
+ }));
+ var start = this._isDeclarative && current ? current : startTransform;
- this._times = times || Infinity;
- this._swing = swing || false;
- this._wait = wait || 0;
- return this;
- }
- }, {
- key: "delay",
- value: function delay(_delay) {
- return this.animate(0, _delay);
- }
- /*\r
- Basic Functionality\r
- ===================\r
- These methods allow us to attach basic functions to the runner directly\r
- */
+ if (affine) {
+ target = target.decompose(x, y);
+ start = start.decompose(x, y); // Get the current and target angle as it was set
- }, {
- key: "queue",
- value: function queue(initFn, runFn, isTransform) {
- this._queue.push({
- initialiser: initFn || noop,
- runner: runFn || noop,
- isTransform: isTransform,
- initialised: false,
- finished: false
- });
+ var rTarget = target.rotate;
+ var rCurrent = start.rotate; // Figure out the shortest path to rotate directly
- var timeline$$1 = this.timeline();
- timeline$$1 && this.timeline()._continue();
- return this;
- }
- }, {
- key: "during",
- value: function during(fn) {
- return this.queue(null, fn);
- }
- }, {
- key: "after",
- value: function after(fn) {
- return this.on('finish', fn);
- }
- /*\r
- Runner animation methods\r
- ========================\r
- Control how the animation plays\r
- */
+ var possibilities = [rTarget - 360, rTarget, rTarget + 360];
+ var distances = possibilities.map(function (a) {
+ return Math.abs(a - rCurrent);
+ });
+ var shortest = Math.min.apply(Math, _toConsumableArray(distances));
+ var index = distances.indexOf(shortest);
+ target.rotate = possibilities[index];
+ }
- }, {
- key: "time",
- value: function time(_time) {
- if (_time == null) {
- return this._time;
+ if (relative) {
+ // we have to be careful here not to overwrite the rotation
+ // with the rotate method of Matrix
+ if (!isMatrix) {
+ target.rotate = transforms.rotate || 0;
+ }
+
+ if (this._isDeclarative && currentAngle) {
+ start.rotate = currentAngle;
+ }
}
- var dt = _time - this._time;
- this.step(dt);
- return this;
- }
- }, {
- key: "duration",
- value: function duration() {
- return this._times * (this._wait + this._duration) - this._wait;
+ morpher.from(start);
+ morpher.to(target);
+ var affineParameters = morpher.at(pos);
+ currentAngle = affineParameters.rotate;
+ current = new Matrix(affineParameters);
+ this.addTransform(current);
+ return morpher.done();
}
- }, {
- key: "loops",
- value: function loops(p) {
- var loopDuration = this._duration + this._wait;
- if (p == null) {
- var loopsDone = Math.floor(this._time / loopDuration);
- var relativeTime = this._time - loopsDone * loopDuration;
- var position = relativeTime / this._duration;
- return Math.min(loopsDone + position, this._times);
- }
+ function retarget(newTransforms) {
+ // only get a new origin if it changed since the last call
+ if ((newTransforms.origin || 'center').toString() !== (transforms.origin || 'center').toString()) {
+ origin = getOrigin(transforms, element);
+ } // overwrite the old transformations with the new ones
- var whole = Math.floor(p);
- var partial = p % 1;
- var time = loopDuration * whole + this._duration * partial;
- return this.time(time);
+
+ transforms = _objectSpread({}, newTransforms, {
+ origin: origin
+ });
}
- }, {
- key: "position",
- value: function position(p) {
- // Get all of the variables we need
- var x = this._time;
- var d = this._duration;
- var w = this._wait;
- var t = this._times;
- var s = this._swing;
- var r = this._reverse;
- var position;
- if (p == null) {
- /*\r
- This function converts a time to a position in the range [0, 1]\r
- The full explanation can be found in this desmos demonstration\r
- https://www.desmos.com/calculator/u4fbavgche\r
- The logic is slightly simplified here because we can use booleans\r
- */
- // Figure out the value without thinking about the start or end time
- var f = function f(x) {
- var swinging = s * Math.floor(x % (2 * (w + d)) / (w + d));
- var backwards = swinging && !r || !swinging && r;
- var uncliped = Math.pow(-1, backwards) * (x % (w + d)) / d + backwards;
- var clipped = Math.max(Math.min(uncliped, 1), 0);
- return clipped;
- }; // Figure out the value by incorporating the start time
+ this.queue(setup, run, retarget);
+ this._isDeclarative && this._rememberMorpher('transform', morpher);
+ return this;
+ },
+ // Animatable x-axis
+ x: function x(_x, relative) {
+ return this._queueNumber('x', _x);
+ },
+ // Animatable y-axis
+ y: function y(_y) {
+ return this._queueNumber('y', _y);
+ },
+ dx: function dx(x) {
+ return this._queueNumberDelta('dx', x);
+ },
+ dy: function dy(y) {
+ return this._queueNumberDelta('dy', y);
+ },
+ _queueNumberDelta: function _queueNumberDelta(method, to) {
+ to = new SVGNumber(to); // Try to change the target if we have this method already registerd
+ if (this._tryRetargetDelta(method, to)) return this; // Make a morpher and queue the animation
- var endTime = t * (w + d) - w;
- position = x <= 0 ? Math.round(f(1e-5)) : x < endTime ? f(x) : Math.round(f(endTime - 1e-5));
- return position;
- } // Work out the loops done and add the position to the loops done
+ var morpher = new Morphable(this._stepper).to(to);
+ this.queue(function () {
+ var from = this.element()[method]();
+ morpher.from(from);
+ morpher.to(from + to);
+ }, function (pos) {
+ this.element()[method](morpher.at(pos));
+ return morpher.done();
+ }); // Register the morpher so that if it is changed again, we can retarget it
+ this._rememberMorpher(method, morpher);
- var loopsDone = Math.floor(this.loops());
- var swingForward = s && loopsDone % 2 === 0;
- var forwards = swingForward && !r || r && swingForward;
- position = loopsDone + (forwards ? p : 1 - p);
- return this.loops(position);
- }
- }, {
- key: "progress",
- value: function progress(p) {
- if (p == null) {
- return Math.min(1, this._time / this.duration());
- }
+ return this;
+ },
+ _queueObject: function _queueObject(method, to) {
+ // Try to change the target if we have this method already registerd
+ if (this._tryRetarget(method, to)) return this; // Make a morpher and queue the animation
- return this.time(p * this.duration());
- }
- }, {
- key: "step",
- value: function step(dt) {
- // If we are inactive, this stepper just gets skipped
- if (!this.enabled) return this; // Update the time and get the new position
+ var morpher = new Morphable(this._stepper).to(to);
+ this.queue(function () {
+ morpher.from(this.element()[method]());
+ }, function (pos) {
+ this.element()[method](morpher.at(pos));
+ return morpher.done();
+ }); // Register the morpher so that if it is changed again, we can retarget it
- dt = dt == null ? 16 : dt;
- this._time += dt;
- var position = this.position(); // Figure out if we need to run the stepper in this frame
+ this._rememberMorpher(method, morpher);
- var running = this._lastPosition !== position && this._time >= 0;
- this._lastPosition = position; // Figure out if we just started
+ return this;
+ },
+ _queueNumber: function _queueNumber(method, value) {
+ return this._queueObject(method, new SVGNumber(value));
+ },
+ // Animatable center x-axis
+ cx: function cx(x) {
+ return this._queueNumber('cx', x);
+ },
+ // Animatable center y-axis
+ cy: function cy(y) {
+ return this._queueNumber('cy', y);
+ },
+ // Add animatable move
+ move: function move(x, y) {
+ return this.x(x).y(y);
+ },
+ // Add animatable center
+ center: function center(x, y) {
+ return this.cx(x).cy(y);
+ },
+ // Add animatable size
+ size: function size(width, height) {
+ // animate bbox based size for all other elements
+ var box;
- var duration = this.duration();
- var justStarted = this._lastTime < 0 && this._time > 0;
- var justFinished = this._lastTime < this._time && this.time > duration;
- this._lastTime = this._time;
+ if (!width || !height) {
+ box = this._element.bbox();
+ }
- if (justStarted) {
- this.fire('start', this);
- } // Work out if the runner is finished set the done flag here so animations
- // know, that they are running in the last step (this is good for
- // transformations which can be merged)
+ if (!width) {
+ width = box.width / box.height * height;
+ }
+ if (!height) {
+ height = box.height / box.width * width;
+ }
- var declarative = this._isDeclarative;
- this.done = !declarative && !justFinished && this._time >= duration; // Call initialise and the run function
+ return this.width(width).height(height);
+ },
+ // Add animatable width
+ width: function width(_width) {
+ return this._queueNumber('width', _width);
+ },
+ // Add animatable height
+ height: function height(_height) {
+ return this._queueNumber('height', _height);
+ },
+ // Add animatable plot
+ plot: function plot(a, b, c, d) {
+ // Lines can be plotted with 4 arguments
+ if (arguments.length === 4) {
+ return this.plot([a, b, c, d]);
+ } // FIXME: this needs to be rewritten such that the element is only accesed
+ // in the init function
- if (running || declarative) {
- this._initialise(running); // clear the transforms on this runner so they dont get added again and again
+ return this._queueObject('plot', new this._element.MorphArray(a));
+ /*\r
+ var morpher = this._element.morphArray().to(a)\r
+ this.queue(function () {\r
+ morpher.from(this._element.array())\r
+ }, function (pos) {\r
+ this._element.plot(morpher.at(pos))\r
+ })\r
+ return this\r
+ */
+ },
+ // Add leading method
+ leading: function leading(value) {
+ return this._queueNumber('leading', value);
+ },
+ // Add animatable viewbox
+ viewbox: function viewbox(x, y, width, height) {
+ return this._queueObject('viewbox', new Box(x, y, width, height));
+ },
+ update: function update(o) {
+ if (_typeof(o) !== 'object') {
+ return this.update({
+ offset: arguments[0],
+ color: arguments[1],
+ opacity: arguments[2]
+ });
+ }
- this.transforms = new Matrix();
+ if (o.opacity != null) this.attr('stop-opacity', o.opacity);
+ if (o.color != null) this.attr('stop-color', o.color);
+ if (o.offset != null) this.attr('offset', o.offset);
+ return this;
+ }
+ });
- var converged = this._run(declarative ? dt : position);
+ var _Symbol =
+ /*#__PURE__*/
+ function (_Container) {
+ _inherits(_Symbol, _Container);
- this.fire('step', this);
- } // correct the done flag here
- // declaritive animations itself know when they converged
+ // Initialize node
+ function _Symbol(node) {
+ _classCallCheck(this, _Symbol);
+ return _possibleConstructorReturn(this, _getPrototypeOf(_Symbol).call(this, nodeOrNew('symbol', node), _Symbol));
+ }
- this.done = this.done || converged && declarative;
+ return _Symbol;
+ }(Container);
+ registerMethods({
+ Container: {
+ symbol: function symbol() {
+ return this.put(new _Symbol());
+ }
+ }
+ });
+ register(_Symbol);
- if (this.done) {
- this.fire('finish', this);
- }
+ // Create plain text node
+ function plain(text) {
+ // clear if build mode is disabled
+ if (this._build === false) {
+ this.clear();
+ } // create text node
- return this;
- }
- }, {
- key: "finish",
- value: function finish() {
- return this.step(Infinity);
- }
- }, {
- key: "reverse",
- value: function reverse(_reverse) {
- this._reverse = _reverse == null ? !this._reverse : _reverse;
- return this;
- }
- }, {
- key: "ease",
- value: function ease(fn) {
- this._stepper = new Ease(fn);
- return this;
- }
- }, {
- key: "active",
- value: function active(enabled) {
- if (enabled == null) return this.enabled;
- this.enabled = enabled;
- return this;
- }
- /*\r
- Private Methods\r
- ===============\r
- Methods that shouldn't be used externally\r
- */
- // Save a morpher to the morpher list so that we can retarget it later
- }, {
- key: "_rememberMorpher",
- value: function _rememberMorpher(method, morpher) {
- this._history[method] = {
- morpher: morpher,
- caller: this._queue[this._queue.length - 1]
- };
- } // Try to set the target for a morpher if the morpher exists, otherwise
- // do nothing and return false
+ this.node.appendChild(document.createTextNode(text));
+ return this;
+ } // FIXME: Does this also work for textpath?
+ // Get length of text element
- }, {
- key: "_tryRetarget",
- value: function _tryRetarget(method, target) {
- if (this._history[method]) {
- // if the last method wasnt even initialised, throw it away
- if (!this._history[method].caller.initialised) {
- var index = this._queue.indexOf(this._history[method].caller);
+ function length() {
+ return this.node.getComputedTextLength();
+ }
- this._queue.splice(index, 1);
+ var textable = /*#__PURE__*/Object.freeze({
+ plain: plain,
+ length: length
+ });
- return false;
- } // for the case of transformations, we use the special retarget function
- // which has access to the outer scope
+ var Text =
+ /*#__PURE__*/
+ function (_Shape) {
+ _inherits(Text, _Shape);
+ // Initialize node
+ function Text(node) {
+ var _this;
- if (this._history[method].caller.isTransform) {
- this._history[method].caller.isTransform(target); // for everything else a simple morpher change is sufficient
+ _classCallCheck(this, Text);
- } else {
- this._history[method].morpher.to(target);
- }
+ _this = _possibleConstructorReturn(this, _getPrototypeOf(Text).call(this, nodeOrNew('text', node), Text));
+ _this.dom.leading = new SVGNumber(1.3); // store leading value for rebuilding
- this._history[method].caller.finished = false;
- var timeline$$1 = this.timeline();
- timeline$$1 && timeline$$1._continue();
- return true;
- }
+ _this._rebuild = true; // enable automatic updating of dy values
- return false;
- } // Run each initialise function in the runner if required
+ _this._build = false; // disable build mode for adding multiple lines
+ // set default font
- }, {
- key: "_initialise",
- value: function _initialise(running) {
- // If we aren't running, we shouldn't initialise when not declarative
- if (!running && !this._isDeclarative) return; // Loop through all of the initialisers
+ _this.attr('font-family', attrs['font-family']);
- for (var i = 0, len = this._queue.length; i < len; ++i) {
- // Get the current initialiser
- var current = this._queue[i]; // Determine whether we need to initialise
+ return _this;
+ } // Move over x-axis
- var needsIt = this._isDeclarative || !current.initialised && running;
- running = !current.finished; // Call the initialiser if we need to
- if (needsIt && running) {
- current.initialiser.call(this);
- current.initialised = true;
- }
+ _createClass(Text, [{
+ key: "x",
+ value: function x(_x) {
+ // act as getter
+ if (_x == null) {
+ return this.attr('x');
}
- } // Run each run function for the position or dt given
+
+ return this.attr('x', _x);
+ } // Move over y-axis
}, {
- key: "_run",
- value: function _run(positionOrDt) {
- // Run all of the _queue directly
- var allfinished = true;
+ key: "y",
+ value: function y(_y) {
+ var oy = this.attr('y');
+ var o = typeof oy === 'number' ? oy - this.bbox().y : 0; // act as getter
- for (var i = 0, len = this._queue.length; i < len; ++i) {
- // Get the current function to run
- var current = this._queue[i]; // Run the function if its not finished, we keep track of the finished
- // flag for the sake of declarative _queue
+ if (_y == null) {
+ return typeof oy === 'number' ? oy - o : oy;
+ }
- var converged = current.runner.call(this, positionOrDt);
- current.finished = current.finished || converged === true;
- allfinished = allfinished && current.finished;
- } // We report when all of the constructors are finished
+ return this.attr('y', typeof _y === 'number' ? _y + o : _y);
+ } // Move center over x-axis
+ }, {
+ key: "cx",
+ value: function cx(x) {
+ return x == null ? this.bbox().cx : this.x(x - this.bbox().width / 2);
+ } // Move center over y-axis
- return allfinished;
- }
}, {
- key: "addTransform",
- value: function addTransform(transform, index) {
- this.transforms.lmultiplyO(transform);
- return this;
- }
+ key: "cy",
+ value: function cy(y) {
+ return y == null ? this.bbox().cy : this.y(y - this.bbox().height / 2);
+ } // Set the text content
+
}, {
- key: "clearTransform",
- value: function clearTransform() {
- this.transforms = new Matrix();
- return this;
- }
- }], [{
- key: "sanitise",
- value: function sanitise(duration, delay, when) {
- // Initialise the default parameters
- var times = 1;
- var swing = false;
- var wait = 0;
- duration = duration || timeline.duration;
- delay = delay || timeline.delay;
- when = when || 'last'; // If we have an object, unpack the values
+ key: "text",
+ value: function text(_text) {
+ // act as getter
+ if (_text === undefined) {
+ // FIXME use children() or each()
+ var children = this.node.childNodes;
+ var firstLine = 0;
+ _text = '';
- if (_typeof(duration) === 'object' && !(duration instanceof Stepper)) {
- delay = duration.delay || delay;
- when = duration.when || when;
- swing = duration.swing || swing;
- times = duration.times || times;
- wait = duration.wait || wait;
- duration = duration.duration || timeline.duration;
- }
+ for (var i = 0, len = children.length; i < len; ++i) {
+ // skip textPaths - they are no lines
+ if (children[i].nodeName === 'textPath') {
+ if (i === 0) firstLine = 1;
+ continue;
+ } // add newline if its not the first child and newLined is set to true
- return {
- duration: duration,
- delay: delay,
- swing: swing,
- times: times,
- wait: wait,
- when: when
- };
- }
- }]);
- return Runner;
- }(EventTarget);
- Runner.id = 0;
+ if (i !== firstLine && children[i].nodeType !== 3 && adopt(children[i]).dom.newLined === true) {
+ _text += '\n';
+ } // add content of this node
- var FakeRunner = function FakeRunner() {
- var transforms = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : new Matrix();
- var id = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : -1;
- var done = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
- _classCallCheck(this, FakeRunner);
+ _text += children[i].textContent;
+ }
- this.transforms = transforms;
- this.id = id;
- this.done = done;
- };
+ return _text;
+ } // remove existing content
- extend([Runner, FakeRunner], {
- mergeWith: function mergeWith(runner) {
- return new FakeRunner(runner.transforms.lmultiply(this.transforms), runner.id);
- }
- }); // FakeRunner.emptyRunner = new FakeRunner()
- var lmultiply = function lmultiply(last, curr) {
- return last.lmultiplyO(curr);
- };
+ this.clear().build(true);
- var getRunnerTransform = function getRunnerTransform(runner) {
- return runner.transforms;
- };
+ if (typeof _text === 'function') {
+ // call block
+ _text.call(this, this);
+ } else {
+ // store text and make sure text is not blank
+ _text = _text.split('\n'); // build new lines
- function mergeTransforms() {
- // Find the matrix to apply to the element and apply it
- var runners = this._transformationRunners.runners;
- var netTransform = runners.map(getRunnerTransform).reduce(lmultiply, new Matrix());
- this.transform(netTransform);
+ for (var j = 0, jl = _text.length; j < jl; j++) {
+ this.tspan(_text[j]).newLine();
+ }
+ } // disable build mode and rebuild lines
- this._transformationRunners.merge();
- if (this._transformationRunners.length() === 1) {
- this._frameId = null;
- }
- }
+ return this.build(false).rebuild();
+ } // Set / get leading
- var RunnerArray =
- /*#__PURE__*/
- function () {
- function RunnerArray() {
- _classCallCheck(this, RunnerArray);
+ }, {
+ key: "leading",
+ value: function leading(value) {
+ // act as getter
+ if (value == null) {
+ return this.dom.leading;
+ } // act as setter
- this.runners = [];
- this.ids = [];
- }
- _createClass(RunnerArray, [{
- key: "add",
- value: function add(runner) {
- if (this.runners.includes(runner)) return;
- var id = runner.id + 1;
- var leftSibling = this.ids.reduce(function (last, curr) {
- if (curr > last && curr < id) return curr;
- return last;
- }, 0);
- var index = this.ids.indexOf(leftSibling) + 1;
- this.ids.splice(index, 0, id);
- this.runners.splice(index, 0, runner);
- return this;
- }
- }, {
- key: "getByID",
- value: function getByID(id) {
- return this.runners[this.ids.indexOf(id + 1)];
- }
- }, {
- key: "remove",
- value: function remove(id) {
- var index = this.ids.indexOf(id + 1);
- this.ids.splice(index, 1);
- this.runners.splice(index, 1);
- return this;
- }
+ this.dom.leading = new SVGNumber(value);
+ return this.rebuild();
+ } // Rebuild appearance type
+
}, {
- key: "merge",
- value: function merge() {
- var _this2 = this;
+ key: "rebuild",
+ value: function rebuild(_rebuild) {
+ // store new rebuild flag if given
+ if (typeof _rebuild === 'boolean') {
+ this._rebuild = _rebuild;
+ } // define position of all lines
- var lastRunner = null;
- this.runners.forEach(function (runner, i) {
- if (lastRunner && runner.done && lastRunner.done) {
- _this2.remove(runner.id);
- _this2.edit(lastRunner.id, runner.mergeWith(lastRunner));
- }
+ if (this._rebuild) {
+ var self = this;
+ var blankLineOffset = 0;
+ var dy = this.dom.leading * new SVGNumber(this.attr('font-size'));
+ this.each(function () {
+ if (this.dom.newLined) {
+ this.attr('x', self.attr('x'));
+
+ if (this.text() === '\n') {
+ blankLineOffset += dy;
+ } else {
+ this.attr('dy', dy + blankLineOffset);
+ blankLineOffset = 0;
+ }
+ }
+ });
+ this.fire('rebuild');
+ }
- lastRunner = runner;
- });
- return this;
- }
- }, {
- key: "edit",
- value: function edit(id, newRunner) {
- var index = this.ids.indexOf(id + 1);
- this.ids.splice(index, 1, id);
- this.runners.splice(index, 1, newRunner);
return this;
- }
+ } // Enable / disable build mode
+
}, {
- key: "length",
- value: function length() {
- return this.ids.length;
- }
+ key: "build",
+ value: function build(_build) {
+ this._build = !!_build;
+ return this;
+ } // overwrite method from parent to set data properly
+
}, {
- key: "clearBefore",
- value: function clearBefore(id) {
- var deleteCnt = this.ids.indexOf(id + 1) || 1;
- this.ids.splice(0, deleteCnt, 0);
- this.runners.splice(0, deleteCnt, new FakeRunner());
+ key: "setData",
+ value: function setData(o) {
+ this.dom = o;
+ this.dom.leading = new SVGNumber(o.leading || 1.3);
return this;
}
}]);
- return RunnerArray;
- }();
-
- var frameId = 0;
+ return Text;
+ }(Shape);
+ extend(Text, textable);
registerMethods({
- Element: {
- animate: function animate(duration, delay, when) {
- var o = Runner.sanitise(duration, delay, when);
- var timeline$$1 = this.timeline();
- return new Runner(o.duration).loop(o).element(this).timeline(timeline$$1).schedule(delay, when);
- },
- delay: function delay(by, when) {
- return this.animate(0, by, when);
- },
- // this function searches for all runners on the element and deletes the ones
- // which run before the current one. This is because absolute transformations
- // overwfrite anything anyway so there is no need to waste time computing
- // other runners
- _clearTransformRunnersBefore: function _clearTransformRunnersBefore(currentRunner) {
- this._transformationRunners.clearBefore(currentRunner.id);
- },
- _currentTransform: function _currentTransform(current) {
- return this._transformationRunners.runners // we need the equal sign here to make sure, that also transformations
- // on the same runner which execute before the current transformation are
- // taken into account
- .filter(function (runner) {
- return runner.id <= current.id;
- }).map(getRunnerTransform).reduce(lmultiply, new Matrix());
- },
- addRunner: function addRunner(runner) {
- this._transformationRunners.add(runner);
-
- Animator.transform_frame(mergeTransforms.bind(this), this._frameId);
+ Container: {
+ // Create text element
+ text: function text(_text2) {
+ return this.put(new Text()).text(_text2);
},
- _prepareRunner: function _prepareRunner() {
- if (this._frameId == null) {
- this._transformationRunners = new RunnerArray().add(new FakeRunner(new Matrix(this)));
- this._frameId = frameId++;
- }
+ // Create plain text element
+ plain: function plain$$1(text) {
+ return this.put(new Text()).plain(text);
}
}
});
- extend(Runner, {
- attr: function attr(a, v) {
- return this.styleAttr('attr', a, v);
- },
- // Add animatable styles
- css: function css(s, v) {
- return this.styleAttr('css', s, v);
- },
- styleAttr: function styleAttr(type, name, val) {
- // apply attributes individually
- if (_typeof(name) === 'object') {
- for (var key in val) {
- this.styleAttr(type, key, val[key]);
- }
- }
+ register(Text);
- var morpher = new Morphable(this._stepper).to(val);
- this.queue(function () {
- morpher = morpher.from(this.element()[type](name));
- }, function (pos) {
- this.element()[type](name, morpher.at(pos));
- return morpher.done();
- });
- return this;
- },
- zoom: function zoom(level, point) {
- var morpher = new Morphable(this._stepper).to(new SVGNumber(level));
- this.queue(function () {
- morpher = morpher.from(this.zoom());
- }, function (pos) {
- this.element().zoom(morpher.at(pos), point);
- return morpher.done();
- });
- return this;
- },
+ var TextPath =
+ /*#__PURE__*/
+ function (_Text) {
+ _inherits(TextPath, _Text);
- /**\r
- ** absolute transformations\r
- **/
- //
- // M v -----|-----(D M v = F v)------|-----> T v
- //
- // 1. define the final state (T) and decompose it (once)
- // t = [tx, ty, the, lam, sy, sx]
- // 2. on every frame: pull the current state of all previous transforms
- // (M - m can change)
- // and then write this as m = [tx0, ty0, the0, lam0, sy0, sx0]
- // 3. Find the interpolated matrix F(pos) = m + pos * (t - m)
- // - Note F(0) = M
- // - Note F(1) = T
- // 4. Now you get the delta matrix as a result: D = F * inv(M)
- transform: function transform(transforms, relative, affine) {
- // If we have a declarative function, we should retarget it if possible
- relative = transforms.relative || relative;
+ // Initialize node
+ function TextPath(node) {
+ _classCallCheck(this, TextPath);
- if (this._isDeclarative && !relative && this._tryRetarget('transform', transforms)) {
- return this;
- } // Parse the parameters
+ return _possibleConstructorReturn(this, _getPrototypeOf(TextPath).call(this, nodeOrNew('textPath', node), TextPath));
+ } // return the array of the path track element
- var isMatrix = isMatrixLike(transforms);
- affine = transforms.affine != null ? transforms.affine : affine != null ? affine : !isMatrix; // Create a morepher and set its type
+ _createClass(TextPath, [{
+ key: "array",
+ value: function array() {
+ var track = this.track();
+ return track ? track.array() : null;
+ } // Plot path if any
- var morpher = new Morphable().type(affine ? TransformBag : Matrix).stepper(this._stepper);
- var origin;
- var element;
- var current;
- var currentAngle;
- var startTransform;
+ }, {
+ key: "plot",
+ value: function plot(d) {
+ var track = this.track();
+ var pathArray = null;
- function setup() {
- // make sure element and origin is defined
- element = element || this.element();
- origin = origin || getOrigin(transforms, element);
- startTransform = new Matrix(relative ? undefined : element); // add the runner to the element so it can merge transformations
+ if (track) {
+ pathArray = track.plot(d);
+ }
- element.addRunner(this); // Deactivate all transforms that have run so far if we are absolute
+ return d == null ? pathArray : this;
+ } // Get the path element
- if (!relative) {
- element._clearTransformRunnersBefore(this);
- }
+ }, {
+ key: "track",
+ value: function track() {
+ return this.reference('href');
}
+ }]);
- function run(pos) {
- // clear all other transforms before this in case something is saved
- // on this runner. We are absolute. We dont need these!
- if (!relative) this.clearTransform();
+ return TextPath;
+ }(Text);
+ registerMethods({
+ Container: {
+ textPath: function textPath(text, path) {
+ return this.defs().path(path).text(text).addTo(this);
+ }
+ },
+ Text: {
+ // Create path for text to run on
+ path: function path(track) {
+ var path = new TextPath(); // if d is a path, reuse it
- var _transform = new Point(origin).transform(element._currentTransform(this)),
- x = _transform.x,
- y = _transform.y;
+ if (!(track instanceof Path)) {
+ // create path element
+ track = this.doc().defs().path(track);
+ } // link textPath to path and add content
- var target = new Matrix(_objectSpread({}, transforms, {
- origin: [x, y]
- }));
- var start = this._isDeclarative && current ? current : startTransform;
- if (affine) {
- target = target.decompose(x, y);
- start = start.decompose(x, y); // Get the current and target angle as it was set
+ path.attr('href', '#' + track, xlink); // add textPath element as child node and return textPath
- var rTarget = target.rotate;
- var rCurrent = start.rotate; // Figure out the shortest path to rotate directly
+ return this.put(path);
+ },
+ // FIXME: make this plural?
+ // Get the textPath children
+ textPath: function textPath() {
+ return this.find('textPath');
+ }
+ },
+ Path: {
+ // creates a textPath from this path
+ text: function text(_text) {
+ if (_text instanceof Text) {
+ var txt = _text.text();
- var possibilities = [rTarget - 360, rTarget, rTarget + 360];
- var distances = possibilities.map(function (a) {
- return Math.abs(a - rCurrent);
- });
- var shortest = Math.min.apply(Math, _toConsumableArray(distances));
- var index = distances.indexOf(shortest);
- target.rotate = possibilities[index];
+ return _text.clear().path(this).text(txt);
}
- if (relative) {
- // we have to be careful here not to overwrite the rotation
- // with the rotate method of Matrix
- if (!isMatrix) {
- target.rotate = transforms.rotate || 0;
- }
+ return this.parent().put(new Text()).path(this).text(_text);
+ } // FIXME: Maybe add `targets` to get all textPaths associated with this path
- if (this._isDeclarative && currentAngle) {
- start.rotate = currentAngle;
- }
- }
+ }
+ });
+ TextPath.prototype.MorphArray = PathArray;
+ register(TextPath);
- morpher.from(start);
- morpher.to(target);
- var affineParameters = morpher.at(pos);
- currentAngle = affineParameters.rotate;
- current = new Matrix(affineParameters);
- this.addTransform(current);
- return morpher.done();
- }
+ var Tspan =
+ /*#__PURE__*/
+ function (_Text) {
+ _inherits(Tspan, _Text);
+
+ // Initialize node
+ function Tspan(node) {
+ _classCallCheck(this, Tspan);
- function retarget(newTransforms) {
- // only get a new origin if it changed since the last call
- if ((newTransforms.origin || 'center').toString() !== (transforms.origin || 'center').toString()) {
- origin = getOrigin(transforms, element);
- } // overwrite the old transformations with the new ones
+ return _possibleConstructorReturn(this, _getPrototypeOf(Tspan).call(this, nodeOrNew('tspan', node), Tspan));
+ } // Set text content
- transforms = _objectSpread({}, newTransforms, {
- origin: origin
- });
- }
+ _createClass(Tspan, [{
+ key: "text",
+ value: function text(_text) {
+ if (_text == null) return this.node.textContent + (this.dom.newLined ? '\n' : '');
+ typeof _text === 'function' ? _text.call(this, this) : this.plain(_text);
+ return this;
+ } // Shortcut dx
- this.queue(setup, run, retarget);
- this._isDeclarative && this._rememberMorpher('transform', morpher);
- return this;
- },
- // Animatable x-axis
- x: function x(_x, relative) {
- return this._queueNumber('x', _x);
- },
- // Animatable y-axis
- y: function y(_y) {
- return this._queueNumber('y', _y);
- },
- dx: function dx(x) {
- return this._queueNumberDelta('dx', x);
- },
- dy: function dy(y) {
- return this._queueNumberDelta('dy', y);
- },
- _queueNumberDelta: function _queueNumberDelta(method, to) {
- to = new SVGNumber(to); // Try to change the target if we have this method already registerd
+ }, {
+ key: "dx",
+ value: function dx(_dx) {
+ return this.attr('dx', _dx);
+ } // Shortcut dy
- if (this._tryRetargetDelta(method, to)) return this; // Make a morpher and queue the animation
+ }, {
+ key: "dy",
+ value: function dy(_dy) {
+ return this.attr('dy', _dy);
+ } // Create new line
- var morpher = new Morphable(this._stepper).to(to);
- this.queue(function () {
- var from = this.element()[method]();
- morpher.from(from);
- morpher.to(from + to);
- }, function (pos) {
- this.element()[method](morpher.at(pos));
- return morpher.done();
- }); // Register the morpher so that if it is changed again, we can retarget it
+ }, {
+ key: "newLine",
+ value: function newLine() {
+ // fetch text parent
+ var t = this.parent(Text); // mark new line
- this._rememberMorpher(method, morpher);
+ this.dom.newLined = true; // apply new position
- return this;
- },
- _queueObject: function _queueObject(method, to) {
- // Try to change the target if we have this method already registerd
- if (this._tryRetarget(method, to)) return this; // Make a morpher and queue the animation
+ return this.dy(t.dom.leading * t.attr('font-size')).attr('x', t.x());
+ }
+ }]);
- var morpher = new Morphable(this._stepper).to(to);
- this.queue(function () {
- morpher.from(this.element()[method]());
- }, function (pos) {
- this.element()[method](morpher.at(pos));
- return morpher.done();
- }); // Register the morpher so that if it is changed again, we can retarget it
+ return Tspan;
+ }(Text);
+ extend(Tspan, textable);
+ registerMethods({
+ Tspan: {
+ tspan: function tspan(text) {
+ var tspan = new Tspan(); // clear if build mode is disabled
- this._rememberMorpher(method, morpher);
+ if (!this._build) {
+ this.clear();
+ } // add new tspan
- return this;
- },
- _queueNumber: function _queueNumber(method, value) {
- return this._queueObject(method, new SVGNumber(value));
- },
- // Animatable center x-axis
- cx: function cx(x) {
- return this._queueNumber('cx', x);
- },
- // Animatable center y-axis
- cy: function cy(y) {
- return this._queueNumber('cy', y);
- },
- // Add animatable move
- move: function move(x, y) {
- return this.x(x).y(y);
- },
- // Add animatable center
- center: function center(x, y) {
- return this.cx(x).cy(y);
- },
- // Add animatable size
- size: function size(width, height) {
- // animate bbox based size for all other elements
- var box;
- if (!width || !height) {
- box = this._element.bbox();
+ this.node.appendChild(tspan.node);
+ return tspan.text(text);
}
+ }
+ });
+ register(Tspan);
- if (!width) {
- width = box.width / box.height * height;
- }
+ var Use =
+ /*#__PURE__*/
+ function (_Shape) {
+ _inherits(Use, _Shape);
- if (!height) {
- height = box.height / box.width * width;
- }
+ function Use(node) {
+ _classCallCheck(this, Use);
- return this.width(width).height(height);
- },
- // Add animatable width
- width: function width(_width) {
- return this._queueNumber('width', _width);
- },
- // Add animatable height
- height: function height(_height) {
- return this._queueNumber('height', _height);
- },
- // Add animatable plot
- plot: function plot(a, b, c, d) {
- // Lines can be plotted with 4 arguments
- if (arguments.length === 4) {
- return this.plot([a, b, c, d]);
- } // FIXME: this needs to be rewritten such that the element is only accesed
- // in the init function
+ return _possibleConstructorReturn(this, _getPrototypeOf(Use).call(this, nodeOrNew('use', node), Use));
+ } // Use element as a reference
- return this._queueObject('plot', new this._element.MorphArray(a));
- /*\r
- var morpher = this._element.morphArray().to(a)\r
- this.queue(function () {\r
- morpher.from(this._element.array())\r
- }, function (pos) {\r
- this._element.plot(morpher.at(pos))\r
- })\r
- return this\r
- */
- },
- // Add leading method
- leading: function leading(value) {
- return this._queueNumber('leading', value);
- },
- // Add animatable viewbox
- viewbox: function viewbox(x, y, width, height) {
- return this._queueObject('viewbox', new Box(x, y, width, height));
- },
- update: function update(o) {
- if (_typeof(o) !== 'object') {
- return this.update({
- offset: arguments[0],
- color: arguments[1],
- opacity: arguments[2]
- });
+ _createClass(Use, [{
+ key: "element",
+ value: function element(_element, file) {
+ // Set lined element
+ return this.attr('href', (file || '') + '#' + _element, xlink);
}
+ }]);
- if (o.opacity != null) this.attr('stop-opacity', o.opacity);
- if (o.color != null) this.attr('stop-color', o.color);
- if (o.offset != null) this.attr('offset', o.offset);
- return this;
+ return Use;
+ }(Shape);
+ registerMethods({
+ Container: {
+ // Create a use element
+ use: function use(element, file) {
+ return this.put(new Use()).element(element, file);
+ }
}
});
+ register(Use);
+
- // export {default as SVGArray} from './SVGArray.js'
- // export {default as Bare} from './Bare.js'
- // export {default as Box} from './Box.js'
- // export {default as Circle} from './Circle.js'
- // export {default as ClipPath} from './ClipPath.js'
- // export {default as Color} from './Color.js'
- // export {default as Container} from './Container.js'
- // export {Controller, Ease, PID, Spring} from './Controller.js'
- // export {default as Defs} from './Defs.js'
- // export {default as Doc} from './Doc.js'
- // export {default as Element} from './Element.js'
- // export {default as Ellipse} from './Ellipse.js'
- // export {default as EventTarget} from './EventTarget.js'
- // export {default as Gradient} from './Gradient.js'
- // export {default as G} from './G.js'
- // export {default as HtmlNode} from './HtmlNode.js'
- // export {default as A} from './A.js'
- // export {default as Image} from './Image.js'
- // export {default as Line} from './Line.js'
- // export {default as Marker} from './Marker.js'
- // export {default as Mask} from './Mask.js'
- // export {default as Matrix} from './Matrix.js'
- // export {default as Morphable} from './Morphable.js'
- // export {default as SVGNumber} from './SVGNumber.js'
- // export {default as Path} from './Path.js'
- // export {default as PathArray} from './PathArray.js'
- // export {default as Pattern} from './Pattern.js'
- // export {default as Point} from './Point.js'
- // export {default as PointArray} from './PointArray.js'
- // export {default as Polygon} from './Polygon.js'
- // export {default as Polyline} from './Polyline.js'
- // export {default as Queue} from './Queue.js'
- // export {default as Rect} from './Rect.js'
- // export {default as Runner} from './Runner.js'
- // export {default as Shape} from './Shape.js'
- // export {default as Stop} from './Stop.js'
- // export {default as Symbol} from './Symbol.js'
- // export {default as Text} from './Text.js'
- // export {default as TextPath} from './TextPath.js'
- // export {default as Timeline} from './Timeline.js'
- // export {default as Use} from './Use.js'
var Classes = /*#__PURE__*/Object.freeze({
- EventTarget: EventTarget,
- Dom: Dom,
- Element: Element,
- Shape: Shape,
- Container: Container,
- HtmlNode: HtmlNode,
- Doc: Doc$1,
- Defs: Defs,
- G: G,
Animator: Animator,
+ SVGArray: SVGArray,
Bare: Bare,
+ Box: Box,
Circle: Circle,
ClipPath: ClipPath,
- A: A,
+ Color: Color,
+ Container: Container,
+ Controller: Controller,
+ Ease: Ease,
+ PID: PID,
+ Spring: Spring,
+ Defs: Defs,
+ Doc: Doc$1,
+ Dom: Dom,
+ Element: Element,
Ellipse: Ellipse,
- Stop: Stop,
+ EventTarget: EventTarget,
Gradient: Gradient,
+ G: G,
+ HtmlNode: HtmlNode,
+ A: A,
Image: Image,
Line: Line,
Marker: Marker,
Mask: Mask,
+ Matrix: Matrix,
+ Morphable: Morphable,
+ SVGNumber: SVGNumber,
Path: Path,
+ PathArray: PathArray,
Pattern: Pattern,
+ Point: Point,
+ PointArray: PointArray,
Polygon: Polygon,
Polyline: Polyline,
+ Queue: Queue,
Rect: Rect,
+ Runner: Runner,
+ Shape: Shape,
+ Stop: Stop,
Symbol: _Symbol,
Text: Text,
TextPath: TextPath,
- Tspan: Tspan,
- Use: Use,
- SVGNumber: SVGNumber,
- SVGArray: SVGArray,
- PathArray: PathArray,
- PointArray: PointArray,
- Matrix: Matrix,
- Point: Point,
- Box: Box,
- Color: Color,
- Morphable: Morphable,
- Queue: Queue,
- Runner: Runner,
Timeline: Timeline,
- Controller: Controller,
- Ease: Ease,
- PID: PID,
- Spring: Spring
+ Tspan: Tspan,
+ Use: Use
});
// ### This module adds backward / forward functionality to elements.
transform: transform
});
- //
- // export function setup (node) {
- // this._memory = {}
- // }
// Remember arbitrary data
function remember(k, v) {
remember: remember,
forget: forget,
memory: memory
- }); // registerConstructor('Memory', setup)
+ });
var sugar = {
stroke: ['color', 'width', 'opacity', 'linecap', 'linejoin', 'miterlimit', 'dasharray', 'dashoffset'],
-var SVG=function(){"use strict";function l(t){return(l="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function o(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function i(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function a(t,e,n){return e&&i(t.prototype,e),n&&i(t,n),t}function _(r){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{},e=Object.keys(s);"function"==typeof Object.getOwnPropertySymbols&&(e=e.concat(Object.getOwnPropertySymbols(s).filter(function(t){return Object.getOwnPropertyDescriptor(s,t).enumerable}))),e.forEach(function(t){var e,n,i;e=r,i=s[n=t],n in e?Object.defineProperty(e,n,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[n]=i})}return r}function r(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&n(t,e)}function u(t){return(u=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function n(t,e){return(n=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}function s(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function h(t,e){return!e||"object"!=typeof e&&"function"!=typeof e?s(t):e}function c(t,e,n){return(c="undefined"!=typeof Reflect&&Reflect.get?Reflect.get:function(t,e,n){var i=function(t,e){for(;!Object.prototype.hasOwnProperty.call(t,e)&&null!==(t=u(t)););return t}(t,e);if(i){var r=Object.getOwnPropertyDescriptor(i,e);return r.get?r.get.call(n):r.value}})(t,e,n||t)}function f(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var n=[],i=!0,r=!1,s=void 0;try{for(var u,o=t[Symbol.iterator]();!(i=(u=o.next()).done)&&(n.push(u.value),!e||n.length!==e);i=!0);}catch(t){r=!0,s=t}finally{try{i||null==o.return||o.return()}finally{if(r)throw s}}return n}(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}function O(t){return function(t){if(Array.isArray(t)){for(var e=0,n=new Array(t.length);e<t.length;e++)n[e]=t[e];return n}}(t)||function(t){if(Symbol.iterator in Object(t)||"[object Arguments]"===Object.prototype.toString.call(t))return Array.from(t)}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}var d=function t(){o(this,t)},v=/^([+-]?(\d+(\.\d*)?|\.\d+)(e[+-]?\d+)?)([a-z%]*)$/i,y=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i,p=/rgb\((\d+),(\d+),(\d+)\)/,m=/(#[a-z0-9\-_]+)/i,t=/\)\s*,?\s*/,g=/\s/g,w=/^#[a-f0-9]{3,6}$/i,k=/^rgb\(/,b=/^(\s+)?$/,x=/^[+-]?(\d+(\.\d*)?|\.\d+)(e[+-]?\d+)?$/i,A=/\.(jpg|jpeg|png|gif|svg)(\?[^=]+.*)?/i,C=/[\s,]+/,j=/([^e])-/gi,M=/[MLHVCSQTAZ]/gi,S=/[MLHVCSQTAZ]/i,T=/((\d?\.\d+(?:e[+-]?\d+)?)((?:\.\d+(?:e[+-]?\d+)?)+))+/gi,E=/\./g,e=Object.freeze({numberAndUnit:v,hex:y,rgb:p,reference:m,transforms:t,whitespace:g,isHex:w,isRgb:k,isCss:/[^:]+:[^;]+;?/,isBlank:b,isNumber:x,isPercent:/^-?[\d.]+%$/,isImage:A,delimiter:C,hyphen:j,pathLetters:M,isPathLetter:S,numbersWithDots:T,dots:E});function N(t,e,n,i){return n+i.replace(E," .")}function D(t){return t.toLowerCase().replace(/-(.)/g,function(t,e){return e.toUpperCase()})}function P(t){return t.charAt(0).toUpperCase()+t.slice(1)}function z(t){var e=t.toString(16);return 1===e.length?"0"+e:e}function R(t,e,n){if(null==e||null==n){var i=t.bbox();null==e?e=i.width/i.height*n:null==n&&(n=i.height/i.width*e)}return{width:e,height:n}}function q(t){return{a:t[0],b:t[1],c:t[2],d:t[3],e:t[4],f:t[5]}}var L="abcdef".split("");function F(t,e,n){return Math.abs(e-t)<(n||1e-6)}function I(t){return null!=t.a||null!=t.b||null!=t.c||null!=t.d||null!=t.e||null!=t.f}function X(t,e){var n,i,r=t.origin;if("string"==typeof r||null==r){var s=(r||"center").toLowerCase().trim(),u=e.bbox(),o=u.height,a=u.width,h=u.x,l=u.y,c=s.includes("left")?h:s.includes("right")?h+a:h+a/2,f=s.includes("top")?l:s.includes("bottom")?l+o:l+o/2;n=null!=t.ox?t.ox:c,i=null!=t.oy?t.oy:f}else n=r[0],i=r[1];return[n,i]}var Y="http://www.w3.org/2000/svg",H="http://www.w3.org/2000/xmlns/",G="http://www.w3.org/1999/xlink",V="http://svgjs.com/svgjs",B=Object.freeze({ns:Y,xmlns:H,xlink:G,svgjs:V});function Q(t,e){return e||U(t)}function U(t){return document.createElementNS(Y,t)}function $(t,e){var n,i;for(i=(t=Array.isArray(t)?t:[t]).length-1;0<=i;i--)for(n in e)t[i].prototype[n]=e[n]}var W=Object.freeze({nodeOrNew:Q,makeNode:U,extend:$,addFactory:function(t,e){$(t,e)},invent:function(e){var t="function"==typeof e.create?e.create:function(t){e.inherit.call(this,t||U(e.create))};return e.inherit&&(t.prototype=new e.inherit,t.prototype.constructor=t),e.extend&&$(t,e.extend),e.construct&&$(e.parent||nt("Container"),e.construct),t}}),J={},Z=Symbol("root");function K(t){if(t instanceof d)return t;if("object"===l(t))return tt(t);if(null==t)return new J[Z];if("string"==typeof t&&"<"!==t.charAt(0))return tt(document.querySelector(t));var e=U("svg");return e.innerHTML=t,t=tt(e.firstChild)}function tt(t){return t?t.instance instanceof d?t.instance:t instanceof window.SVGElement?"svg"===t.nodeName?new J[Z](t):"linearGradient"===t.nodeName||"radialGradient"===t.nodeName?new J.Gradient(t):J[P(t.nodeName)]?new(J[P(t.nodeName)])(t):new J.Bare(t):new J.HtmlNode(t):null}function et(t){var e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:t.name,n=2<arguments.length&&void 0!==arguments[2]&&arguments[2];return J[e]=t,n&&(J[Z]=t),t}function nt(t){return J[t]}var it=1e3;function rt(t){return"Svgjs"+P(t)+it++}function st(t){for(var e=t.children.length-1;0<=e;e--)st(t.children[e]);return t.id?tt(t).id(rt(t.nodeName)):tt(t)}var ut=Object.freeze({root:Z,makeInstance:K,adopt:tt,register:et,getClass:nt,eid:rt,assignNewId:st}),ot=0;function at(t){var e=K(t).getEventHolder();return e.events||(e.events={}),e.events}function ht(t){return K(t).getEventTarget()}function lt(t,e,i,n,r){var s=i.bind(n||t),u=at(t),o=ht(t);e=Array.isArray(e)?e:e.split(C),i._svgjsListenerId||(i._svgjsListenerId=++ot),e.forEach(function(t){var e=t.split(".")[0],n=t.split(".")[1]||"*";u[e]=u[e]||{},u[e][n]=u[e][n]||{},u[e][n][i._svgjsListenerId]=s,o.addEventListener(e,s,r||!1)})}function ct(u,t,o,a){var h=at(u),l=ht(u);("function"!=typeof o||(o=o._svgjsListenerId))&&(t=Array.isArray(t)?t:(t||"").split(C)).forEach(function(t){var e,n,i,r=t&&t.split(".")[0],s=t&&t.split(".")[1];if(o)h[r]&&h[r][s||"*"]&&(l.removeEventListener(r,h[r][s||"*"][o],a||!1),delete h[r][s||"*"][o]);else if(r&&s){if(h[r]&&h[r][s]){for(n in h[r][s])ct(l,[r,s].join("."),n);delete h[r][s]}}else if(s)for(t in h)for(e in h[t])s===e&&ct(l,[t,s].join("."));else if(r){if(h[r]){for(e in h[r])ct(l,[r,e].join("."));delete h[r]}}else{for(t in h)ct(l,t);(i=K(u).getEventHolder()).events&&(i.events={})}})}function ft(t,e,n){var i=ht(t);return e instanceof window.Event||(e=new window.CustomEvent(e,{detail:n,cancelable:!0})),i.dispatchEvent(e),e}var dt=Object.freeze({on:lt,off:ct,dispatch:ft}),vt=function(t){function i(){var t,e=(0<arguments.length&&void 0!==arguments[0]?arguments[0]:{}).events,n=void 0===e?{}:e;return o(this,i),(t=h(this,u(i).call(this))).events=n,t}return r(i,d),a(i,[{key:"addEventListener",value:function(){}},{key:"on",value:function(t,e,n,i){return lt(this,t,e,n,i),this}},{key:"off",value:function(t,e){return ct(this,t,e),this}},{key:"dispatch",value:function(t,e){return ft(this,t,e)}},{key:"dispatchEvent",value:function(t){var e=this.getEventHolder().events;if(!e)return!0;var n=e[t.type];for(var i in n)for(var r in n[i])n[i][r](t);return!t.defaultPrevented}},{key:"fire",value:function(t,e){return this.dispatch(t,e),this}},{key:"getEventHolder",value:function(){return this}},{key:"getEventTarget",value:function(){return this}},{key:"removeEventListener",value:function(){}}]),i}();function yt(t,e){var n,i=t.length,r=[];for(n=0;n<i;n++)r.push(e(t[n]));return r}function pt(t){return t%360*Math.PI/180}$(vt,["click","dblclick","mousedown","mouseup","mouseover","mouseout","mousemove","mouseenter","mouseleave","touchstart","touchmove","touchleave","touchend","touchcancel"].reduce(function(t,e){return t[e]=function(t){return null===t?ct(this,e):lt(this,e,t),this},t},{}));var mt=Object.freeze({map:yt,filter:function(t,e){var n,i=t.length,r=[];for(n=0;n<i;n++)e(t[n])&&r.push(t[n]);return r},radians:pt,degrees:function(t){return 180*t/Math.PI%360},filterSVGElements:function(t){return this.filter(t,function(t){return t instanceof window.SVGElement})}});function gt(){}var wt={duration:400,ease:">",delay:0},kt={"fill-opacity":1,"stroke-opacity":1,"stroke-width":0,"stroke-linejoin":"miter","stroke-linecap":"butt",fill:"#000000",stroke:"#000000",opacity:1,x:0,y:0,cx:0,cy:0,width:0,height:0,r:0,rx:0,ry:0,offset:0,"stop-opacity":1,"stop-color":"#000000","font-size":16,"font-family":"Helvetica, Arial, sans-serif","text-anchor":"start"},bt=Object.freeze({noop:gt,timeline:wt,attrs:kt}),xt=function(){function t(){o(this,t),this.init.apply(this,arguments)}return a(t,[{key:"init",value:function(t,e,n){var i,r;(this.r=0,this.g=0,this.b=0,t)&&("string"==typeof t?k.test(t)?(i=p.exec(t.replace(g,"")),this.r=parseInt(i[1]),this.g=parseInt(i[2]),this.b=parseInt(i[3])):w.test(t)&&(i=y.exec(4===(r=t).length?["#",r.substring(1,2),r.substring(1,2),r.substring(2,3),r.substring(2,3),r.substring(3,4),r.substring(3,4)].join(""):r),this.r=parseInt(i[1],16),this.g=parseInt(i[2],16),this.b=parseInt(i[3],16)):Array.isArray(t)?(this.r=t[0],this.g=t[1],this.b=t[2]):"object"===l(t)?(this.r=t.r,this.g=t.g,this.b=t.b):3===arguments.length&&(this.r=t,this.g=e,this.b=n))}},{key:"toString",value:function(){return this.toHex()}},{key:"toArray",value:function(){return[this.r,this.g,this.b]}},{key:"toHex",value:function(){return"#"+z(Math.round(this.r))+z(Math.round(this.g))+z(Math.round(this.b))}},{key:"toRgb",value:function(){return"rgb("+[this.r,this.g,this.b].join()+")"}},{key:"brightness",value:function(){return this.r/255*.3+this.g/255*.59+this.b/255*.11}}],[{key:"test",value:function(t){return t+="",w.test(t)||k.test(t)}},{key:"isRgb",value:function(t){return t&&"number"==typeof t.r&&"number"==typeof t.g&&"number"==typeof t.b}},{key:"isColor",value:function(t){return this.isRgb(t)||this.test(t)}}]),t}(),_t=function(){try{return Function("name","baseClass","_constructor",["baseClass = baseClass || Array","return {","[name]: class extends baseClass {","constructor (...args) {","super(...args)","_constructor && _constructor.apply(this, args)","}","}","}[name]"].join("\n"))}catch(t){return function(t){var e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:Array,n=2<arguments.length?arguments[2]:void 0,i=function(){e.apply(this,arguments),n&&n.apply(this,arguments)};return(i.prototype=Object.create(e.prototype)).constructor=i}}}(),Ot=_t("SVGArray",Array,function(){this.init.apply(this,arguments)});$(Ot,{init:function(){this.length=0,this.push.apply(this,O(this.parse.apply(this,arguments)))},toArray:function(){return Array.prototype.concat.apply([],this)},toString:function(){return this.join(" ")},valueOf:function(){var t=[];return t.push.apply(t,O(this)),t},parse:function(){var t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:[];return t instanceof Array?t:t.trim().split(C).map(parseFloat)},clone:function(){return new this.constructor(this)},toSet:function(){return new Set(this)}});var At=function(){function n(){o(this,n),this.init.apply(this,arguments)}return a(n,[{key:"init",value:function(t,e){e=Array.isArray(t)?t[1]:e,t=Array.isArray(t)?t[0]:t,this.value=0,this.unit=e||"","number"==typeof t?this.value=isNaN(t)?0:isFinite(t)?t:t<0?-34e37:34e37:"string"==typeof t?(e=t.match(v))&&(this.value=parseFloat(e[1]),"%"===e[5]?this.value/=100:"s"===e[5]&&(this.value*=1e3),this.unit=e[5]):t instanceof n&&(this.value=t.valueOf(),this.unit=t.unit)}},{key:"toString",value:function(){return("%"===this.unit?~~(1e8*this.value)/1e6:"s"===this.unit?this.value/1e3:this.value)+this.unit}},{key:"toJSON",value:function(){return this.toString()}},{key:"toArray",value:function(){return[this.value,this.unit]}},{key:"valueOf",value:function(){return this.value}},{key:"plus",value:function(t){return new n(this+(t=new n(t)),this.unit||t.unit)}},{key:"minus",value:function(t){return new n(this-(t=new n(t)),this.unit||t.unit)}},{key:"times",value:function(t){return new n(this*(t=new n(t)),this.unit||t.unit)}},{key:"divide",value:function(t){return new n(this/(t=new n(t)),this.unit||t.unit)}}]),n}();var Ct=function(t){function n(t){var e;return o(this,n),(e=h(this,u(n).call(this,t))).node=t,e.type=t.nodeName,e}return r(n,vt),a(n,[{key:"add",value:function(t,e){return t=K(t),null==e?this.node.appendChild(t.node):t.node!==this.node.childNodes[e]&&this.node.insertBefore(t.node,this.node.childNodes[e]),this}},{key:"addTo",value:function(t){return K(t).put(this)}},{key:"children",value:function(){return yt(this.node.children,function(t){return tt(t)})}},{key:"clear",value:function(){for(;this.node.hasChildNodes();)this.node.removeChild(this.node.lastChild);return delete this._defs,this}},{key:"clone",value:function(t){this.writeDataToDom();var e=st(this.node.cloneNode(!0));return t?t.add(e):this.after(e),e}},{key:"each",value:function(t,e){var n,i,r=this.children();for(n=0,i=r.length;n<i;n++)t.apply(r[n],[n,r]),e&&r[n].each(t,e);return this}},{key:"first",value:function(){return tt(this.node.firstChild)}},{key:"get",value:function(t){return tt(this.node.childNodes[t])}},{key:"getEventHolder",value:function(){return this.node}},{key:"getEventTarget",value:function(){return this.node}},{key:"has",value:function(t){return 0<=this.index(t)}},{key:"id",value:function(t){return void 0!==t||this.node.id||(this.node.id=rt(this.type)),this.attr("id",t)}},{key:"index",value:function(t){return[].slice.call(this.node.childNodes).indexOf(t.node)}},{key:"last",value:function(){return tt(this.node.lastChild)}},{key:"matches",value:function(t){return e=this.node,n=t,(e.matches||e.matchesSelector||e.msMatchesSelector||e.mozMatchesSelector||e.webkitMatchesSelector||e.oMatchesSelector).call(e,n);var e,n}},{key:"native",value:function(){return this.node}},{key:"parent",value:function(t){var e=this;if(!e.node.parentNode)return null;if(e=tt(e.node.parentNode),!t)return e;for(;e&&e.node instanceof window.SVGElement;){if("string"==typeof t?e.matches(t):e instanceof t)return e;e=tt(e.node.parentNode)}}},{key:"put",value:function(t,e){return this.add(t,e),t}},{key:"putIn",value:function(t){return K(t).add(this)}},{key:"remove",value:function(){return this.parent()&&this.parent().removeElement(this),this}},{key:"removeElement",value:function(t){return this.node.removeChild(t.node),this}},{key:"replace",value:function(t){return this.after(t).remove(),t}},{key:"toString",value:function(){return this.id()}},{key:"svg",value:function(t){var e,n;if(!t)return this.writeDataToDom(),this.node.outerHTML;for((e=document.createElementNS(Y,"svg")).innerHTML=t,n=e.children.length;n--;)this.node.appendChild(e.firstElementChild);return this}},{key:"writeDataToDom",value:function(){return this.each(function(){this.writeDataToDom()}),this}}]),n}();$(Ct,{attr:function(t,e,n){if(null==t){t={},e=this.node.attributes;var i=!0,r=!1,s=void 0;try{for(var u,o=e[Symbol.iterator]();!(i=(u=o.next()).done);i=!0){var a=u.value;t[a.nodeName]=x.test(a.nodeValue)?parseFloat(a.nodeValue):a.nodeValue}}catch(t){r=!0,s=t}finally{try{i||null==o.return||o.return()}finally{if(r)throw s}}return t}if(Array.isArray(t));else if("object"===l(t))for(e in t)this.attr(e,t[e]);else if(null===e)this.node.removeAttribute(t);else{if(null==e)return null==(e=this.node.getAttribute(t))?kt[t]:x.test(e)?parseFloat(e):e;for("fill"!==t&&"stroke"!==t||A.test(e)&&(e=this.doc().defs().image(e));"function"==typeof e.attrHook;)e=e.attrHook(this,t);"number"==typeof e?e=new At(e):xt.isColor(e)?e=new xt(e):e.constructor===Array&&(e=new Ot(e)),"leading"===t?this.leading&&this.leading(e):"string"==typeof n?this.node.setAttributeNS(n,t,e.toString()):this.node.setAttribute(t,e.toString()),!this.rebuild||"font-size"!==t&&"x"!==t||this.rebuild()}return this}});var jt=nt(Z),Mt=function(t){function n(t){var e;return o(this,n),(e=h(this,u(n).call(this,t))).dom={},e.node.instance=s(s(e)),t.hasAttribute("svgjs:data")&&e.setData(JSON.parse(t.getAttribute("svgjs:data"))||{}),e}return r(n,Ct),a(n,[{key:"center",value:function(t,e){return this.cx(t).cy(e)}},{key:"cx",value:function(t){return null==t?this.x()+this.width()/2:this.x(t-this.width()/2)}},{key:"cy",value:function(t){return null==t?this.y()+this.height()/2:this.y(t-this.height()/2)}},{key:"defs",value:function(){return this.doc().defs()}},{key:"doc",value:function(){var t=this.parent(jt);return t&&t.doc()}},{key:"getEventHolder",value:function(){return this}},{key:"height",value:function(t){return this.attr("height",t)}},{key:"inside",value:function(t,e){var n=this.bbox();return t>n.x&&e>n.y&&t<n.x+n.width&&e<n.y+n.height}},{key:"move",value:function(t,e){return this.x(t).y(e)}},{key:"parents",value:function(t){var e=[],n=this;do{if(!(n=n.parent(t))||n instanceof nt("HtmlNode"))break;e.push(n)}while(n.parent);return e}},{key:"reference",value:function(t){var e=function(t){var e=(t||"").toString().match(m);if(e)return e[1]}(this.attr(t));return e?K(e):null}},{key:"setData",value:function(t){return this.dom=t,this}},{key:"size",value:function(t,e){var n=R(this,t,e);return this.width(new At(n.width)).height(new At(n.height))}},{key:"width",value:function(t){return this.attr("width",t)}},{key:"writeDataToDom",value:function(){return this.node.removeAttribute("svgjs:data"),Object.keys(this.dom).length&&this.node.setAttribute("svgjs:data",JSON.stringify(this.dom)),c(u(n.prototype),"writeDataToDom",this).call(this)}},{key:"x",value:function(t){return this.attr("x",t)}},{key:"y",value:function(t){return this.attr("y",t)}}]),n}(),St=function(t){function e(){return o(this,e),h(this,u(e).apply(this,arguments))}return r(e,Mt),e}(),Tt=function(t){function e(){return o(this,e),h(this,u(e).apply(this,arguments))}return r(e,Mt),a(e,[{key:"flatten",value:function(t){return this.each(function(){return this instanceof e?this.flatten(t).ungroup(t):this.toParent(t)}),this.node.firstElementChild||this.remove(),this}},{key:"ungroup",value:function(t){return t=t||this.parent(),this.each(function(){return this.toParent(t)}),this.remove(),this}}]),e}(),Et=function(t){function e(t){return o(this,e),h(this,u(e).call(this,t,e))}return r(e,Ct),e}();et(Et);var Nt=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("defs",t),e))}return r(e,Tt),a(e,[{key:"flatten",value:function(){return this}},{key:"ungroup",value:function(){return this}}]),e}();et(Nt);var Dt={};function Pt(t,e){if(Array.isArray(t)){var n=!0,i=!1,r=void 0;try{for(var s,u=t[Symbol.iterator]();!(n=(s=u.next()).done);n=!0){Pt(s.value,e)}}catch(t){i=!0,r=t}finally{try{n||null==u.return||u.return()}finally{if(i)throw r}}}else if("object"!==l(t))Dt[t]=Object.assign(Dt[t]||{},e);else for(var o=Object.entries(t),a=0;a<o.length;a++){var h=f(o[a],2);Pt(h[0],h[1])}}function zt(t){return Dt[t]||{}}var Rt=function(t){function n(t){var e;return o(this,n),(e=h(this,u(n).call(this,Q("svg",t),n))).namespace(),e}return r(n,Tt),a(n,[{key:"isRoot",value:function(){return!(this.node.parentNode&&this.node.parentNode instanceof window.SVGElement&&"#document"!==this.node.parentNode.nodeName)}},{key:"doc",value:function(){return this.isRoot()?this:c(u(n.prototype),"doc",this).call(this)}},{key:"namespace",value:function(){return this.isRoot()?this.attr({xmlns:Y,version:"1.1"}).attr("xmlns:xlink",G,H).attr("xmlns:svgjs",V,H):this.doc().namespace()}},{key:"defs",value:function(){return this.isRoot()?tt(this.node.getElementsByTagName("defs")[0])||this.put(new Nt):this.doc().defs()}},{key:"parent",value:function(t){return this.isRoot()?"#document"===this.node.parentNode.nodeName?null:tt(this.node.parentNode):c(u(n.prototype),"parent",this).call(this,t)}},{key:"clear",value:function(){for(;this.node.hasChildNodes();)this.node.removeChild(this.node.lastChild);return this}}]),n}();Pt({Container:{nested:function(){return this.put(new Rt)}}}),et(Rt,"Doc",!0);var qt=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("g",t),e))}return r(e,Tt),e}();Pt({Element:{group:function(){return this.put(new qt)}}}),et(qt);var Lt=function(){function t(){o(this,t),this._first=null,this._last=null}return a(t,[{key:"push",value:function(t){var e=t.next?t:{value:t,next:null,prev:null};return this._last?(e.prev=this._last,this._last.next=e,this._last=e):(this._last=e,this._first=e),e}},{key:"shift",value:function(){var t=this._first;return t?(this._first=t.next,this._first&&(this._first.prev=null),this._last=this._first?this._last:null,t.value):null}},{key:"first",value:function(){return this._first&&this._first.value}},{key:"last",value:function(){return this._last&&this._last.value}},{key:"remove",value:function(t){t.prev&&(t.prev.next=t.next),t.next&&(t.next.prev=t.prev),t===this._last&&(this._last=t.prev),t===this._first&&(this._first=t.next),t.prev=null,t.next=null}}]),t}(),Ft={nextDraw:null,frames:new Lt,timeouts:new Lt,timer:window.performance||window.Date,transforms:[],frame:function(t){var e=Ft.frames.push({run:t});return null===Ft.nextDraw&&(Ft.nextDraw=window.requestAnimationFrame(Ft._draw)),e},transform_frame:function(t,e){Ft.transforms[e]=t},timeout:function(t,e){e=e||0;var n=Ft.timer.now()+e,i=Ft.timeouts.push({run:t,time:n});return null===Ft.nextDraw&&(Ft.nextDraw=window.requestAnimationFrame(Ft._draw)),i},cancelFrame:function(t){Ft.frames.remove(t)},clearTimeout:function(t){Ft.timeouts.remove(t)},_draw:function(t){for(var e=null,n=Ft.timeouts.last();(e=Ft.timeouts.shift())&&(t>=e.time?e.run():Ft.timeouts.push(e),e!==n););for(var i=null,r=Ft.frames.last();i!==r&&(i=Ft.frames.shift());)i.run();Ft.transforms.forEach(function(t){t()}),Ft.nextDraw=Ft.timeouts.first()||Ft.frames.first()?window.requestAnimationFrame(Ft._draw):null}},It=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q(t,"string"==typeof t?null:t),e))}return r(e,Tt),a(e,[{key:"words",value:function(t){for(;this.node.hasChildNodes();)this.node.removeChild(this.node.lastChild);return this.node.appendChild(document.createTextNode(t)),this}}]),e}();function Xt(t){return null==t?this.cx()-this.rx():this.cx(t+this.rx())}function Yt(t){return null==t?this.cy()-this.ry():this.cy(t+this.ry())}function Ht(t){return null==t?this.attr("cx"):this.attr("cx",t)}function Gt(t){return null==t?this.attr("cy"):this.attr("cy",t)}function Vt(t){return null==t?2*this.rx():this.rx(new At(t).divide(2))}function Bt(t){return null==t?2*this.ry():this.ry(new At(t).divide(2))}function Qt(t,e){var n=R(this,t,e);return this.rx(new At(n.width).divide(2)).ry(new At(n.height).divide(2))}et(It),Pt("Container",{element:function(t,e){return this.put(new It(t,e))}});var Ut=Object.freeze({rx:function(t){return this.attr("rx",t)},ry:function(t){return this.attr("ry",t)},x:Xt,y:Yt,cx:Ht,cy:Gt,width:Vt,height:Bt,size:Qt}),$t=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("circle",t),e))}return r(e,St),a(e,[{key:"radius",value:function(t){return this.attr("r",t)}},{key:"rx",value:function(t){return this.attr("r",t)}},{key:"ry",value:function(t){return this.rx(t)}}]),e}();function Wt(t,e){return yt((e||document).querySelectorAll(t),function(t){return tt(t)})}function Jt(t){return Wt(t,this.node)}$($t,{x:Xt,y:Yt,cx:Ht,cy:Gt,width:Vt,height:Bt,size:Qt}),Pt({Element:{circle:function(t){return this.put(new $t).radius(new At(t).divide(2)).move(0,0)}}}),et($t),Pt("Dom",{find:Jt});var Zt=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("clipPath",t),e))}return r(e,Tt),a(e,[{key:"remove",value:function(){return this.targets().forEach(function(t){t.unclip()}),c(u(e.prototype),"remove",this).call(this)}},{key:"targets",value:function(){return Wt('svg [clip-path*="'+this.id()+'"]')}}]),e}();Pt({Container:{clip:function(){return this.defs().put(new Zt)}},Element:{clipWith:function(t){var e=t instanceof Zt?t:this.parent().clip().add(t);return this.attr("clip-path",'url("#'+e.id()+'")')},unclip:function(){return this.attr("clip-path",null)},clipper:function(){return this.reference("clip-path")}}}),et(Zt);var Kt=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("a",t),e))}return r(e,Tt),a(e,[{key:"to",value:function(t){return this.attr("href",t,G)}},{key:"target",value:function(t){return this.attr("target",t)}}]),e}();Pt({Container:{link:function(t){return this.put(new Kt).to(t)}},Element:{linkTo:function(t){var e=new Kt;return"function"==typeof t?t.call(e,e):e.to(t),this.parent().put(e).put(this)}}}),et(Kt);var te=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("ellipse",t),e))}return r(e,St),e}();$(te,Ut),Pt("Container",{ellipse:function(t,e){return this.put(new te).size(t,e).move(0,0)}}),et(te);var ee=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("stop",t),e))}return r(e,Mt),a(e,[{key:"update",value:function(t){return("number"==typeof t||t instanceof At)&&(t={offset:arguments[0],color:arguments[1],opacity:arguments[2]}),null!=t.opacity&&this.attr("stop-opacity",t.opacity),null!=t.color&&this.attr("stop-color",t.color),null!=t.offset&&this.attr("offset",new At(t.offset)),this}}]),e}();et(ee);var ne=Object.freeze({from:function(t,e){return"radialGradient"===(this._element||this).type?this.attr({fx:new At(t),fy:new At(e)}):this.attr({x1:new At(t),y1:new At(e)})},to:function(t,e){return"radialGradient"===(this._element||this).type?this.attr({cx:new At(t),cy:new At(e)}):this.attr({x2:new At(t),y2:new At(e)})}});function ie(){if(!ie.nodes){var t=(new Rt).size(2,0).css({opacity:0,position:"absolute",left:"-100%",top:"-100%",overflow:"hidden"}),e=t.path().node;ie.nodes={svg:t,path:e}}if(!ie.nodes.svg.node.parentNode){var n=document.body||document.documentElement;ie.nodes.svg.addTo(n)}return ie.nodes}var re=function(){function r(t,e,n){var i;o(this,r),n=n||{x:0,y:0},i=Array.isArray(t)?{x:t[0],y:t[1]}:"object"===l(t)?{x:t.x,y:t.y}:{x:t,y:e},this.x=null==i.x?n.x:i.x,this.y=null==i.y?n.y:i.y}return a(r,[{key:"clone",value:function(){return new r(this)}},{key:"native",value:function(){var t=ie().svg.node.createSVGPoint();return t.x=this.x,t.y=this.y,t}},{key:"transform",value:function(t){return new r(t.a*this.x+t.c*this.y+t.e,t.b*this.x+t.d*this.y+t.f)}}]),r}();Pt({Element:{point:function(t,e){return new re(t,e).transform(this.screenCTM().inverse())}}});var se=function(){function u(){o(this,u),this.init.apply(this,arguments)}return a(u,[{key:"init",value:function(t){var e;t="string"==typeof t?t.split(C).map(parseFloat):Array.isArray(t)?t:"object"===l(t)?[null!=t.left?t.left:t.x,null!=t.top?t.top:t.y,t.width,t.height]:4===arguments.length?[].slice.call(arguments):[0,0,0,0],this.x=t[0],this.y=t[1],this.width=t[2],this.height=t[3],null==(e=this).x&&(e.x=0,e.y=0,e.width=0,e.height=0),e.w=e.width,e.h=e.height,e.x2=e.x+e.width,e.y2=e.y+e.height,e.cx=e.x+e.width/2,e.cy=e.y+e.height/2}},{key:"merge",value:function(t){var e=Math.min(this.x,t.x),n=Math.min(this.y,t.y);return new u(e,n,Math.max(this.x+this.width,t.x+t.width)-e,Math.max(this.y+this.height,t.y+t.height)-n)}},{key:"transform",value:function(e){var n=1/0,i=-1/0,r=1/0,s=-1/0;return[new re(this.x,this.y),new re(this.x2,this.y),new re(this.x,this.y2),new re(this.x2,this.y2)].forEach(function(t){t=t.transform(e),n=Math.min(n,t.x),i=Math.max(i,t.x),r=Math.min(r,t.y),s=Math.max(s,t.y)}),new u(n,r,i-n,s-r)}},{key:"addOffset",value:function(){return this.x+=window.pageXOffset,this.y+=window.pageYOffset,this}},{key:"toString",value:function(){return this.x+" "+this.y+" "+this.width+" "+this.height}},{key:"toArray",value:function(){return[this.x,this.y,this.width,this.height]}}]),u}();function ue(e){var n,t,i;try{if(n=e(this.node),!((i=n).w||i.h||i.x||i.y||(t=this.node,(document.documentElement.contains||function(t){for(;t.parentNode;)t=t.parentNode;return t===document}).call(document.documentElement,t))))throw new Error("Element not in the dom")}catch(t){try{var r=this.clone(ie().svg).show();n=e(r.node),r.remove()}catch(t){console.warn("Getting a bounding box of this element is not possible")}}return n}Pt({Element:{bbox:function(){return new se(ue.call(this,function(t){return t.getBBox()}))},rbox:function(t){var e=new se(ue.call(this,function(t){return t.getBoundingClientRect()}));return t?e.transform(t.screenCTM().inverse()):e.addOffset()}},viewbox:{viewbox:function(t,e,n,i){return null==t?new se(this.attr("viewBox")):this.attr("viewBox",new se(t,e,n,i))}}});var oe=function(t){function i(t){return o(this,i),h(this,u(i).call(this,Q(t+"Gradient","string"==typeof t?null:t),i))}return r(i,Tt),a(i,[{key:"stop",value:function(t,e,n){return this.put(new ee).update(t,e,n)}},{key:"update",value:function(t){return this.clear(),"function"==typeof t&&t.call(this,this),this}},{key:"url",value:function(){return"url(#"+this.id()+")"}},{key:"toString",value:function(){return this.url()}},{key:"attr",value:function(t,e,n){return"transform"===t&&(t="gradientTransform"),c(u(i.prototype),"attr",this).call(this,t,e,n)}},{key:"targets",value:function(){return Jt('svg [fill*="'+this.id()+'"]')}},{key:"bbox",value:function(){return new se}}]),i}();$(oe,ne),Pt({Container:{gradient:function(t,e){return this.defs().gradient(t,e)}},Defs:{gradient:function(t,e){return this.put(new oe(t)).update(e)}}}),et(oe);var ae=function(t){function i(t){return o(this,i),h(this,u(i).call(this,Q("pattern",t),i))}return r(i,Tt),a(i,[{key:"url",value:function(){return"url(#"+this.id()+")"}},{key:"update",value:function(t){return this.clear(),"function"==typeof t&&t.call(this,this),this}},{key:"toString",value:function(){return this.url()}},{key:"attr",value:function(t,e,n){return"transform"===t&&(t="patternTransform"),c(u(i.prototype),"attr",this).call(this,t,e,n)}},{key:"targets",value:function(){return Jt('svg [fill*="'+this.id()+'"]')}},{key:"bbox",value:function(){return new se}}]),i}();Pt({Container:{pattern:function(t,e,n){return this.defs().pattern(t,e,n)}},Defs:{pattern:function(t,e,n){return this.put(new ae).update(n).attr({x:0,y:0,width:t,height:e,patternUnits:"userSpaceOnUse"})}}}),et(ae);var he=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("image",t),e))}return r(e,St),a(e,[{key:"load",value:function(n,i){if(!n)return this;var r=new window.Image;return lt(r,"load",function(t){var e=this.parent(ae);0===this.width()&&0===this.height()&&this.size(r.width,r.height),e instanceof ae&&0===e.width()&&0===e.height()&&e.size(this.width(),this.height()),"function"==typeof i&&i.call(this,{width:r.width,height:r.height,ratio:r.width/r.height,url:n})},this),lt(r,"load error",function(){ct(r)}),this.attr("href",r.src=n,G)}},{key:"attrHook",value:function(t){var e=this;return t.doc().defs().pattern(0,0,function(t){t.add(e)})}}]),e}();Pt({Container:{image:function(t,e){return this.put(new he).size(0,0).load(t,e)}}}),et(he);var le=_t("PointArray",Ot);$(le,{toString:function(){for(var t=0,e=this.length,n=[];t<e;t++)n.push(this[t].join(","));return n.join(" ")},toLine:function(){return{x1:this[0][0],y1:this[0][1],x2:this[1][0],y2:this[1][1]}},at:function(t){if(!this.destination)return this;for(var e=0,n=this.length,i=[];e<n;e++)i.push([this[e][0]+(this.destination[e][0]-this[e][0])*t,this[e][1]+(this.destination[e][1]-this[e][1])*t]);return new le(i)},parse:function(){var t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:[[0,0]],e=[];if(t instanceof Array){if(t[0]instanceof Array)return t}else t=t.trim().split(C).map(parseFloat);t.length%2!=0&&t.pop();for(var n=0,i=t.length;n<i;n+=2)e.push([t[n],t[n+1]]);return e},move:function(t,e){var n=this.bbox();if(t-=n.x,e-=n.y,!isNaN(t)&&!isNaN(e))for(var i=this.length-1;0<=i;i--)this[i]=[this[i][0]+t,this[i][1]+e];return this},size:function(t,e){var n,i=this.bbox();for(n=this.length-1;0<=n;n--)i.width&&(this[n][0]=(this[n][0]-i.x)*t/i.width+i.x),i.height&&(this[n][1]=(this[n][1]-i.y)*e/i.height+i.y);return this},bbox:function(){var e=-1/0,n=-1/0,i=1/0,r=1/0;return this.forEach(function(t){e=Math.max(t[0],e),n=Math.max(t[1],n),i=Math.min(t[0],i),r=Math.min(t[1],r)}),{x:i,y:r,width:e-i,height:n-r}}});var ce=le;var fe=Object.freeze({MorphArray:ce,x:function(t){return null==t?this.bbox().x:this.move(t,this.bbox().y)},y:function(t){return null==t?this.bbox().y:this.move(this.bbox().x,t)},width:function(t){var e=this.bbox();return null==t?e.width:this.size(t,e.height)},height:function(t){var e=this.bbox();return null==t?e.height:this.size(e.width,t)}}),de=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("line",t),e))}return r(e,St),a(e,[{key:"array",value:function(){return new le([[this.attr("x1"),this.attr("y1")],[this.attr("x2"),this.attr("y2")]])}},{key:"plot",value:function(t,e,n,i){return null==t?this.array():(t=void 0!==e?{x1:t,y1:e,x2:n,y2:i}:new le(t).toLine(),this.attr(t))}},{key:"move",value:function(t,e){return this.attr(this.array().move(t,e).toLine())}},{key:"size",value:function(t,e){var n=R(this,t,e);return this.attr(this.array().size(n.width,n.height).toLine())}}]),e}();$(de,fe),Pt({Container:{line:function(){for(var t=arguments.length,e=new Array(t),n=0;n<t;n++)e[n]=arguments[n];return de.prototype.plot.apply(this.put(new de),null!=e[0]?e:[0,0,0,0])}}}),et(de);var ve=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("marker",t),e))}return r(e,Tt),a(e,[{key:"width",value:function(t){return this.attr("markerWidth",t)}},{key:"height",value:function(t){return this.attr("markerHeight",t)}},{key:"ref",value:function(t,e){return this.attr("refX",t).attr("refY",e)}},{key:"update",value:function(t){return this.clear(),"function"==typeof t&&t.call(this,this),this}},{key:"toString",value:function(){return"url(#"+this.id()+")"}}]),e}();Pt({Container:{marker:function(t,e,n){return this.defs().marker(t,e,n)}},Defs:{marker:function(t,e,n){return this.put(new ve).size(t,e).ref(t/2,e/2).viewbox(0,0,t,e).attr("orient","auto").update(n)}},marker:{marker:function(t,e,n,i){var r=["marker"];return"all"!==t&&r.push(t),r=r.join("-"),t=e instanceof ve?e:this.defs().marker(e,n,i),this.attr(r,t)}}}),et(ve);var ye=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("mask",t),e))}return r(e,Tt),a(e,[{key:"remove",value:function(){return this.targets().forEach(function(t){t.unmask()}),c(u(e.prototype),"remove",this).call(this)}},{key:"targets",value:function(){return Wt('svg [mask*="'+this.id()+'"]')}}]),e}();Pt({Container:{mask:function(){return this.defs().put(new ye)}},Element:{maskWith:function(t){var e=t instanceof ye?t:this.parent().mask().add(t);return this.attr("mask",'url("#'+e.id()+'")')},unmask:function(){return this.attr("mask",null)},masker:function(){return this.reference("mask")}}}),et(ye);for(var pe=_t("PathArray",Ot),me={M:function(t,e,n){return e.x=n.x=t[0],e.y=n.y=t[1],["M",e.x,e.y]},L:function(t,e){return e.x=t[0],e.y=t[1],["L",t[0],t[1]]},H:function(t,e){return e.x=t[0],["H",t[0]]},V:function(t,e){return e.y=t[0],["V",t[0]]},C:function(t,e){return e.x=t[4],e.y=t[5],["C",t[0],t[1],t[2],t[3],t[4],t[5]]},S:function(t,e){return e.x=t[2],e.y=t[3],["S",t[0],t[1],t[2],t[3]]},Q:function(t,e){return e.x=t[2],e.y=t[3],["Q",t[0],t[1],t[2],t[3]]},T:function(t,e){return e.x=t[0],e.y=t[1],["T",t[0],t[1]]},Z:function(t,e,n){return e.x=n.x,e.y=n.y,["Z"]},A:function(t,e){return e.x=t[5],e.y=t[6],["A",t[0],t[1],t[2],t[3],t[4],t[5],t[6]]}},ge="mlhvqtcsaz".split(""),we=0,ke=ge.length;we<ke;++we)me[ge[we]]=function(s){return function(t,e,n){if("H"===s)t[0]=t[0]+e.x;else if("V"===s)t[0]=t[0]+e.y;else if("A"===s)t[5]=t[5]+e.x,t[6]=t[6]+e.y;else for(var i=0,r=t.length;i<r;++i)t[i]=t[i]+(i%2?e.y:e.x);return me[s](t,e,n)}}(ge[we].toUpperCase());$(pe,{toString:function(){return function(t){for(var e=0,n=t.length,i="";e<n;e++)i+=t[e][0],null!=t[e][1]&&(i+=t[e][1],null!=t[e][2]&&(i+=" ",i+=t[e][2],null!=t[e][3]&&(i+=" ",i+=t[e][3],i+=" ",i+=t[e][4],null!=t[e][5]&&(i+=" ",i+=t[e][5],i+=" ",i+=t[e][6],null!=t[e][7]&&(i+=" ",i+=t[e][7])))));return i+" "}(this)},move:function(t,e){var n=this.bbox();if(t-=n.x,e-=n.y,!isNaN(t)&&!isNaN(e))for(var i,r=this.length-1;0<=r;r--)"M"===(i=this[r][0])||"L"===i||"T"===i?(this[r][1]+=t,this[r][2]+=e):"H"===i?this[r][1]+=t:"V"===i?this[r][1]+=e:"C"===i||"S"===i||"Q"===i?(this[r][1]+=t,this[r][2]+=e,this[r][3]+=t,this[r][4]+=e,"C"===i&&(this[r][5]+=t,this[r][6]+=e)):"A"===i&&(this[r][6]+=t,this[r][7]+=e);return this},size:function(t,e){var n,i,r=this.bbox();for(n=this.length-1;0<=n;n--)"M"===(i=this[n][0])||"L"===i||"T"===i?(this[n][1]=(this[n][1]-r.x)*t/r.width+r.x,this[n][2]=(this[n][2]-r.y)*e/r.height+r.y):"H"===i?this[n][1]=(this[n][1]-r.x)*t/r.width+r.x:"V"===i?this[n][1]=(this[n][1]-r.y)*e/r.height+r.y:"C"===i||"S"===i||"Q"===i?(this[n][1]=(this[n][1]-r.x)*t/r.width+r.x,this[n][2]=(this[n][2]-r.y)*e/r.height+r.y,this[n][3]=(this[n][3]-r.x)*t/r.width+r.x,this[n][4]=(this[n][4]-r.y)*e/r.height+r.y,"C"===i&&(this[n][5]=(this[n][5]-r.x)*t/r.width+r.x,this[n][6]=(this[n][6]-r.y)*e/r.height+r.y)):"A"===i&&(this[n][1]=this[n][1]*t/r.width,this[n][2]=this[n][2]*e/r.height,this[n][6]=(this[n][6]-r.x)*t/r.width+r.x,this[n][7]=(this[n][7]-r.y)*e/r.height+r.y);return this},equalCommands:function(t){var e,n,i;for(t=new pe(t),i=this.length===t.length,e=0,n=this.length;i&&e<n;e++)i=this[e][0]===t[e][0];return i},morph:function(t){return t=new pe(t),this.equalCommands(t)?this.destination=t:this.destination=null,this},at:function(t){if(!this.destination)return this;var e,n,i,r,s=this,u=this.destination.value,o=[],a=new pe;for(e=0,n=s.length;e<n;e++){for(o[e]=[s[e][0]],i=1,r=s[e].length;i<r;i++)o[e][i]=s[e][i]+(u[e][i]-s[e][i])*t;"A"===o[e][0]&&(o[e][4]=+(0!==o[e][4]),o[e][5]=+(0!==o[e][5]))}return a.value=o,a},parse:function(){var t,e=0<arguments.length&&void 0!==arguments[0]?arguments[0]:[["M",0,0]];if(e instanceof pe)return e;var n={M:2,L:2,H:1,V:1,C:6,S:4,Q:4,T:2,A:7,Z:0};e="string"==typeof e?e.replace(T,N).replace(M," $& ").replace(j,"$1 -").trim().split(C):e.reduce(function(t,e){return[].concat.call(t,e)},[]);for(var i=[],r=new re,s=new re,u=0,o=e.length;S.test(e[u])?(t=e[u],++u):"M"===t?t="L":"m"===t&&(t="l"),i.push(me[t].call(null,e.slice(u,u+=n[t.toUpperCase()]).map(parseFloat),r,s)),u<o;);return i},bbox:function(){return ie().path.setAttribute("d",this.toString()),ie.nodes.path.getBBox()}});var be=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("path",t),e))}return r(e,St),a(e,[{key:"array",value:function(){return this._array||(this._array=new pe(this.attr("d")))}},{key:"plot",value:function(t){return null==t?this.array():this.clear().attr("d","string"==typeof t?t:this._array=new pe(t))}},{key:"clear",value:function(){return delete this._array,this}},{key:"move",value:function(t,e){return this.attr("d",this.array().move(t,e))}},{key:"x",value:function(t){return null==t?this.bbox().x:this.move(t,this.bbox().y)}},{key:"y",value:function(t){return null==t?this.bbox().y:this.move(this.bbox().x,t)}},{key:"size",value:function(t,e){var n=R(this,t,e);return this.attr("d",this.array().size(n.width,n.height))}},{key:"width",value:function(t){return null==t?this.bbox().width:this.size(t,this.bbox().height)}},{key:"height",value:function(t){return null==t?this.bbox().height:this.size(this.bbox().width,t)}},{key:"targets",value:function(){return Wt('svg textpath [href*="'+this.id()+'"]')}}]),e}();be.prototype.MorphArray=pe,Pt({Container:{path:function(t){return this.put(new be).plot(t||new pe)}}}),et(be);var xe=Object.freeze({array:function(){return this._array||(this._array=new le(this.attr("points")))},plot:function(t){return null==t?this.array():this.clear().attr("points","string"==typeof t?t:this._array=new le(t))},clear:function(){return delete this._array,this},move:function(t,e){return this.attr("points",this.array().move(t,e))},size:function(t,e){var n=R(this,t,e);return this.attr("points",this.array().size(n.width,n.height))}}),_e=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("polygon",t),e))}return r(e,St),e}();Pt({Container:{polygon:function(t){return this.put(new _e).plot(t||new le)}}}),$(_e,fe),$(_e,xe),et(_e);var Oe=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("polyline",t),e))}return r(e,St),e}();Pt({Container:{polyline:function(t){return this.put(new Oe).plot(t||new le)}}}),$(Oe,fe),$(Oe,xe),et(Oe);var Ae=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("rect",t),e))}return r(e,St),a(e,[{key:"rx",value:function(t){return this.attr("rx",t)}},{key:"ry",value:function(t){return this.attr("ry",t)}}]),e}();Pt({Container:{rect:function(t,e){return this.put(new Ae).size(t,e)}}}),et(Ae);var Ce=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("symbol",t),e))}return r(e,Tt),e}();Pt({Container:{symbol:function(){return this.put(new Ce)}}}),et(Ce);var je=Object.freeze({plain:function(t){return!1===this._build&&this.clear(),this.node.appendChild(document.createTextNode(t)),this},length:function(){return this.node.getComputedTextLength()}}),Me=function(t){function n(t){var e;return o(this,n),(e=h(this,u(n).call(this,Q("text",t),n))).dom.leading=new At(1.3),e._rebuild=!0,e._build=!1,e.attr("font-family",kt["font-family"]),e}return r(n,St),a(n,[{key:"x",value:function(t){return null==t?this.attr("x"):this.attr("x",t)}},{key:"y",value:function(t){var e=this.attr("y"),n="number"==typeof e?e-this.bbox().y:0;return null==t?"number"==typeof e?e-n:e:this.attr("y","number"==typeof t?t+n:t)}},{key:"cx",value:function(t){return null==t?this.bbox().cx:this.x(t-this.bbox().width/2)}},{key:"cy",value:function(t){return null==t?this.bbox().cy:this.y(t-this.bbox().height/2)}},{key:"text",value:function(t){if(void 0===t){var e=this.node.childNodes,n=0;t="";for(var i=0,r=e.length;i<r;++i)"textPath"!==e[i].nodeName?(i!==n&&3!==e[i].nodeType&&!0===tt(e[i]).dom.newLined&&(t+="\n"),t+=e[i].textContent):0===i&&(n=1);return t}if(this.clear().build(!0),"function"==typeof t)t.call(this,this);else for(var s=0,u=(t=t.split("\n")).length;s<u;s++)this.tspan(t[s]).newLine();return this.build(!1).rebuild()}},{key:"leading",value:function(t){return null==t?this.dom.leading:(this.dom.leading=new At(t),this.rebuild())}},{key:"rebuild",value:function(t){if("boolean"==typeof t&&(this._rebuild=t),this._rebuild){var e=this,n=0,i=this.dom.leading*new At(this.attr("font-size"));this.each(function(){this.dom.newLined&&(this.attr("x",e.attr("x")),"\n"===this.text()?n+=i:(this.attr("dy",i+n),n=0))}),this.fire("rebuild")}return this}},{key:"build",value:function(t){return this._build=!!t,this}},{key:"setData",value:function(t){return this.dom=t,this.dom.leading=new At(t.leading||1.3),this}}]),n}();$(Me,je),Pt({Container:{text:function(t){return this.put(new Me).text(t)},plain:function(t){return this.put(new Me).plain(t)}}}),et(Me);var Se=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("textPath",t),e))}return r(e,Me),a(e,[{key:"array",value:function(){var t=this.track();return t?t.array():null}},{key:"plot",value:function(t){var e=this.track(),n=null;return e&&(n=e.plot(t)),null==t?n:this}},{key:"track",value:function(){return this.reference("href")}}]),e}();Pt({Container:{textPath:function(t,e){return this.defs().path(e).text(t).addTo(this)}},Text:{path:function(t){var e=new Se;return t instanceof be||(t=this.doc().defs().path(t)),e.attr("href","#"+t,G),this.put(e)},textPath:function(){return this.find("textPath")}},Path:{text:function(t){if(t instanceof Me){var e=t.text();return t.clear().path(this).text(e)}return this.parent().put(new Me).path(this).text(t)}}}),Se.prototype.MorphArray=pe,et(Se);var Te=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("tspan",t),e))}return r(e,Me),a(e,[{key:"text",value:function(t){return null==t?this.node.textContent+(this.dom.newLined?"\n":""):("function"==typeof t?t.call(this,this):this.plain(t),this)}},{key:"dx",value:function(t){return this.attr("dx",t)}},{key:"dy",value:function(t){return this.attr("dy",t)}},{key:"newLine",value:function(){var t=this.parent(Me);return this.dom.newLined=!0,this.dy(t.dom.leading*t.attr("font-size")).attr("x",t.x())}}]),e}();$(Te,je),Pt({Tspan:{tspan:function(t){var e=new Te;return this._build||this.clear(),this.node.appendChild(e.node),e.text(t)}}}),et(Te);var Ee=function(t){function e(t){return o(this,e),h(this,u(e).call(this,Q("use",t),e))}return r(e,St),a(e,[{key:"element",value:function(t,e){return this.attr("href",(e||"")+"#"+t,G)}}]),e}();Pt({Container:{use:function(t,e){return this.put(new Ee).element(t,e)}}}),et(Ee);var Ne=function(){function h(){o(this,h),this.init.apply(this,arguments)}return a(h,[{key:"init",value:function(t){var e=q([1,0,0,1,0,0]);t=t instanceof Mt?t.matrixify():"string"==typeof t?q(t.split(C).map(parseFloat)):Array.isArray(t)?q(t):"object"===l(t)&&I(t)?t:"object"===l(t)?(new h).transform(t):6===arguments.length?q([].slice.call(arguments)):e,this.a=null!=t.a?t.a:e.a,this.b=null!=t.b?t.b:e.b,this.c=null!=t.c?t.c:e.c,this.d=null!=t.d?t.d:e.d,this.e=null!=t.e?t.e:e.e,this.f=null!=t.f?t.f:e.f}},{key:"clone",value:function(){return new h(this)}},{key:"transform",value:function(t){if(I(t))return new h(t).multiplyO(this);var e=h.formatTransforms(t),n=new re(e.ox,e.oy).transform(this),i=n.x,r=n.y,s=(new h).translateO(e.rx,e.ry).lmultiplyO(this).translateO(-i,-r).scaleO(e.scaleX,e.scaleY).skewO(e.skewX,e.skewY).shearO(e.shear).rotateO(e.theta).translateO(i,r);if(isFinite(e.px)||isFinite(e.py)){var u=new re(i,r).transform(s),o=e.px?e.px-u.x:0,a=e.py?e.py-u.y:0;s.translateO(o,a)}return s.translateO(e.tx,e.ty),s}},{key:"compose",value:function(t){t.origin&&(t.originX=t.origin[0],t.originY=t.origin[1]);var e=t.originX||0,n=t.originY||0,i=t.scaleX||1,r=t.scaleY||1,s=t.shear||0,u=t.rotate||0,o=t.translateX||0,a=t.translateY||0;return(new h).translateO(-e,-n).scaleO(i,r).shearO(s).rotateO(u).translateO(o,a).lmultiplyO(this).translateO(e,n)}},{key:"decompose",value:function(){var t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:0,e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:0,n=this.a,i=this.b,r=this.c,s=this.d,u=this.e,o=this.f,a=n*s-i*r,h=0<a?1:-1,l=h*Math.sqrt(n*n+i*i),c=Math.atan2(h*i,h*n),f=180/Math.PI*c,d=Math.cos(c),v=Math.sin(c),y=(n*r+i*s)/a,p=r*l/(y*n-i)||s*l/(y*i+n);return{scaleX:l,scaleY:p,shear:y,rotate:f,translateX:u-t+t*d*l+e*(y*d*l-v*p),translateY:o-e+t*v*l+e*(y*v*l+d*p),originX:t,originY:e,a:this.a,b:this.b,c:this.c,d:this.d,e:this.e,f:this.f}}},{key:"multiply",value:function(t){return this.clone().multiplyO(t)}},{key:"multiplyO",value:function(t){var e=t instanceof h?t:new h(t);return h.matrixMultiply(this,e,this)}},{key:"lmultiply",value:function(t){return this.clone().lmultiplyO(t)}},{key:"lmultiplyO",value:function(t){var e=t instanceof h?t:new h(t);return h.matrixMultiply(e,this,this)}},{key:"inverseO",value:function(){var t=this.a,e=this.b,n=this.c,i=this.d,r=this.e,s=this.f,u=t*i-e*n;if(!u)throw new Error("Cannot invert "+this);var o=i/u,a=-e/u,h=-n/u,l=t/u,c=-(o*r+h*s),f=-(a*r+l*s);return this.a=o,this.b=a,this.c=h,this.d=l,this.e=c,this.f=f,this}},{key:"inverse",value:function(){return this.clone().inverseO()}},{key:"translate",value:function(t,e){return this.clone().translateO(t,e)}},{key:"translateO",value:function(t,e){return this.e+=t||0,this.f+=e||0,this}},{key:"scale",value:function(t,e,n,i){var r;return(r=this.clone()).scaleO.apply(r,arguments)}},{key:"scaleO",value:function(t){var e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:t,n=2<arguments.length&&void 0!==arguments[2]?arguments[2]:0,i=3<arguments.length&&void 0!==arguments[3]?arguments[3]:0;3===arguments.length&&(i=n,n=e,e=t);var r=this.a,s=this.b,u=this.c,o=this.d,a=this.e,h=this.f;return this.a=r*t,this.b=s*e,this.c=u*t,this.d=o*e,this.e=a*t-n*t+n,this.f=h*e-i*e+i,this}},{key:"rotate",value:function(t,e,n){return this.clone().rotateO(t,e,n)}},{key:"rotateO",value:function(t){var e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:0,n=2<arguments.length&&void 0!==arguments[2]?arguments[2]:0;t=pt(t);var i=Math.cos(t),r=Math.sin(t),s=this.a,u=this.b,o=this.c,a=this.d,h=this.e,l=this.f;return this.a=s*i-u*r,this.b=u*i+s*r,this.c=o*i-a*r,this.d=a*i+o*r,this.e=h*i-l*r+n*r-e*i+e,this.f=l*i+h*r-e*r-n*i+n,this}},{key:"flip",value:function(t,e){return this.clone().flipO(t,e)}},{key:"flipO",value:function(t,e){return"x"===t?this.scaleO(-1,1,e,0):"y"===t?this.scaleO(1,-1,0,e):this.scaleO(-1,-1,t,e||t)}},{key:"shear",value:function(t,e,n){return this.clone().shearO(t,e,n)}},{key:"shearO",value:function(t){var e=2<arguments.length&&void 0!==arguments[2]?arguments[2]:0,n=this.a,i=this.b,r=this.c,s=this.d,u=this.e,o=this.f;return this.a=n+i*t,this.c=r+s*t,this.e=u+o*t-e*t,this}},{key:"skew",value:function(t,e,n,i){var r;return(r=this.clone()).skewO.apply(r,arguments)}},{key:"skewO",value:function(t){var e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:t,n=2<arguments.length&&void 0!==arguments[2]?arguments[2]:0,i=3<arguments.length&&void 0!==arguments[3]?arguments[3]:0;3===arguments.length&&(i=n,n=e,e=t),t=pt(t),e=pt(e);var r=Math.tan(t),s=Math.tan(e),u=this.a,o=this.b,a=this.c,h=this.d,l=this.e,c=this.f;return this.a=u+o*r,this.b=o+u*s,this.c=a+h*r,this.d=h+a*s,this.e=l+c*r-i*r,this.f=c+l*s-n*s,this}},{key:"skewX",value:function(t,e,n){return this.skew(t,0,e,n)}},{key:"skewXO",value:function(t,e,n){return this.skewO(t,0,e,n)}},{key:"skewY",value:function(t,e,n){return this.skew(0,t,e,n)}},{key:"skewYO",value:function(t,e,n){return this.skewO(0,t,e,n)}},{key:"aroundO",value:function(t,e,n){var i=t||0,r=e||0;return this.translateO(-i,-r).lmultiplyO(n).translateO(i,r)}},{key:"around",value:function(t,e,n){return this.clone().aroundO(t,e,n)}},{key:"native",value:function(){for(var t=ie().svg.node.createSVGMatrix(),e=L.length-1;0<=e;e--)t[L[e]]=this[L[e]];return t}},{key:"equals",value:function(t){var e=new h(t);return F(this.a,e.a)&&F(this.b,e.b)&&F(this.c,e.c)&&F(this.d,e.d)&&F(this.e,e.e)&&F(this.f,e.f)}},{key:"toString",value:function(){return"matrix("+this.a+","+this.b+","+this.c+","+this.d+","+this.e+","+this.f+")"}},{key:"toArray",value:function(){return[this.a,this.b,this.c,this.d,this.e,this.f]}},{key:"valueOf",value:function(){return{a:this.a,b:this.b,c:this.c,d:this.d,e:this.e,f:this.f}}}],[{key:"formatTransforms",value:function(t){var e="both"===t.flip||!0===t.flip,n=t.flip&&(e||"x"===t.flip)?-1:1,i=t.flip&&(e||"y"===t.flip)?-1:1,r=t.skew&&t.skew.length?t.skew[0]:isFinite(t.skew)?t.skew:isFinite(t.skewX)?t.skewX:0,s=t.skew&&t.skew.length?t.skew[1]:isFinite(t.skew)?t.skew:isFinite(t.skewY)?t.skewY:0,u=t.scale&&t.scale.length?t.scale[0]*n:isFinite(t.scale)?t.scale*n:isFinite(t.scaleX)?t.scaleX*n:n,o=t.scale&&t.scale.length?t.scale[1]*i:isFinite(t.scale)?t.scale*i:isFinite(t.scaleY)?t.scaleY*i:i,a=t.shear||0,h=t.rotate||t.theta||0,l=new re(t.origin||t.around||t.ox||t.originX,t.oy||t.originY),c=l.x,f=l.y,d=new re(t.position||t.px||t.positionX,t.py||t.positionY),v=d.x,y=d.y,p=new re(t.translate||t.tx||t.translateX,t.ty||t.translateY),m=p.x,g=p.y,w=new re(t.relative||t.rx||t.relativeX,t.ry||t.relativeY);return{scaleX:u,scaleY:o,skewX:r,skewY:s,shear:a,theta:h,rx:w.x,ry:w.y,tx:m,ty:g,ox:c,oy:f,px:v,py:y}}},{key:"matrixMultiply",value:function(t,e,n){var i=t.a*e.a+t.c*e.b,r=t.b*e.a+t.d*e.b,s=t.a*e.c+t.c*e.d,u=t.b*e.c+t.d*e.d,o=t.e+t.a*e.e+t.c*e.f,a=t.f+t.b*e.e+t.d*e.f;return n.a=i,n.b=r,n.c=s,n.d=u,n.e=o,n.f=a,n}}]),h}();function De(e,n){return function(t){return null==t?this[t]:(this[e]=t,n&&n.call(this),this)}}Pt({Element:{ctm:function(){return new Ne(this.node.getCTM())},screenCTM:function(){if("function"!=typeof this.isRoot||this.isRoot())return new Ne(this.node.getScreenCTM());var t=this.rect(1,1),e=t.node.getScreenCTM();return t.remove(),new Ne(e)}}});var Pe={"-":function(t){return t},"<>":function(t){return-Math.cos(t*Math.PI)/2+.5},">":function(t){return Math.sin(t*Math.PI/2)},"<":function(t){return 1-Math.cos(t*Math.PI/2)},bezier:function(t,e,n,i){return function(t){}}},ze=function(){function t(){o(this,t)}return a(t,[{key:"done",value:function(){return!1}}]),t}(),Re=function(t){function n(t){var e;return o(this,n),(e=h(this,u(n).call(this))).ease=Pe[t||wt.ease]||t,e}return r(n,ze),a(n,[{key:"step",value:function(t,e,n){return"number"!=typeof t?n<1?t:e:t+(e-t)*this.ease(n)}}]),n}(),qe=function(t){function n(t){var e;return o(this,n),(e=h(this,u(n).call(this))).stepper=t,e}return r(n,ze),a(n,[{key:"step",value:function(t,e,n,i){return this.stepper(t,e,n,i)}},{key:"done",value:function(t){return t.done}}]),n}();function Le(){var t=(this._duration||500)/1e3,e=this._overshoot||0,n=Math.PI,i=Math.log(e/100+1e-10),r=-i/Math.sqrt(n*n+i*i),s=3.9/(r*t);this.d=2*r*s,this.k=s*s}var Fe=function(t){function i(t,e){var n;return o(this,i),(n=h(this,u(i).call(this))).duration(t||500).overshoot(e||0),n}return r(i,qe),a(i,[{key:"step",value:function(t,e,n,i){if("string"==typeof t)return t;if(i.done=n===1/0,n===1/0)return e;if(0===n)return t;100<n&&(n=16),n/=1e3;var r=i.velocity||0,s=-this.d*r-this.k*(t-e),u=t+r*n+s*n*n/2;return i.velocity=r+s*n,i.done=Math.abs(e-u)+Math.abs(r)<.002,i.done?e:u}}]),i}();$(Fe,{duration:De("_duration",Le),overshoot:De("_overshoot",Le)});var Ie=function(t){function s(t,e,n,i){var r;return o(this,s),t=null==t?.1:t,e=null==e?.01:e,n=null==n?0:n,i=null==i?1e3:i,(r=h(this,u(s).call(this))).p(t).i(e).d(n).windup(i),r}return r(s,qe),a(s,[{key:"step",value:function(t,e,n,i){if("string"==typeof t)return t;if(i.done=n===1/0,n===1/0)return e;if(0===n)return t;var r=e-t,s=(i.integral||0)+r*n,u=(r-(i.error||0))/n,o=this.windup;return!1!==o&&(s=Math.max(-o,Math.min(s,o))),i.error=r,i.integral=s,i.done=Math.abs(r)<.001,i.done?e:t+(this.P*r+this.I*s+this.D*u)}}]),s}();$(Ie,{windup:De("windup"),p:De("P"),i:De("I"),d:De("D")});var Xe=function(){function e(t){o(this,e),this._stepper=t||new Re("-"),this._from=null,this._to=null,this._type=null,this._context=null,this._morphObj=null}return a(e,[{key:"from",value:function(t){return null==t?this._from:(this._from=this._set(t),this)}},{key:"to",value:function(t){return null==t?this._to:(this._to=this._set(t),this)}},{key:"type",value:function(t){return null==t?this._type:(this._type=t,this)}},{key:"_set",value:function(t){if(!this._type){var e=l(t);"number"===e?this.type(At):"string"===e?xt.isColor(t)?this.type(xt):C.test(t)?this.type(M.test(t)?pe:Ot):v.test(t)?this.type(At):this.type(Ye):-1<Ve.indexOf(t.constructor)?this.type(t.constructor):Array.isArray(t)?this.type(Ot):"object"===e?this.type(Ge):this.type(Ye)}var n=new this._type(t).toArray();return this._morphObj=this._morphObj||new this._type,this._context=this._context||Array.apply(null,Array(n.length)).map(Object),n}},{key:"stepper",value:function(t){return null==t?this._stepper:(this._stepper=t,this)}},{key:"done",value:function(){return this._context.map(this._stepper.done).reduce(function(t,e){return t&&e},!0)}},{key:"at",value:function(n){var i=this;return this._morphObj.fromArray(this._from.map(function(t,e){return i._stepper.step(t,i._to[e],n,i._context[e],i._context)}))}}]),e}(),Ye=function(){function t(){o(this,t),this.init.apply(this,arguments)}return a(t,[{key:"init",value:function(t){t=Array.isArray(t)?t[0]:t,this.value=t}},{key:"valueOf",value:function(){return this.value}},{key:"toArray",value:function(){return[this.value]}}]),t}(),He=function(){function e(){o(this,e),this.init.apply(this,arguments)}return a(e,[{key:"init",value:function(t){Array.isArray(t)&&(t={scaleX:t[0],scaleY:t[1],shear:t[2],rotate:t[3],translateX:t[4],translateY:t[5],originX:t[6],originY:t[7]}),Object.assign(this,e.defaults,t)}},{key:"toArray",value:function(){var t=this;return[t.scaleX,t.scaleY,t.shear,t.rotate,t.translateX,t.translateY,t.originX,t.originY]}}]),e}();He.defaults={scaleX:1,scaleY:1,shear:0,rotate:0,translateX:0,translateY:0,originX:0,originY:0};var Ge=function(){function t(){o(this,t),this.init.apply(this,arguments)}return a(t,[{key:"init",value:function(t){if(this.values=[],Array.isArray(t))this.values=t;else{var e=Object.entries(t||{}).sort(function(t,e){return t[0]-e[0]});this.values=e.reduce(function(t,e){return t.concat(e)},[])}}},{key:"valueOf",value:function(){for(var t={},e=this.values,n=0,i=e.length;n<i;n+=2)t[e[n]]=e[n+1];return t}},{key:"toArray",value:function(){return this.values}}]),t}(),Ve=[Ye,He,Ge];var Be=window.performance||Date,Qe=function(t){var e=t.start,n=t.runner.duration();return{start:e,duration:n,end:e+n,runner:t.runner}},Ue=function(){function t(){o(this,t),this._timeSource=function(){return Be.now()},this._dispatcher=document.createElement("div"),this._startTime=0,this._speed=1,this._reverse=!1,this._persist=0,this._nextFrame=null,this._paused=!1,this._runners=[],this._order=[],this._time=0,this._lastSourceTime=0,this._lastStepTime=0}return a(t,[{key:"getEventTarget",value:function(){return this._dispatcher}},{key:"schedule",value:function(t,e,n){if(null==t)return this._runners.map(Qe).sort(function(t,e){return t.start-e.start||t.duration-e.duration});this.active()||(this._step(),null==n&&(n="now"));var i=0;if(e=e||0,null==n||"last"===n||"after"===n)i=this._startTime;else if("absolute"===n||"start"===n)i=e,e=0;else if("now"===n)i=this._time;else{if("relative"!==n)throw new Error('Invalid value for the "when" parameter');var r=this._runners[t.id];r&&(i=r.start+e,e=0)}return t.unschedule(),t.timeline(this),t.time(-e),this._startTime=i+t.duration()+e,this._runners[t.id]={persist:this.persist(),runner:t,start:i},this._order.push(t.id),this._continue(),this}},{key:"unschedule",value:function(t){var e=this._order.indexOf(t.id);return e<0||(delete this._runners[t.id],this._order.splice(e,1),t.timeline(null)),this}},{key:"play",value:function(){return this._paused=!1,this._continue()}},{key:"pause",value:function(){return this._nextFrame=null,this._paused=!0,this}},{key:"stop",value:function(){return this.seek(-this._time),this.pause()}},{key:"finish",value:function(){return this.seek(1/0),this.pause()}},{key:"speed",value:function(t){return null==t?this._speed:(this._speed=t,this)}},{key:"reverse",value:function(t){var e=this.speed();if(null==t)return this.speed(-e);var n=Math.abs(e);return this.speed(t?n:-n)}},{key:"seek",value:function(t){return this._time+=t,this._continue()}},{key:"time",value:function(t){return null==t?this._time:(this._time=t,this)}},{key:"persist",value:function(t){return null==t?this._persist:(this._persist=t,this)}},{key:"source",value:function(t){return null==t?this._timeSource:(this._timeSource=t,this)}},{key:"_step",value:function(){if(!this._paused){var t=this._timeSource(),e=t-this._lastSourceTime,n=this._speed*e+(this._time-this._lastStepTime);this._lastSourceTime=t,this._time+=n,this._lastStepTime=this._time;for(var i=!1,r=0,s=this._order.length;r<s;r++){var u=this._runners[this._order[r]],o=u.runner,a=n,h=this._time-u.start;if(h<0)i=!0;else if(h<a&&(a=h),o.active())if(o.step(a).done){if(!0!==u.persist){o.duration()-o.time()+this._time+this._persist<this._time&&(delete this._runners[this._order[r]],this._order.splice(r--,1)&&--s,o.timeline(null))}}else i=!0}return this._nextFrame=i?Ft.frame(this._step.bind(this)):null,this}}},{key:"_continue",value:function(){return this._paused||this._nextFrame||(this._nextFrame=Ft.frame(this._step.bind(this))),this}},{key:"active",value:function(){return!!this._nextFrame}}]),t}();Pt({Element:{timeline:function(){return this._timeline=this._timeline||new Ue,this._timeline}}});var $e=function(t){function s(t){var e;return o(this,s),(e=h(this,u(s).call(this))).id=s.id++,t="function"==typeof(t=null==t?wt.duration:t)?new qe(t):t,e._element=null,e._timeline=null,e.done=!1,e._queue=[],e._duration="number"==typeof t&&t,e._isDeclarative=t instanceof qe,e._stepper=e._isDeclarative?t:new Re,e._history={},e.enabled=!0,e._time=0,e._last=0,e.transforms=new Ne,e.transformId=1,e._haveReversed=!1,e._reverse=!1,e._loopsDone=0,e._swing=!1,e._wait=0,e._times=1,e}return r(s,vt),a(s,[{key:"element",value:function(t){return null==t?this._element:((this._element=t)._prepareRunner(),this)}},{key:"timeline",value:function(t){return void 0===t?this._timeline:(this._timeline=t,this)}},{key:"animate",value:function(t,e,n){var i=s.sanitise(t,e,n),r=new s(i.duration);return this._timeline&&r.timeline(this._timeline),this._element&&r.element(this._element),r.loop(i).schedule(e,n)}},{key:"schedule",value:function(t,e,n){if(t instanceof Ue||(n=e,e=t,t=this.timeline()),!t)throw Error("Runner cannot be scheduled without timeline");return t.schedule(this,e,n),this}},{key:"unschedule",value:function(){var t=this.timeline();return t&&t.unschedule(this),this}},{key:"loop",value:function(t,e,n){return"object"===l(t)&&(e=t.swing,n=t.wait,t=t.times),this._times=t||1/0,this._swing=e||!1,this._wait=n||0,this}},{key:"delay",value:function(t){return this.animate(0,t)}},{key:"queue",value:function(t,e,n){return this._queue.push({initialiser:t||gt,runner:e||gt,isTransform:n,initialised:!1,finished:!1}),this.timeline()&&this.timeline()._continue(),this}},{key:"during",value:function(t){return this.queue(null,t)}},{key:"after",value:function(t){return this.on("finish",t)}},{key:"time",value:function(t){if(null==t)return this._time;var e=t-this._time;return this.step(e),this}},{key:"duration",value:function(){return this._times*(this._wait+this._duration)-this._wait}},{key:"loops",value:function(t){var e=this._duration+this._wait;if(null==t){var n=Math.floor(this._time/e),i=(this._time-n*e)/this._duration;return Math.min(n+i,this._times)}var r=t%1,s=e*Math.floor(t)+this._duration*r;return this.time(s)}},{key:"position",value:function(t){var e,n=this._time,r=this._duration,s=this._wait,i=this._times,u=this._swing,o=this._reverse;if(null==t){var a=function(t){var e=u*Math.floor(t%(2*(s+r))/(s+r)),n=e&&!o||!e&&o,i=Math.pow(-1,n)*(t%(s+r))/r+n;return Math.max(Math.min(i,1),0)},h=i*(s+r)-s;return e=n<=0?Math.round(a(1e-5)):n<h?a(n):Math.round(a(h-1e-5)),e}var l=Math.floor(this.loops()),c=u&&l%2==0;return e=l+(c&&!o||o&&c?t:1-t),this.loops(e)}},{key:"progress",value:function(t){return null==t?Math.min(1,this._time/this.duration()):this.time(t*this.duration())}},{key:"step",value:function(t){if(!this.enabled)return this;t=null==t?16:t,this._time+=t;var e=this.position(),n=this._lastPosition!==e&&0<=this._time;this._lastPosition=e;var i=this.duration(),r=this._lastTime<0&&0<this._time,s=this._lastTime<this._time&&this.time>i;this._lastTime=this._time,r&&this.fire("start",this);var u=this._isDeclarative;if(this.done=!u&&!s&&this._time>=i,n||u){this._initialise(n),this.transforms=new Ne;var o=this._run(u?t:e);this.fire("step",this)}return this.done=this.done||o&&u,this.done&&this.fire("finish",this),this}},{key:"finish",value:function(){return this.step(1/0)}},{key:"reverse",value:function(t){return this._reverse=null==t?!this._reverse:t,this}},{key:"ease",value:function(t){return this._stepper=new Re(t),this}},{key:"active",value:function(t){return null==t?this.enabled:(this.enabled=t,this)}},{key:"_rememberMorpher",value:function(t,e){this._history[t]={morpher:e,caller:this._queue[this._queue.length-1]}}},{key:"_tryRetarget",value:function(t,e){if(this._history[t]){if(!this._history[t].caller.initialised){var n=this._queue.indexOf(this._history[t].caller);return this._queue.splice(n,1),!1}this._history[t].caller.isTransform?this._history[t].caller.isTransform(e):this._history[t].morpher.to(e),this._history[t].caller.finished=!1;var i=this.timeline();return i&&i._continue(),!0}return!1}},{key:"_initialise",value:function(t){if(t||this._isDeclarative)for(var e=0,n=this._queue.length;e<n;++e){var i=this._queue[e],r=this._isDeclarative||!i.initialised&&t;t=!i.finished,r&&t&&(i.initialiser.call(this),i.initialised=!0)}}},{key:"_run",value:function(t){for(var e=!0,n=0,i=this._queue.length;n<i;++n){var r=this._queue[n],s=r.runner.call(this,t);r.finished=r.finished||!0===s,e=e&&r.finished}return e}},{key:"addTransform",value:function(t,e){return this.transforms.lmultiplyO(t),this}},{key:"clearTransform",value:function(){return this.transforms=new Ne,this}}],[{key:"sanitise",value:function(t,e,n){var i=1,r=!1,s=0;return e=e||wt.delay,n=n||"last","object"!==l(t=t||wt.duration)||t instanceof ze||(e=t.delay||e,n=t.when||n,r=t.swing||r,i=t.times||i,s=t.wait||s,t=t.duration||wt.duration),{duration:t,delay:e,swing:r,times:i,wait:s,when:n}}}]),s}();$e.id=0;var We=function t(){var e=0<arguments.length&&void 0!==arguments[0]?arguments[0]:new Ne,n=1<arguments.length&&void 0!==arguments[1]?arguments[1]:-1,i=!(2<arguments.length&&void 0!==arguments[2])||arguments[2];o(this,t),this.transforms=e,this.id=n,this.done=i};$([$e,We],{mergeWith:function(t){return new We(t.transforms.lmultiply(this.transforms),t.id)}});var Je=function(t,e){return t.lmultiplyO(e)},Ze=function(t){return t.transforms};var Ke=function(){function t(){o(this,t),this.runners=[],this.ids=[]}return a(t,[{key:"add",value:function(t){if(!this.runners.includes(t)){var n=t.id+1,e=this.ids.reduce(function(t,e){return t<e&&e<n?e:t},0),i=this.ids.indexOf(e)+1;return this.ids.splice(i,0,n),this.runners.splice(i,0,t),this}}},{key:"getByID",value:function(t){return this.runners[this.ids.indexOf(t+1)]}},{key:"remove",value:function(t){var e=this.ids.indexOf(t+1);return this.ids.splice(e,1),this.runners.splice(e,1),this}},{key:"merge",value:function(){var n=this,i=null;return this.runners.forEach(function(t,e){i&&t.done&&i.done&&(n.remove(t.id),n.edit(i.id,t.mergeWith(i))),i=t}),this}},{key:"edit",value:function(t,e){var n=this.ids.indexOf(t+1);return this.ids.splice(n,1,t),this.runners.splice(n,1,e),this}},{key:"length",value:function(){return this.ids.length}},{key:"clearBefore",value:function(t){var e=this.ids.indexOf(t+1)||1;return this.ids.splice(0,e,0),this.runners.splice(0,e,new We),this}}]),t}(),tn=0;Pt({Element:{animate:function(t,e,n){var i=$e.sanitise(t,e,n),r=this.timeline();return new $e(i.duration).loop(i).element(this).timeline(r).schedule(e,n)},delay:function(t,e){return this.animate(0,t,e)},_clearTransformRunnersBefore:function(t){this._transformationRunners.clearBefore(t.id)},_currentTransform:function(e){return this._transformationRunners.runners.filter(function(t){return t.id<=e.id}).map(Ze).reduce(Je,new Ne)},addRunner:function(t){this._transformationRunners.add(t),Ft.transform_frame(function(){var t=this._transformationRunners.runners.map(Ze).reduce(Je,new Ne);this.transform(t),this._transformationRunners.merge(),1===this._transformationRunners.length()&&(this._frameId=null)}.bind(this),this._frameId)},_prepareRunner:function(){null==this._frameId&&(this._transformationRunners=(new Ke).add(new We(new Ne(this))),this._frameId=tn++)}}}),$($e,{attr:function(t,e){return this.styleAttr("attr",t,e)},css:function(t,e){return this.styleAttr("css",t,e)},styleAttr:function(e,n,t){if("object"===l(n))for(var i in t)this.styleAttr(e,i,t[i]);var r=new Xe(this._stepper).to(t);return this.queue(function(){r=r.from(this.element()[e](n))},function(t){return this.element()[e](n,r.at(t)),r.done()}),this},zoom:function(t,e){var n=new Xe(this._stepper).to(new At(t));return this.queue(function(){n=n.from(this.zoom())},function(t){return this.element().zoom(n.at(t),e),n.done()}),this},transform:function(d,v,y){if(v=d.relative||v,this._isDeclarative&&!v&&this._tryRetarget("transform",d))return this;var p=I(d);y=null!=d.affine?d.affine:null!=y?y:!p;var m,g,w,k,b,x=(new Xe).type(y?He:Ne).stepper(this._stepper);return this.queue(function(){g=g||this.element(),m=m||X(d,g),b=new Ne(v?void 0:g),g.addRunner(this),v||g._clearTransformRunnersBefore(this)},function(t){v||this.clearTransform();var e=new re(m).transform(g._currentTransform(this)),n=e.x,i=e.y,r=new Ne(_({},d,{origin:[n,i]})),s=this._isDeclarative&&w?w:b;if(y){r=r.decompose(n,i),s=s.decompose(n,i);var u=r.rotate,o=s.rotate,a=[u-360,u,u+360],h=a.map(function(t){return Math.abs(t-o)}),l=Math.min.apply(Math,O(h)),c=h.indexOf(l);r.rotate=a[c]}v&&(p||(r.rotate=d.rotate||0),this._isDeclarative&&k&&(s.rotate=k)),x.from(s),x.to(r);var f=x.at(t);return k=f.rotate,w=new Ne(f),this.addTransform(w),x.done()},function(t){(t.origin||"center").toString()!==(d.origin||"center").toString()&&(m=X(d,g)),d=_({},t,{origin:m})}),this._isDeclarative&&this._rememberMorpher("transform",x),this},x:function(t,e){return this._queueNumber("x",t)},y:function(t){return this._queueNumber("y",t)},dx:function(t){return this._queueNumberDelta("dx",t)},dy:function(t){return this._queueNumberDelta("dy",t)},_queueNumberDelta:function(e,n){if(n=new At(n),this._tryRetargetDelta(e,n))return this;var i=new Xe(this._stepper).to(n);return this.queue(function(){var t=this.element()[e]();i.from(t),i.to(t+n)},function(t){return this.element()[e](i.at(t)),i.done()}),this._rememberMorpher(e,i),this},_queueObject:function(e,t){if(this._tryRetarget(e,t))return this;var n=new Xe(this._stepper).to(t);return this.queue(function(){n.from(this.element()[e]())},function(t){return this.element()[e](n.at(t)),n.done()}),this._rememberMorpher(e,n),this},_queueNumber:function(t,e){return this._queueObject(t,new At(e))},cx:function(t){return this._queueNumber("cx",t)},cy:function(t){return this._queueNumber("cy",t)},move:function(t,e){return this.x(t).y(e)},center:function(t,e){return this.cx(t).cy(e)},size:function(t,e){var n;return t&&e||(n=this._element.bbox()),t||(t=n.width/n.height*e),e||(e=n.height/n.width*t),this.width(t).height(e)},width:function(t){return this._queueNumber("width",t)},height:function(t){return this._queueNumber("height",t)},plot:function(t,e,n,i){return 4===arguments.length?this.plot([t,e,n,i]):this._queueObject("plot",new this._element.MorphArray(t))},leading:function(t){return this._queueNumber("leading",t)},viewbox:function(t,e,n,i){return this._queueObject("viewbox",new se(t,e,n,i))},update:function(t){return"object"!==l(t)?this.update({offset:t,color:arguments[1],opacity:arguments[2]}):(null!=t.opacity&&this.attr("stop-opacity",t.opacity),null!=t.color&&this.attr("stop-color",t.color),null!=t.offset&&this.attr("offset",t.offset),this)}});var en=Object.freeze({EventTarget:vt,Dom:Ct,Element:Mt,Shape:St,Container:Tt,HtmlNode:Et,Doc:Rt,Defs:Nt,G:qt,Animator:Ft,Bare:It,Circle:$t,ClipPath:Zt,A:Kt,Ellipse:te,Stop:ee,Gradient:oe,Image:he,Line:de,Marker:ve,Mask:ye,Path:be,Pattern:ae,Polygon:_e,Polyline:Oe,Rect:Ae,Symbol:Ce,Text:Me,TextPath:Se,Tspan:Te,Use:Ee,SVGNumber:At,SVGArray:Ot,PathArray:pe,PointArray:le,Matrix:Ne,Point:re,Box:se,Color:xt,Morphable:Xe,Queue:Lt,Runner:$e,Timeline:Ue,Controller:qe,Ease:Re,PID:Ie,Spring:Fe});Pt("Dom",{siblings:function(){return this.parent().children()},position:function(){return this.parent().index(this)},next:function(){return this.siblings()[this.position()+1]},prev:function(){return this.siblings()[this.position()-1]},forward:function(){var t=this.position()+1,e=this.parent();return e.removeElement(this).add(this,t),"function"==typeof e.isRoot&&e.isRoot()&&e.node.appendChild(e.defs().node),this},backward:function(){var t=this.position();return 0<t&&this.parent().removeElement(this).add(this,t-1),this},front:function(){var t=this.parent();return t.node.appendChild(this.node),"function"==typeof t.isRoot&&t.isRoot()&&t.node.appendChild(t.defs().node),this},back:function(){return 0<this.position()&&this.parent().removeElement(this).add(this,0),this},before:function(t){t.remove();var e=this.position();return this.parent().add(t,e),this},after:function(t){t.remove();var e=this.position();return this.parent().add(t,e+1),this}}),Pt("Dom",{data:function(e,t,n){if("object"===l(e))for(t in e)this.data(t,e[t]);else if(arguments.length<2)try{return JSON.parse(this.attr("data-"+e))}catch(t){return this.attr("data-"+e)}else this.attr("data-"+e,null===t?null:!0===n||"string"==typeof t||"number"==typeof t?t:JSON.stringify(t));return this}}),Pt("Dom",{classes:function(){var t=this.attr("class");return null==t?[]:t.trim().split(C)},hasClass:function(t){return-1!==this.classes().indexOf(t)},addClass:function(t){if(!this.hasClass(t)){var e=this.classes();e.push(t),this.attr("class",e.join(" "))}return this},removeClass:function(e){return this.hasClass(e)&&this.attr("class",this.classes().filter(function(t){return t!==e}).join(" ")),this},toggleClass:function(t){return this.hasClass(t)?this.removeClass(t):this.addClass(t)}}),Pt("Dom",{css:function(t,e){var n={};if(0===arguments.length)return this.node.style.cssText.split(/\s*;\s*/).filter(function(t){return!!t.length}).forEach(function(t){var e=t.split(/\s*:\s*/);n[e[0]]=e[1]}),n;if(arguments.length<2){if(Array.isArray(t)){var i=!0,r=!1,s=void 0;try{for(var u,o=t[Symbol.iterator]();!(i=(u=o.next()).done);i=!0){var a=D(u.value);n[a]=this.node.style[a]}}catch(t){r=!0,s=t}finally{try{i||null==o.return||o.return()}finally{if(r)throw s}}return n}if("string"==typeof t)return this.node.style[D(t)];if("object"===l(t))for(var h in t)this.node.style[D(h)]=null==t[h]||b.test(t[h])?"":t[h]}return 2===arguments.length&&(this.node.style[D(t)]=null==e||b.test(e)?"":e),this},show:function(){return this.css("display","")},hide:function(){return this.css("display","none")},visible:function(){return"none"!==this.css("display")}}),Pt("Element",{untransform:function(){return this.attr("transform",null)},matrixify:function(){return(this.attr("transform")||"").split(t).slice(0,-1).map(function(t){var e=t.trim().split("(");return[e[0],e[1].split(C).map(function(t){return parseFloat(t)})]}).reverse().reduce(function(t,e){return"matrix"===e[0]?t.lmultiply(q(e[1])):t[e[0]].apply(t,e[1])},new Ne)},toParent:function(t){if(this===t)return this;var e=this.screenCTM(),n=t.screenCTM().inverse();return this.addTo(t).untransform().transform(n.multiply(e)),this},toDoc:function(){return this.toParent(this.doc())},transform:function(t,e){if(null==t||"string"==typeof t){var n=new Ne(this).decompose();return n[t]||n}I(t)||(t=_({},t,{origin:X(t,this)}));var i=new Ne(!0===e?this:e||!1).transform(t);return this.attr("transform",i)}}),Pt("Dom",{remember:function(t,e){if("object"===l(t))for(var n in t)this.remember(n,t[n]);else{if(1===arguments.length)return this.memory()[t];this.memory()[t]=e}return this},forget:function(){if(0===arguments.length)this._memory={};else for(var t=arguments.length-1;0<=t;t--)delete this.memory()[arguments[t]];return this},memory:function(){return this._memory=this._memory||{}}});var nn={stroke:["color","width","opacity","linecap","linejoin","miterlimit","dasharray","dashoffset"],fill:["color","opacity","rule"],prefix:function(t,e){return"color"===e?t:t+"-"+e}};["fill","stroke"].forEach(function(e){var n,t={};t[e]=function(t){if(void 0===t)return this;if("string"==typeof t||xt.isRgb(t)||t instanceof Mt)this.attr(e,t);else for(n=nn[e].length-1;0<=n;n--)null!=t[nn[e][n]]&&this.attr(nn.prefix(e,nn[e][n]),t[nn[e][n]]);return this},Pt(["Shape","Runner"],t)}),Pt(["Element","Runner"],{matrix:function(t,e,n,i,r,s){return null==t?new Ne(this):this.attr("transform",new Ne(t,e,n,i,r,s))},rotate:function(t,e,n){return this.transform({rotate:t,ox:e,oy:n},!0)},skew:function(t,e,n,i){return 1===arguments.length||3===arguments.length?this.transform({skew:t,ox:e,oy:n},!0):this.transform({skew:[t,e],ox:n,oy:i},!0)},shear:function(t,e,n){return this.transform({shear:t,ox:e,oy:n},!0)},scale:function(t,e,n,i){return 1===arguments.length||3===arguments.length?this.transform({scale:t,ox:e,oy:n},!0):this.transform({scale:[t,e],ox:n,oy:i},!0)},translate:function(t,e){return this.transform({translate:[t,e]},!0)},relative:function(t,e){return this.transform({relative:[t,e]},!0)},flip:function(t,e){var n="string"==typeof t?t:(isFinite(t),"both"),i="both"===t&&isFinite(e)?[e,e]:"x"===t?[e,0]:"y"===t?[0,e]:isFinite(t)?[t,t]:[0,0];this.transform({flip:n,origin:i},!0)},opacity:function(t){return this.attr("opacity",t)},dx:function(t){return this.x(new At(t).plus(this instanceof $e?0:this.x()),!0)},dy:function(t){return this.y(new At(t).plus(this instanceof $e?0:this.y()),!0)},dmove:function(t,e){return this.dx(t).dy(e)}}),Pt("radius",{radius:function(t,e){var n=(this._element||this).type;return"radialGradient"===n||"radialGradient"===n?this.attr("r",new At(t)):this.rx(t).ry(null==e?t:e)}}),Pt("Path",{length:function(){return this.node.getTotalLength()},pointAt:function(t){return new re(this.node.getPointAtLength(t))}}),Pt(["Element","Runner"],{font:function(t,e){if("object"===l(t))for(e in t)this.font(e,t[e]);return"leading"===t?this.leading(e):"anchor"===t?this.attr("text-anchor",e):"size"===t||"family"===t||"weight"===t||"stretch"===t||"variant"===t||"style"===t?this.attr("font-"+t,e):this.attr(t,e)}});var rn=$;function sn(t){return K(t)}return rn([Rt,Ce,he,ae,ve],zt("viewbox")),rn([de,Oe,_e,be],zt("marker")),rn(Me,zt("Text")),rn(be,zt("Path")),rn(Nt,zt("Defs")),rn([Me,Te],zt("Tspan")),rn([Ae,te,$t,oe],zt("radius")),rn(vt,zt("EventTarget")),rn(Ct,zt("Dom")),rn(Mt,zt("Element")),rn(St,zt("Shape")),rn(Tt,zt("Container")),function(){var t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:[];Ve.push.apply(Ve,O([].concat(t)))}([At,xt,se,Ne,Ot,le,pe]),$(Ve,{to:function(t,e){return(new Xe).type(this.constructor).from(this.valueOf()).to(t,e)},fromArray:function(t){return this.init(t),this}}),Object.assign(sn,en),Object.assign(sn,W),Object.assign(sn,ut),sn.utils=mt,sn.regex=e,(sn.get=sn).find=Wt,Object.assign(sn,B),sn.easing=Pe,Object.assign(sn,dt),sn.TransformBag=He,sn.ObjectBag=Ge,sn.NonMorphable=Ye,sn.parser=ie,sn.defaults=bt,sn}();
+var SVG=function(){"use strict";function l(t){return(l="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function o(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function i(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function a(t,e,n){return e&&i(t.prototype,e),n&&i(t,n),t}function _(r){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{},e=Object.keys(s);"function"==typeof Object.getOwnPropertySymbols&&(e=e.concat(Object.getOwnPropertySymbols(s).filter(function(t){return Object.getOwnPropertyDescriptor(s,t).enumerable}))),e.forEach(function(t){var e,n,i;e=r,i=s[n=t],n in e?Object.defineProperty(e,n,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[n]=i})}return r}function r(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&n(t,e)}function u(t){return(u=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function n(t,e){return(n=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}function s(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function h(t,e){return!e||"object"!=typeof e&&"function"!=typeof e?s(t):e}function c(t,e,n){return(c="undefined"!=typeof Reflect&&Reflect.get?Reflect.get:function(t,e,n){var i=function(t,e){for(;!Object.prototype.hasOwnProperty.call(t,e)&&null!==(t=u(t)););return t}(t,e);if(i){var r=Object.getOwnPropertyDescriptor(i,e);return r.get?r.get.call(n):r.value}})(t,e,n||t)}function f(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var n=[],i=!0,r=!1,s=void 0;try{for(var u,o=t[Symbol.iterator]();!(i=(u=o.next()).done)&&(n.push(u.value),!e||n.length!==e);i=!0);}catch(t){r=!0,s=t}finally{try{i||null==o.return||o.return()}finally{if(r)throw s}}return n}(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}function O(t){return function(t){if(Array.isArray(t)){for(var e=0,n=new Array(t.length);e<t.length;e++)n[e]=t[e];return n}}(t)||function(t){if(Symbol.iterator in Object(t)||"[object Arguments]"===Object.prototype.toString.call(t))return Array.from(t)}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}var t=function(){function t(){o(this,t),this._first=null,this._last=null}return a(t,[{key:"push",value:function(t){var e=t.next?t:{value:t,next:null,prev:null};return this._last?(e.prev=this._last,this._last.next=e,this._last=e):(this._last=e,this._first=e),e}},{key:"shift",value:function(){var t=this._first;return t?(this._first=t.next,this._first&&(this._first.prev=null),this._last=this._first?this._last:null,t.value):null}},{key:"first",value:function(){return this._first&&this._first.value}},{key:"last",value:function(){return this._last&&this._last.value}},{key:"remove",value:function(t){t.prev&&(t.prev.next=t.next),t.next&&(t.next.prev=t.prev),t===this._last&&(this._last=t.prev),t===this._first&&(this._first=t.next),t.prev=null,t.next=null}}]),t}(),d={nextDraw:null,frames:new t,timeouts:new t,timer:window.performance||window.Date,transforms:[],frame:function(t){var e=d.frames.push({run:t});return null===d.nextDraw&&(d.nextDraw=window.requestAnimationFrame(d._draw)),e},transform_frame:function(t,e){d.transforms[e]=t},timeout:function(t,e){e=e||0;var n=d.timer.now()+e,i=d.timeouts.push({run:t,time:n});return null===d.nextDraw&&(d.nextDraw=window.requestAnimationFrame(d._draw)),i},cancelFrame:function(t){d.frames.remove(t)},clearTimeout:function(t){d.timeouts.remove(t)},_draw:function(t){for(var e=null,n=d.timeouts.last();(e=d.timeouts.shift())&&(t>=e.time?e.run():d.timeouts.push(e),e!==n););for(var i=null,r=d.frames.last();i!==r&&(i=d.frames.shift());)i.run();d.transforms.forEach(function(t){t()}),d.nextDraw=d.timeouts.first()||d.frames.first()?window.requestAnimationFrame(d._draw):null}},v=/^([+-]?(\d+(\.\d*)?|\.\d+)(e[+-]?\d+)?)([a-z%]*)$/i,y=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i,p=/rgb\((\d+),(\d+),(\d+)\)/,m=/(#[a-z0-9\-_]+)/i,e=/\)\s*,?\s*/,g=/\s/g,w=/^#[a-f0-9]{3,6}$/i,k=/^rgb\(/,b=/^(\s+)?$/,x=/^[+-]?(\d+(\.\d*)?|\.\d+)(e[+-]?\d+)?$/i,A=/\.(jpg|jpeg|png|gif|svg)(\?[^=]+.*)?/i,C=/[\s,]+/,j=/([^e])-/gi,M=/[MLHVCSQTAZ]/gi,S=/[MLHVCSQTAZ]/i,T=/((\d?\.\d+(?:e[+-]?\d+)?)((?:\.\d+(?:e[+-]?\d+)?)+))+/gi,E=/\./g,N=Object.freeze({numberAndUnit:v,hex:y,rgb:p,reference:m,transforms:e,whitespace:g,isHex:w,isRgb:k,isCss:/[^:]+:[^;]+;?/,isBlank:b,isNumber:x,isPercent:/^-?[\d.]+%$/,isImage:A,delimiter:C,hyphen:j,pathLetters:M,isPathLetter:S,numbersWithDots:T,dots:E}),D=function(){try{return Function("name","baseClass","_constructor",["baseClass = baseClass || Array","return {","[name]: class extends baseClass {","constructor (...args) {","super(...args)","_constructor && _constructor.apply(this, args)","}","}","}[name]"].join("\n"))}catch(t){return function(t){var e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:Array,n=2<arguments.length?arguments[2]:void 0,i=function(){e.apply(this,arguments),n&&n.apply(this,arguments)};return(i.prototype=Object.create(e.prototype)).constructor=i}}}(),P="http://www.w3.org/2000/svg",z="http://www.w3.org/2000/xmlns/",R="http://www.w3.org/1999/xlink",q="http://svgjs.com/svgjs",L=Object.freeze({ns:P,xmlns:z,xlink:R,svgjs:q}),F=function t(){o(this,t)};function I(t,e,n,i){return n+i.replace(E," .")}function X(t){return t.toLowerCase().replace(/-(.)/g,function(t,e){return e.toUpperCase()})}function Y(t){return t.charAt(0).toUpperCase()+t.slice(1)}function H(t){var e=t.toString(16);return 1===e.length?"0"+e:e}function G(t,e,n){if(null==e||null==n){var i=t.bbox();null==e?e=i.width/i.height*n:null==n&&(n=i.height/i.width*e)}return{width:e,height:n}}function V(t){return{a:t[0],b:t[1],c:t[2],d:t[3],e:t[4],f:t[5]}}var B="abcdef".split("");function Q(t,e,n){return Math.abs(e-t)<(n||1e-6)}function U(t){return null!=t.a||null!=t.b||null!=t.c||null!=t.d||null!=t.e||null!=t.f}function $(t,e){var n,i,r=t.origin;if("string"==typeof r||null==r){var s=(r||"center").toLowerCase().trim(),u=e.bbox(),o=u.height,a=u.width,h=u.x,l=u.y,c=s.includes("left")?h:s.includes("right")?h+a:h+a/2,f=s.includes("top")?l:s.includes("bottom")?l+o:l+o/2;n=null!=t.ox?t.ox:c,i=null!=t.oy?t.oy:f}else n=r[0],i=r[1];return[n,i]}var W={},J=Symbol("root");function Z(t){if(t instanceof F)return t;if("object"===l(t))return K(t);if(null==t)return new W[J];if("string"==typeof t&&"<"!==t.charAt(0))return K(document.querySelector(t));var e=ot("svg");return e.innerHTML=t,t=K(e.firstChild)}function K(t){return t?t.instance instanceof F?t.instance:t instanceof window.SVGElement?"svg"===t.nodeName?new W[J](t):"linearGradient"===t.nodeName||"radialGradient"===t.nodeName?new W.Gradient(t):W[Y(t.nodeName)]?new(W[Y(t.nodeName)])(t):new W.Bare(t):new W.HtmlNode(t):null}function tt(t){var e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:t.name,n=2<arguments.length&&void 0!==arguments[2]&&arguments[2];return W[e]=t,n&&(W[J]=t),t}function et(t){return W[t]}var nt=1e3;function it(t){return"Svgjs"+Y(t)+nt++}function rt(t){for(var e=t.children.length-1;0<=e;e--)rt(t.children[e]);return t.id?K(t).id(it(t.nodeName)):K(t)}var st=Object.freeze({root:J,makeInstance:Z,adopt:K,register:tt,getClass:et,eid:it,assignNewId:rt});function ut(t,e){return e||ot(t)}function ot(t){return document.createElementNS(P,t)}function at(t,e){var n,i;for(i=(t=Array.isArray(t)?t:[t]).length-1;0<=i;i--)for(n in e)t[i].prototype[n]=e[n]}var ht=Object.freeze({nodeOrNew:ut,makeNode:ot,extend:at,addFactory:function(t,e){at(t,e)},invent:function(e){var t="function"==typeof e.create?e.create:function(t){e.inherit.call(this,t||ot(e.create))};return e.inherit&&(t.prototype=new e.inherit,t.prototype.constructor=t),e.extend&&at(t,e.extend),e.construct&&at(e.parent||et("Container"),e.construct),t}}),lt=D("SVGArray",Array,function(){this.init.apply(this,arguments)});at(lt,{init:function(){this.length=0,this.push.apply(this,O(this.parse.apply(this,arguments)))},toArray:function(){return Array.prototype.concat.apply([],this)},toString:function(){return this.join(" ")},valueOf:function(){var t=[];return t.push.apply(t,O(this)),t},parse:function(){var t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:[];return t instanceof Array?t:t.trim().split(C).map(parseFloat)},clone:function(){return new this.constructor(this)},toSet:function(){return new Set(this)}});var ct=function(){function n(){o(this,n),this.init.apply(this,arguments)}return a(n,[{key:"init",value:function(t,e){e=Array.isArray(t)?t[1]:e,t=Array.isArray(t)?t[0]:t,this.value=0,this.unit=e||"","number"==typeof t?this.value=isNaN(t)?0:isFinite(t)?t:t<0?-34e37:34e37:"string"==typeof t?(e=t.match(v))&&(this.value=parseFloat(e[1]),"%"===e[5]?this.value/=100:"s"===e[5]&&(this.value*=1e3),this.unit=e[5]):t instanceof n&&(this.value=t.valueOf(),this.unit=t.unit)}},{key:"toString",value:function(){return("%"===this.unit?~~(1e8*this.value)/1e6:"s"===this.unit?this.value/1e3:this.value)+this.unit}},{key:"toJSON",value:function(){return this.toString()}},{key:"toArray",value:function(){return[this.value,this.unit]}},{key:"valueOf",value:function(){return this.value}},{key:"plus",value:function(t){return new n(this+(t=new n(t)),this.unit||t.unit)}},{key:"minus",value:function(t){return new n(this-(t=new n(t)),this.unit||t.unit)}},{key:"times",value:function(t){return new n(this*(t=new n(t)),this.unit||t.unit)}},{key:"divide",value:function(t){return new n(this/(t=new n(t)),this.unit||t.unit)}}]),n}(),ft=0;function dt(t){var e=Z(t).getEventHolder();return e.events||(e.events={}),e.events}function vt(t){return Z(t).getEventTarget()}function yt(t,e,i,n,r){var s=i.bind(n||t),u=dt(t),o=vt(t);e=Array.isArray(e)?e:e.split(C),i._svgjsListenerId||(i._svgjsListenerId=++ft),e.forEach(function(t){var e=t.split(".")[0],n=t.split(".")[1]||"*";u[e]=u[e]||{},u[e][n]=u[e][n]||{},u[e][n][i._svgjsListenerId]=s,o.addEventListener(e,s,r||!1)})}function pt(u,t,o,a){var h=dt(u),l=vt(u);("function"!=typeof o||(o=o._svgjsListenerId))&&(t=Array.isArray(t)?t:(t||"").split(C)).forEach(function(t){var e,n,i,r=t&&t.split(".")[0],s=t&&t.split(".")[1];if(o)h[r]&&h[r][s||"*"]&&(l.removeEventListener(r,h[r][s||"*"][o],a||!1),delete h[r][s||"*"][o]);else if(r&&s){if(h[r]&&h[r][s]){for(n in h[r][s])pt(l,[r,s].join("."),n);delete h[r][s]}}else if(s)for(t in h)for(e in h[t])s===e&&pt(l,[t,s].join("."));else if(r){if(h[r]){for(e in h[r])pt(l,[r,e].join("."));delete h[r]}}else{for(t in h)pt(l,t);(i=Z(u).getEventHolder()).events&&(i.events={})}})}function mt(t,e,n){var i=vt(t);return e instanceof window.Event||(e=new window.CustomEvent(e,{detail:n,cancelable:!0})),i.dispatchEvent(e),e}var gt=Object.freeze({on:yt,off:pt,dispatch:mt}),wt={};function kt(t,e){if(Array.isArray(t)){var n=!0,i=!1,r=void 0;try{for(var s,u=t[Symbol.iterator]();!(n=(s=u.next()).done);n=!0){kt(s.value,e)}}catch(t){i=!0,r=t}finally{try{n||null==u.return||u.return()}finally{if(i)throw r}}}else if("object"!==l(t))wt[t]=Object.assign(wt[t]||{},e);else for(var o=Object.entries(t),a=0;a<o.length;a++){var h=f(o[a],2);kt(h[0],h[1])}}function bt(t){return wt[t]||{}}var xt=function(t){function i(){var t,e=(0<arguments.length&&void 0!==arguments[0]?arguments[0]:{}).events,n=void 0===e?{}:e;return o(this,i),(t=h(this,u(i).call(this))).events=n,t}return r(i,F),a(i,[{key:"addEventListener",value:function(){}},{key:"on",value:function(t,e,n,i){return yt(this,t,e,n,i),this}},{key:"off",value:function(t,e){return pt(this,t,e),this}},{key:"dispatch",value:function(t,e){return mt(this,t,e)}},{key:"dispatchEvent",value:function(t){var e=this.getEventHolder().events;if(!e)return!0;var n=e[t.type];for(var i in n)for(var r in n[i])n[i][r](t);return!t.defaultPrevented}},{key:"fire",value:function(t,e){return this.dispatch(t,e),this}},{key:"getEventHolder",value:function(){return this}},{key:"getEventTarget",value:function(){return this}},{key:"removeEventListener",value:function(){}}]),i}();function _t(t,e){var n,i=t.length,r=[];for(n=0;n<i;n++)r.push(e(t[n]));return r}function Ot(t){return t%360*Math.PI/180}kt("Element",["click","dblclick","mousedown","mouseup","mouseover","mouseout","mousemove","mouseenter","mouseleave","touchstart","touchmove","touchleave","touchend","touchcancel"].reduce(function(t,e){return t[e]=function(t){return null===t?pt(this,e):yt(this,e,t),this},t},{}));var At=Object.freeze({map:_t,filter:function(t,e){var n,i=t.length,r=[];for(n=0;n<i;n++)e(t[n])&&r.push(t[n]);return r},radians:Ot,degrees:function(t){return 180*t/Math.PI%360},filterSVGElements:function(t){return this.filter(t,function(t){return t instanceof window.SVGElement})}});function Ct(){}var jt={duration:400,ease:">",delay:0},Mt={"fill-opacity":1,"stroke-opacity":1,"stroke-width":0,"stroke-linejoin":"miter","stroke-linecap":"butt",fill:"#000000",stroke:"#000000",opacity:1,x:0,y:0,cx:0,cy:0,width:0,height:0,r:0,rx:0,ry:0,offset:0,"stop-opacity":1,"stop-color":"#000000","font-size":16,"font-family":"Helvetica, Arial, sans-serif","text-anchor":"start"},St=Object.freeze({noop:Ct,timeline:jt,attrs:Mt}),Tt=function(){function t(){o(this,t),this.init.apply(this,arguments)}return a(t,[{key:"init",value:function(t,e,n){var i,r;(this.r=0,this.g=0,this.b=0,t)&&("string"==typeof t?k.test(t)?(i=p.exec(t.replace(g,"")),this.r=parseInt(i[1]),this.g=parseInt(i[2]),this.b=parseInt(i[3])):w.test(t)&&(i=y.exec(4===(r=t).length?["#",r.substring(1,2),r.substring(1,2),r.substring(2,3),r.substring(2,3),r.substring(3,4),r.substring(3,4)].join(""):r),this.r=parseInt(i[1],16),this.g=parseInt(i[2],16),this.b=parseInt(i[3],16)):Array.isArray(t)?(this.r=t[0],this.g=t[1],this.b=t[2]):"object"===l(t)?(this.r=t.r,this.g=t.g,this.b=t.b):3===arguments.length&&(this.r=t,this.g=e,this.b=n))}},{key:"toString",value:function(){return this.toHex()}},{key:"toArray",value:function(){return[this.r,this.g,this.b]}},{key:"toHex",value:function(){return"#"+H(Math.round(this.r))+H(Math.round(this.g))+H(Math.round(this.b))}},{key:"toRgb",value:function(){return"rgb("+[this.r,this.g,this.b].join()+")"}},{key:"brightness",value:function(){return this.r/255*.3+this.g/255*.59+this.b/255*.11}}],[{key:"test",value:function(t){return t+="",w.test(t)||k.test(t)}},{key:"isRgb",value:function(t){return t&&"number"==typeof t.r&&"number"==typeof t.g&&"number"==typeof t.b}},{key:"isColor",value:function(t){return this.isRgb(t)||this.test(t)}}]),t}();var Et=function(t){function n(t){var e;return o(this,n),(e=h(this,u(n).call(this,t))).node=t,e.type=t.nodeName,e}return r(n,xt),a(n,[{key:"add",value:function(t,e){return t=Z(t),null==e?this.node.appendChild(t.node):t.node!==this.node.childNodes[e]&&this.node.insertBefore(t.node,this.node.childNodes[e]),this}},{key:"addTo",value:function(t){return Z(t).put(this)}},{key:"children",value:function(){return _t(this.node.children,function(t){return K(t)})}},{key:"clear",value:function(){for(;this.node.hasChildNodes();)this.node.removeChild(this.node.lastChild);return delete this._defs,this}},{key:"clone",value:function(t){this.writeDataToDom();var e=rt(this.node.cloneNode(!0));return t?t.add(e):this.after(e),e}},{key:"each",value:function(t,e){var n,i,r=this.children();for(n=0,i=r.length;n<i;n++)t.apply(r[n],[n,r]),e&&r[n].each(t,e);return this}},{key:"first",value:function(){return K(this.node.firstChild)}},{key:"get",value:function(t){return K(this.node.childNodes[t])}},{key:"getEventHolder",value:function(){return this.node}},{key:"getEventTarget",value:function(){return this.node}},{key:"has",value:function(t){return 0<=this.index(t)}},{key:"id",value:function(t){return void 0!==t||this.node.id||(this.node.id=it(this.type)),this.attr("id",t)}},{key:"index",value:function(t){return[].slice.call(this.node.childNodes).indexOf(t.node)}},{key:"last",value:function(){return K(this.node.lastChild)}},{key:"matches",value:function(t){return e=this.node,n=t,(e.matches||e.matchesSelector||e.msMatchesSelector||e.mozMatchesSelector||e.webkitMatchesSelector||e.oMatchesSelector).call(e,n);var e,n}},{key:"native",value:function(){return this.node}},{key:"parent",value:function(t){var e=this;if(!e.node.parentNode)return null;if(e=K(e.node.parentNode),!t)return e;for(;e&&e.node instanceof window.SVGElement;){if("string"==typeof t?e.matches(t):e instanceof t)return e;e=K(e.node.parentNode)}}},{key:"put",value:function(t,e){return this.add(t,e),t}},{key:"putIn",value:function(t){return Z(t).add(this)}},{key:"remove",value:function(){return this.parent()&&this.parent().removeElement(this),this}},{key:"removeElement",value:function(t){return this.node.removeChild(t.node),this}},{key:"replace",value:function(t){return this.after(t).remove(),t}},{key:"toString",value:function(){return this.id()}},{key:"svg",value:function(t){var e,n;if(!t)return this.writeDataToDom(),this.node.outerHTML;for((e=document.createElementNS(P,"svg")).innerHTML=t,n=e.children.length;n--;)this.node.appendChild(e.firstElementChild);return this}},{key:"writeDataToDom",value:function(){return this.each(function(){this.writeDataToDom()}),this}}]),n}();at(Et,{attr:function(t,e,n){if(null==t){t={},e=this.node.attributes;var i=!0,r=!1,s=void 0;try{for(var u,o=e[Symbol.iterator]();!(i=(u=o.next()).done);i=!0){var a=u.value;t[a.nodeName]=x.test(a.nodeValue)?parseFloat(a.nodeValue):a.nodeValue}}catch(t){r=!0,s=t}finally{try{i||null==o.return||o.return()}finally{if(r)throw s}}return t}if(Array.isArray(t));else if("object"===l(t))for(e in t)this.attr(e,t[e]);else if(null===e)this.node.removeAttribute(t);else{if(null==e)return null==(e=this.node.getAttribute(t))?Mt[t]:x.test(e)?parseFloat(e):e;for("fill"!==t&&"stroke"!==t||A.test(e)&&(e=this.doc().defs().image(e));"function"==typeof e.attrHook;)e=e.attrHook(this,t);"number"==typeof e?e=new ct(e):Tt.isColor(e)?e=new Tt(e):e.constructor===Array&&(e=new lt(e)),"leading"===t?this.leading&&this.leading(e):"string"==typeof n?this.node.setAttributeNS(n,t,e.toString()):this.node.setAttribute(t,e.toString()),!this.rebuild||"font-size"!==t&&"x"!==t||this.rebuild()}return this}});var Nt=et(J),Dt=function(t){function n(t){var e;return o(this,n),(e=h(this,u(n).call(this,t))).dom={},e.node.instance=s(s(e)),t.hasAttribute("svgjs:data")&&e.setData(JSON.parse(t.getAttribute("svgjs:data"))||{}),e}return r(n,Et),a(n,[{key:"center",value:function(t,e){return this.cx(t).cy(e)}},{key:"cx",value:function(t){return null==t?this.x()+this.width()/2:this.x(t-this.width()/2)}},{key:"cy",value:function(t){return null==t?this.y()+this.height()/2:this.y(t-this.height()/2)}},{key:"defs",value:function(){return this.doc().defs()}},{key:"doc",value:function(){var t=this.parent(Nt);return t&&t.doc()}},{key:"getEventHolder",value:function(){return this}},{key:"height",value:function(t){return this.attr("height",t)}},{key:"inside",value:function(t,e){var n=this.bbox();return t>n.x&&e>n.y&&t<n.x+n.width&&e<n.y+n.height}},{key:"move",value:function(t,e){return this.x(t).y(e)}},{key:"parents",value:function(t){var e=[],n=this;do{if(!(n=n.parent(t))||n instanceof et("HtmlNode"))break;e.push(n)}while(n.parent);return e}},{key:"reference",value:function(t){var e=function(t){var e=(t||"").toString().match(m);if(e)return e[1]}(this.attr(t));return e?Z(e):null}},{key:"setData",value:function(t){return this.dom=t,this}},{key:"size",value:function(t,e){var n=G(this,t,e);return this.width(new ct(n.width)).height(new ct(n.height))}},{key:"width",value:function(t){return this.attr("width",t)}},{key:"writeDataToDom",value:function(){return this.node.removeAttribute("svgjs:data"),Object.keys(this.dom).length&&this.node.setAttribute("svgjs:data",JSON.stringify(this.dom)),c(u(n.prototype),"writeDataToDom",this).call(this)}},{key:"x",value:function(t){return this.attr("x",t)}},{key:"y",value:function(t){return this.attr("y",t)}}]),n}(),Pt=function(t){function e(){return o(this,e),h(this,u(e).apply(this,arguments))}return r(e,Dt),a(e,[{key:"flatten",value:function(t){return this.each(function(){return this instanceof e?this.flatten(t).ungroup(t):this.toParent(t)}),this.node.firstElementChild||this.remove(),this}},{key:"ungroup",value:function(t){return t=t||this.parent(),this.each(function(){return this.toParent(t)}),this.remove(),this}}]),e}(),zt=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut(t,"string"==typeof t?null:t),e))}return r(e,Pt),a(e,[{key:"words",value:function(t){for(;this.node.hasChildNodes();)this.node.removeChild(this.node.lastChild);return this.node.appendChild(document.createTextNode(t)),this}}]),e}();tt(zt),kt("Container",{element:function(t,e){return this.put(new zt(t,e))}});var Rt=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("defs",t),e))}return r(e,Pt),a(e,[{key:"flatten",value:function(){return this}},{key:"ungroup",value:function(){return this}}]),e}();tt(Rt);var qt=function(t){function n(t){var e;return o(this,n),(e=h(this,u(n).call(this,ut("svg",t),n))).namespace(),e}return r(n,Pt),a(n,[{key:"isRoot",value:function(){return!(this.node.parentNode&&this.node.parentNode instanceof window.SVGElement&&"#document"!==this.node.parentNode.nodeName)}},{key:"doc",value:function(){return this.isRoot()?this:c(u(n.prototype),"doc",this).call(this)}},{key:"namespace",value:function(){return this.isRoot()?this.attr({xmlns:P,version:"1.1"}).attr("xmlns:xlink",R,z).attr("xmlns:svgjs",q,z):this.doc().namespace()}},{key:"defs",value:function(){return this.isRoot()?K(this.node.getElementsByTagName("defs")[0])||this.put(new Rt):this.doc().defs()}},{key:"parent",value:function(t){return this.isRoot()?"#document"===this.node.parentNode.nodeName?null:K(this.node.parentNode):c(u(n.prototype),"parent",this).call(this,t)}},{key:"clear",value:function(){for(;this.node.hasChildNodes();)this.node.removeChild(this.node.lastChild);return this}}]),n}();function Lt(){if(!Lt.nodes){var t=(new qt).size(2,0).css({opacity:0,position:"absolute",left:"-100%",top:"-100%",overflow:"hidden"}),e=t.path().node;Lt.nodes={svg:t,path:e}}if(!Lt.nodes.svg.node.parentNode){var n=document.body||document.documentElement;Lt.nodes.svg.addTo(n)}return Lt.nodes}kt({Container:{nested:function(){return this.put(new qt)}}}),tt(qt,"Doc",!0);var Ft=function(){function r(t,e,n){var i;o(this,r),n=n||{x:0,y:0},i=Array.isArray(t)?{x:t[0],y:t[1]}:"object"===l(t)?{x:t.x,y:t.y}:{x:t,y:e},this.x=null==i.x?n.x:i.x,this.y=null==i.y?n.y:i.y}return a(r,[{key:"clone",value:function(){return new r(this)}},{key:"native",value:function(){var t=Lt().svg.node.createSVGPoint();return t.x=this.x,t.y=this.y,t}},{key:"transform",value:function(t){return new r(t.a*this.x+t.c*this.y+t.e,t.b*this.x+t.d*this.y+t.f)}}]),r}();kt({Element:{point:function(t,e){return new Ft(t,e).transform(this.screenCTM().inverse())}}});var It=function(){function u(){o(this,u),this.init.apply(this,arguments)}return a(u,[{key:"init",value:function(t){var e;t="string"==typeof t?t.split(C).map(parseFloat):Array.isArray(t)?t:"object"===l(t)?[null!=t.left?t.left:t.x,null!=t.top?t.top:t.y,t.width,t.height]:4===arguments.length?[].slice.call(arguments):[0,0,0,0],this.x=t[0],this.y=t[1],this.width=t[2],this.height=t[3],null==(e=this).x&&(e.x=0,e.y=0,e.width=0,e.height=0),e.w=e.width,e.h=e.height,e.x2=e.x+e.width,e.y2=e.y+e.height,e.cx=e.x+e.width/2,e.cy=e.y+e.height/2}},{key:"merge",value:function(t){var e=Math.min(this.x,t.x),n=Math.min(this.y,t.y);return new u(e,n,Math.max(this.x+this.width,t.x+t.width)-e,Math.max(this.y+this.height,t.y+t.height)-n)}},{key:"transform",value:function(e){var n=1/0,i=-1/0,r=1/0,s=-1/0;return[new Ft(this.x,this.y),new Ft(this.x2,this.y),new Ft(this.x,this.y2),new Ft(this.x2,this.y2)].forEach(function(t){t=t.transform(e),n=Math.min(n,t.x),i=Math.max(i,t.x),r=Math.min(r,t.y),s=Math.max(s,t.y)}),new u(n,r,i-n,s-r)}},{key:"addOffset",value:function(){return this.x+=window.pageXOffset,this.y+=window.pageYOffset,this}},{key:"toString",value:function(){return this.x+" "+this.y+" "+this.width+" "+this.height}},{key:"toArray",value:function(){return[this.x,this.y,this.width,this.height]}}]),u}();function Xt(e){var n,t,i;try{if(n=e(this.node),!((i=n).w||i.h||i.x||i.y||(t=this.node,(document.documentElement.contains||function(t){for(;t.parentNode;)t=t.parentNode;return t===document}).call(document.documentElement,t))))throw new Error("Element not in the dom")}catch(t){try{var r=this.clone(Lt().svg).show();n=e(r.node),r.remove()}catch(t){console.warn("Getting a bounding box of this element is not possible")}}return n}kt({Element:{bbox:function(){return new It(Xt.call(this,function(t){return t.getBBox()}))},rbox:function(t){var e=new It(Xt.call(this,function(t){return t.getBoundingClientRect()}));return t?e.transform(t.screenCTM().inverse()):e.addOffset()}},viewbox:{viewbox:function(t,e,n,i){return null==t?new It(this.attr("viewBox")):this.attr("viewBox",new It(t,e,n,i))}}});var Yt=function(t){function e(){return o(this,e),h(this,u(e).apply(this,arguments))}return r(e,Dt),e}();function Ht(t){return null==t?this.cx()-this.rx():this.cx(t+this.rx())}function Gt(t){return null==t?this.cy()-this.ry():this.cy(t+this.ry())}function Vt(t){return null==t?this.attr("cx"):this.attr("cx",t)}function Bt(t){return null==t?this.attr("cy"):this.attr("cy",t)}function Qt(t){return null==t?2*this.rx():this.rx(new ct(t).divide(2))}function Ut(t){return null==t?2*this.ry():this.ry(new ct(t).divide(2))}function $t(t,e){var n=G(this,t,e);return this.rx(new ct(n.width).divide(2)).ry(new ct(n.height).divide(2))}var Wt=Object.freeze({rx:function(t){return this.attr("rx",t)},ry:function(t){return this.attr("ry",t)},x:Ht,y:Gt,cx:Vt,cy:Bt,width:Qt,height:Ut,size:$t}),Jt=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("circle",t),e))}return r(e,Yt),a(e,[{key:"radius",value:function(t){return this.attr("r",t)}},{key:"rx",value:function(t){return this.attr("r",t)}},{key:"ry",value:function(t){return this.rx(t)}}]),e}();function Zt(t,e){return _t((e||document).querySelectorAll(t),function(t){return K(t)})}function Kt(t){return Zt(t,this.node)}at(Jt,{x:Ht,y:Gt,cx:Vt,cy:Bt,width:Qt,height:Ut,size:$t}),kt({Element:{circle:function(t){return this.put(new Jt).radius(new ct(t).divide(2)).move(0,0)}}}),tt(Jt),kt("Dom",{find:Kt});var te=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("clipPath",t),e))}return r(e,Pt),a(e,[{key:"remove",value:function(){return this.targets().forEach(function(t){t.unclip()}),c(u(e.prototype),"remove",this).call(this)}},{key:"targets",value:function(){return Zt('svg [clip-path*="'+this.id()+'"]')}}]),e}();function ee(e,n){return function(t){return null==t?this[t]:(this[e]=t,n&&n.call(this),this)}}kt({Container:{clip:function(){return this.defs().put(new te)}},Element:{clipWith:function(t){var e=t instanceof te?t:this.parent().clip().add(t);return this.attr("clip-path",'url("#'+e.id()+'")')},unclip:function(){return this.attr("clip-path",null)},clipper:function(){return this.reference("clip-path")}}}),tt(te);var ne={"-":function(t){return t},"<>":function(t){return-Math.cos(t*Math.PI)/2+.5},">":function(t){return Math.sin(t*Math.PI/2)},"<":function(t){return 1-Math.cos(t*Math.PI/2)},bezier:function(t,e,n,i){return function(t){}}},ie=function(){function t(){o(this,t)}return a(t,[{key:"done",value:function(){return!1}}]),t}(),re=function(t){function n(t){var e;return o(this,n),(e=h(this,u(n).call(this))).ease=ne[t||jt.ease]||t,e}return r(n,ie),a(n,[{key:"step",value:function(t,e,n){return"number"!=typeof t?n<1?t:e:t+(e-t)*this.ease(n)}}]),n}(),se=function(t){function n(t){var e;return o(this,n),(e=h(this,u(n).call(this))).stepper=t,e}return r(n,ie),a(n,[{key:"step",value:function(t,e,n,i){return this.stepper(t,e,n,i)}},{key:"done",value:function(t){return t.done}}]),n}();function ue(){var t=(this._duration||500)/1e3,e=this._overshoot||0,n=Math.PI,i=Math.log(e/100+1e-10),r=-i/Math.sqrt(n*n+i*i),s=3.9/(r*t);this.d=2*r*s,this.k=s*s}var oe=function(t){function i(t,e){var n;return o(this,i),(n=h(this,u(i).call(this))).duration(t||500).overshoot(e||0),n}return r(i,se),a(i,[{key:"step",value:function(t,e,n,i){if("string"==typeof t)return t;if(i.done=n===1/0,n===1/0)return e;if(0===n)return t;100<n&&(n=16),n/=1e3;var r=i.velocity||0,s=-this.d*r-this.k*(t-e),u=t+r*n+s*n*n/2;return i.velocity=r+s*n,i.done=Math.abs(e-u)+Math.abs(r)<.002,i.done?e:u}}]),i}();at(oe,{duration:ee("_duration",ue),overshoot:ee("_overshoot",ue)});var ae=function(t){function s(t,e,n,i){var r;return o(this,s),t=null==t?.1:t,e=null==e?.01:e,n=null==n?0:n,i=null==i?1e3:i,(r=h(this,u(s).call(this))).p(t).i(e).d(n).windup(i),r}return r(s,se),a(s,[{key:"step",value:function(t,e,n,i){if("string"==typeof t)return t;if(i.done=n===1/0,n===1/0)return e;if(0===n)return t;var r=e-t,s=(i.integral||0)+r*n,u=(r-(i.error||0))/n,o=this.windup;return!1!==o&&(s=Math.max(-o,Math.min(s,o))),i.error=r,i.integral=s,i.done=Math.abs(r)<.001,i.done?e:t+(this.P*r+this.I*s+this.D*u)}}]),s}();at(ae,{windup:ee("windup"),p:ee("P"),i:ee("I"),d:ee("D")});var he=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("ellipse",t),e))}return r(e,Yt),e}();at(he,Wt),kt("Container",{ellipse:function(t,e){return this.put(new he).size(t,e).move(0,0)}}),tt(he);var le=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("stop",t),e))}return r(e,Dt),a(e,[{key:"update",value:function(t){return("number"==typeof t||t instanceof ct)&&(t={offset:arguments[0],color:arguments[1],opacity:arguments[2]}),null!=t.opacity&&this.attr("stop-opacity",t.opacity),null!=t.color&&this.attr("stop-color",t.color),null!=t.offset&&this.attr("offset",new ct(t.offset)),this}}]),e}();tt(le);var ce=Object.freeze({from:function(t,e){return"radialGradient"===(this._element||this).type?this.attr({fx:new ct(t),fy:new ct(e)}):this.attr({x1:new ct(t),y1:new ct(e)})},to:function(t,e){return"radialGradient"===(this._element||this).type?this.attr({cx:new ct(t),cy:new ct(e)}):this.attr({x2:new ct(t),y2:new ct(e)})}}),fe=function(t){function i(t){return o(this,i),h(this,u(i).call(this,ut(t+"Gradient","string"==typeof t?null:t),i))}return r(i,Pt),a(i,[{key:"stop",value:function(t,e,n){return this.put(new le).update(t,e,n)}},{key:"update",value:function(t){return this.clear(),"function"==typeof t&&t.call(this,this),this}},{key:"url",value:function(){return"url(#"+this.id()+")"}},{key:"toString",value:function(){return this.url()}},{key:"attr",value:function(t,e,n){return"transform"===t&&(t="gradientTransform"),c(u(i.prototype),"attr",this).call(this,t,e,n)}},{key:"targets",value:function(){return Kt('svg [fill*="'+this.id()+'"]')}},{key:"bbox",value:function(){return new It}}]),i}();at(fe,ce),kt({Container:{gradient:function(t,e){return this.defs().gradient(t,e)}},Defs:{gradient:function(t,e){return this.put(new fe(t)).update(e)}}}),tt(fe);var de=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("g",t),e))}return r(e,Pt),e}();kt({Element:{group:function(){return this.put(new de)}}}),tt(de);var ve=function(t){function e(t){return o(this,e),h(this,u(e).call(this,t,e))}return r(e,Et),e}();tt(ve);var ye=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("a",t),e))}return r(e,Pt),a(e,[{key:"to",value:function(t){return this.attr("href",t,R)}},{key:"target",value:function(t){return this.attr("target",t)}}]),e}();kt({Container:{link:function(t){return this.put(new ye).to(t)}},Element:{linkTo:function(t){var e=new ye;return"function"==typeof t?t.call(e,e):e.to(t),this.parent().put(e).put(this)}}}),tt(ye);var pe=function(t){function i(t){return o(this,i),h(this,u(i).call(this,ut("pattern",t),i))}return r(i,Pt),a(i,[{key:"url",value:function(){return"url(#"+this.id()+")"}},{key:"update",value:function(t){return this.clear(),"function"==typeof t&&t.call(this,this),this}},{key:"toString",value:function(){return this.url()}},{key:"attr",value:function(t,e,n){return"transform"===t&&(t="patternTransform"),c(u(i.prototype),"attr",this).call(this,t,e,n)}},{key:"targets",value:function(){return Kt('svg [fill*="'+this.id()+'"]')}},{key:"bbox",value:function(){return new It}}]),i}();kt({Container:{pattern:function(t,e,n){return this.defs().pattern(t,e,n)}},Defs:{pattern:function(t,e,n){return this.put(new pe).update(n).attr({x:0,y:0,width:t,height:e,patternUnits:"userSpaceOnUse"})}}}),tt(pe);var me=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("image",t),e))}return r(e,Yt),a(e,[{key:"load",value:function(n,i){if(!n)return this;var r=new window.Image;return yt(r,"load",function(t){var e=this.parent(pe);0===this.width()&&0===this.height()&&this.size(r.width,r.height),e instanceof pe&&0===e.width()&&0===e.height()&&e.size(this.width(),this.height()),"function"==typeof i&&i.call(this,{width:r.width,height:r.height,ratio:r.width/r.height,url:n})},this),yt(r,"load error",function(){pt(r)}),this.attr("href",r.src=n,R)}},{key:"attrHook",value:function(t){var e=this;return t.doc().defs().pattern(0,0,function(t){t.add(e)})}}]),e}();kt({Container:{image:function(t,e){return this.put(new me).size(0,0).load(t,e)}}}),tt(me);var ge=D("PointArray",lt);at(ge,{toString:function(){for(var t=0,e=this.length,n=[];t<e;t++)n.push(this[t].join(","));return n.join(" ")},toLine:function(){return{x1:this[0][0],y1:this[0][1],x2:this[1][0],y2:this[1][1]}},at:function(t){if(!this.destination)return this;for(var e=0,n=this.length,i=[];e<n;e++)i.push([this[e][0]+(this.destination[e][0]-this[e][0])*t,this[e][1]+(this.destination[e][1]-this[e][1])*t]);return new ge(i)},parse:function(){var t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:[[0,0]],e=[];if(t instanceof Array){if(t[0]instanceof Array)return t}else t=t.trim().split(C).map(parseFloat);t.length%2!=0&&t.pop();for(var n=0,i=t.length;n<i;n+=2)e.push([t[n],t[n+1]]);return e},move:function(t,e){var n=this.bbox();if(t-=n.x,e-=n.y,!isNaN(t)&&!isNaN(e))for(var i=this.length-1;0<=i;i--)this[i]=[this[i][0]+t,this[i][1]+e];return this},size:function(t,e){var n,i=this.bbox();for(n=this.length-1;0<=n;n--)i.width&&(this[n][0]=(this[n][0]-i.x)*t/i.width+i.x),i.height&&(this[n][1]=(this[n][1]-i.y)*e/i.height+i.y);return this},bbox:function(){var e=-1/0,n=-1/0,i=1/0,r=1/0;return this.forEach(function(t){e=Math.max(t[0],e),n=Math.max(t[1],n),i=Math.min(t[0],i),r=Math.min(t[1],r)}),{x:i,y:r,width:e-i,height:n-r}}});var we=ge;var ke=Object.freeze({MorphArray:we,x:function(t){return null==t?this.bbox().x:this.move(t,this.bbox().y)},y:function(t){return null==t?this.bbox().y:this.move(this.bbox().x,t)},width:function(t){var e=this.bbox();return null==t?e.width:this.size(t,e.height)},height:function(t){var e=this.bbox();return null==t?e.height:this.size(e.width,t)}}),be=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("line",t),e))}return r(e,Yt),a(e,[{key:"array",value:function(){return new ge([[this.attr("x1"),this.attr("y1")],[this.attr("x2"),this.attr("y2")]])}},{key:"plot",value:function(t,e,n,i){return null==t?this.array():(t=void 0!==e?{x1:t,y1:e,x2:n,y2:i}:new ge(t).toLine(),this.attr(t))}},{key:"move",value:function(t,e){return this.attr(this.array().move(t,e).toLine())}},{key:"size",value:function(t,e){var n=G(this,t,e);return this.attr(this.array().size(n.width,n.height).toLine())}}]),e}();at(be,ke),kt({Container:{line:function(){for(var t=arguments.length,e=new Array(t),n=0;n<t;n++)e[n]=arguments[n];return be.prototype.plot.apply(this.put(new be),null!=e[0]?e:[0,0,0,0])}}}),tt(be);var xe=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("marker",t),e))}return r(e,Pt),a(e,[{key:"width",value:function(t){return this.attr("markerWidth",t)}},{key:"height",value:function(t){return this.attr("markerHeight",t)}},{key:"ref",value:function(t,e){return this.attr("refX",t).attr("refY",e)}},{key:"update",value:function(t){return this.clear(),"function"==typeof t&&t.call(this,this),this}},{key:"toString",value:function(){return"url(#"+this.id()+")"}}]),e}();kt({Container:{marker:function(t,e,n){return this.defs().marker(t,e,n)}},Defs:{marker:function(t,e,n){return this.put(new xe).size(t,e).ref(t/2,e/2).viewbox(0,0,t,e).attr("orient","auto").update(n)}},marker:{marker:function(t,e,n,i){var r=["marker"];return"all"!==t&&r.push(t),r=r.join("-"),t=e instanceof xe?e:this.defs().marker(e,n,i),this.attr(r,t)}}}),tt(xe);var _e=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("mask",t),e))}return r(e,Pt),a(e,[{key:"remove",value:function(){return this.targets().forEach(function(t){t.unmask()}),c(u(e.prototype),"remove",this).call(this)}},{key:"targets",value:function(){return Zt('svg [mask*="'+this.id()+'"]')}}]),e}();kt({Container:{mask:function(){return this.defs().put(new _e)}},Element:{maskWith:function(t){var e=t instanceof _e?t:this.parent().mask().add(t);return this.attr("mask",'url("#'+e.id()+'")')},unmask:function(){return this.attr("mask",null)},masker:function(){return this.reference("mask")}}}),tt(_e);var Oe=function(){function h(){o(this,h),this.init.apply(this,arguments)}return a(h,[{key:"init",value:function(t){var e=V([1,0,0,1,0,0]);t=t instanceof Dt?t.matrixify():"string"==typeof t?V(t.split(C).map(parseFloat)):Array.isArray(t)?V(t):"object"===l(t)&&U(t)?t:"object"===l(t)?(new h).transform(t):6===arguments.length?V([].slice.call(arguments)):e,this.a=null!=t.a?t.a:e.a,this.b=null!=t.b?t.b:e.b,this.c=null!=t.c?t.c:e.c,this.d=null!=t.d?t.d:e.d,this.e=null!=t.e?t.e:e.e,this.f=null!=t.f?t.f:e.f}},{key:"clone",value:function(){return new h(this)}},{key:"transform",value:function(t){if(U(t))return new h(t).multiplyO(this);var e=h.formatTransforms(t),n=new Ft(e.ox,e.oy).transform(this),i=n.x,r=n.y,s=(new h).translateO(e.rx,e.ry).lmultiplyO(this).translateO(-i,-r).scaleO(e.scaleX,e.scaleY).skewO(e.skewX,e.skewY).shearO(e.shear).rotateO(e.theta).translateO(i,r);if(isFinite(e.px)||isFinite(e.py)){var u=new Ft(i,r).transform(s),o=e.px?e.px-u.x:0,a=e.py?e.py-u.y:0;s.translateO(o,a)}return s.translateO(e.tx,e.ty),s}},{key:"compose",value:function(t){t.origin&&(t.originX=t.origin[0],t.originY=t.origin[1]);var e=t.originX||0,n=t.originY||0,i=t.scaleX||1,r=t.scaleY||1,s=t.shear||0,u=t.rotate||0,o=t.translateX||0,a=t.translateY||0;return(new h).translateO(-e,-n).scaleO(i,r).shearO(s).rotateO(u).translateO(o,a).lmultiplyO(this).translateO(e,n)}},{key:"decompose",value:function(){var t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:0,e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:0,n=this.a,i=this.b,r=this.c,s=this.d,u=this.e,o=this.f,a=n*s-i*r,h=0<a?1:-1,l=h*Math.sqrt(n*n+i*i),c=Math.atan2(h*i,h*n),f=180/Math.PI*c,d=Math.cos(c),v=Math.sin(c),y=(n*r+i*s)/a,p=r*l/(y*n-i)||s*l/(y*i+n);return{scaleX:l,scaleY:p,shear:y,rotate:f,translateX:u-t+t*d*l+e*(y*d*l-v*p),translateY:o-e+t*v*l+e*(y*v*l+d*p),originX:t,originY:e,a:this.a,b:this.b,c:this.c,d:this.d,e:this.e,f:this.f}}},{key:"multiply",value:function(t){return this.clone().multiplyO(t)}},{key:"multiplyO",value:function(t){var e=t instanceof h?t:new h(t);return h.matrixMultiply(this,e,this)}},{key:"lmultiply",value:function(t){return this.clone().lmultiplyO(t)}},{key:"lmultiplyO",value:function(t){var e=t instanceof h?t:new h(t);return h.matrixMultiply(e,this,this)}},{key:"inverseO",value:function(){var t=this.a,e=this.b,n=this.c,i=this.d,r=this.e,s=this.f,u=t*i-e*n;if(!u)throw new Error("Cannot invert "+this);var o=i/u,a=-e/u,h=-n/u,l=t/u,c=-(o*r+h*s),f=-(a*r+l*s);return this.a=o,this.b=a,this.c=h,this.d=l,this.e=c,this.f=f,this}},{key:"inverse",value:function(){return this.clone().inverseO()}},{key:"translate",value:function(t,e){return this.clone().translateO(t,e)}},{key:"translateO",value:function(t,e){return this.e+=t||0,this.f+=e||0,this}},{key:"scale",value:function(t,e,n,i){var r;return(r=this.clone()).scaleO.apply(r,arguments)}},{key:"scaleO",value:function(t){var e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:t,n=2<arguments.length&&void 0!==arguments[2]?arguments[2]:0,i=3<arguments.length&&void 0!==arguments[3]?arguments[3]:0;3===arguments.length&&(i=n,n=e,e=t);var r=this.a,s=this.b,u=this.c,o=this.d,a=this.e,h=this.f;return this.a=r*t,this.b=s*e,this.c=u*t,this.d=o*e,this.e=a*t-n*t+n,this.f=h*e-i*e+i,this}},{key:"rotate",value:function(t,e,n){return this.clone().rotateO(t,e,n)}},{key:"rotateO",value:function(t){var e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:0,n=2<arguments.length&&void 0!==arguments[2]?arguments[2]:0;t=Ot(t);var i=Math.cos(t),r=Math.sin(t),s=this.a,u=this.b,o=this.c,a=this.d,h=this.e,l=this.f;return this.a=s*i-u*r,this.b=u*i+s*r,this.c=o*i-a*r,this.d=a*i+o*r,this.e=h*i-l*r+n*r-e*i+e,this.f=l*i+h*r-e*r-n*i+n,this}},{key:"flip",value:function(t,e){return this.clone().flipO(t,e)}},{key:"flipO",value:function(t,e){return"x"===t?this.scaleO(-1,1,e,0):"y"===t?this.scaleO(1,-1,0,e):this.scaleO(-1,-1,t,e||t)}},{key:"shear",value:function(t,e,n){return this.clone().shearO(t,e,n)}},{key:"shearO",value:function(t){var e=2<arguments.length&&void 0!==arguments[2]?arguments[2]:0,n=this.a,i=this.b,r=this.c,s=this.d,u=this.e,o=this.f;return this.a=n+i*t,this.c=r+s*t,this.e=u+o*t-e*t,this}},{key:"skew",value:function(t,e,n,i){var r;return(r=this.clone()).skewO.apply(r,arguments)}},{key:"skewO",value:function(t){var e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:t,n=2<arguments.length&&void 0!==arguments[2]?arguments[2]:0,i=3<arguments.length&&void 0!==arguments[3]?arguments[3]:0;3===arguments.length&&(i=n,n=e,e=t),t=Ot(t),e=Ot(e);var r=Math.tan(t),s=Math.tan(e),u=this.a,o=this.b,a=this.c,h=this.d,l=this.e,c=this.f;return this.a=u+o*r,this.b=o+u*s,this.c=a+h*r,this.d=h+a*s,this.e=l+c*r-i*r,this.f=c+l*s-n*s,this}},{key:"skewX",value:function(t,e,n){return this.skew(t,0,e,n)}},{key:"skewXO",value:function(t,e,n){return this.skewO(t,0,e,n)}},{key:"skewY",value:function(t,e,n){return this.skew(0,t,e,n)}},{key:"skewYO",value:function(t,e,n){return this.skewO(0,t,e,n)}},{key:"aroundO",value:function(t,e,n){var i=t||0,r=e||0;return this.translateO(-i,-r).lmultiplyO(n).translateO(i,r)}},{key:"around",value:function(t,e,n){return this.clone().aroundO(t,e,n)}},{key:"native",value:function(){for(var t=Lt().svg.node.createSVGMatrix(),e=B.length-1;0<=e;e--)t[B[e]]=this[B[e]];return t}},{key:"equals",value:function(t){var e=new h(t);return Q(this.a,e.a)&&Q(this.b,e.b)&&Q(this.c,e.c)&&Q(this.d,e.d)&&Q(this.e,e.e)&&Q(this.f,e.f)}},{key:"toString",value:function(){return"matrix("+this.a+","+this.b+","+this.c+","+this.d+","+this.e+","+this.f+")"}},{key:"toArray",value:function(){return[this.a,this.b,this.c,this.d,this.e,this.f]}},{key:"valueOf",value:function(){return{a:this.a,b:this.b,c:this.c,d:this.d,e:this.e,f:this.f}}}],[{key:"formatTransforms",value:function(t){var e="both"===t.flip||!0===t.flip,n=t.flip&&(e||"x"===t.flip)?-1:1,i=t.flip&&(e||"y"===t.flip)?-1:1,r=t.skew&&t.skew.length?t.skew[0]:isFinite(t.skew)?t.skew:isFinite(t.skewX)?t.skewX:0,s=t.skew&&t.skew.length?t.skew[1]:isFinite(t.skew)?t.skew:isFinite(t.skewY)?t.skewY:0,u=t.scale&&t.scale.length?t.scale[0]*n:isFinite(t.scale)?t.scale*n:isFinite(t.scaleX)?t.scaleX*n:n,o=t.scale&&t.scale.length?t.scale[1]*i:isFinite(t.scale)?t.scale*i:isFinite(t.scaleY)?t.scaleY*i:i,a=t.shear||0,h=t.rotate||t.theta||0,l=new Ft(t.origin||t.around||t.ox||t.originX,t.oy||t.originY),c=l.x,f=l.y,d=new Ft(t.position||t.px||t.positionX,t.py||t.positionY),v=d.x,y=d.y,p=new Ft(t.translate||t.tx||t.translateX,t.ty||t.translateY),m=p.x,g=p.y,w=new Ft(t.relative||t.rx||t.relativeX,t.ry||t.relativeY);return{scaleX:u,scaleY:o,skewX:r,skewY:s,shear:a,theta:h,rx:w.x,ry:w.y,tx:m,ty:g,ox:c,oy:f,px:v,py:y}}},{key:"matrixMultiply",value:function(t,e,n){var i=t.a*e.a+t.c*e.b,r=t.b*e.a+t.d*e.b,s=t.a*e.c+t.c*e.d,u=t.b*e.c+t.d*e.d,o=t.e+t.a*e.e+t.c*e.f,a=t.f+t.b*e.e+t.d*e.f;return n.a=i,n.b=r,n.c=s,n.d=u,n.e=o,n.f=a,n}}]),h}();kt({Element:{ctm:function(){return new Oe(this.node.getCTM())},screenCTM:function(){if("function"!=typeof this.isRoot||this.isRoot())return new Oe(this.node.getScreenCTM());var t=this.rect(1,1),e=t.node.getScreenCTM();return t.remove(),new Oe(e)}}});for(var Ae=D("PathArray",lt),Ce={M:function(t,e,n){return e.x=n.x=t[0],e.y=n.y=t[1],["M",e.x,e.y]},L:function(t,e){return e.x=t[0],e.y=t[1],["L",t[0],t[1]]},H:function(t,e){return e.x=t[0],["H",t[0]]},V:function(t,e){return e.y=t[0],["V",t[0]]},C:function(t,e){return e.x=t[4],e.y=t[5],["C",t[0],t[1],t[2],t[3],t[4],t[5]]},S:function(t,e){return e.x=t[2],e.y=t[3],["S",t[0],t[1],t[2],t[3]]},Q:function(t,e){return e.x=t[2],e.y=t[3],["Q",t[0],t[1],t[2],t[3]]},T:function(t,e){return e.x=t[0],e.y=t[1],["T",t[0],t[1]]},Z:function(t,e,n){return e.x=n.x,e.y=n.y,["Z"]},A:function(t,e){return e.x=t[5],e.y=t[6],["A",t[0],t[1],t[2],t[3],t[4],t[5],t[6]]}},je="mlhvqtcsaz".split(""),Me=0,Se=je.length;Me<Se;++Me)Ce[je[Me]]=function(s){return function(t,e,n){if("H"===s)t[0]=t[0]+e.x;else if("V"===s)t[0]=t[0]+e.y;else if("A"===s)t[5]=t[5]+e.x,t[6]=t[6]+e.y;else for(var i=0,r=t.length;i<r;++i)t[i]=t[i]+(i%2?e.y:e.x);return Ce[s](t,e,n)}}(je[Me].toUpperCase());at(Ae,{toString:function(){return function(t){for(var e=0,n=t.length,i="";e<n;e++)i+=t[e][0],null!=t[e][1]&&(i+=t[e][1],null!=t[e][2]&&(i+=" ",i+=t[e][2],null!=t[e][3]&&(i+=" ",i+=t[e][3],i+=" ",i+=t[e][4],null!=t[e][5]&&(i+=" ",i+=t[e][5],i+=" ",i+=t[e][6],null!=t[e][7]&&(i+=" ",i+=t[e][7])))));return i+" "}(this)},move:function(t,e){var n=this.bbox();if(t-=n.x,e-=n.y,!isNaN(t)&&!isNaN(e))for(var i,r=this.length-1;0<=r;r--)"M"===(i=this[r][0])||"L"===i||"T"===i?(this[r][1]+=t,this[r][2]+=e):"H"===i?this[r][1]+=t:"V"===i?this[r][1]+=e:"C"===i||"S"===i||"Q"===i?(this[r][1]+=t,this[r][2]+=e,this[r][3]+=t,this[r][4]+=e,"C"===i&&(this[r][5]+=t,this[r][6]+=e)):"A"===i&&(this[r][6]+=t,this[r][7]+=e);return this},size:function(t,e){var n,i,r=this.bbox();for(n=this.length-1;0<=n;n--)"M"===(i=this[n][0])||"L"===i||"T"===i?(this[n][1]=(this[n][1]-r.x)*t/r.width+r.x,this[n][2]=(this[n][2]-r.y)*e/r.height+r.y):"H"===i?this[n][1]=(this[n][1]-r.x)*t/r.width+r.x:"V"===i?this[n][1]=(this[n][1]-r.y)*e/r.height+r.y:"C"===i||"S"===i||"Q"===i?(this[n][1]=(this[n][1]-r.x)*t/r.width+r.x,this[n][2]=(this[n][2]-r.y)*e/r.height+r.y,this[n][3]=(this[n][3]-r.x)*t/r.width+r.x,this[n][4]=(this[n][4]-r.y)*e/r.height+r.y,"C"===i&&(this[n][5]=(this[n][5]-r.x)*t/r.width+r.x,this[n][6]=(this[n][6]-r.y)*e/r.height+r.y)):"A"===i&&(this[n][1]=this[n][1]*t/r.width,this[n][2]=this[n][2]*e/r.height,this[n][6]=(this[n][6]-r.x)*t/r.width+r.x,this[n][7]=(this[n][7]-r.y)*e/r.height+r.y);return this},equalCommands:function(t){var e,n,i;for(t=new Ae(t),i=this.length===t.length,e=0,n=this.length;i&&e<n;e++)i=this[e][0]===t[e][0];return i},morph:function(t){return t=new Ae(t),this.equalCommands(t)?this.destination=t:this.destination=null,this},at:function(t){if(!this.destination)return this;var e,n,i,r,s=this,u=this.destination.value,o=[],a=new Ae;for(e=0,n=s.length;e<n;e++){for(o[e]=[s[e][0]],i=1,r=s[e].length;i<r;i++)o[e][i]=s[e][i]+(u[e][i]-s[e][i])*t;"A"===o[e][0]&&(o[e][4]=+(0!==o[e][4]),o[e][5]=+(0!==o[e][5]))}return a.value=o,a},parse:function(){var t,e=0<arguments.length&&void 0!==arguments[0]?arguments[0]:[["M",0,0]];if(e instanceof Ae)return e;var n={M:2,L:2,H:1,V:1,C:6,S:4,Q:4,T:2,A:7,Z:0};e="string"==typeof e?e.replace(T,I).replace(M," $& ").replace(j,"$1 -").trim().split(C):e.reduce(function(t,e){return[].concat.call(t,e)},[]);for(var i=[],r=new Ft,s=new Ft,u=0,o=e.length;S.test(e[u])?(t=e[u],++u):"M"===t?t="L":"m"===t&&(t="l"),i.push(Ce[t].call(null,e.slice(u,u+=n[t.toUpperCase()]).map(parseFloat),r,s)),u<o;);return i},bbox:function(){return Lt().path.setAttribute("d",this.toString()),Lt.nodes.path.getBBox()}});var Te=function(){function e(t){o(this,e),this._stepper=t||new re("-"),this._from=null,this._to=null,this._type=null,this._context=null,this._morphObj=null}return a(e,[{key:"from",value:function(t){return null==t?this._from:(this._from=this._set(t),this)}},{key:"to",value:function(t){return null==t?this._to:(this._to=this._set(t),this)}},{key:"type",value:function(t){return null==t?this._type:(this._type=t,this)}},{key:"_set",value:function(t){if(!this._type){var e=l(t);"number"===e?this.type(ct):"string"===e?Tt.isColor(t)?this.type(Tt):C.test(t)?this.type(M.test(t)?Ae:lt):v.test(t)?this.type(ct):this.type(Ee):-1<Pe.indexOf(t.constructor)?this.type(t.constructor):Array.isArray(t)?this.type(lt):"object"===e?this.type(De):this.type(Ee)}var n=new this._type(t).toArray();return this._morphObj=this._morphObj||new this._type,this._context=this._context||Array.apply(null,Array(n.length)).map(Object),n}},{key:"stepper",value:function(t){return null==t?this._stepper:(this._stepper=t,this)}},{key:"done",value:function(){return this._context.map(this._stepper.done).reduce(function(t,e){return t&&e},!0)}},{key:"at",value:function(n){var i=this;return this._morphObj.fromArray(this._from.map(function(t,e){return i._stepper.step(t,i._to[e],n,i._context[e],i._context)}))}}]),e}(),Ee=function(){function t(){o(this,t),this.init.apply(this,arguments)}return a(t,[{key:"init",value:function(t){t=Array.isArray(t)?t[0]:t,this.value=t}},{key:"valueOf",value:function(){return this.value}},{key:"toArray",value:function(){return[this.value]}}]),t}(),Ne=function(){function e(){o(this,e),this.init.apply(this,arguments)}return a(e,[{key:"init",value:function(t){Array.isArray(t)&&(t={scaleX:t[0],scaleY:t[1],shear:t[2],rotate:t[3],translateX:t[4],translateY:t[5],originX:t[6],originY:t[7]}),Object.assign(this,e.defaults,t)}},{key:"toArray",value:function(){var t=this;return[t.scaleX,t.scaleY,t.shear,t.rotate,t.translateX,t.translateY,t.originX,t.originY]}}]),e}();Ne.defaults={scaleX:1,scaleY:1,shear:0,rotate:0,translateX:0,translateY:0,originX:0,originY:0};var De=function(){function t(){o(this,t),this.init.apply(this,arguments)}return a(t,[{key:"init",value:function(t){if(this.values=[],Array.isArray(t))this.values=t;else{var e=Object.entries(t||{}).sort(function(t,e){return t[0]-e[0]});this.values=e.reduce(function(t,e){return t.concat(e)},[])}}},{key:"valueOf",value:function(){for(var t={},e=this.values,n=0,i=e.length;n<i;n+=2)t[e[n]]=e[n+1];return t}},{key:"toArray",value:function(){return this.values}}]),t}(),Pe=[Ee,Ne,De];var ze=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("path",t),e))}return r(e,Yt),a(e,[{key:"array",value:function(){return this._array||(this._array=new Ae(this.attr("d")))}},{key:"plot",value:function(t){return null==t?this.array():this.clear().attr("d","string"==typeof t?t:this._array=new Ae(t))}},{key:"clear",value:function(){return delete this._array,this}},{key:"move",value:function(t,e){return this.attr("d",this.array().move(t,e))}},{key:"x",value:function(t){return null==t?this.bbox().x:this.move(t,this.bbox().y)}},{key:"y",value:function(t){return null==t?this.bbox().y:this.move(this.bbox().x,t)}},{key:"size",value:function(t,e){var n=G(this,t,e);return this.attr("d",this.array().size(n.width,n.height))}},{key:"width",value:function(t){return null==t?this.bbox().width:this.size(t,this.bbox().height)}},{key:"height",value:function(t){return null==t?this.bbox().height:this.size(this.bbox().width,t)}},{key:"targets",value:function(){return Zt('svg textpath [href*="'+this.id()+'"]')}}]),e}();ze.prototype.MorphArray=Ae,kt({Container:{path:function(t){return this.put(new ze).plot(t||new Ae)}}}),tt(ze);var Re=Object.freeze({array:function(){return this._array||(this._array=new ge(this.attr("points")))},plot:function(t){return null==t?this.array():this.clear().attr("points","string"==typeof t?t:this._array=new ge(t))},clear:function(){return delete this._array,this},move:function(t,e){return this.attr("points",this.array().move(t,e))},size:function(t,e){var n=G(this,t,e);return this.attr("points",this.array().size(n.width,n.height))}}),qe=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("polygon",t),e))}return r(e,Yt),e}();kt({Container:{polygon:function(t){return this.put(new qe).plot(t||new ge)}}}),at(qe,ke),at(qe,Re),tt(qe);var Le=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("polyline",t),e))}return r(e,Yt),e}();kt({Container:{polyline:function(t){return this.put(new Le).plot(t||new ge)}}}),at(Le,ke),at(Le,Re),tt(Le);var Fe=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("rect",t),e))}return r(e,Yt),a(e,[{key:"rx",value:function(t){return this.attr("rx",t)}},{key:"ry",value:function(t){return this.attr("ry",t)}}]),e}();kt({Container:{rect:function(t,e){return this.put(new Fe).size(t,e)}}}),tt(Fe);var Ie=window.performance||Date,Xe=function(t){var e=t.start,n=t.runner.duration();return{start:e,duration:n,end:e+n,runner:t.runner}},Ye=function(){function t(){o(this,t),this._timeSource=function(){return Ie.now()},this._dispatcher=document.createElement("div"),this._startTime=0,this._speed=1,this._reverse=!1,this._persist=0,this._nextFrame=null,this._paused=!1,this._runners=[],this._order=[],this._time=0,this._lastSourceTime=0,this._lastStepTime=0}return a(t,[{key:"getEventTarget",value:function(){return this._dispatcher}},{key:"schedule",value:function(t,e,n){if(null==t)return this._runners.map(Xe).sort(function(t,e){return t.start-e.start||t.duration-e.duration});this.active()||(this._step(),null==n&&(n="now"));var i=0;if(e=e||0,null==n||"last"===n||"after"===n)i=this._startTime;else if("absolute"===n||"start"===n)i=e,e=0;else if("now"===n)i=this._time;else{if("relative"!==n)throw new Error('Invalid value for the "when" parameter');var r=this._runners[t.id];r&&(i=r.start+e,e=0)}return t.unschedule(),t.timeline(this),t.time(-e),this._startTime=i+t.duration()+e,this._runners[t.id]={persist:this.persist(),runner:t,start:i},this._order.push(t.id),this._continue(),this}},{key:"unschedule",value:function(t){var e=this._order.indexOf(t.id);return e<0||(delete this._runners[t.id],this._order.splice(e,1),t.timeline(null)),this}},{key:"play",value:function(){return this._paused=!1,this._continue()}},{key:"pause",value:function(){return this._nextFrame=null,this._paused=!0,this}},{key:"stop",value:function(){return this.seek(-this._time),this.pause()}},{key:"finish",value:function(){return this.seek(1/0),this.pause()}},{key:"speed",value:function(t){return null==t?this._speed:(this._speed=t,this)}},{key:"reverse",value:function(t){var e=this.speed();if(null==t)return this.speed(-e);var n=Math.abs(e);return this.speed(t?n:-n)}},{key:"seek",value:function(t){return this._time+=t,this._continue()}},{key:"time",value:function(t){return null==t?this._time:(this._time=t,this)}},{key:"persist",value:function(t){return null==t?this._persist:(this._persist=t,this)}},{key:"source",value:function(t){return null==t?this._timeSource:(this._timeSource=t,this)}},{key:"_step",value:function(){if(!this._paused){var t=this._timeSource(),e=t-this._lastSourceTime,n=this._speed*e+(this._time-this._lastStepTime);this._lastSourceTime=t,this._time+=n,this._lastStepTime=this._time;for(var i=!1,r=0,s=this._order.length;r<s;r++){var u=this._runners[this._order[r]],o=u.runner,a=n,h=this._time-u.start;if(h<0)i=!0;else if(h<a&&(a=h),o.active())if(o.step(a).done){if(!0!==u.persist){o.duration()-o.time()+this._time+this._persist<this._time&&(delete this._runners[this._order[r]],this._order.splice(r--,1)&&--s,o.timeline(null))}}else i=!0}return this._nextFrame=i?d.frame(this._step.bind(this)):null,this}}},{key:"_continue",value:function(){return this._paused||this._nextFrame||(this._nextFrame=d.frame(this._step.bind(this))),this}},{key:"active",value:function(){return!!this._nextFrame}}]),t}();kt({Element:{timeline:function(){return this._timeline=this._timeline||new Ye,this._timeline}}});var He=function(t){function s(t){var e;return o(this,s),(e=h(this,u(s).call(this))).id=s.id++,t="function"==typeof(t=null==t?jt.duration:t)?new se(t):t,e._element=null,e._timeline=null,e.done=!1,e._queue=[],e._duration="number"==typeof t&&t,e._isDeclarative=t instanceof se,e._stepper=e._isDeclarative?t:new re,e._history={},e.enabled=!0,e._time=0,e._last=0,e.transforms=new Oe,e.transformId=1,e._haveReversed=!1,e._reverse=!1,e._loopsDone=0,e._swing=!1,e._wait=0,e._times=1,e}return r(s,xt),a(s,[{key:"element",value:function(t){return null==t?this._element:((this._element=t)._prepareRunner(),this)}},{key:"timeline",value:function(t){return void 0===t?this._timeline:(this._timeline=t,this)}},{key:"animate",value:function(t,e,n){var i=s.sanitise(t,e,n),r=new s(i.duration);return this._timeline&&r.timeline(this._timeline),this._element&&r.element(this._element),r.loop(i).schedule(e,n)}},{key:"schedule",value:function(t,e,n){if(t instanceof Ye||(n=e,e=t,t=this.timeline()),!t)throw Error("Runner cannot be scheduled without timeline");return t.schedule(this,e,n),this}},{key:"unschedule",value:function(){var t=this.timeline();return t&&t.unschedule(this),this}},{key:"loop",value:function(t,e,n){return"object"===l(t)&&(e=t.swing,n=t.wait,t=t.times),this._times=t||1/0,this._swing=e||!1,this._wait=n||0,this}},{key:"delay",value:function(t){return this.animate(0,t)}},{key:"queue",value:function(t,e,n){return this._queue.push({initialiser:t||Ct,runner:e||Ct,isTransform:n,initialised:!1,finished:!1}),this.timeline()&&this.timeline()._continue(),this}},{key:"during",value:function(t){return this.queue(null,t)}},{key:"after",value:function(t){return this.on("finish",t)}},{key:"time",value:function(t){if(null==t)return this._time;var e=t-this._time;return this.step(e),this}},{key:"duration",value:function(){return this._times*(this._wait+this._duration)-this._wait}},{key:"loops",value:function(t){var e=this._duration+this._wait;if(null==t){var n=Math.floor(this._time/e),i=(this._time-n*e)/this._duration;return Math.min(n+i,this._times)}var r=t%1,s=e*Math.floor(t)+this._duration*r;return this.time(s)}},{key:"position",value:function(t){var e,n=this._time,r=this._duration,s=this._wait,i=this._times,u=this._swing,o=this._reverse;if(null==t){var a=function(t){var e=u*Math.floor(t%(2*(s+r))/(s+r)),n=e&&!o||!e&&o,i=Math.pow(-1,n)*(t%(s+r))/r+n;return Math.max(Math.min(i,1),0)},h=i*(s+r)-s;return e=n<=0?Math.round(a(1e-5)):n<h?a(n):Math.round(a(h-1e-5)),e}var l=Math.floor(this.loops()),c=u&&l%2==0;return e=l+(c&&!o||o&&c?t:1-t),this.loops(e)}},{key:"progress",value:function(t){return null==t?Math.min(1,this._time/this.duration()):this.time(t*this.duration())}},{key:"step",value:function(t){if(!this.enabled)return this;t=null==t?16:t,this._time+=t;var e=this.position(),n=this._lastPosition!==e&&0<=this._time;this._lastPosition=e;var i=this.duration(),r=this._lastTime<0&&0<this._time,s=this._lastTime<this._time&&this.time>i;this._lastTime=this._time,r&&this.fire("start",this);var u=this._isDeclarative;if(this.done=!u&&!s&&this._time>=i,n||u){this._initialise(n),this.transforms=new Oe;var o=this._run(u?t:e);this.fire("step",this)}return this.done=this.done||o&&u,this.done&&this.fire("finish",this),this}},{key:"finish",value:function(){return this.step(1/0)}},{key:"reverse",value:function(t){return this._reverse=null==t?!this._reverse:t,this}},{key:"ease",value:function(t){return this._stepper=new re(t),this}},{key:"active",value:function(t){return null==t?this.enabled:(this.enabled=t,this)}},{key:"_rememberMorpher",value:function(t,e){this._history[t]={morpher:e,caller:this._queue[this._queue.length-1]}}},{key:"_tryRetarget",value:function(t,e){if(this._history[t]){if(!this._history[t].caller.initialised){var n=this._queue.indexOf(this._history[t].caller);return this._queue.splice(n,1),!1}this._history[t].caller.isTransform?this._history[t].caller.isTransform(e):this._history[t].morpher.to(e),this._history[t].caller.finished=!1;var i=this.timeline();return i&&i._continue(),!0}return!1}},{key:"_initialise",value:function(t){if(t||this._isDeclarative)for(var e=0,n=this._queue.length;e<n;++e){var i=this._queue[e],r=this._isDeclarative||!i.initialised&&t;t=!i.finished,r&&t&&(i.initialiser.call(this),i.initialised=!0)}}},{key:"_run",value:function(t){for(var e=!0,n=0,i=this._queue.length;n<i;++n){var r=this._queue[n],s=r.runner.call(this,t);r.finished=r.finished||!0===s,e=e&&r.finished}return e}},{key:"addTransform",value:function(t,e){return this.transforms.lmultiplyO(t),this}},{key:"clearTransform",value:function(){return this.transforms=new Oe,this}}],[{key:"sanitise",value:function(t,e,n){var i=1,r=!1,s=0;return e=e||jt.delay,n=n||"last","object"!==l(t=t||jt.duration)||t instanceof ie||(e=t.delay||e,n=t.when||n,r=t.swing||r,i=t.times||i,s=t.wait||s,t=t.duration||jt.duration),{duration:t,delay:e,swing:r,times:i,wait:s,when:n}}}]),s}();He.id=0;var Ge=function t(){var e=0<arguments.length&&void 0!==arguments[0]?arguments[0]:new Oe,n=1<arguments.length&&void 0!==arguments[1]?arguments[1]:-1,i=!(2<arguments.length&&void 0!==arguments[2])||arguments[2];o(this,t),this.transforms=e,this.id=n,this.done=i};at([He,Ge],{mergeWith:function(t){return new Ge(t.transforms.lmultiply(this.transforms),t.id)}});var Ve=function(t,e){return t.lmultiplyO(e)},Be=function(t){return t.transforms};var Qe=function(){function t(){o(this,t),this.runners=[],this.ids=[]}return a(t,[{key:"add",value:function(t){if(!this.runners.includes(t)){var n=t.id+1,e=this.ids.reduce(function(t,e){return t<e&&e<n?e:t},0),i=this.ids.indexOf(e)+1;return this.ids.splice(i,0,n),this.runners.splice(i,0,t),this}}},{key:"getByID",value:function(t){return this.runners[this.ids.indexOf(t+1)]}},{key:"remove",value:function(t){var e=this.ids.indexOf(t+1);return this.ids.splice(e,1),this.runners.splice(e,1),this}},{key:"merge",value:function(){var n=this,i=null;return this.runners.forEach(function(t,e){i&&t.done&&i.done&&(n.remove(t.id),n.edit(i.id,t.mergeWith(i))),i=t}),this}},{key:"edit",value:function(t,e){var n=this.ids.indexOf(t+1);return this.ids.splice(n,1,t),this.runners.splice(n,1,e),this}},{key:"length",value:function(){return this.ids.length}},{key:"clearBefore",value:function(t){var e=this.ids.indexOf(t+1)||1;return this.ids.splice(0,e,0),this.runners.splice(0,e,new Ge),this}}]),t}(),Ue=0;kt({Element:{animate:function(t,e,n){var i=He.sanitise(t,e,n),r=this.timeline();return new He(i.duration).loop(i).element(this).timeline(r).schedule(e,n)},delay:function(t,e){return this.animate(0,t,e)},_clearTransformRunnersBefore:function(t){this._transformationRunners.clearBefore(t.id)},_currentTransform:function(e){return this._transformationRunners.runners.filter(function(t){return t.id<=e.id}).map(Be).reduce(Ve,new Oe)},addRunner:function(t){this._transformationRunners.add(t),d.transform_frame(function(){var t=this._transformationRunners.runners.map(Be).reduce(Ve,new Oe);this.transform(t),this._transformationRunners.merge(),1===this._transformationRunners.length()&&(this._frameId=null)}.bind(this),this._frameId)},_prepareRunner:function(){null==this._frameId&&(this._transformationRunners=(new Qe).add(new Ge(new Oe(this))),this._frameId=Ue++)}}}),at(He,{attr:function(t,e){return this.styleAttr("attr",t,e)},css:function(t,e){return this.styleAttr("css",t,e)},styleAttr:function(e,n,t){if("object"===l(n))for(var i in t)this.styleAttr(e,i,t[i]);var r=new Te(this._stepper).to(t);return this.queue(function(){r=r.from(this.element()[e](n))},function(t){return this.element()[e](n,r.at(t)),r.done()}),this},zoom:function(t,e){var n=new Te(this._stepper).to(new ct(t));return this.queue(function(){n=n.from(this.zoom())},function(t){return this.element().zoom(n.at(t),e),n.done()}),this},transform:function(d,v,y){if(v=d.relative||v,this._isDeclarative&&!v&&this._tryRetarget("transform",d))return this;var p=U(d);y=null!=d.affine?d.affine:null!=y?y:!p;var m,g,w,k,b,x=(new Te).type(y?Ne:Oe).stepper(this._stepper);return this.queue(function(){g=g||this.element(),m=m||$(d,g),b=new Oe(v?void 0:g),g.addRunner(this),v||g._clearTransformRunnersBefore(this)},function(t){v||this.clearTransform();var e=new Ft(m).transform(g._currentTransform(this)),n=e.x,i=e.y,r=new Oe(_({},d,{origin:[n,i]})),s=this._isDeclarative&&w?w:b;if(y){r=r.decompose(n,i),s=s.decompose(n,i);var u=r.rotate,o=s.rotate,a=[u-360,u,u+360],h=a.map(function(t){return Math.abs(t-o)}),l=Math.min.apply(Math,O(h)),c=h.indexOf(l);r.rotate=a[c]}v&&(p||(r.rotate=d.rotate||0),this._isDeclarative&&k&&(s.rotate=k)),x.from(s),x.to(r);var f=x.at(t);return k=f.rotate,w=new Oe(f),this.addTransform(w),x.done()},function(t){(t.origin||"center").toString()!==(d.origin||"center").toString()&&(m=$(d,g)),d=_({},t,{origin:m})}),this._isDeclarative&&this._rememberMorpher("transform",x),this},x:function(t,e){return this._queueNumber("x",t)},y:function(t){return this._queueNumber("y",t)},dx:function(t){return this._queueNumberDelta("dx",t)},dy:function(t){return this._queueNumberDelta("dy",t)},_queueNumberDelta:function(e,n){if(n=new ct(n),this._tryRetargetDelta(e,n))return this;var i=new Te(this._stepper).to(n);return this.queue(function(){var t=this.element()[e]();i.from(t),i.to(t+n)},function(t){return this.element()[e](i.at(t)),i.done()}),this._rememberMorpher(e,i),this},_queueObject:function(e,t){if(this._tryRetarget(e,t))return this;var n=new Te(this._stepper).to(t);return this.queue(function(){n.from(this.element()[e]())},function(t){return this.element()[e](n.at(t)),n.done()}),this._rememberMorpher(e,n),this},_queueNumber:function(t,e){return this._queueObject(t,new ct(e))},cx:function(t){return this._queueNumber("cx",t)},cy:function(t){return this._queueNumber("cy",t)},move:function(t,e){return this.x(t).y(e)},center:function(t,e){return this.cx(t).cy(e)},size:function(t,e){var n;return t&&e||(n=this._element.bbox()),t||(t=n.width/n.height*e),e||(e=n.height/n.width*t),this.width(t).height(e)},width:function(t){return this._queueNumber("width",t)},height:function(t){return this._queueNumber("height",t)},plot:function(t,e,n,i){return 4===arguments.length?this.plot([t,e,n,i]):this._queueObject("plot",new this._element.MorphArray(t))},leading:function(t){return this._queueNumber("leading",t)},viewbox:function(t,e,n,i){return this._queueObject("viewbox",new It(t,e,n,i))},update:function(t){return"object"!==l(t)?this.update({offset:t,color:arguments[1],opacity:arguments[2]}):(null!=t.opacity&&this.attr("stop-opacity",t.opacity),null!=t.color&&this.attr("stop-color",t.color),null!=t.offset&&this.attr("offset",t.offset),this)}});var $e=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("symbol",t),e))}return r(e,Pt),e}();kt({Container:{symbol:function(){return this.put(new $e)}}}),tt($e);var We=Object.freeze({plain:function(t){return!1===this._build&&this.clear(),this.node.appendChild(document.createTextNode(t)),this},length:function(){return this.node.getComputedTextLength()}}),Je=function(t){function n(t){var e;return o(this,n),(e=h(this,u(n).call(this,ut("text",t),n))).dom.leading=new ct(1.3),e._rebuild=!0,e._build=!1,e.attr("font-family",Mt["font-family"]),e}return r(n,Yt),a(n,[{key:"x",value:function(t){return null==t?this.attr("x"):this.attr("x",t)}},{key:"y",value:function(t){var e=this.attr("y"),n="number"==typeof e?e-this.bbox().y:0;return null==t?"number"==typeof e?e-n:e:this.attr("y","number"==typeof t?t+n:t)}},{key:"cx",value:function(t){return null==t?this.bbox().cx:this.x(t-this.bbox().width/2)}},{key:"cy",value:function(t){return null==t?this.bbox().cy:this.y(t-this.bbox().height/2)}},{key:"text",value:function(t){if(void 0===t){var e=this.node.childNodes,n=0;t="";for(var i=0,r=e.length;i<r;++i)"textPath"!==e[i].nodeName?(i!==n&&3!==e[i].nodeType&&!0===K(e[i]).dom.newLined&&(t+="\n"),t+=e[i].textContent):0===i&&(n=1);return t}if(this.clear().build(!0),"function"==typeof t)t.call(this,this);else for(var s=0,u=(t=t.split("\n")).length;s<u;s++)this.tspan(t[s]).newLine();return this.build(!1).rebuild()}},{key:"leading",value:function(t){return null==t?this.dom.leading:(this.dom.leading=new ct(t),this.rebuild())}},{key:"rebuild",value:function(t){if("boolean"==typeof t&&(this._rebuild=t),this._rebuild){var e=this,n=0,i=this.dom.leading*new ct(this.attr("font-size"));this.each(function(){this.dom.newLined&&(this.attr("x",e.attr("x")),"\n"===this.text()?n+=i:(this.attr("dy",i+n),n=0))}),this.fire("rebuild")}return this}},{key:"build",value:function(t){return this._build=!!t,this}},{key:"setData",value:function(t){return this.dom=t,this.dom.leading=new ct(t.leading||1.3),this}}]),n}();at(Je,We),kt({Container:{text:function(t){return this.put(new Je).text(t)},plain:function(t){return this.put(new Je).plain(t)}}}),tt(Je);var Ze=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("textPath",t),e))}return r(e,Je),a(e,[{key:"array",value:function(){var t=this.track();return t?t.array():null}},{key:"plot",value:function(t){var e=this.track(),n=null;return e&&(n=e.plot(t)),null==t?n:this}},{key:"track",value:function(){return this.reference("href")}}]),e}();kt({Container:{textPath:function(t,e){return this.defs().path(e).text(t).addTo(this)}},Text:{path:function(t){var e=new Ze;return t instanceof ze||(t=this.doc().defs().path(t)),e.attr("href","#"+t,R),this.put(e)},textPath:function(){return this.find("textPath")}},Path:{text:function(t){if(t instanceof Je){var e=t.text();return t.clear().path(this).text(e)}return this.parent().put(new Je).path(this).text(t)}}}),Ze.prototype.MorphArray=Ae,tt(Ze);var Ke=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("tspan",t),e))}return r(e,Je),a(e,[{key:"text",value:function(t){return null==t?this.node.textContent+(this.dom.newLined?"\n":""):("function"==typeof t?t.call(this,this):this.plain(t),this)}},{key:"dx",value:function(t){return this.attr("dx",t)}},{key:"dy",value:function(t){return this.attr("dy",t)}},{key:"newLine",value:function(){var t=this.parent(Je);return this.dom.newLined=!0,this.dy(t.dom.leading*t.attr("font-size")).attr("x",t.x())}}]),e}();at(Ke,We),kt({Tspan:{tspan:function(t){var e=new Ke;return this._build||this.clear(),this.node.appendChild(e.node),e.text(t)}}}),tt(Ke);var tn=function(t){function e(t){return o(this,e),h(this,u(e).call(this,ut("use",t),e))}return r(e,Yt),a(e,[{key:"element",value:function(t,e){return this.attr("href",(e||"")+"#"+t,R)}}]),e}();kt({Container:{use:function(t,e){return this.put(new tn).element(t,e)}}}),tt(tn);var en=Object.freeze({Animator:d,SVGArray:lt,Bare:zt,Box:It,Circle:Jt,ClipPath:te,Color:Tt,Container:Pt,Controller:se,Ease:re,PID:ae,Spring:oe,Defs:Rt,Doc:qt,Dom:Et,Element:Dt,Ellipse:he,EventTarget:xt,Gradient:fe,G:de,HtmlNode:ve,A:ye,Image:me,Line:be,Marker:xe,Mask:_e,Matrix:Oe,Morphable:Te,SVGNumber:ct,Path:ze,PathArray:Ae,Pattern:pe,Point:Ft,PointArray:ge,Polygon:qe,Polyline:Le,Queue:t,Rect:Fe,Runner:He,Shape:Yt,Stop:le,Symbol:$e,Text:Je,TextPath:Ze,Timeline:Ye,Tspan:Ke,Use:tn});kt("Dom",{siblings:function(){return this.parent().children()},position:function(){return this.parent().index(this)},next:function(){return this.siblings()[this.position()+1]},prev:function(){return this.siblings()[this.position()-1]},forward:function(){var t=this.position()+1,e=this.parent();return e.removeElement(this).add(this,t),"function"==typeof e.isRoot&&e.isRoot()&&e.node.appendChild(e.defs().node),this},backward:function(){var t=this.position();return 0<t&&this.parent().removeElement(this).add(this,t-1),this},front:function(){var t=this.parent();return t.node.appendChild(this.node),"function"==typeof t.isRoot&&t.isRoot()&&t.node.appendChild(t.defs().node),this},back:function(){return 0<this.position()&&this.parent().removeElement(this).add(this,0),this},before:function(t){t.remove();var e=this.position();return this.parent().add(t,e),this},after:function(t){t.remove();var e=this.position();return this.parent().add(t,e+1),this}}),kt("Dom",{data:function(e,t,n){if("object"===l(e))for(t in e)this.data(t,e[t]);else if(arguments.length<2)try{return JSON.parse(this.attr("data-"+e))}catch(t){return this.attr("data-"+e)}else this.attr("data-"+e,null===t?null:!0===n||"string"==typeof t||"number"==typeof t?t:JSON.stringify(t));return this}}),kt("Dom",{classes:function(){var t=this.attr("class");return null==t?[]:t.trim().split(C)},hasClass:function(t){return-1!==this.classes().indexOf(t)},addClass:function(t){if(!this.hasClass(t)){var e=this.classes();e.push(t),this.attr("class",e.join(" "))}return this},removeClass:function(e){return this.hasClass(e)&&this.attr("class",this.classes().filter(function(t){return t!==e}).join(" ")),this},toggleClass:function(t){return this.hasClass(t)?this.removeClass(t):this.addClass(t)}}),kt("Dom",{css:function(t,e){var n={};if(0===arguments.length)return this.node.style.cssText.split(/\s*;\s*/).filter(function(t){return!!t.length}).forEach(function(t){var e=t.split(/\s*:\s*/);n[e[0]]=e[1]}),n;if(arguments.length<2){if(Array.isArray(t)){var i=!0,r=!1,s=void 0;try{for(var u,o=t[Symbol.iterator]();!(i=(u=o.next()).done);i=!0){var a=X(u.value);n[a]=this.node.style[a]}}catch(t){r=!0,s=t}finally{try{i||null==o.return||o.return()}finally{if(r)throw s}}return n}if("string"==typeof t)return this.node.style[X(t)];if("object"===l(t))for(var h in t)this.node.style[X(h)]=null==t[h]||b.test(t[h])?"":t[h]}return 2===arguments.length&&(this.node.style[X(t)]=null==e||b.test(e)?"":e),this},show:function(){return this.css("display","")},hide:function(){return this.css("display","none")},visible:function(){return"none"!==this.css("display")}}),kt("Element",{untransform:function(){return this.attr("transform",null)},matrixify:function(){return(this.attr("transform")||"").split(e).slice(0,-1).map(function(t){var e=t.trim().split("(");return[e[0],e[1].split(C).map(function(t){return parseFloat(t)})]}).reverse().reduce(function(t,e){return"matrix"===e[0]?t.lmultiply(V(e[1])):t[e[0]].apply(t,e[1])},new Oe)},toParent:function(t){if(this===t)return this;var e=this.screenCTM(),n=t.screenCTM().inverse();return this.addTo(t).untransform().transform(n.multiply(e)),this},toDoc:function(){return this.toParent(this.doc())},transform:function(t,e){if(null==t||"string"==typeof t){var n=new Oe(this).decompose();return n[t]||n}U(t)||(t=_({},t,{origin:$(t,this)}));var i=new Oe(!0===e?this:e||!1).transform(t);return this.attr("transform",i)}}),kt("Dom",{remember:function(t,e){if("object"===l(t))for(var n in t)this.remember(n,t[n]);else{if(1===arguments.length)return this.memory()[t];this.memory()[t]=e}return this},forget:function(){if(0===arguments.length)this._memory={};else for(var t=arguments.length-1;0<=t;t--)delete this.memory()[arguments[t]];return this},memory:function(){return this._memory=this._memory||{}}});var nn={stroke:["color","width","opacity","linecap","linejoin","miterlimit","dasharray","dashoffset"],fill:["color","opacity","rule"],prefix:function(t,e){return"color"===e?t:t+"-"+e}};["fill","stroke"].forEach(function(e){var n,t={};t[e]=function(t){if(void 0===t)return this;if("string"==typeof t||Tt.isRgb(t)||t instanceof Dt)this.attr(e,t);else for(n=nn[e].length-1;0<=n;n--)null!=t[nn[e][n]]&&this.attr(nn.prefix(e,nn[e][n]),t[nn[e][n]]);return this},kt(["Shape","Runner"],t)}),kt(["Element","Runner"],{matrix:function(t,e,n,i,r,s){return null==t?new Oe(this):this.attr("transform",new Oe(t,e,n,i,r,s))},rotate:function(t,e,n){return this.transform({rotate:t,ox:e,oy:n},!0)},skew:function(t,e,n,i){return 1===arguments.length||3===arguments.length?this.transform({skew:t,ox:e,oy:n},!0):this.transform({skew:[t,e],ox:n,oy:i},!0)},shear:function(t,e,n){return this.transform({shear:t,ox:e,oy:n},!0)},scale:function(t,e,n,i){return 1===arguments.length||3===arguments.length?this.transform({scale:t,ox:e,oy:n},!0):this.transform({scale:[t,e],ox:n,oy:i},!0)},translate:function(t,e){return this.transform({translate:[t,e]},!0)},relative:function(t,e){return this.transform({relative:[t,e]},!0)},flip:function(t,e){var n="string"==typeof t?t:(isFinite(t),"both"),i="both"===t&&isFinite(e)?[e,e]:"x"===t?[e,0]:"y"===t?[0,e]:isFinite(t)?[t,t]:[0,0];this.transform({flip:n,origin:i},!0)},opacity:function(t){return this.attr("opacity",t)},dx:function(t){return this.x(new ct(t).plus(this instanceof He?0:this.x()),!0)},dy:function(t){return this.y(new ct(t).plus(this instanceof He?0:this.y()),!0)},dmove:function(t,e){return this.dx(t).dy(e)}}),kt("radius",{radius:function(t,e){var n=(this._element||this).type;return"radialGradient"===n||"radialGradient"===n?this.attr("r",new ct(t)):this.rx(t).ry(null==e?t:e)}}),kt("Path",{length:function(){return this.node.getTotalLength()},pointAt:function(t){return new Ft(this.node.getPointAtLength(t))}}),kt(["Element","Runner"],{font:function(t,e){if("object"===l(t))for(e in t)this.font(e,t[e]);return"leading"===t?this.leading(e):"anchor"===t?this.attr("text-anchor",e):"size"===t||"family"===t||"weight"===t||"stretch"===t||"variant"===t||"style"===t?this.attr("font-"+t,e):this.attr(t,e)}});var rn=at;function sn(t){return Z(t)}return rn([qt,$e,me,pe,xe],bt("viewbox")),rn([be,Le,qe,ze],bt("marker")),rn(Je,bt("Text")),rn(ze,bt("Path")),rn(Rt,bt("Defs")),rn([Je,Ke],bt("Tspan")),rn([Fe,he,Jt,fe],bt("radius")),rn(xt,bt("EventTarget")),rn(Et,bt("Dom")),rn(Dt,bt("Element")),rn(Yt,bt("Shape")),rn(Pt,bt("Container")),function(){var t=0<arguments.length&&void 0!==arguments[0]?arguments[0]:[];Pe.push.apply(Pe,O([].concat(t)))}([ct,Tt,It,Oe,lt,ge,Ae]),at(Pe,{to:function(t,e){return(new Te).type(this.constructor).from(this.valueOf()).to(t,e)},fromArray:function(t){return this.init(t),this}}),Object.assign(sn,en),Object.assign(sn,ht),Object.assign(sn,st),sn.utils=At,sn.regex=N,(sn.get=sn).find=Zt,Object.assign(sn,L),sn.easing=ne,Object.assign(sn,gt),sn.TransformBag=Ne,sn.ObjectBag=De,sn.NonMorphable=Ee,sn.parser=Lt,sn.defaults=St,sn}();
projects / svg.js.git / commitdiff