').appendTo(browser);
+ var frame = $('').prependTo(browser).hide().wrap('');
+ var header = $('
').prependTo(browser).text(allLibs).css({
+ position: 'absolute',
+ top: 0,
+ left: 0,
+ width: '100%'
+ });
+ var cancel = $('').appendTo(browser).on('click touchend', function () {
+ $('#imgbrowse_holder').hide();
+ }).css({
+ position: 'absolute',
+ top: 5,
+ right: -10
+ });
+ var leftBlock = $('').css({
+ position: 'absolute',
+ top: 5,
+ left: 10
+ }).appendTo(browser);
+ var back = $('').appendTo(leftBlock).on('click touchend', function () {
+ frame.attr('src', 'about:blank').hide();
+ libOpts.show();
+ header.text(allLibs);
+ back.hide();
+ }).css({
+ 'margin-right': 5
+ }).hide();
+ /* const type = */
- function importImage(url) {
- const newImage = svgCanvas.addSVGElementFromJson({
- element: 'image',
- attr: {
- x: 0,
- y: 0,
- width: 0,
- height: 0,
- id: svgCanvas.getNextId(),
- style: 'pointer-events:inherit'
- }
- });
- svgCanvas.clearSelection();
- svgCanvas.addToSelection([newImage]);
- svgCanvas.setImageURL(url);
- }
+ $('').appendTo(leftBlock).change(function () {
+ mode = $(this).val();
- const pending = {};
- let mode = 's';
- let multiArr = [];
- let transferStopped = false;
- let preview, submit;
- /**
- * Contains the SVG to insert.
- * @typedef {PlainObject} ImageLibMessage
- * @property {"imagelib"} namespace Required to distinguish from any other messages of app.
- * @property {string} href Set to same value as previous `ImageLibMetaMessage` `id`.
- * @property {string} data The response (as an SVG string or URL)
- */
+ switch (mode) {
+ case 's':
+ case 'o':
+ toggleMulti(false);
+ break;
- /**
- * Used for setting meta-data before images are retrieved.
- * @typedef {PlainObject} ImageLibMetaMessage
- * @property {"imagelib"} namespace Required to distinguish from any other messages of app.
- * @property {string} name If the subsequent response is an SVG string or if `preview_url`
- * is present, will be used as the title for the preview image. When an
- * SVG string is present, will default to the first ``'s contents or
- * "(SVG #<Length of response>)" if none is present. Otherwise, if `preview_url`
- * is present, will default to the empty string. Though `name` may be falsy,
- * it is always expected to be present for meta messages.
- * @property {string} id Identifier (the expected `href` for a subsequent response message);
- * used for ensuring the subsequent response can be tied to this `ImageLibMetaMessage` object.
- * @property {string} [preview_url] When import mode is multiple, used to set an image
- * source along with the name/title. If the subsequent response is an SVG string
- * and there is no `preview_url`, the default will just be to show the
- * name/title. If the response is not an SVG string, the default will be to
- * show that response (i.e., the URL).
- * @property {string} entry Set automatically with div holding retrieving
- * message (until ready to delete)
- * @todo Should use a separate Map instead of `entry`
- */
-
- /**
- * @param {PlainObject} cfg
- * @param {string} cfg.origin
- * @param {ImageLibMetaMessage|ImageLibMessage|string} cfg.data String is deprecated when parsed to JSON `ImageLibMessage`
- * @returns {void}
- */
-
- async function onMessage({
- origin,
- data: response
- }) {
- // eslint-disable-line no-shadow
- if (!response || !['string', 'object'].includes(typeof response)) {
- // Do nothing
- return;
- }
-
- let id;
- let type;
-
- try {
- // Todo: This block can be removed (and the above check changed to
- // insist on an object) if embedAPI moves away from a string to
- // an object (if IE9 support not needed)
- response = typeof response === 'object' ? response : JSON.parse(response);
-
- if (response.namespace !== 'imagelib') {
- return;
- }
-
- if (!allowedImageLibOrigins.includes('*') && !allowedImageLibOrigins.includes(origin)) {
- // Todo: Surface this error to user?
- console.log(`Origin ${origin} not whitelisted for posting to ${window.origin}`); // eslint-disable-line no-console
-
- return;
- }
-
- const hasName = ('name' in response);
- const hasHref = ('href' in response);
-
- if (!hasName && transferStopped) {
- transferStopped = false;
- return;
- }
-
- if (hasHref) {
- id = response.href;
- response = response.data;
- } // Hide possible transfer dialog box
-
-
- $('#dialog_box').hide();
- type = hasName ? 'meta' : response.charAt(0);
- } catch (e) {
- // This block is for backward compatibility (for IAN and Openclipart);
- // should otherwise return
- if (typeof response === 'string') {
- const char1 = response.charAt(0);
-
- if (char1 !== '{' && transferStopped) {
- transferStopped = false;
- return;
- }
-
- if (char1 === '|') {
- const secondpos = response.indexOf('|', 1);
- id = response.substr(1, secondpos - 1);
- response = response.substr(secondpos + 1);
- type = response.charAt(0);
- }
- }
- }
-
- let entry, curMeta, svgStr, imgStr;
-
- switch (type) {
- case 'meta':
- {
- // Metadata
- transferStopped = false;
- curMeta = response; // Should be safe to add dynamic property as passed metadata
-
- pending[curMeta.id] = curMeta; // lgtm [js/remote-property-injection]
-
- const name = curMeta.name || 'file';
- const message = uiStrings.notification.retrieving.replace('%s', name);
-
- if (mode !== 'm') {
- await $.process_cancel(message);
- transferStopped = true; // Should a message be sent back to the frame?
-
- $('#dialog_box').hide();
- } else {
- entry = $('<div>').text(message).data('id', curMeta.id);
- preview.append(entry);
- curMeta.entry = entry;
- }
-
- return;
- }
-
- case '<':
- svgStr = true;
- break;
-
- case 'd':
- {
- if (response.startsWith('data:image/svg+xml')) {
- const pre = 'data:image/svg+xml;base64,';
- const src = response.substring(pre.length);
- response = decode64(src);
- svgStr = true;
- break;
- } else if (response.startsWith('data:image/')) {
- imgStr = true;
- break;
- }
- }
- // Else fall through
-
- default:
- // TODO: See if there's a way to base64 encode the binary data stream
- // const str = 'data:;base64,' + svgedit.utilities.encode64(response, true);
- // Assume it's raw image data
- // importImage(str);
- // Don't give warning as postMessage may have been used by something else
- if (mode !== 'm') {
- closeBrowser();
- } else {
- pending[id].entry.remove();
- } // await $.alert('Unexpected data was returned: ' + response, function() {
- // if (mode !== 'm') {
- // closeBrowser();
- // } else {
- // pending[id].entry.remove();
- // }
- // });
-
-
- return;
- }
-
- switch (mode) {
- case 's':
- // Import one
- if (svgStr) {
- svgCanvas.importSvgString(response);
- } else if (imgStr) {
- importImage(response);
- }
-
- closeBrowser();
- break;
-
- case 'm':
- {
- // Import multiple
- multiArr.push([svgStr ? 'svg' : 'img', response]);
- curMeta = pending[id];
- let title;
-
- if (svgStr) {
- if (curMeta && curMeta.name) {
- title = curMeta.name;
- } else {
- // Try to find a title
- // `dropXMLInternalSubset` is to help prevent the billion laughs attack
- const xml = new DOMParser().parseFromString(dropXMLInternalSubset(response), 'text/xml').documentElement; // lgtm [js/xml-bomb]
-
- title = $(xml).children('title').first().text() || '(SVG #' + response.length + ')';
- }
-
- if (curMeta) {
- preview.children().each(function () {
- if ($(this).data('id') === id) {
- if (curMeta.preview_url) {
- $(this).html($('<span>').append($('<img>').attr('src', curMeta.preview_url), title));
- } else {
- $(this).text(title);
+ case 'm':
+ // Import multiple
+ toggleMulti(true);
+ break;
}
+ }).css({
+ 'margin-top': 10
+ });
+ cancel.prepend($.getSvgIcon('cancel', true));
+ back.prepend($.getSvgIcon('tool_imagelib', true));
+ imagelibStrings.imgLibs.forEach(function (_ref5) {
+ var name = _ref5.name,
+ url = _ref5.url,
+ description = _ref5.description;
+ $('<li>').appendTo(libOpts).text(name).on('click touchend', function () {
+ frame.attr('src', url).show();
+ header.text(name);
+ libOpts.hide();
+ back.show();
+ }).append("<span>".concat(description, "</span>"));
+ });
+ } else {
+ $('#imgbrowse_holder').show();
+ }
+ };
- submit.removeAttr('disabled');
+ toggleMulti = function _toggleMulti(show) {
+ $('#lib_framewrap, #imglib_opts').css({
+ right: show ? 200 : 10
+ });
+
+ if (!preview) {
+ preview = $('<div id=imglib_preview>').css({
+ position: 'absolute',
+ top: 45,
+ right: 10,
+ width: 180,
+ bottom: 45,
+ background: '#fff',
+ overflow: 'auto'
+ }).insertAfter('#lib_framewrap');
+ submit = $('<button disabled>Import selected</button>').appendTo('#imgbrowse').on('click touchend', function () {
+ $.each(multiArr, function (i) {
+ var type = this[0];
+ var data = this[1];
+
+ if (type === 'svg') {
+ svgCanvas.importSvgString(data);
+ } else {
+ importImage(data);
+ }
+
+ svgCanvas.moveSelectedElements(i * 20, i * 20, false);
+ });
+ preview.empty();
+ multiArr = [];
+ $('#imgbrowse_holder').hide();
+ }).css({
+ position: 'absolute',
+ bottom: 10,
+ right: -10
+ });
+ }
+
+ preview.toggle(show);
+ submit.toggle(show);
+ };
+
+ _onMessage = function _onMessage3() {
+ _onMessage = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(_ref4) {
+ var origin, response, id, type, hasName, hasHref, char1, secondpos, entry, curMeta, svgStr, imgStr, name, message, pre, src, title, xml, ok;
+ return regeneratorRuntime.wrap(function _callee$(_context) {
+ while (1) {
+ switch (_context.prev = _context.next) {
+ case 0:
+ origin = _ref4.origin, response = _ref4.data;
+
+ if (!(!response || !['string', 'object'].includes(_typeof(response)))) {
+ _context.next = 3;
+ break;
+ }
+
+ return _context.abrupt("return");
+
+ case 3:
+ _context.prev = 3;
+ // Todo: This block can be removed (and the above check changed to
+ // insist on an object) if embedAPI moves away from a string to
+ // an object (if IE9 support not needed)
+ response = _typeof(response) === 'object' ? response : JSON.parse(response);
+
+ if (!(response.namespace !== 'imagelib')) {
+ _context.next = 7;
+ break;
+ }
+
+ return _context.abrupt("return");
+
+ case 7:
+ if (!(!allowedImageLibOrigins.includes('*') && !allowedImageLibOrigins.includes(origin))) {
+ _context.next = 10;
+ break;
+ }
+
+ // Todo: Surface this error to user?
+ console.log("Origin ".concat(origin, " not whitelisted for posting to ").concat(window.origin)); // eslint-disable-line no-console
+
+ return _context.abrupt("return");
+
+ case 10:
+ hasName = 'name' in response;
+ hasHref = 'href' in response;
+
+ if (!(!hasName && transferStopped)) {
+ _context.next = 15;
+ break;
+ }
+
+ transferStopped = false;
+ return _context.abrupt("return");
+
+ case 15:
+ if (hasHref) {
+ id = response.href;
+ response = response.data;
+ } // Hide possible transfer dialog box
+
+
+ $('#dialog_box').hide();
+ type = hasName ? 'meta' : response.charAt(0);
+ _context.next = 28;
+ break;
+
+ case 20:
+ _context.prev = 20;
+ _context.t0 = _context["catch"](3);
+
+ if (!(typeof response === 'string')) {
+ _context.next = 28;
+ break;
+ }
+
+ char1 = response.charAt(0);
+
+ if (!(char1 !== '{' && transferStopped)) {
+ _context.next = 27;
+ break;
+ }
+
+ transferStopped = false;
+ return _context.abrupt("return");
+
+ case 27:
+ if (char1 === '|') {
+ secondpos = response.indexOf('|', 1);
+ id = response.substr(1, secondpos - 1);
+ response = response.substr(secondpos + 1);
+ type = response.charAt(0);
+ }
+
+ case 28:
+ _context.t1 = type;
+ _context.next = _context.t1 === 'meta' ? 31 : _context.t1 === '<' ? 47 : _context.t1 === 'd' ? 49 : 60;
+ break;
+
+ case 31:
+ // Metadata
+ transferStopped = false;
+ curMeta = response; // Should be safe to add dynamic property as passed metadata
+
+ pending[curMeta.id] = curMeta; // lgtm [js/remote-property-injection]
+
+ name = curMeta.name || 'file';
+ message = uiStrings.notification.retrieving.replace('%s', name);
+
+ if (!(mode !== 'm')) {
+ _context.next = 43;
+ break;
+ }
+
+ _context.next = 39;
+ return $.process_cancel(message);
+
+ case 39:
+ transferStopped = true; // Should a message be sent back to the frame?
+
+ $('#dialog_box').hide();
+ _context.next = 46;
+ break;
+
+ case 43:
+ entry = $('<div>').text(message).data('id', curMeta.id);
+ preview.append(entry);
+ curMeta.entry = entry;
+
+ case 46:
+ return _context.abrupt("return");
+
+ case 47:
+ svgStr = true;
+ return _context.abrupt("break", 62);
+
+ case 49:
+ if (!response.startsWith('data:image/svg+xml')) {
+ _context.next = 57;
+ break;
+ }
+
+ pre = 'data:image/svg+xml;base64,';
+ src = response.substring(pre.length);
+ response = decode64(src);
+ svgStr = true;
+ return _context.abrupt("break", 62);
+
+ case 57:
+ if (!response.startsWith('data:image/')) {
+ _context.next = 60;
+ break;
+ }
+
+ imgStr = true;
+ return _context.abrupt("break", 62);
+
+ case 60:
+ // TODO: See if there's a way to base64 encode the binary data stream
+ // const str = 'data:;base64,' + svgedit.utilities.encode64(response, true);
+ // Assume it's raw image data
+ // importImage(str);
+ // Don't give warning as postMessage may have been used by something else
+ if (mode !== 'm') {
+ closeBrowser();
+ } else {
+ pending[id].entry.remove();
+ } // await $.alert('Unexpected data was returned: ' + response, function() {
+ // if (mode !== 'm') {
+ // closeBrowser();
+ // } else {
+ // pending[id].entry.remove();
+ // }
+ // });
+
+
+ return _context.abrupt("return");
+
+ case 62:
+ _context.t2 = mode;
+ _context.next = _context.t2 === 's' ? 65 : _context.t2 === 'm' ? 68 : _context.t2 === 'o' ? 72 : 83;
+ break;
+
+ case 65:
+ // Import one
+ if (svgStr) {
+ svgCanvas.importSvgString(response);
+ } else if (imgStr) {
+ importImage(response);
+ }
+
+ closeBrowser();
+ return _context.abrupt("break", 83);
+
+ case 68:
+ // Import multiple
+ multiArr.push([svgStr ? 'svg' : 'img', response]);
+ curMeta = pending[id];
+
+ if (svgStr) {
+ if (curMeta && curMeta.name) {
+ title = curMeta.name;
+ } else {
+ // Try to find a title
+ // `dropXMLInternalSubset` is to help prevent the billion laughs attack
+ xml = new DOMParser().parseFromString(dropXMLInternalSubset(response), 'text/xml').documentElement; // lgtm [js/xml-bomb]
+
+ title = $(xml).children('title').first().text() || '(SVG #' + response.length + ')';
+ }
+
+ if (curMeta) {
+ preview.children().each(function () {
+ if ($(this).data('id') === id) {
+ if (curMeta.preview_url) {
+ $(this).html($('<span>').append($('<img>').attr('src', curMeta.preview_url), title));
+ } else {
+ $(this).text(title);
+ }
+
+ submit.removeAttr('disabled');
+ }
+ });
+ } else {
+ preview.append($('<div>').text(title));
+ submit.removeAttr('disabled');
+ }
+ } else {
+ if (curMeta && curMeta.preview_url) {
+ title = curMeta.name || '';
+ entry = $('<span>').append($('<img>').attr('src', curMeta.preview_url), title);
+ } else {
+ entry = $('<img>').attr('src', response);
+ }
+
+ if (curMeta) {
+ preview.children().each(function () {
+ if ($(this).data('id') === id) {
+ $(this).html(entry);
+ submit.removeAttr('disabled');
+ }
+ });
+ } else {
+ preview.append($('<div>').append(entry));
+ submit.removeAttr('disabled');
+ }
+ }
+
+ return _context.abrupt("break", 83);
+
+ case 72:
+ if (svgStr) {
+ _context.next = 74;
+ break;
+ }
+
+ return _context.abrupt("break", 83);
+
+ case 74:
+ closeBrowser();
+ _context.next = 77;
+ return svgEditor.openPrep();
+
+ case 77:
+ ok = _context.sent;
+
+ if (ok) {
+ _context.next = 80;
+ break;
+ }
+
+ return _context.abrupt("return");
+
+ case 80:
+ svgCanvas.clear();
+ svgCanvas.setSvgString(response); // updateCanvas();
+
+ return _context.abrupt("break", 83);
+
+ case 83:
+ case "end":
+ return _context.stop();
+ }
+ }
+ }, _callee, null, [[3, 20]]);
+ }));
+ return _onMessage.apply(this, arguments);
+ };
+
+ onMessage = function _onMessage2(_x) {
+ return _onMessage.apply(this, arguments);
+ };
+
+ importImage = function _importImage(url) {
+ var newImage = svgCanvas.addSVGElementFromJson({
+ element: 'image',
+ attr: {
+ x: 0,
+ y: 0,
+ width: 0,
+ height: 0,
+ id: svgCanvas.getNextId(),
+ style: 'pointer-events:inherit'
}
});
- } else {
- preview.append($('<div>').text(title));
- submit.removeAttr('disabled');
- }
- } else {
- if (curMeta && curMeta.preview_url) {
- title = curMeta.name || '';
- entry = $('<span>').append($('<img>').attr('src', curMeta.preview_url), title);
- } else {
- entry = $('<img>').attr('src', response);
- }
+ svgCanvas.clearSelection();
+ svgCanvas.addToSelection([newImage]);
+ svgCanvas.setImageURL(url);
+ };
- if (curMeta) {
- preview.children().each(function () {
- if ($(this).data('id') === id) {
- $(this).html(entry);
- submit.removeAttr('disabled');
- }
- });
- } else {
- preview.append($('<div>').append(entry));
- submit.removeAttr('disabled');
- }
- }
+ closeBrowser = function _closeBrowser() {
+ $('#imgbrowse_holder').hide();
+ document.activeElement.blur(); // make sure focus is the body to correct issue #417
+ };
- break;
+ $ = _ref.$, decode64 = _ref.decode64, importLocale = _ref.importLocale, dropXMLInternalSubset = _ref.dropXMLInternalSubset;
+ _context2.next = 9;
+ return importLocale();
+
+ case 9:
+ imagelibStrings = _context2.sent;
+ modularVersion = !('svgEditor' in window) || !window.svgEditor || window.svgEditor.modules !== false;
+ svgEditor = _this;
+ uiStrings = svgEditor.uiStrings, svgCanvas = svgEditor.canvas, extIconsPath = svgEditor.curConfig.extIconsPath;
+ imagelibStrings.imgLibs = imagelibStrings.imgLibs.map(function (_ref2) {
+ var name = _ref2.name,
+ url = _ref2.url,
+ description = _ref2.description;
+ // Todo: Adopt some standard formatting library like `fluent.js` instead
+ url = url // Keep these regexes as is in prep. for switching to `u` flag
+ // which will require escaping
+ // eslint-disable-next-line unicorn/better-regex
+ .replace(/\{path\}/g, extIconsPath).replace( // eslint-disable-next-line unicorn/better-regex
+ /\{modularVersion\}/g, modularVersion ? imagelibStrings.moduleEnding || '-es' : '');
+ return {
+ name: name,
+ url: url,
+ description: description
+ };
+ });
+ allowedImageLibOrigins = imagelibStrings.imgLibs.map(function (_ref3) {
+ var url = _ref3.url;
+
+ try {
+ return new URL(url).origin;
+ } catch (err) {
+ return location.origin;
+ }
+ });
+ /**
+ *
+ * @returns {void}
+ */
+
+ pending = {};
+ mode = 's';
+ multiArr = [];
+ transferStopped = false;
+ // Receive `postMessage` data
+ window.addEventListener('message', onMessage, true);
+ /**
+ * @param {boolean} show
+ * @returns {void}
+ */
+
+ buttons = [{
+ id: 'tool_imagelib',
+ type: 'app_menu',
+ // _flyout
+ icon: extIconsPath + 'imagelib.png',
+ position: 4,
+ events: {
+ mouseup: showBrowser
+ }
+ }];
+ return _context2.abrupt("return", {
+ svgicons: extIconsPath + 'ext-imagelib.xml',
+ buttons: imagelibStrings.buttons.map(function (button, i) {
+ return Object.assign(buttons[i], button);
+ }),
+ callback: function callback() {
+ $('<style>').text('#imgbrowse_holder {' + 'position: absolute;' + 'top: 0;' + 'left: 0;' + 'width: 100%;' + 'height: 100%;' + 'background-color: rgba(0, 0, 0, .5);' + 'z-index: 5;' + '}' + '#imgbrowse {' + 'position: absolute;' + 'top: 25px;' + 'left: 25px;' + 'right: 25px;' + 'bottom: 25px;' + 'min-width: 300px;' + 'min-height: 200px;' + 'background: #B0B0B0;' + 'border: 1px outset #777;' + '}' + '#imgbrowse h1 {' + 'font-size: 20px;' + 'margin: .4em;' + 'text-align: center;' + '}' + '#lib_framewrap,' + '#imgbrowse > ul {' + 'position: absolute;' + 'top: 45px;' + 'left: 10px;' + 'right: 10px;' + 'bottom: 10px;' + 'background: white;' + 'margin: 0;' + 'padding: 0;' + '}' + '#imgbrowse > ul {' + 'overflow: auto;' + '}' + '#imgbrowse > div {' + 'border: 1px solid #666;' + '}' + '#imglib_preview > div {' + 'padding: 5px;' + 'font-size: 12px;' + '}' + '#imglib_preview img {' + 'display: block;' + 'margin: 0 auto;' + 'max-height: 100px;' + '}' + '#imgbrowse li {' + 'list-style: none;' + 'padding: .5em;' + 'background: #E8E8E8;' + 'border-bottom: 1px solid #B0B0B0;' + 'line-height: 1.2em;' + 'font-style: sans-serif;' + '}' + '#imgbrowse li > span {' + 'color: #666;' + 'font-size: 15px;' + 'display: block;' + '}' + '#imgbrowse li:hover {' + 'background: #FFC;' + 'cursor: pointer;' + '}' + '#imgbrowse iframe {' + 'width: 100%;' + 'height: 100%;' + 'border: 0;' + '}').appendTo('head');
+ }
+ });
+
+ case 22:
+ case "end":
+ return _context2.stop();
}
-
- case 'o':
- {
- // Open
- if (!svgStr) {
- break;
- }
-
- closeBrowser();
- const ok = await svgEditor.openPrep();
-
- if (!ok) {
- return;
- }
-
- svgCanvas.clear();
- svgCanvas.setSvgString(response); // updateCanvas();
-
- break;
- }
- }
- } // Receive `postMessage` data
-
-
- window.addEventListener('message', onMessage, true);
- /**
- * @param {boolean} show
- * @returns {void}
- */
-
- function toggleMulti(show) {
- $('#lib_framewrap, #imglib_opts').css({
- right: show ? 200 : 10
- });
-
- if (!preview) {
- preview = $('<div id=imglib_preview>').css({
- position: 'absolute',
- top: 45,
- right: 10,
- width: 180,
- bottom: 45,
- background: '#fff',
- overflow: 'auto'
- }).insertAfter('#lib_framewrap');
- submit = $('<button disabled>Import selected</button>').appendTo('#imgbrowse').on('click touchend', function () {
- $.each(multiArr, function (i) {
- const type = this[0];
- const data = this[1];
-
- if (type === 'svg') {
- svgCanvas.importSvgString(data);
- } else {
- importImage(data);
- }
-
- svgCanvas.moveSelectedElements(i * 20, i * 20, false);
- });
- preview.empty();
- multiArr = [];
- $('#imgbrowse_holder').hide();
- }).css({
- position: 'absolute',
- bottom: 10,
- right: -10
- });
- }
-
- preview.toggle(show);
- submit.toggle(show);
- }
- /**
- *
- * @returns {void}
- */
-
-
- function showBrowser() {
- let browser = $('#imgbrowse');
-
- if (!browser.length) {
- $('<div id=imgbrowse_holder><div id=imgbrowse class=toolbar_button>' + '</div></div>').insertAfter('#svg_docprops');
- browser = $('#imgbrowse');
- const allLibs = imagelibStrings.select_lib;
- const libOpts = $('<ul id=imglib_opts>').appendTo(browser);
- const frame = $('<iframe src="javascript:0"/>').prependTo(browser).hide().wrap('<div id=lib_framewrap>');
- const header = $('<h1>').prependTo(browser).text(allLibs).css({
- position: 'absolute',
- top: 0,
- left: 0,
- width: '100%'
- });
- const cancel = $('<button>' + uiStrings.common.cancel + '</button>').appendTo(browser).on('click touchend', function () {
- $('#imgbrowse_holder').hide();
- }).css({
- position: 'absolute',
- top: 5,
- right: -10
- });
- const leftBlock = $('<span>').css({
- position: 'absolute',
- top: 5,
- left: 10
- }).appendTo(browser);
- const back = $('<button hidden>' + imagelibStrings.show_list + '</button>').appendTo(leftBlock).on('click touchend', function () {
- frame.attr('src', 'about:blank').hide();
- libOpts.show();
- header.text(allLibs);
- back.hide();
- }).css({
- 'margin-right': 5
- }).hide();
- /* const type = */
-
- $('<select><option value=s>' + imagelibStrings.import_single + '</option><option value=m>' + imagelibStrings.import_multi + '</option><option value=o>' + imagelibStrings.open + '</option></select>').appendTo(leftBlock).change(function () {
- mode = $(this).val();
-
- switch (mode) {
- case 's':
- case 'o':
- toggleMulti(false);
- break;
-
- case 'm':
- // Import multiple
- toggleMulti(true);
- break;
- }
- }).css({
- 'margin-top': 10
- });
- cancel.prepend($.getSvgIcon('cancel', true));
- back.prepend($.getSvgIcon('tool_imagelib', true));
- imagelibStrings.imgLibs.forEach(function ({
- name,
- url,
- description
- }) {
- $('<li>').appendTo(libOpts).text(name).on('click touchend', function () {
- frame.attr('src', url).show();
- header.text(name);
- libOpts.hide();
- back.show();
- }).append(`<span>${description}</span>`);
- });
- } else {
- $('#imgbrowse_holder').show();
- }
- }
-
- const buttons = [{
- id: 'tool_imagelib',
- type: 'app_menu',
- // _flyout
- icon: extIconsPath + 'imagelib.png',
- position: 4,
- events: {
- mouseup: showBrowser
- }
- }];
- return {
- svgicons: extIconsPath + 'ext-imagelib.xml',
- buttons: imagelibStrings.buttons.map((button, i) => {
- return Object.assign(buttons[i], button);
- }),
-
- callback() {
- $('<style>').text('#imgbrowse_holder {' + 'position: absolute;' + 'top: 0;' + 'left: 0;' + 'width: 100%;' + 'height: 100%;' + 'background-color: rgba(0, 0, 0, .5);' + 'z-index: 5;' + '}' + '#imgbrowse {' + 'position: absolute;' + 'top: 25px;' + 'left: 25px;' + 'right: 25px;' + 'bottom: 25px;' + 'min-width: 300px;' + 'min-height: 200px;' + 'background: #B0B0B0;' + 'border: 1px outset #777;' + '}' + '#imgbrowse h1 {' + 'font-size: 20px;' + 'margin: .4em;' + 'text-align: center;' + '}' + '#lib_framewrap,' + '#imgbrowse > ul {' + 'position: absolute;' + 'top: 45px;' + 'left: 10px;' + 'right: 10px;' + 'bottom: 10px;' + 'background: white;' + 'margin: 0;' + 'padding: 0;' + '}' + '#imgbrowse > ul {' + 'overflow: auto;' + '}' + '#imgbrowse > div {' + 'border: 1px solid #666;' + '}' + '#imglib_preview > div {' + 'padding: 5px;' + 'font-size: 12px;' + '}' + '#imglib_preview img {' + 'display: block;' + 'margin: 0 auto;' + 'max-height: 100px;' + '}' + '#imgbrowse li {' + 'list-style: none;' + 'padding: .5em;' + 'background: #E8E8E8;' + 'border-bottom: 1px solid #B0B0B0;' + 'line-height: 1.2em;' + 'font-style: sans-serif;' + '}' + '#imgbrowse li > span {' + 'color: #666;' + 'font-size: 15px;' + 'display: block;' + '}' + '#imgbrowse li:hover {' + 'background: #FFC;' + 'cursor: pointer;' + '}' + '#imgbrowse iframe {' + 'width: 100%;' + 'height: 100%;' + 'border: 0;' + '}').appendTo('head');
- }
-
- };
+ }
+ }, _callee2);
+ }))();
}
-
};
return extImagelib;
diff --git a/dist/extensions/ext-markers.js b/dist/extensions/ext-markers.js
index c3dc6c12..203ebc21 100644
--- a/dist/extensions/ext-markers.js
+++ b/dist/extensions/ext-markers.js
@@ -1,6 +1,42 @@
var svgEditorExtension_markers = (function () {
'use strict';
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+ try {
+ var info = gen[key](arg);
+ var value = info.value;
+ } catch (error) {
+ reject(error);
+ return;
+ }
+
+ if (info.done) {
+ resolve(value);
+ } else {
+ Promise.resolve(value).then(_next, _throw);
+ }
+ }
+
+ function _asyncToGenerator(fn) {
+ return function () {
+ var self = this,
+ args = arguments;
+ return new Promise(function (resolve, reject) {
+ var gen = fn.apply(self, args);
+
+ function _next(value) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+ }
+
+ function _throw(err) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+ }
+
+ _next(undefined);
+ });
+ };
+ }
+
/**
* @file ext-markers.js
*
@@ -33,734 +69,693 @@ var svgEditorExtension_markers = (function () {
*/
var extMarkers = {
name: 'markers',
-
- async init(S) {
- const strings = await S.importLocale();
- const svgEditor = this;
- const {
- $
- } = S;
- const svgCanvas = svgEditor.canvas;
- const // {svgcontent} = S,
- addElem = svgCanvas.addSVGElementFromJson;
- const mtypes = ['start', 'mid', 'end'];
- const markerPrefix = 'se_marker_';
- const idPrefix = 'mkr_'; // note - to add additional marker types add them below with a unique id
- // and add the associated icon(s) to marker-icons.svg
- // the geometry is normalized to a 100x100 box with the origin at lower left
- // Safari did not like negative values for low left of viewBox
- // remember that the coordinate system has +y downward
-
- const markerTypes = {
- nomarker: {},
- leftarrow: {
- element: 'path',
- attr: {
- d: 'M0,50 L100,90 L70,50 L100,10 Z'
- }
- },
- rightarrow: {
- element: 'path',
- attr: {
- d: 'M100,50 L0,90 L30,50 L0,10 Z'
- }
- },
- textmarker: {
- element: 'text',
- attr: {
- x: 0,
- y: 0,
- 'stroke-width': 0,
- stroke: 'none',
- 'font-size': 75,
- 'font-family': 'serif',
- 'text-anchor': 'left',
- 'xml:space': 'preserve'
- }
- },
- forwardslash: {
- element: 'path',
- attr: {
- d: 'M30,100 L70,0'
- }
- },
- reverseslash: {
- element: 'path',
- attr: {
- d: 'M30,0 L70,100'
- }
- },
- verticalslash: {
- element: 'path',
- attr: {
- d: 'M50,0 L50,100'
- }
- },
- box: {
- element: 'path',
- attr: {
- d: 'M20,20 L20,80 L80,80 L80,20 Z'
- }
- },
- star: {
- element: 'path',
- attr: {
- d: 'M10,30 L90,30 L20,90 L50,10 L80,90 Z'
- }
- },
- xmark: {
- element: 'path',
- attr: {
- d: 'M20,80 L80,20 M80,80 L20,20'
- }
- },
- triangle: {
- element: 'path',
- attr: {
- d: 'M10,80 L50,20 L80,80 Z'
- }
- },
- mcircle: {
- element: 'circle',
- attr: {
- r: 30,
- cx: 50,
- cy: 50
- }
- }
- }; // duplicate shapes to support unfilled (open) marker types with an _o suffix
-
- ['leftarrow', 'rightarrow', 'box', 'star', 'mcircle', 'triangle'].forEach(v => {
- markerTypes[v + '_o'] = markerTypes[v];
- });
- /**
- * @param {Element} elem - A graphic element will have an attribute like marker-start
- * @param {"marker-start"|"marker-mid"|"marker-end"} attr
- * @returns {Element} The marker element that is linked to the graphic element
- */
-
- function getLinked(elem, attr) {
- const str = elem.getAttribute(attr);
-
- if (!str) {
- return null;
- }
-
- const m = str.match(/\(#(.*)\)/); // const m = str.match(/\(#(?<id>.+)\)/);
- // if (!m || !m.groups.id) {
-
- if (!m || m.length !== 2) {
- return null;
- }
-
- return svgCanvas.getElem(m[1]); // return svgCanvas.getElem(m.groups.id);
- }
- /**
- *
- * @param {"start"|"mid"|"end"} pos
- * @param {string} id
- * @returns {void}
- */
-
-
- function setIcon(pos, id) {
- if (id.substr(0, 1) !== '\\') {
- id = '\\textmarker';
- }
-
- const ci = '#' + idPrefix + pos + '_' + id.substr(1);
- svgEditor.setIcon('#cur_' + pos + '_marker_list', $(ci).children());
- $(ci).addClass('current').siblings().removeClass('current');
- }
-
- let selElems;
- /**
- * Toggles context tool panel off/on. Sets the controls with the
- * selected element's settings.
- * @param {boolean} on
- * @returns {void}
- */
-
- function showPanel(on) {
- $('#marker_panel').toggle(on);
-
- if (on) {
- const el = selElems[0];
- let val, ci;
- $.each(mtypes, function (i, pos) {
- const m = getLinked(el, 'marker-' + pos);
- const txtbox = $('#' + pos + '_marker');
-
- if (!m) {
- val = '\\nomarker';
- ci = val;
- txtbox.hide(); // hide text box
- } else {
- if (!m.attributes.se_type) {
- return;
- } // not created by this extension
-
-
- val = '\\' + m.attributes.se_type.textContent;
- ci = val;
-
- if (val === '\\textmarker') {
- val = m.lastChild.textContent; // txtbox.show(); // show text box
- } else {
- txtbox.hide(); // hide text box
- }
- }
-
- txtbox.val(val);
- setIcon(pos, ci);
- });
- }
- }
- /**
- * @param {string} id
- * @param {""|"\\nomarker"|"nomarker"|"leftarrow"|"rightarrow"|"textmarker"|"forwardslash"|"reverseslash"|"verticalslash"|"box"|"star"|"xmark"|"triangle"|"mcircle"} val
- * @returns {SVGMarkerElement}
- */
-
-
- function addMarker(id, val) {
- const txtBoxBg = '#ffffff';
- const txtBoxBorder = 'none';
- const txtBoxStrokeWidth = 0;
- let marker = svgCanvas.getElem(id);
-
- if (marker) {
- return undefined;
- }
-
- if (val === '' || val === '\\nomarker') {
- return undefined;
- }
-
- const el = selElems[0];
- const color = el.getAttribute('stroke'); // NOTE: Safari didn't like a negative value in viewBox
- // so we use a standardized 0 0 100 100
- // with 50 50 being mapped to the marker position
-
- const strokeWidth = 10;
- let refX = 50;
- let refY = 50;
- let viewBox = '0 0 100 100';
- let markerWidth = 5;
- let markerHeight = 5;
- let seType;
-
- if (val.substr(0, 1) === '\\') {
- seType = val.substr(1);
- } else {
- seType = 'textmarker';
- }
-
- if (!markerTypes[seType]) {
- return undefined;
- } // an unknown type!
- // create a generic marker
-
-
- marker = addElem({
- element: 'marker',
- attr: {
- id,
- markerUnits: 'strokeWidth',
- orient: 'auto',
- style: 'pointer-events:none',
- se_type: seType
- }
- });
-
- if (seType !== 'textmarker') {
- const mel = addElem(markerTypes[seType]);
- const fillcolor = seType.substr(-2) === '_o' ? 'none' : color;
- mel.setAttribute('fill', fillcolor);
- mel.setAttribute('stroke', color);
- mel.setAttribute('stroke-width', strokeWidth);
- marker.append(mel);
- } else {
- const text = addElem(markerTypes[seType]); // have to add text to get bounding box
-
- text.textContent = val;
- const tb = text.getBBox(); // alert(tb.x + ' ' + tb.y + ' ' + tb.width + ' ' + tb.height);
-
- const pad = 1;
- const bb = tb;
- bb.x = 0;
- bb.y = 0;
- bb.width += pad * 2;
- bb.height += pad * 2; // shift text according to its size
-
- text.setAttribute('x', pad);
- text.setAttribute('y', bb.height - pad - tb.height / 4); // kludge?
-
- text.setAttribute('fill', color);
- refX = bb.width / 2 + pad;
- refY = bb.height / 2 + pad;
- viewBox = bb.x + ' ' + bb.y + ' ' + bb.width + ' ' + bb.height;
- markerWidth = bb.width / 10;
- markerHeight = bb.height / 10;
- const box = addElem({
- element: 'rect',
- attr: {
- x: bb.x,
- y: bb.y,
- width: bb.width,
- height: bb.height,
- fill: txtBoxBg,
- stroke: txtBoxBorder,
- 'stroke-width': txtBoxStrokeWidth
- }
- });
- marker.setAttribute('orient', 0);
- marker.append(box, text);
- }
-
- marker.setAttribute('viewBox', viewBox);
- marker.setAttribute('markerWidth', markerWidth);
- marker.setAttribute('markerHeight', markerHeight);
- marker.setAttribute('refX', refX);
- marker.setAttribute('refY', refY);
- svgCanvas.findDefs().append(marker);
- return marker;
- }
- /**
- * @param {Element} elem
- * @returns {SVGPolylineElement}
- */
-
-
- function convertline(elem) {
- // this routine came from the connectors extension
- // it is needed because midpoint markers don't work with line elements
- if (elem.tagName !== 'line') {
- return elem;
- } // Convert to polyline to accept mid-arrow
-
-
- const x1 = Number(elem.getAttribute('x1'));
- const x2 = Number(elem.getAttribute('x2'));
- const y1 = Number(elem.getAttribute('y1'));
- const y2 = Number(elem.getAttribute('y2'));
- const {
- id
- } = elem;
- const midPt = ' ' + (x1 + x2) / 2 + ',' + (y1 + y2) / 2 + ' ';
- const pline = addElem({
- element: 'polyline',
- attr: {
- points: x1 + ',' + y1 + midPt + x2 + ',' + y2,
- stroke: elem.getAttribute('stroke'),
- 'stroke-width': elem.getAttribute('stroke-width'),
- fill: 'none',
- opacity: elem.getAttribute('opacity') || 1
- }
- });
- $.each(mtypes, function (i, pos) {
- // get any existing marker definitions
- const nam = 'marker-' + pos;
- const m = elem.getAttribute(nam);
-
- if (m) {
- pline.setAttribute(nam, elem.getAttribute(nam));
- }
- });
- const batchCmd = new S.BatchCommand();
- batchCmd.addSubCommand(new S.RemoveElementCommand(elem, elem.parentNode));
- batchCmd.addSubCommand(new S.InsertElementCommand(pline));
- $(elem).after(pline).remove();
- svgCanvas.clearSelection();
- pline.id = id;
- svgCanvas.addToSelection([pline]);
- S.addCommandToHistory(batchCmd);
- return pline;
- }
- /**
- *
- * @returns {void}
- */
-
-
- function setMarker() {
- const poslist = {
- start_marker: 'start',
- mid_marker: 'mid',
- end_marker: 'end'
- };
- const pos = poslist[this.id];
- const markerName = 'marker-' + pos;
- const el = selElems[0];
- const marker = getLinked(el, markerName);
-
- if (marker) {
- $(marker).remove();
- }
-
- el.removeAttribute(markerName);
- let val = this.value;
-
- if (val === '') {
- val = '\\nomarker';
- }
-
- if (val === '\\nomarker') {
- setIcon(pos, val);
- svgCanvas.call('changed', selElems);
- return;
- } // Set marker on element
-
-
- const id = markerPrefix + pos + '_' + el.id;
- addMarker(id, val);
- svgCanvas.changeSelectedAttribute(markerName, 'url(#' + id + ')');
-
- if (el.tagName === 'line' && pos === 'mid') {
- convertline(el);
- }
-
- svgCanvas.call('changed', selElems);
- setIcon(pos, val);
- }
- /**
- * Called when the main system modifies an object. This routine changes
- * the associated markers to be the same color.
- * @param {Element} elem
- * @returns {void}
- */
-
-
- function colorChanged(elem) {
- const color = elem.getAttribute('stroke');
- $.each(mtypes, function (i, pos) {
- const marker = getLinked(elem, 'marker-' + pos);
-
- if (!marker) {
- return;
- }
-
- if (!marker.attributes.se_type) {
- return;
- } // not created by this extension
-
-
- const ch = marker.lastElementChild;
-
- if (!ch) {
- return;
- }
-
- const curfill = ch.getAttribute('fill');
- const curstroke = ch.getAttribute('stroke');
-
- if (curfill && curfill !== 'none') {
- ch.setAttribute('fill', color);
- }
-
- if (curstroke && curstroke !== 'none') {
- ch.setAttribute('stroke', color);
- }
- });
- }
- /**
- * Called when the main system creates or modifies an object.
- * Its primary purpose is to create new markers for cloned objects.
- * @param {Element} el
- * @returns {void}
- */
-
-
- function updateReferences(el) {
- $.each(mtypes, function (i, pos) {
- const id = markerPrefix + pos + '_' + el.id;
- const markerName = 'marker-' + pos;
- const marker = getLinked(el, markerName);
-
- if (!marker || !marker.attributes.se_type) {
- return;
- } // not created by this extension
-
-
- const url = el.getAttribute(markerName);
-
- if (url) {
- const len = el.id.length;
- const linkid = url.substr(-len - 1, len);
-
- if (el.id !== linkid) {
- const val = $('#' + pos + '_marker').attr('value');
- addMarker(id, val);
- svgCanvas.changeSelectedAttribute(markerName, 'url(#' + id + ')');
-
- if (el.tagName === 'line' && pos === 'mid') {
- el = convertline(el);
- }
-
- svgCanvas.call('changed', selElems);
+ init: function init(S) {
+ var _this = this;
+
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
+ var strings, svgEditor, $, svgCanvas, addElem, mtypes, markerPrefix, idPrefix, markerTypes, getLinked, setIcon, selElems, showPanel, addMarker, convertline, setMarker, colorChanged, updateReferences, triggerTextEntry, showTextPrompt, _showTextPrompt, setArrowFromButton, _setArrowFromButton, getTitle, buildButtonList, contextTools;
+
+ return regeneratorRuntime.wrap(function _callee3$(_context3) {
+ while (1) {
+ switch (_context3.prev = _context3.next) {
+ case 0:
+ buildButtonList = function _buildButtonList() {
+ var buttons = []; // const i = 0;
+
+ /*
+ buttons.push({
+ id: idPrefix + 'markers_off',
+ title: 'Turn off all markers',
+ type: 'context',
+ events: { click: setMarkerSet },
+ panel: 'marker_panel'
+ });
+ buttons.push({
+ id: idPrefix + 'markers_dimension',
+ title: 'Dimension',
+ type: 'context',
+ events: { click: setMarkerSet },
+ panel: 'marker_panel'
+ });
+ buttons.push({
+ id: idPrefix + 'markers_label',
+ title: 'Label',
+ type: 'context',
+ events: { click: setMarkerSet },
+ panel: 'marker_panel'
+ });
+ */
+
+ $.each(mtypes, function (k, pos) {
+ var listname = pos + '_marker_list';
+ var def = true;
+ Object.keys(markerTypes).forEach(function (id) {
+ var title = getTitle(String(id));
+ buttons.push({
+ id: idPrefix + pos + '_' + id,
+ svgicon: id,
+ icon: svgEditor.curConfig.extIconsPath + 'markers-' + id + '.png',
+ title: title,
+ type: 'context',
+ events: {
+ click: setArrowFromButton
+ },
+ panel: 'marker_panel',
+ list: listname,
+ isDefault: def
+ });
+ def = false;
+ });
+ });
+ return buttons;
+ };
+
+ getTitle = function _getTitle(id) {
+ var langList = strings.langList;
+ var item = langList.find(function (itm) {
+ return itm.id === id;
+ });
+ return item ? item.title : id;
+ };
+
+ _setArrowFromButton = function _setArrowFromButton3() {
+ _setArrowFromButton = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(ev) {
+ var parts, pos, val;
+ return regeneratorRuntime.wrap(function _callee2$(_context2) {
+ while (1) {
+ switch (_context2.prev = _context2.next) {
+ case 0:
+ parts = this.id.split('_');
+ pos = parts[1];
+ val = parts[2];
+
+ if (parts[3]) {
+ val += '_' + parts[3];
+ }
+
+ if (!(val !== 'textmarker')) {
+ _context2.next = 8;
+ break;
+ }
+
+ triggerTextEntry(pos, '\\' + val);
+ _context2.next = 10;
+ break;
+
+ case 8:
+ _context2.next = 10;
+ return showTextPrompt(pos);
+
+ case 10:
+ case "end":
+ return _context2.stop();
+ }
+ }
+ }, _callee2, this);
+ }));
+ return _setArrowFromButton.apply(this, arguments);
+ };
+
+ setArrowFromButton = function _setArrowFromButton2(_x2) {
+ return _setArrowFromButton.apply(this, arguments);
+ };
+
+ _showTextPrompt = function _showTextPrompt3() {
+ _showTextPrompt = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(pos) {
+ var def, txt;
+ return regeneratorRuntime.wrap(function _callee$(_context) {
+ while (1) {
+ switch (_context.prev = _context.next) {
+ case 0:
+ def = $('#' + pos + '_marker').val();
+
+ if (def.substr(0, 1) === '\\') {
+ def = '';
+ }
+
+ _context.next = 4;
+ return $.prompt('Enter text for ' + pos + ' marker', def);
+
+ case 4:
+ txt = _context.sent;
+
+ if (txt) {
+ triggerTextEntry(pos, txt);
+ }
+
+ case 6:
+ case "end":
+ return _context.stop();
+ }
+ }
+ }, _callee);
+ }));
+ return _showTextPrompt.apply(this, arguments);
+ };
+
+ showTextPrompt = function _showTextPrompt2(_x) {
+ return _showTextPrompt.apply(this, arguments);
+ };
+
+ triggerTextEntry = function _triggerTextEntry(pos, val) {
+ $('#' + pos + '_marker').val(val);
+ $('#' + pos + '_marker').change(); // const txtbox = $('#'+pos+'_marker');
+ // if (val.substr(0,1)=='\\') {txtbox.hide();}
+ // else {txtbox.show();}
+ };
+
+ updateReferences = function _updateReferences(el) {
+ $.each(mtypes, function (i, pos) {
+ var id = markerPrefix + pos + '_' + el.id;
+ var markerName = 'marker-' + pos;
+ var marker = getLinked(el, markerName);
+
+ if (!marker || !marker.attributes.se_type) {
+ return;
+ } // not created by this extension
+
+
+ var url = el.getAttribute(markerName);
+
+ if (url) {
+ var len = el.id.length;
+ var linkid = url.substr(-len - 1, len);
+
+ if (el.id !== linkid) {
+ var val = $('#' + pos + '_marker').attr('value');
+ addMarker(id, val);
+ svgCanvas.changeSelectedAttribute(markerName, 'url(#' + id + ')');
+
+ if (el.tagName === 'line' && pos === 'mid') {
+ el = convertline(el);
+ }
+
+ svgCanvas.call('changed', selElems);
+ }
+ }
+ });
+ };
+
+ colorChanged = function _colorChanged(elem) {
+ var color = elem.getAttribute('stroke');
+ $.each(mtypes, function (i, pos) {
+ var marker = getLinked(elem, 'marker-' + pos);
+
+ if (!marker) {
+ return;
+ }
+
+ if (!marker.attributes.se_type) {
+ return;
+ } // not created by this extension
+
+
+ var ch = marker.lastElementChild;
+
+ if (!ch) {
+ return;
+ }
+
+ var curfill = ch.getAttribute('fill');
+ var curstroke = ch.getAttribute('stroke');
+
+ if (curfill && curfill !== 'none') {
+ ch.setAttribute('fill', color);
+ }
+
+ if (curstroke && curstroke !== 'none') {
+ ch.setAttribute('stroke', color);
+ }
+ });
+ };
+
+ setMarker = function _setMarker() {
+ var poslist = {
+ start_marker: 'start',
+ mid_marker: 'mid',
+ end_marker: 'end'
+ };
+ var pos = poslist[this.id];
+ var markerName = 'marker-' + pos;
+ var el = selElems[0];
+ var marker = getLinked(el, markerName);
+
+ if (marker) {
+ $(marker).remove();
+ }
+
+ el.removeAttribute(markerName);
+ var val = this.value;
+
+ if (val === '') {
+ val = '\\nomarker';
+ }
+
+ if (val === '\\nomarker') {
+ setIcon(pos, val);
+ svgCanvas.call('changed', selElems);
+ return;
+ } // Set marker on element
+
+
+ var id = markerPrefix + pos + '_' + el.id;
+ addMarker(id, val);
+ svgCanvas.changeSelectedAttribute(markerName, 'url(#' + id + ')');
+
+ if (el.tagName === 'line' && pos === 'mid') {
+ convertline(el);
+ }
+
+ svgCanvas.call('changed', selElems);
+ setIcon(pos, val);
+ };
+
+ convertline = function _convertline(elem) {
+ // this routine came from the connectors extension
+ // it is needed because midpoint markers don't work with line elements
+ if (elem.tagName !== 'line') {
+ return elem;
+ } // Convert to polyline to accept mid-arrow
+
+
+ var x1 = Number(elem.getAttribute('x1'));
+ var x2 = Number(elem.getAttribute('x2'));
+ var y1 = Number(elem.getAttribute('y1'));
+ var y2 = Number(elem.getAttribute('y2'));
+ var id = elem.id;
+ var midPt = ' ' + (x1 + x2) / 2 + ',' + (y1 + y2) / 2 + ' ';
+ var pline = addElem({
+ element: 'polyline',
+ attr: {
+ points: x1 + ',' + y1 + midPt + x2 + ',' + y2,
+ stroke: elem.getAttribute('stroke'),
+ 'stroke-width': elem.getAttribute('stroke-width'),
+ fill: 'none',
+ opacity: elem.getAttribute('opacity') || 1
+ }
+ });
+ $.each(mtypes, function (i, pos) {
+ // get any existing marker definitions
+ var nam = 'marker-' + pos;
+ var m = elem.getAttribute(nam);
+
+ if (m) {
+ pline.setAttribute(nam, elem.getAttribute(nam));
+ }
+ });
+ var batchCmd = new S.BatchCommand();
+ batchCmd.addSubCommand(new S.RemoveElementCommand(elem, elem.parentNode));
+ batchCmd.addSubCommand(new S.InsertElementCommand(pline));
+ $(elem).after(pline).remove();
+ svgCanvas.clearSelection();
+ pline.id = id;
+ svgCanvas.addToSelection([pline]);
+ S.addCommandToHistory(batchCmd);
+ return pline;
+ };
+
+ addMarker = function _addMarker(id, val) {
+ var txtBoxBg = '#ffffff';
+ var txtBoxBorder = 'none';
+ var txtBoxStrokeWidth = 0;
+ var marker = svgCanvas.getElem(id);
+
+ if (marker) {
+ return undefined;
+ }
+
+ if (val === '' || val === '\\nomarker') {
+ return undefined;
+ }
+
+ var el = selElems[0];
+ var color = el.getAttribute('stroke'); // NOTE: Safari didn't like a negative value in viewBox
+ // so we use a standardized 0 0 100 100
+ // with 50 50 being mapped to the marker position
+
+ var strokeWidth = 10;
+ var refX = 50;
+ var refY = 50;
+ var viewBox = '0 0 100 100';
+ var markerWidth = 5;
+ var markerHeight = 5;
+ var seType;
+
+ if (val.substr(0, 1) === '\\') {
+ seType = val.substr(1);
+ } else {
+ seType = 'textmarker';
+ }
+
+ if (!markerTypes[seType]) {
+ return undefined;
+ } // an unknown type!
+ // create a generic marker
+
+
+ marker = addElem({
+ element: 'marker',
+ attr: {
+ id: id,
+ markerUnits: 'strokeWidth',
+ orient: 'auto',
+ style: 'pointer-events:none',
+ se_type: seType
+ }
+ });
+
+ if (seType !== 'textmarker') {
+ var mel = addElem(markerTypes[seType]);
+ var fillcolor = seType.substr(-2) === '_o' ? 'none' : color;
+ mel.setAttribute('fill', fillcolor);
+ mel.setAttribute('stroke', color);
+ mel.setAttribute('stroke-width', strokeWidth);
+ marker.append(mel);
+ } else {
+ var text = addElem(markerTypes[seType]); // have to add text to get bounding box
+
+ text.textContent = val;
+ var tb = text.getBBox(); // alert(tb.x + ' ' + tb.y + ' ' + tb.width + ' ' + tb.height);
+
+ var pad = 1;
+ var bb = tb;
+ bb.x = 0;
+ bb.y = 0;
+ bb.width += pad * 2;
+ bb.height += pad * 2; // shift text according to its size
+
+ text.setAttribute('x', pad);
+ text.setAttribute('y', bb.height - pad - tb.height / 4); // kludge?
+
+ text.setAttribute('fill', color);
+ refX = bb.width / 2 + pad;
+ refY = bb.height / 2 + pad;
+ viewBox = bb.x + ' ' + bb.y + ' ' + bb.width + ' ' + bb.height;
+ markerWidth = bb.width / 10;
+ markerHeight = bb.height / 10;
+ var box = addElem({
+ element: 'rect',
+ attr: {
+ x: bb.x,
+ y: bb.y,
+ width: bb.width,
+ height: bb.height,
+ fill: txtBoxBg,
+ stroke: txtBoxBorder,
+ 'stroke-width': txtBoxStrokeWidth
+ }
+ });
+ marker.setAttribute('orient', 0);
+ marker.append(box, text);
+ }
+
+ marker.setAttribute('viewBox', viewBox);
+ marker.setAttribute('markerWidth', markerWidth);
+ marker.setAttribute('markerHeight', markerHeight);
+ marker.setAttribute('refX', refX);
+ marker.setAttribute('refY', refY);
+ svgCanvas.findDefs().append(marker);
+ return marker;
+ };
+
+ showPanel = function _showPanel(on) {
+ $('#marker_panel').toggle(on);
+
+ if (on) {
+ var el = selElems[0];
+ var val, ci;
+ $.each(mtypes, function (i, pos) {
+ var m = getLinked(el, 'marker-' + pos);
+ var txtbox = $('#' + pos + '_marker');
+
+ if (!m) {
+ val = '\\nomarker';
+ ci = val;
+ txtbox.hide(); // hide text box
+ } else {
+ if (!m.attributes.se_type) {
+ return;
+ } // not created by this extension
+
+
+ val = '\\' + m.attributes.se_type.textContent;
+ ci = val;
+
+ if (val === '\\textmarker') {
+ val = m.lastChild.textContent; // txtbox.show(); // show text box
+ } else {
+ txtbox.hide(); // hide text box
+ }
+ }
+
+ txtbox.val(val);
+ setIcon(pos, ci);
+ });
+ }
+ };
+
+ setIcon = function _setIcon(pos, id) {
+ if (id.substr(0, 1) !== '\\') {
+ id = '\\textmarker';
+ }
+
+ var ci = '#' + idPrefix + pos + '_' + id.substr(1);
+ svgEditor.setIcon('#cur_' + pos + '_marker_list', $(ci).children());
+ $(ci).addClass('current').siblings().removeClass('current');
+ };
+
+ getLinked = function _getLinked(elem, attr) {
+ var str = elem.getAttribute(attr);
+
+ if (!str) {
+ return null;
+ }
+
+ var m = str.match(/\(#(.*)\)/); // const m = str.match(/\(#(?<id>.+)\)/);
+ // if (!m || !m.groups.id) {
+
+ if (!m || m.length !== 2) {
+ return null;
+ }
+
+ return svgCanvas.getElem(m[1]); // return svgCanvas.getElem(m.groups.id);
+ };
+
+ _context3.next = 17;
+ return S.importLocale();
+
+ case 17:
+ strings = _context3.sent;
+ svgEditor = _this;
+ $ = S.$;
+ svgCanvas = svgEditor.canvas;
+ addElem = svgCanvas.addSVGElementFromJson;
+ mtypes = ['start', 'mid', 'end'];
+ markerPrefix = 'se_marker_';
+ idPrefix = 'mkr_'; // note - to add additional marker types add them below with a unique id
+ // and add the associated icon(s) to marker-icons.svg
+ // the geometry is normalized to a 100x100 box with the origin at lower left
+ // Safari did not like negative values for low left of viewBox
+ // remember that the coordinate system has +y downward
+
+ markerTypes = {
+ nomarker: {},
+ leftarrow: {
+ element: 'path',
+ attr: {
+ d: 'M0,50 L100,90 L70,50 L100,10 Z'
+ }
+ },
+ rightarrow: {
+ element: 'path',
+ attr: {
+ d: 'M100,50 L0,90 L30,50 L0,10 Z'
+ }
+ },
+ textmarker: {
+ element: 'text',
+ attr: {
+ x: 0,
+ y: 0,
+ 'stroke-width': 0,
+ stroke: 'none',
+ 'font-size': 75,
+ 'font-family': 'serif',
+ 'text-anchor': 'left',
+ 'xml:space': 'preserve'
+ }
+ },
+ forwardslash: {
+ element: 'path',
+ attr: {
+ d: 'M30,100 L70,0'
+ }
+ },
+ reverseslash: {
+ element: 'path',
+ attr: {
+ d: 'M30,0 L70,100'
+ }
+ },
+ verticalslash: {
+ element: 'path',
+ attr: {
+ d: 'M50,0 L50,100'
+ }
+ },
+ box: {
+ element: 'path',
+ attr: {
+ d: 'M20,20 L20,80 L80,80 L80,20 Z'
+ }
+ },
+ star: {
+ element: 'path',
+ attr: {
+ d: 'M10,30 L90,30 L20,90 L50,10 L80,90 Z'
+ }
+ },
+ xmark: {
+ element: 'path',
+ attr: {
+ d: 'M20,80 L80,20 M80,80 L20,20'
+ }
+ },
+ triangle: {
+ element: 'path',
+ attr: {
+ d: 'M10,80 L50,20 L80,80 Z'
+ }
+ },
+ mcircle: {
+ element: 'circle',
+ attr: {
+ r: 30,
+ cx: 50,
+ cy: 50
+ }
+ }
+ }; // duplicate shapes to support unfilled (open) marker types with an _o suffix
+
+ ['leftarrow', 'rightarrow', 'box', 'star', 'mcircle', 'triangle'].forEach(function (v) {
+ markerTypes[v + '_o'] = markerTypes[v];
+ });
+ /**
+ * @param {Element} elem - A graphic element will have an attribute like marker-start
+ * @param {"marker-start"|"marker-mid"|"marker-end"} attr
+ * @returns {Element} The marker element that is linked to the graphic element
+ */
+
+ contextTools = [{
+ type: 'input',
+ panel: 'marker_panel',
+ id: 'start_marker',
+ size: 3,
+ events: {
+ change: setMarker
+ }
+ }, {
+ type: 'button-select',
+ panel: 'marker_panel',
+ id: 'start_marker_list',
+ colnum: 3,
+ events: {
+ change: setArrowFromButton
+ }
+ }, {
+ type: 'input',
+ panel: 'marker_panel',
+ id: 'mid_marker',
+ defval: '',
+ size: 3,
+ events: {
+ change: setMarker
+ }
+ }, {
+ type: 'button-select',
+ panel: 'marker_panel',
+ id: 'mid_marker_list',
+ colnum: 3,
+ events: {
+ change: setArrowFromButton
+ }
+ }, {
+ type: 'input',
+ panel: 'marker_panel',
+ id: 'end_marker',
+ size: 3,
+ events: {
+ change: setMarker
+ }
+ }, {
+ type: 'button-select',
+ panel: 'marker_panel',
+ id: 'end_marker_list',
+ colnum: 3,
+ events: {
+ change: setArrowFromButton
+ }
+ }];
+ return _context3.abrupt("return", {
+ name: strings.name,
+ svgicons: svgEditor.curConfig.extIconsPath + 'markers-icons.xml',
+ callback: function callback() {
+ $('#marker_panel').addClass('toolset').hide();
+ },
+
+ /* async */
+ addLangData: function addLangData(_ref) {
+ var importLocale = _ref.importLocale,
+ lang = _ref.lang;
+ return {
+ data: strings.langList
+ };
+ },
+ selectedChanged: function selectedChanged(opts) {
+ // Use this to update the current selected elements
+ // console.log('selectChanged',opts);
+ selElems = opts.elems;
+ var markerElems = ['line', 'path', 'polyline', 'polygon'];
+ var i = selElems.length;
+
+ while (i--) {
+ var elem = selElems[i];
+
+ if (elem && markerElems.includes(elem.tagName)) {
+ if (opts.selectedElement && !opts.multiselected) {
+ showPanel(true);
+ } else {
+ showPanel(false);
+ }
+ } else {
+ showPanel(false);
+ }
+ }
+ },
+ elementChanged: function elementChanged(opts) {
+ // console.log('elementChanged',opts);
+ var elem = opts.elems[0];
+
+ if (elem && (elem.getAttribute('marker-start') || elem.getAttribute('marker-mid') || elem.getAttribute('marker-end'))) {
+ colorChanged(elem);
+ updateReferences(elem);
+ } // changing_flag = false; // Not apparently in use
+
+ },
+ buttons: buildButtonList(),
+ context_tools: strings.contextTools.map(function (contextTool, i) {
+ return Object.assign(contextTools[i], contextTool);
+ })
+ });
+
+ case 29:
+ case "end":
+ return _context3.stop();
}
}
- });
- } // simulate a change event a text box that stores the current element's marker type
-
- /**
- * @param {"start"|"mid"|"end"} pos
- * @param {string} val
- * @returns {void}
- */
-
-
- function triggerTextEntry(pos, val) {
- $('#' + pos + '_marker').val(val);
- $('#' + pos + '_marker').change(); // const txtbox = $('#'+pos+'_marker');
- // if (val.substr(0,1)=='\\') {txtbox.hide();}
- // else {txtbox.show();}
- }
- /**
- * @param {"start"|"mid"|"end"} pos
- * @returns {Promise<void>} Resolves to `undefined`
- */
-
-
- async function showTextPrompt(pos) {
- let def = $('#' + pos + '_marker').val();
-
- if (def.substr(0, 1) === '\\') {
- def = '';
- }
-
- const txt = await $.prompt('Enter text for ' + pos + ' marker', def);
-
- if (txt) {
- triggerTextEntry(pos, txt);
- }
- }
- /*
- function setMarkerSet(obj) {
- const parts = this.id.split('_');
- const set = parts[2];
- switch (set) {
- case 'off':
- triggerTextEntry('start','\\nomarker');
- triggerTextEntry('mid','\\nomarker');
- triggerTextEntry('end','\\nomarker');
- break;
- case 'dimension':
- triggerTextEntry('start','\\leftarrow');
- triggerTextEntry('end','\\rightarrow');
- await showTextPrompt('mid');
- break;
- case 'label':
- triggerTextEntry('mid','\\nomarker');
- triggerTextEntry('end','\\rightarrow');
- await showTextPrompt('start');
- break;
- }
- }
- */
- // callback function for a toolbar button click
-
- /**
- * @param {Event} ev
- * @returns {Promise<void>} Resolves to `undefined`
- */
-
-
- async function setArrowFromButton(ev) {
- const parts = this.id.split('_');
- const pos = parts[1];
- let val = parts[2];
-
- if (parts[3]) {
- val += '_' + parts[3];
- }
-
- if (val !== 'textmarker') {
- triggerTextEntry(pos, '\\' + val);
- } else {
- await showTextPrompt(pos);
- }
- }
- /**
- * @param {"nomarker"|"leftarrow"|"rightarrow"|"textmarker"|"forwardslash"|"reverseslash"|"verticalslash"|"box"|"star"|"xmark"|"triangle"|"mcircle"} id
- * @returns {string}
- */
-
-
- function getTitle(id) {
- const {
- langList
- } = strings;
- const item = langList.find(itm => {
- return itm.id === id;
- });
- return item ? item.title : id;
- }
- /**
- * Build the toolbar button array from the marker definitions.
- * @returns {module:SVGEditor.Button[]}
- */
-
-
- function buildButtonList() {
- const buttons = []; // const i = 0;
-
- /*
- buttons.push({
- id: idPrefix + 'markers_off',
- title: 'Turn off all markers',
- type: 'context',
- events: { click: setMarkerSet },
- panel: 'marker_panel'
- });
- buttons.push({
- id: idPrefix + 'markers_dimension',
- title: 'Dimension',
- type: 'context',
- events: { click: setMarkerSet },
- panel: 'marker_panel'
- });
- buttons.push({
- id: idPrefix + 'markers_label',
- title: 'Label',
- type: 'context',
- events: { click: setMarkerSet },
- panel: 'marker_panel'
- });
- */
-
- $.each(mtypes, function (k, pos) {
- const listname = pos + '_marker_list';
- let def = true;
- Object.keys(markerTypes).forEach(function (id) {
- const title = getTitle(String(id));
- buttons.push({
- id: idPrefix + pos + '_' + id,
- svgicon: id,
- icon: svgEditor.curConfig.extIconsPath + 'markers-' + id + '.png',
- title,
- type: 'context',
- events: {
- click: setArrowFromButton
- },
- panel: 'marker_panel',
- list: listname,
- isDefault: def
- });
- def = false;
- });
- });
- return buttons;
- }
-
- const contextTools = [{
- type: 'input',
- panel: 'marker_panel',
- id: 'start_marker',
- size: 3,
- events: {
- change: setMarker
- }
- }, {
- type: 'button-select',
- panel: 'marker_panel',
- id: 'start_marker_list',
- colnum: 3,
- events: {
- change: setArrowFromButton
- }
- }, {
- type: 'input',
- panel: 'marker_panel',
- id: 'mid_marker',
- defval: '',
- size: 3,
- events: {
- change: setMarker
- }
- }, {
- type: 'button-select',
- panel: 'marker_panel',
- id: 'mid_marker_list',
- colnum: 3,
- events: {
- change: setArrowFromButton
- }
- }, {
- type: 'input',
- panel: 'marker_panel',
- id: 'end_marker',
- size: 3,
- events: {
- change: setMarker
- }
- }, {
- type: 'button-select',
- panel: 'marker_panel',
- id: 'end_marker_list',
- colnum: 3,
- events: {
- change: setArrowFromButton
- }
- }];
- return {
- name: strings.name,
- svgicons: svgEditor.curConfig.extIconsPath + 'markers-icons.xml',
-
- callback() {
- $('#marker_panel').addClass('toolset').hide();
- },
-
- /* async */
- addLangData({
- importLocale,
- lang
- }) {
- return {
- data: strings.langList
- };
- },
-
- selectedChanged(opts) {
- // Use this to update the current selected elements
- // console.log('selectChanged',opts);
- selElems = opts.elems;
- const markerElems = ['line', 'path', 'polyline', 'polygon'];
- let i = selElems.length;
-
- while (i--) {
- const elem = selElems[i];
-
- if (elem && markerElems.includes(elem.tagName)) {
- if (opts.selectedElement && !opts.multiselected) {
- showPanel(true);
- } else {
- showPanel(false);
- }
- } else {
- showPanel(false);
- }
- }
- },
-
- elementChanged(opts) {
- // console.log('elementChanged',opts);
- const elem = opts.elems[0];
-
- if (elem && (elem.getAttribute('marker-start') || elem.getAttribute('marker-mid') || elem.getAttribute('marker-end'))) {
- colorChanged(elem);
- updateReferences(elem);
- } // changing_flag = false; // Not apparently in use
-
- },
-
- buttons: buildButtonList(),
- context_tools: strings.contextTools.map((contextTool, i) => {
- return Object.assign(contextTools[i], contextTool);
- })
- };
+ }, _callee3);
+ }))();
}
-
};
return extMarkers;
diff --git a/dist/extensions/ext-mathjax.js b/dist/extensions/ext-mathjax.js
index 7be6cef3..3c765d9c 100644
--- a/dist/extensions/ext-mathjax.js
+++ b/dist/extensions/ext-mathjax.js
@@ -1,6 +1,42 @@
var svgEditorExtension_mathjax = (function () {
'use strict';
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+ try {
+ var info = gen[key](arg);
+ var value = info.value;
+ } catch (error) {
+ reject(error);
+ return;
+ }
+
+ if (info.done) {
+ resolve(value);
+ } else {
+ Promise.resolve(value).then(_next, _throw);
+ }
+ }
+
+ function _asyncToGenerator(fn) {
+ return function () {
+ var self = this,
+ args = arguments;
+ return new Promise(function (resolve, reject) {
+ var gen = fn.apply(self, args);
+
+ function _next(value) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+ }
+
+ function _throw(err) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+ }
+
+ _next(undefined);
+ });
+ };
+ }
+
/**
* Add any of the whitelisted attributes to the script tag.
* @param {HTMLScriptElement} script
@@ -10,38 +46,32 @@ var svgEditorExtension_mathjax = (function () {
function addScriptAtts(script, atts) {
- ['id', 'class', 'type'].forEach(prop => {
+ ['id', 'class', 'type'].forEach(function (prop) {
if (prop in atts) {
script[prop] = atts[prop];
}
});
} // Additions by Brett
- /**
- *
- * @author Brett Zamir (other items are from `dynamic-import-polyfill`)
- * @param {string|string[]} url
- * @param {PlainObject} [atts={}]
- * @returns {Promise<void|Error>} Resolves to `undefined` or rejects with an `Error` upon a
- * script loading error
- */
- function importScript(url, atts = {}) {
+ function importScript(url) {
+ var atts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+
if (Array.isArray(url)) {
- return Promise.all(url.map(u => {
+ return Promise.all(url.map(function (u) {
return importScript(u, atts);
}));
}
- return new Promise((resolve, reject) => {
+ return new Promise(function (resolve, reject) {
// eslint-disable-line promise/avoid-new
- const script = document.createElement('script');
+ var script = document.createElement('script');
/**
*
* @returns {void}
*/
function scriptOnError() {
- reject(new Error(`Failed to import: ${url}`));
+ reject(new Error("Failed to import: ".concat(url)));
destructor();
}
/**
@@ -55,7 +85,7 @@ var svgEditorExtension_mathjax = (function () {
destructor();
}
- const destructor = () => {
+ var destructor = function destructor() {
script.removeEventListener('error', scriptOnError);
script.removeEventListener('load', scriptOnLoad);
script.remove();
@@ -71,232 +101,258 @@ var svgEditorExtension_mathjax = (function () {
});
}
- /* globals MathJax */
var extMathjax = {
name: 'mathjax',
+ init: function init(_ref) {
+ var _this = this;
- async init({
- $,
- importLocale
- }) {
- const strings = await importLocale();
- const svgEditor = this;
- const svgCanvas = svgEditor.canvas; // Configuration of the MathJax extention.
- // This will be added to the head tag before MathJax is loaded.
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
+ var $, importLocale, strings, svgEditor, svgCanvas, mathjaxSrcSecure, uiStrings, math, locationX, locationY, mathjaxLoaded, saveMath, buttons;
+ return regeneratorRuntime.wrap(function _callee2$(_context2) {
+ while (1) {
+ switch (_context2.prev = _context2.next) {
+ case 0:
+ saveMath = function _saveMath() {
+ var code = $('#mathjax_code_textarea').val(); // displaystyle to force MathJax NOT to use the inline style. Because it is
+ // less fancy!
- const
- /* mathjaxConfiguration = `<script type="text/x-mathjax-config">
- MathJax.Hub.Config({
- extensions: ['tex2jax.js'],
- jax: ['input/TeX', 'output/SVG'],
- showProcessingMessages: true,
- showMathMenu: false,
- showMathMenuMSIE: false,
- errorSettings: {
- message: ['[Math Processing Error]'],
- style: {color: '#CC0000', 'font-style': 'italic'}
- },
- elements: [],
- tex2jax: {
- ignoreClass: 'tex2jax_ignore2', processClass: 'tex2jax_process2',
- },
- TeX: {
- extensions: ['AMSmath.js', 'AMSsymbols.js', 'noErrors.js', 'noUndefined.js']
- },
- SVG: {
- }
- });
- </script>`, */
- // mathjaxSrc = 'http://cdn.mathjax.org/mathjax/latest/MathJax.js',
- // Had been on https://c328740.ssl.cf1.rackcdn.com/mathjax/latest/MathJax.js?config=TeX-AMS-MML_SVG.js
- // Obtained Text-AMS-MML_SVG.js from https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.3/config/TeX-AMS-MML_SVG.js
- mathjaxSrcSecure = 'mathjax/MathJax.min.js?config=TeX-AMS-MML_SVG.js',
- {
- uiStrings
- } = svgEditor;
- let math,
- locationX,
- locationY,
- mathjaxLoaded = false; // TODO: Implement language support. Move these uiStrings to the locale files and
- // the code to the langReady callback. Also i18nize alert and HTML below
+ MathJax.Hub.queue.Push(['Text', math, '\\displaystyle{' + code + '}']);
+ /*
+ * The MathJax library doesn't want to bloat your webpage so it creates
+ * every symbol (glymph) you need only once. These are saved in a `<svg>` on
+ * the top of your html document, just under the body tag. Each glymph has
+ * its unique id and is saved as a `<path>` in the `<defs>` tag of the `<svg>`
+ *
+ * Then when the symbols are needed in the rest of your html document they
+ * are refferd to by a `<use>` tag.
+ * Because of bug 1076 we can't just grab the defs tag on the top and add it
+ * to your formula's `<svg>` and copy the lot. So we have to replace each
+ * `<use>` tag by its `<path>`.
+ */
- $.extend(uiStrings, {
- mathjax: {
- embed_svg: 'Save as mathematics',
- embed_mathml: 'Save as figure',
- svg_save_warning: 'The math will be transformed into a figure is manipulatable like everything else. You will not be able to manipulate the TeX-code anymore. ',
- mathml_save_warning: 'Advised. The math will be saved as a figure.',
- title: 'Mathematics code editor'
- }
- });
- /**
- *
- * @returns {void}
- */
+ MathJax.Hub.queue.Push(function () {
+ var mathjaxMath = $('.MathJax_SVG');
+ var svg = $(mathjaxMath.html());
+ svg.find('use').each(function () {
+ // TODO: find a less pragmatic and more elegant solution to this.
+ var id = $(this).attr('href') ? $(this).attr('href').slice(1) // Works in Chrome.
+ : $(this).attr('xlink:href').slice(1); // Works in Firefox.
- function saveMath() {
- const code = $('#mathjax_code_textarea').val(); // displaystyle to force MathJax NOT to use the inline style. Because it is
- // less fancy!
+ var glymph = $('#' + id).clone().removeAttr('id');
+ var x = $(this).attr('x');
+ var y = $(this).attr('y');
+ var transform = $(this).attr('transform');
- MathJax.Hub.queue.Push(['Text', math, '\\displaystyle{' + code + '}']);
- /*
- * The MathJax library doesn't want to bloat your webpage so it creates
- * every symbol (glymph) you need only once. These are saved in a `<svg>` on
- * the top of your html document, just under the body tag. Each glymph has
- * its unique id and is saved as a `<path>` in the `<defs>` tag of the `<svg>`
- *
- * Then when the symbols are needed in the rest of your html document they
- * are refferd to by a `<use>` tag.
- * Because of bug 1076 we can't just grab the defs tag on the top and add it
- * to your formula's `<svg>` and copy the lot. So we have to replace each
- * `<use>` tag by its `<path>`.
- */
+ if (transform && (x || y)) {
+ glymph.attr('transform', transform + ' translate(' + x + ',' + y + ')');
+ } else if (transform) {
+ glymph.attr('transform', transform);
+ } else if (x || y) {
+ glymph.attr('transform', 'translate(' + x + ',' + y + ')');
+ }
- MathJax.Hub.queue.Push(function () {
- const mathjaxMath = $('.MathJax_SVG');
- const svg = $(mathjaxMath.html());
- svg.find('use').each(function () {
- // TODO: find a less pragmatic and more elegant solution to this.
- const id = $(this).attr('href') ? $(this).attr('href').slice(1) // Works in Chrome.
- : $(this).attr('xlink:href').slice(1); // Works in Firefox.
+ $(this).replaceWith(glymph);
+ }); // Remove the style tag because it interferes with SVG-Edit.
- const glymph = $('#' + id).clone().removeAttr('id');
- const x = $(this).attr('x');
- const y = $(this).attr('y');
- const transform = $(this).attr('transform');
+ svg.removeAttr('style');
+ svg.attr('xmlns', 'http://www.w3.org/2000/svg');
+ svgCanvas.importSvgString($('<div>').append(svg.clone()).html(), true);
+ svgCanvas.ungroupSelectedElement(); // TODO: To undo the adding of the Formula you now have to undo twice.
+ // This should only be once!
- if (transform && (x || y)) {
- glymph.attr('transform', transform + ' translate(' + x + ',' + y + ')');
- } else if (transform) {
- glymph.attr('transform', transform);
- } else if (x || y) {
- glymph.attr('transform', 'translate(' + x + ',' + y + ')');
- }
+ svgCanvas.moveSelectedElements(locationX, locationY, true);
+ });
+ };
- $(this).replaceWith(glymph);
- }); // Remove the style tag because it interferes with SVG-Edit.
+ $ = _ref.$, importLocale = _ref.importLocale;
+ _context2.next = 4;
+ return importLocale();
- svg.removeAttr('style');
- svg.attr('xmlns', 'http://www.w3.org/2000/svg');
- svgCanvas.importSvgString($('<div>').append(svg.clone()).html(), true);
- svgCanvas.ungroupSelectedElement(); // TODO: To undo the adding of the Formula you now have to undo twice.
- // This should only be once!
+ case 4:
+ strings = _context2.sent;
+ svgEditor = _this;
+ svgCanvas = svgEditor.canvas; // Configuration of the MathJax extention.
+ // This will be added to the head tag before MathJax is loaded.
- svgCanvas.moveSelectedElements(locationX, locationY, true);
- });
- }
-
- const buttons = [{
- id: 'tool_mathjax',
- type: 'mode',
- icon: svgEditor.curConfig.extIconsPath + 'mathjax.png',
- events: {
- async click() {
- // Set the mode.
- svgCanvas.setMode('mathjax'); // Only load Mathjax when needed, we don't want to strain Svg-Edit any more.
- // From this point on it is very probable that it will be needed, so load it.
-
- if (mathjaxLoaded === false) {
- $('<div id="mathjax">' + '<!-- Here is where MathJax creates the math -->' + '<div id="mathjax_creator" class="tex2jax_process" style="display:none">' + '$${}$$' + '</div>' + '<div id="mathjax_overlay"></div>' + '<div id="mathjax_container">' + '<div id="tool_mathjax_back" class="toolbar_button">' + '<button id="tool_mathjax_save">OK</button>' + '<button id="tool_mathjax_cancel">Cancel</button>' + '</div>' + '<fieldset>' + '<legend id="mathjax_legend">Mathematics Editor</legend>' + '<label>' + '<span id="mathjax_explication">Please type your mathematics in ' + '<a href="https://en.wikipedia.org/wiki/Help:Displaying_a_formula" target="_blank">TeX</a> code.</span></label>' + '<textarea id="mathjax_code_textarea" spellcheck="false"></textarea>' + '</fieldset>' + '</div>' + '</div>').insertAfter('#svg_prefs').hide(); // Make the MathEditor draggable.
-
- $('#mathjax_container').draggable({
- cancel: 'button,fieldset',
- containment: 'window'
- }); // Add functionality and picture to cancel button.
-
- $('#tool_mathjax_cancel').prepend($.getSvgIcon('cancel', true)).on('click touched', function () {
- $('#mathjax').hide();
- }); // Add functionality and picture to the save button.
-
- $('#tool_mathjax_save').prepend($.getSvgIcon('ok', true)).on('click touched', function () {
- saveMath();
- $('#mathjax').hide();
- }); // MathJax preprocessing has to ignore most of the page.
-
- $('body').addClass('tex2jax_ignore'); // Now get (and run) the MathJax Library.
- // Todo: insert script with modules once widely supported
- // and if MathJax (and its `TeX-AMS-MML_SVG.js` dependency) ends up
- // providing an ES6 module export: https://github.com/mathjax/MathJax/issues/1998
-
- /*
- const modularVersion = !('svgEditor' in window) ||
- !window.svgEditor ||
- window.svgEditor.modules !== false;
- // Add as second argument to `importScript`
- {
- type: modularVersion
- ? 'module' // Make this the default when widely supported
- : 'text/javascript'
- }
- // If only using modules, just use this:
- const {default: MathJax} = await importModule( // or `import()` when widely supported
- svgEditor.curConfig.extIconsPath + mathjaxSrcSecure
- );
- */
- // We use `extIconsPath` here for now as it does not vary with
- // the modular type as does `extPath`
-
- try {
- await importScript(svgEditor.curConfig.extIconsPath + mathjaxSrcSecure); // When MathJax is loaded get the div where the math will be rendered.
-
- MathJax.Hub.queue.Push(function () {
- math = MathJax.Hub.getAllJax('#mathjax_creator')[0];
- console.log(math); // eslint-disable-line no-console
-
- mathjaxLoaded = true;
- console.log('MathJax Loaded'); // eslint-disable-line no-console
+ /* mathjaxConfiguration = `<script type="text/x-mathjax-config">
+ MathJax.Hub.Config({
+ extensions: ['tex2jax.js'],
+ jax: ['input/TeX', 'output/SVG'],
+ showProcessingMessages: true,
+ showMathMenu: false,
+ showMathMenuMSIE: false,
+ errorSettings: {
+ message: ['[Math Processing Error]'],
+ style: {color: '#CC0000', 'font-style': 'italic'}
+ },
+ elements: [],
+ tex2jax: {
+ ignoreClass: 'tex2jax_ignore2', processClass: 'tex2jax_process2',
+ },
+ TeX: {
+ extensions: ['AMSmath.js', 'AMSsymbols.js', 'noErrors.js', 'noUndefined.js']
+ },
+ SVG: {
+ }
});
- } catch (e) {
- console.log('Failed loading MathJax.'); // eslint-disable-line no-console
+ </script>`, */
+ // mathjaxSrc = 'http://cdn.mathjax.org/mathjax/latest/MathJax.js',
+ // Had been on https://c328740.ssl.cf1.rackcdn.com/mathjax/latest/MathJax.js?config=TeX-AMS-MML_SVG.js
+ // Obtained Text-AMS-MML_SVG.js from https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.3/config/TeX-AMS-MML_SVG.js
+ mathjaxSrcSecure = 'mathjax/MathJax.min.js?config=TeX-AMS-MML_SVG.js', uiStrings = svgEditor.uiStrings;
+ mathjaxLoaded = false; // TODO: Implement language support. Move these uiStrings to the locale files and
+ // the code to the langReady callback. Also i18nize alert and HTML below
- $.alert('Failed loading MathJax. You will not be able to change the mathematics.');
- }
+ $.extend(uiStrings, {
+ mathjax: {
+ embed_svg: 'Save as mathematics',
+ embed_mathml: 'Save as figure',
+ svg_save_warning: 'The math will be transformed into a figure is manipulatable like everything else. You will not be able to manipulate the TeX-code anymore. ',
+ mathml_save_warning: 'Advised. The math will be saved as a figure.',
+ title: 'Mathematics code editor'
+ }
+ });
+ /**
+ *
+ * @returns {void}
+ */
+
+ buttons = [{
+ id: 'tool_mathjax',
+ type: 'mode',
+ icon: svgEditor.curConfig.extIconsPath + 'mathjax.png',
+ events: {
+ click: function click() {
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+ return regeneratorRuntime.wrap(function _callee$(_context) {
+ while (1) {
+ switch (_context.prev = _context.next) {
+ case 0:
+ // Set the mode.
+ svgCanvas.setMode('mathjax'); // Only load Mathjax when needed, we don't want to strain Svg-Edit any more.
+ // From this point on it is very probable that it will be needed, so load it.
+
+ if (!(mathjaxLoaded === false)) {
+ _context.next = 17;
+ break;
+ }
+
+ $('<div id="mathjax">' + '<!-- Here is where MathJax creates the math -->' + '<div id="mathjax_creator" class="tex2jax_process" style="display:none">' + '$${}$$' + '</div>' + '<div id="mathjax_overlay"></div>' + '<div id="mathjax_container">' + '<div id="tool_mathjax_back" class="toolbar_button">' + '<button id="tool_mathjax_save">OK</button>' + '<button id="tool_mathjax_cancel">Cancel</button>' + '</div>' + '<fieldset>' + '<legend id="mathjax_legend">Mathematics Editor</legend>' + '<label>' + '<span id="mathjax_explication">Please type your mathematics in ' + '<a href="https://en.wikipedia.org/wiki/Help:Displaying_a_formula" target="_blank">TeX</a> code.</span></label>' + '<textarea id="mathjax_code_textarea" spellcheck="false"></textarea>' + '</fieldset>' + '</div>' + '</div>').insertAfter('#svg_prefs').hide(); // Make the MathEditor draggable.
+
+ $('#mathjax_container').draggable({
+ cancel: 'button,fieldset',
+ containment: 'window'
+ }); // Add functionality and picture to cancel button.
+
+ $('#tool_mathjax_cancel').prepend($.getSvgIcon('cancel', true)).on('click touched', function () {
+ $('#mathjax').hide();
+ }); // Add functionality and picture to the save button.
+
+ $('#tool_mathjax_save').prepend($.getSvgIcon('ok', true)).on('click touched', function () {
+ saveMath();
+ $('#mathjax').hide();
+ }); // MathJax preprocessing has to ignore most of the page.
+
+ $('body').addClass('tex2jax_ignore'); // Now get (and run) the MathJax Library.
+ // Todo: insert script with modules once widely supported
+ // and if MathJax (and its `TeX-AMS-MML_SVG.js` dependency) ends up
+ // providing an ES6 module export: https://github.com/mathjax/MathJax/issues/1998
+
+ /*
+ const modularVersion = !('svgEditor' in window) ||
+ !window.svgEditor ||
+ window.svgEditor.modules !== false;
+ // Add as second argument to `importScript`
+ {
+ type: modularVersion
+ ? 'module' // Make this the default when widely supported
+ : 'text/javascript'
+ }
+ // If only using modules, just use this:
+ const {default: MathJax} = await importModule( // or `import()` when widely supported
+ svgEditor.curConfig.extIconsPath + mathjaxSrcSecure
+ );
+ */
+ // We use `extIconsPath` here for now as it does not vary with
+ // the modular type as does `extPath`
+
+ _context.prev = 7;
+ _context.next = 10;
+ return importScript(svgEditor.curConfig.extIconsPath + mathjaxSrcSecure);
+
+ case 10:
+ // When MathJax is loaded get the div where the math will be rendered.
+ MathJax.Hub.queue.Push(function () {
+ math = MathJax.Hub.getAllJax('#mathjax_creator')[0];
+ console.log(math); // eslint-disable-line no-console
+
+ mathjaxLoaded = true;
+ console.log('MathJax Loaded'); // eslint-disable-line no-console
+ });
+ _context.next = 17;
+ break;
+
+ case 13:
+ _context.prev = 13;
+ _context.t0 = _context["catch"](7);
+ console.log('Failed loading MathJax.'); // eslint-disable-line no-console
+
+ $.alert('Failed loading MathJax. You will not be able to change the mathematics.');
+
+ case 17:
+ case "end":
+ return _context.stop();
+ }
+ }
+ }, _callee, null, [[7, 13]]);
+ }))();
+ }
+ }
+ }];
+ return _context2.abrupt("return", {
+ name: strings.name,
+ svgicons: svgEditor.curConfig.extIconsPath + 'mathjax-icons.xml',
+ buttons: strings.buttons.map(function (button, i) {
+ return Object.assign(buttons[i], button);
+ }),
+ mouseDown: function mouseDown() {
+ if (svgCanvas.getMode() === 'mathjax') {
+ return {
+ started: true
+ };
+ }
+
+ return undefined;
+ },
+ mouseUp: function mouseUp(opts) {
+ if (svgCanvas.getMode() === 'mathjax') {
+ // Get the coordinates from your mouse.
+ var zoom = svgCanvas.getZoom(); // Get the actual coordinate by dividing by the zoom value
+
+ locationX = opts.mouse_x / zoom;
+ locationY = opts.mouse_y / zoom;
+ $('#mathjax').show();
+ return {
+ started: false
+ }; // Otherwise the last selected object dissapears.
+ }
+
+ return undefined;
+ },
+ callback: function callback() {
+ $('<style>').text('#mathjax fieldset{' + 'padding: 5px;' + 'margin: 5px;' + 'border: 1px solid #DDD;' + '}' + '#mathjax label{' + 'display: block;' + 'margin: .5em;' + '}' + '#mathjax legend {' + 'max-width:195px;' + '}' + '#mathjax_overlay {' + 'position: absolute;' + 'top: 0;' + 'left: 0;' + 'right: 0;' + 'bottom: 0;' + 'background-color: black;' + 'opacity: 0.6;' + 'z-index: 20000;' + '}' + '#mathjax_container {' + 'position: absolute;' + 'top: 50px;' + 'padding: 10px;' + 'background-color: #B0B0B0;' + 'border: 1px outset #777;' + 'opacity: 1.0;' + 'font-family: Verdana, Helvetica, sans-serif;' + 'font-size: .8em;' + 'z-index: 20001;' + '}' + '#tool_mathjax_back {' + 'margin-left: 1em;' + 'overflow: auto;' + '}' + '#mathjax_legend{' + 'font-weight: bold;' + 'font-size:1.1em;' + '}' + '#mathjax_code_textarea {\\n' + 'margin: 5px .7em;' + 'overflow: hidden;' + 'width: 416px;' + 'display: block;' + 'height: 100px;' + '}').appendTo('head'); // Add the MathJax configuration.
+ // $(mathjaxConfiguration).appendTo('head');
+ }
+ });
+
+ case 12:
+ case "end":
+ return _context2.stop();
}
}
-
- }
- }];
- return {
- name: strings.name,
- svgicons: svgEditor.curConfig.extIconsPath + 'mathjax-icons.xml',
- buttons: strings.buttons.map((button, i) => {
- return Object.assign(buttons[i], button);
- }),
-
- mouseDown() {
- if (svgCanvas.getMode() === 'mathjax') {
- return {
- started: true
- };
- }
-
- return undefined;
- },
-
- mouseUp(opts) {
- if (svgCanvas.getMode() === 'mathjax') {
- // Get the coordinates from your mouse.
- const zoom = svgCanvas.getZoom(); // Get the actual coordinate by dividing by the zoom value
-
- locationX = opts.mouse_x / zoom;
- locationY = opts.mouse_y / zoom;
- $('#mathjax').show();
- return {
- started: false
- }; // Otherwise the last selected object dissapears.
- }
-
- return undefined;
- },
-
- callback() {
- $('<style>').text('#mathjax fieldset{' + 'padding: 5px;' + 'margin: 5px;' + 'border: 1px solid #DDD;' + '}' + '#mathjax label{' + 'display: block;' + 'margin: .5em;' + '}' + '#mathjax legend {' + 'max-width:195px;' + '}' + '#mathjax_overlay {' + 'position: absolute;' + 'top: 0;' + 'left: 0;' + 'right: 0;' + 'bottom: 0;' + 'background-color: black;' + 'opacity: 0.6;' + 'z-index: 20000;' + '}' + '#mathjax_container {' + 'position: absolute;' + 'top: 50px;' + 'padding: 10px;' + 'background-color: #B0B0B0;' + 'border: 1px outset #777;' + 'opacity: 1.0;' + 'font-family: Verdana, Helvetica, sans-serif;' + 'font-size: .8em;' + 'z-index: 20001;' + '}' + '#tool_mathjax_back {' + 'margin-left: 1em;' + 'overflow: auto;' + '}' + '#mathjax_legend{' + 'font-weight: bold;' + 'font-size:1.1em;' + '}' + '#mathjax_code_textarea {\\n' + 'margin: 5px .7em;' + 'overflow: hidden;' + 'width: 416px;' + 'display: block;' + 'height: 100px;' + '}').appendTo('head'); // Add the MathJax configuration.
- // $(mathjaxConfiguration).appendTo('head');
- }
-
- };
+ }, _callee2);
+ }))();
}
-
};
return extMathjax;
diff --git a/dist/extensions/ext-overview_window.js b/dist/extensions/ext-overview_window.js
index e1503ced..0b8867a1 100644
--- a/dist/extensions/ext-overview_window.js
+++ b/dist/extensions/ext-overview_window.js
@@ -11,18 +11,16 @@ var svgEditorExtension_overview_window = (function () {
*/
var extOverview_window = {
name: 'overview_window',
-
- init({
- $,
- isChrome,
- isIE
- }) {
- const overviewWindowGlobals = {}; // Disabled in Chrome 48-, see https://github.com/SVG-Edit/svgedit/issues/26 and
+ init: function init(_ref) {
+ var $ = _ref.$,
+ isChrome = _ref.isChrome,
+ isIE = _ref.isIE;
+ var overviewWindowGlobals = {}; // Disabled in Chrome 48-, see https://github.com/SVG-Edit/svgedit/issues/26 and
// https://code.google.com/p/chromium/issues/detail?id=565120.
if (isChrome()) {
- const verIndex = navigator.userAgent.indexOf('Chrome/') + 7;
- const chromeVersion = Number.parseInt(navigator.userAgent.substring(verIndex));
+ var verIndex = navigator.userAgent.indexOf('Chrome/') + 7;
+ var chromeVersion = Number.parseInt(navigator.userAgent.substring(verIndex));
if (chromeVersion < 49) {
return undefined;
@@ -30,22 +28,22 @@ var svgEditorExtension_overview_window = (function () {
} // Define and insert the base html element.
- const propsWindowHtml = '<div id="overview_window_content_pane" style="width:100%; word-wrap:break-word; display:inline-block; margin-top:20px;">' + '<div id="overview_window_content" style="position:relative; left:12px; top:0px;">' + '<div style="background-color:#A0A0A0; display:inline-block; overflow:visible;">' + '<svg id="overviewMiniView" width="150" height="100" x="0" y="0" viewBox="0 0 4800 3600" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">' + '<use x="0" y="0" xlink:href="#svgroot"> </use>' + '</svg>' + '<div id="overview_window_view_box" style="min-width:50px; min-height:50px; position:absolute; top:30px; left:30px; z-index:5; background-color:rgba(255,0,102,0.3);">' + '</div>' + '</div>' + '</div>' + '</div>';
+ var propsWindowHtml = '<div id="overview_window_content_pane" style="width:100%; word-wrap:break-word; display:inline-block; margin-top:20px;">' + '<div id="overview_window_content" style="position:relative; left:12px; top:0px;">' + '<div style="background-color:#A0A0A0; display:inline-block; overflow:visible;">' + '<svg id="overviewMiniView" width="150" height="100" x="0" y="0" viewBox="0 0 4800 3600" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">' + '<use x="0" y="0" xlink:href="#svgroot"> </use>' + '</svg>' + '<div id="overview_window_view_box" style="min-width:50px; min-height:50px; position:absolute; top:30px; left:30px; z-index:5; background-color:rgba(255,0,102,0.3);">' + '</div>' + '</div>' + '</div>' + '</div>';
$('#sidepanels').append(propsWindowHtml); // Define dynamic animation of the view box.
- const updateViewBox = function () {
- const portHeight = Number.parseFloat($('#workarea').css('height'));
- const portWidth = Number.parseFloat($('#workarea').css('width'));
- const portX = $('#workarea').scrollLeft();
- const portY = $('#workarea').scrollTop();
- const windowWidth = Number.parseFloat($('#svgcanvas').css('width'));
- const windowHeight = Number.parseFloat($('#svgcanvas').css('height'));
- const overviewWidth = $('#overviewMiniView').attr('width');
- const overviewHeight = $('#overviewMiniView').attr('height');
- const viewBoxX = portX / windowWidth * overviewWidth;
- const viewBoxY = portY / windowHeight * overviewHeight;
- const viewBoxWidth = portWidth / windowWidth * overviewWidth;
- const viewBoxHeight = portHeight / windowHeight * overviewHeight;
+ var updateViewBox = function updateViewBox() {
+ var portHeight = Number.parseFloat($('#workarea').css('height'));
+ var portWidth = Number.parseFloat($('#workarea').css('width'));
+ var portX = $('#workarea').scrollLeft();
+ var portY = $('#workarea').scrollTop();
+ var windowWidth = Number.parseFloat($('#svgcanvas').css('width'));
+ var windowHeight = Number.parseFloat($('#svgcanvas').css('height'));
+ var overviewWidth = $('#overviewMiniView').attr('width');
+ var overviewHeight = $('#overviewMiniView').attr('height');
+ var viewBoxX = portX / windowWidth * overviewWidth;
+ var viewBoxY = portY / windowHeight * overviewHeight;
+ var viewBoxWidth = portWidth / windowWidth * overviewWidth;
+ var viewBoxHeight = portHeight / windowHeight * overviewHeight;
$('#overview_window_view_box').css('min-width', viewBoxWidth + 'px');
$('#overview_window_view_box').css('min-height', viewBoxHeight + 'px');
$('#overview_window_view_box').css('top', viewBoxY + 'px');
@@ -60,11 +58,11 @@ var svgEditorExtension_overview_window = (function () {
$('#workarea').resize(updateViewBox);
updateViewBox(); // Compensate for changes in zoom and canvas size.
- const updateViewDimensions = function () {
- const viewWidth = $('#svgroot').attr('width');
- const viewHeight = $('#svgroot').attr('height');
- let viewX = 640;
- let viewY = 480;
+ var updateViewDimensions = function updateViewDimensions() {
+ var viewWidth = $('#svgroot').attr('width');
+ var viewHeight = $('#svgroot').attr('height');
+ var viewX = 640;
+ var viewY = 480;
if (isIE()) {
// This has only been tested with Firefox 10 and IE 9 (without chrome frame).
@@ -77,8 +75,8 @@ var svgEditorExtension_overview_window = (function () {
viewY = 0;
}
- const svgWidthOld = $('#overviewMiniView').attr('width');
- const svgHeightNew = viewHeight / viewWidth * svgWidthOld;
+ var svgWidthOld = $('#overviewMiniView').attr('width');
+ var svgHeightNew = viewHeight / viewWidth * svgWidthOld;
$('#overviewMiniView').attr('viewBox', viewX + ' ' + viewY + ' ' + viewWidth + ' ' + viewHeight);
$('#overviewMiniView').attr('height', svgHeightNew);
updateViewBox();
@@ -88,15 +86,15 @@ var svgEditorExtension_overview_window = (function () {
overviewWindowGlobals.viewBoxDragging = false;
- const updateViewPortFromViewBox = function () {
- const windowWidth = Number.parseFloat($('#svgcanvas').css('width'));
- const windowHeight = Number.parseFloat($('#svgcanvas').css('height'));
- const overviewWidth = $('#overviewMiniView').attr('width');
- const overviewHeight = $('#overviewMiniView').attr('height');
- const viewBoxX = Number.parseFloat($('#overview_window_view_box').css('left'));
- const viewBoxY = Number.parseFloat($('#overview_window_view_box').css('top'));
- const portX = viewBoxX / overviewWidth * windowWidth;
- const portY = viewBoxY / overviewHeight * windowHeight;
+ var updateViewPortFromViewBox = function updateViewPortFromViewBox() {
+ var windowWidth = Number.parseFloat($('#svgcanvas').css('width'));
+ var windowHeight = Number.parseFloat($('#svgcanvas').css('height'));
+ var overviewWidth = $('#overviewMiniView').attr('width');
+ var overviewHeight = $('#overviewMiniView').attr('height');
+ var viewBoxX = Number.parseFloat($('#overview_window_view_box').css('left'));
+ var viewBoxY = Number.parseFloat($('#overview_window_view_box').css('top'));
+ var portX = viewBoxX / overviewWidth * windowWidth;
+ var portY = viewBoxY / overviewHeight * windowHeight;
$('#workarea').scrollLeft(portX);
$('#workarea').scrollTop(portY);
};
@@ -104,26 +102,23 @@ var svgEditorExtension_overview_window = (function () {
$('#overview_window_view_box').draggable({
containment: 'parent',
drag: updateViewPortFromViewBox,
-
- start() {
+ start: function start() {
overviewWindowGlobals.viewBoxDragging = true;
},
-
- stop() {
+ stop: function stop() {
overviewWindowGlobals.viewBoxDragging = false;
}
-
});
$('#overviewMiniView').click(function (evt) {
// Firefox doesn't support evt.offsetX and evt.offsetY.
- const mouseX = evt.offsetX || evt.originalEvent.layerX;
- const mouseY = evt.offsetY || evt.originalEvent.layerY;
- const overviewWidth = $('#overviewMiniView').attr('width');
- const overviewHeight = $('#overviewMiniView').attr('height');
- const viewBoxWidth = Number.parseFloat($('#overview_window_view_box').css('min-width'));
- const viewBoxHeight = Number.parseFloat($('#overview_window_view_box').css('min-height'));
- let viewBoxX = mouseX - 0.5 * viewBoxWidth;
- let viewBoxY = mouseY - 0.5 * viewBoxHeight; // deal with constraints
+ var mouseX = evt.offsetX || evt.originalEvent.layerX;
+ var mouseY = evt.offsetY || evt.originalEvent.layerY;
+ var overviewWidth = $('#overviewMiniView').attr('width');
+ var overviewHeight = $('#overviewMiniView').attr('height');
+ var viewBoxWidth = Number.parseFloat($('#overview_window_view_box').css('min-width'));
+ var viewBoxHeight = Number.parseFloat($('#overview_window_view_box').css('min-height'));
+ var viewBoxX = mouseX - 0.5 * viewBoxWidth;
+ var viewBoxY = mouseY - 0.5 * viewBoxHeight; // deal with constraints
if (viewBoxX < 0) {
viewBoxX = 0;
@@ -151,7 +146,6 @@ var svgEditorExtension_overview_window = (function () {
workareaResized: updateViewBox
};
}
-
};
return extOverview_window;
diff --git a/dist/extensions/ext-panning.js b/dist/extensions/ext-panning.js
index 222e2c33..8b675fbe 100644
--- a/dist/extensions/ext-panning.js
+++ b/dist/extensions/ext-panning.js
@@ -1,6 +1,42 @@
var svgEditorExtension_panning = (function () {
'use strict';
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+ try {
+ var info = gen[key](arg);
+ var value = info.value;
+ } catch (error) {
+ reject(error);
+ return;
+ }
+
+ if (info.done) {
+ resolve(value);
+ } else {
+ Promise.resolve(value).then(_next, _throw);
+ }
+ }
+
+ function _asyncToGenerator(fn) {
+ return function () {
+ var self = this,
+ args = arguments;
+ return new Promise(function (resolve, reject) {
+ var gen = fn.apply(self, args);
+
+ function _next(value) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+ }
+
+ function _throw(err) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+ }
+
+ _next(undefined);
+ });
+ };
+ }
+
/**
* @file ext-panning.js
*
@@ -15,57 +51,70 @@ var svgEditorExtension_panning = (function () {
*/
var extPanning = {
name: 'panning',
+ init: function init(_ref) {
+ var _this = this;
- async init({
- importLocale
- }) {
- const strings = await importLocale();
- const svgEditor = this;
- const svgCanvas = svgEditor.canvas;
- const buttons = [{
- id: 'ext-panning',
- icon: svgEditor.curConfig.extIconsPath + 'panning.png',
- type: 'mode',
- events: {
- click() {
- svgCanvas.setMode('ext-panning');
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+ var importLocale, strings, svgEditor, svgCanvas, buttons;
+ return regeneratorRuntime.wrap(function _callee$(_context) {
+ while (1) {
+ switch (_context.prev = _context.next) {
+ case 0:
+ importLocale = _ref.importLocale;
+ _context.next = 3;
+ return importLocale();
+
+ case 3:
+ strings = _context.sent;
+ svgEditor = _this;
+ svgCanvas = svgEditor.canvas;
+ buttons = [{
+ id: 'ext-panning',
+ icon: svgEditor.curConfig.extIconsPath + 'panning.png',
+ type: 'mode',
+ events: {
+ click: function click() {
+ svgCanvas.setMode('ext-panning');
+ }
+ }
+ }];
+ return _context.abrupt("return", {
+ name: strings.name,
+ svgicons: svgEditor.curConfig.extIconsPath + 'ext-panning.xml',
+ buttons: strings.buttons.map(function (button, i) {
+ return Object.assign(buttons[i], button);
+ }),
+ mouseDown: function mouseDown() {
+ if (svgCanvas.getMode() === 'ext-panning') {
+ svgEditor.setPanning(true);
+ return {
+ started: true
+ };
+ }
+
+ return undefined;
+ },
+ mouseUp: function mouseUp() {
+ if (svgCanvas.getMode() === 'ext-panning') {
+ svgEditor.setPanning(false);
+ return {
+ keep: false,
+ element: null
+ };
+ }
+
+ return undefined;
+ }
+ });
+
+ case 8:
+ case "end":
+ return _context.stop();
+ }
}
-
- }
- }];
- return {
- name: strings.name,
- svgicons: svgEditor.curConfig.extIconsPath + 'ext-panning.xml',
- buttons: strings.buttons.map((button, i) => {
- return Object.assign(buttons[i], button);
- }),
-
- mouseDown() {
- if (svgCanvas.getMode() === 'ext-panning') {
- svgEditor.setPanning(true);
- return {
- started: true
- };
- }
-
- return undefined;
- },
-
- mouseUp() {
- if (svgCanvas.getMode() === 'ext-panning') {
- svgEditor.setPanning(false);
- return {
- keep: false,
- element: null
- };
- }
-
- return undefined;
- }
-
- };
+ }, _callee);
+ }))();
}
-
};
return extPanning;
diff --git a/dist/extensions/ext-php_savefile.js b/dist/extensions/ext-php_savefile.js
index cc535320..89052fb0 100644
--- a/dist/extensions/ext-php_savefile.js
+++ b/dist/extensions/ext-php_savefile.js
@@ -5,41 +5,33 @@ var svgEditorExtension_php_savefile = (function () {
// handler as in "ext-server_opensave.js" (and in savefile.php)
var extPhp_savefile = {
name: 'php_savefile',
-
- init({
- $
- }) {
- const svgEditor = this;
- const {
- curConfig: {
- extPath
- },
- canvas: svgCanvas
- } = svgEditor;
+ init: function init(_ref) {
+ var $ = _ref.$;
+ var svgEditor = this;
+ var extPath = svgEditor.curConfig.extPath,
+ svgCanvas = svgEditor.canvas;
/**
* Get file name out of SVGEdit document title.
* @returns {string}
*/
function getFileNameFromTitle() {
- const title = svgCanvas.getDocumentTitle();
+ var title = svgCanvas.getDocumentTitle();
return title.trim();
}
- const saveSvgAction = extPath + 'savefile.php';
+ var saveSvgAction = extPath + 'savefile.php';
svgEditor.setCustomHandlers({
- save(win, data) {
- const svg = '<?xml version="1.0" encoding="UTF-8"?>\n' + data,
- filename = getFileNameFromTitle();
+ save: function save(win, data) {
+ var svg = '<?xml version="1.0" encoding="UTF-8"?>\n' + data,
+ filename = getFileNameFromTitle();
$.post(saveSvgAction, {
output_svg: svg,
- filename
+ filename: filename
});
}
-
});
}
-
};
return extPhp_savefile;
diff --git a/dist/extensions/ext-placemark.js b/dist/extensions/ext-placemark.js
index 9ce77498..46dca7cf 100644
--- a/dist/extensions/ext-placemark.js
+++ b/dist/extensions/ext-placemark.js
@@ -1,6 +1,98 @@
var svgEditorExtension_placemark = (function () {
'use strict';
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+ try {
+ var info = gen[key](arg);
+ var value = info.value;
+ } catch (error) {
+ reject(error);
+ return;
+ }
+
+ if (info.done) {
+ resolve(value);
+ } else {
+ Promise.resolve(value).then(_next, _throw);
+ }
+ }
+
+ function _asyncToGenerator(fn) {
+ return function () {
+ var self = this,
+ args = arguments;
+ return new Promise(function (resolve, reject) {
+ var gen = fn.apply(self, args);
+
+ function _next(value) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+ }
+
+ function _throw(err) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+ }
+
+ _next(undefined);
+ });
+ };
+ }
+
+ function _slicedToArray(arr, i) {
+ return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+ }
+
+ function _arrayWithHoles(arr) {
+ if (Array.isArray(arr)) return arr;
+ }
+
+ function _iterableToArrayLimit(arr, i) {
+ if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
+ var _arr = [];
+ var _n = true;
+ var _d = false;
+ var _e = undefined;
+
+ try {
+ for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
+ _arr.push(_s.value);
+
+ if (i && _arr.length === i) break;
+ }
+ } catch (err) {
+ _d = true;
+ _e = err;
+ } finally {
+ try {
+ if (!_n && _i["return"] != null) _i["return"]();
+ } finally {
+ if (_d) throw _e;
+ }
+ }
+
+ return _arr;
+ }
+
+ function _unsupportedIterableToArray(o, minLen) {
+ if (!o) return;
+ if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+ var n = Object.prototype.toString.call(o).slice(8, -1);
+ if (n === "Object" && o.constructor) n = o.constructor.name;
+ if (n === "Map" || n === "Set") return Array.from(o);
+ if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+ }
+
+ function _arrayLikeToArray(arr, len) {
+ if (len == null || len > arr.length) len = arr.length;
+
+ for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+
+ return arr2;
+ }
+
+ function _nonIterableRest() {
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+ }
+
/**
* @file ext-placemark.js
*
@@ -10,673 +102,621 @@ var svgEditorExtension_placemark = (function () {
*/
var extPlacemark = {
name: 'placemark',
+ init: function init(S) {
+ var _this = this;
- async init(S) {
- const svgEditor = this;
- const svgCanvas = svgEditor.canvas;
- const addElem = svgCanvas.addSVGElementFromJson;
- const {
- $,
- importLocale
- } = S; // {svgcontent},
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+ var svgEditor, svgCanvas, addElem, $, importLocale, selElems, started, newPM, strings, markerTypes, showPanel, getLinked, updateText, updateFont, addMarker, setMarker, colorChanged, updateReferences, setArrowFromButton, getTitle, addMarkerButtons, buttons, contextTools;
+ return regeneratorRuntime.wrap(function _callee$(_context) {
+ while (1) {
+ switch (_context.prev = _context.next) {
+ case 0:
+ addMarkerButtons = function _addMarkerButtons(buttons) {
+ Object.keys(markerTypes).forEach(function (id) {
+ var title = getTitle(String(id));
+ buttons.push({
+ id: 'placemark_marker_' + id,
+ svgicon: id,
+ icon: svgEditor.curConfig.extIconsPath + 'markers-' + id + '.png',
+ title: title,
+ type: 'context',
+ events: {
+ click: setArrowFromButton
+ },
+ panel: 'placemark_panel',
+ list: 'placemark_marker',
+ isDefault: id === 'leftarrow'
+ });
+ });
+ return buttons;
+ };
- let selElems, // editingitex = false,
- // svgdoc = S.svgroot.parentNode.ownerDocument,
- started, newPM; // edg = 0,
- // newFOG, newFOGParent, newDef, newImageName, newMaskID,
- // undoCommand = 'Not image',
- // modeChangeG, ccZoom, wEl, hEl, wOffset, hOffset, ccRgbEl, brushW, brushH;
+ getTitle = function _getTitle(id) {
+ var langList = strings.langList;
+ var item = langList.find(function (itm) {
+ return itm.id === id;
+ });
+ return item ? item.title : id;
+ };
- const strings = await importLocale();
- const markerTypes = {
- nomarker: {},
- forwardslash: {
- element: 'path',
- attr: {
- d: 'M30,100 L70,0'
- }
- },
- reverseslash: {
- element: 'path',
- attr: {
- d: 'M30,0 L70,100'
- }
- },
- verticalslash: {
- element: 'path',
- attr: {
- d: 'M50,0 L50,100'
- }
- },
- xmark: {
- element: 'path',
- attr: {
- d: 'M20,80 L80,20 M80,80 L20,20'
- }
- },
- leftarrow: {
- element: 'path',
- attr: {
- d: 'M0,50 L100,90 L70,50 L100,10 Z'
- }
- },
- rightarrow: {
- element: 'path',
- attr: {
- d: 'M100,50 L0,90 L30,50 L0,10 Z'
- }
- },
- box: {
- element: 'path',
- attr: {
- d: 'M20,20 L20,80 L80,80 L80,20 Z'
- }
- },
- star: {
- element: 'path',
- attr: {
- d: 'M10,30 L90,30 L20,90 L50,10 L80,90 Z'
- }
- },
- mcircle: {
- element: 'circle',
- attr: {
- r: 30,
- cx: 50,
- cy: 50
- }
- },
- triangle: {
- element: 'path',
- attr: {
- d: 'M10,80 L50,20 L80,80 Z'
- }
- }
- }; // duplicate shapes to support unfilled (open) marker types with an _o suffix
+ setArrowFromButton = function _setArrowFromButton(ev) {
+ var parts = this.id.split('_');
+ var val = parts[2];
- ['leftarrow', 'rightarrow', 'box', 'star', 'mcircle', 'triangle'].forEach(v => {
- markerTypes[v + '_o'] = markerTypes[v];
- });
- /**
- *
- * @param {boolean} on
- * @returns {void}
- */
+ if (parts[3]) {
+ val += '_' + parts[3];
+ }
- function showPanel(on) {
- $('#placemark_panel').toggle(on);
- }
- /**
- * @param {Element} elem - A graphic element will have an attribute like marker-start
- * @param {"marker-start"|"marker-mid"|"marker-end"} attr
- * @returns {Element} The marker element that is linked to the graphic element
- */
+ $('#placemark_marker').attr('value', val);
+ };
+
+ updateReferences = function _updateReferences(el) {
+ var id = 'placemark_marker_' + el.id;
+ var markerName = 'marker-start';
+ var marker = getLinked(el, markerName);
+
+ if (!marker || !marker.attributes["class"]) {
+ return;
+ } // not created by this extension
- function getLinked(elem, attr) {
- if (!elem) {
- return null;
- }
+ var url = el.getAttribute(markerName);
- const str = elem.getAttribute(attr);
+ if (url) {
+ var len = el.id.length;
+ var linkid = url.substr(-len - 1, len);
- if (!str) {
- return null;
- } // const m = str.match(/\(#(?<id>.+)\)/);
- // if (!m || !m.groups.id) {
+ if (el.id !== linkid) {
+ var val = $('#placemark_marker').attr('value') || 'leftarrow';
+ addMarker(id, val);
+ svgCanvas.changeSelectedAttribute(markerName, 'url(#' + id + ')');
+ svgCanvas.call('changed', selElems);
+ }
+ }
+ };
+
+ colorChanged = function _colorChanged(el) {
+ var color = el.getAttribute('stroke');
+ var marker = getLinked(el, 'marker-start'); // console.log(marker);
+
+ if (!marker) {
+ return;
+ }
+
+ if (!marker.attributes["class"]) {
+ return;
+ } // not created by this extension
- const m = str.match(/\(#(.*)\)/);
+ var ch = marker.lastElementChild;
- if (!m || m.length !== 2) {
- return null;
- }
+ if (!ch) {
+ return;
+ }
- return svgCanvas.getElem(m[1]); // return svgCanvas.getElem(m.groups.id);
- }
- /**
- * Called when text is changed.
- * @param {string} txt
- * @returns {void}
- */
+ var curfill = ch.getAttribute('fill');
+ var curstroke = ch.getAttribute('stroke');
+
+ if (curfill && curfill !== 'none') {
+ ch.setAttribute('fill', color);
+ }
+
+ if (curstroke && curstroke !== 'none') {
+ ch.setAttribute('stroke', color);
+ }
+ };
+
+ setMarker = function _setMarker(el, val) {
+ var markerName = 'marker-start';
+ var marker = getLinked(el, markerName);
+
+ if (marker) {
+ $(marker).remove();
+ }
+
+ el.removeAttribute(markerName);
+
+ if (val === 'nomarker') {
+ svgCanvas.call('changed', [el]);
+ return;
+ } // Set marker on element
- function updateText(txt) {
- const items = txt.split(';');
- selElems.forEach(elem => {
- if (elem && elem.getAttribute('class').includes('placemark')) {
- $(elem).children().each((_, i) => {
- const [,, type, n] = i.id.split('_');
+ var id = 'placemark_marker_' + el.id;
+ addMarker(id, val);
+ el.setAttribute(markerName, 'url(#' + id + ')');
+ svgCanvas.call('changed', [el]);
+ };
- if (type === 'txt') {
- $(i).text(items[n]);
- }
- });
- }
- });
- }
- /**
- * Called when font is changed.
- * @param {string} font
- * @returns {void}
- */
+ addMarker = function _addMarker(id, val) {
+ var marker = svgCanvas.getElem(id);
+
+ if (marker) {
+ return undefined;
+ } // console.log(id);
- function updateFont(font) {
- font = font.split(' ');
- const fontSize = Number.parseInt(font.pop());
- font = font.join(' ');
- selElems.forEach(elem => {
- if (elem && elem.getAttribute('class').includes('placemark')) {
- $(elem).children().each((_, i) => {
- const [,, type] = i.id.split('_');
+ if (val === '' || val === 'nomarker') {
+ return undefined;
+ }
- if (type === 'txt') {
- $(i).attr({
- 'font-family': font,
- 'font-size': fontSize
+ var color = svgCanvas.getColor('stroke'); // NOTE: Safari didn't like a negative value in viewBox
+ // so we use a standardized 0 0 100 100
+ // with 50 50 being mapped to the marker position
+
+ var scale = 2; // parseFloat($('#marker_size').val());
+
+ var strokeWidth = 10;
+ var refX = 50;
+ var refY = 50;
+ var viewBox = '0 0 100 100';
+ var markerWidth = 5 * scale;
+ var markerHeight = 5 * scale;
+ var seType = val;
+
+ if (!markerTypes[seType]) {
+ return undefined;
+ } // an unknown type!
+ // positional markers(arrows) at end of line
+
+
+ if (seType.includes('left')) refX = 0;
+ if (seType.includes('right')) refX = 100; // create a generic marker
+
+ marker = addElem({
+ element: 'marker',
+ attr: {
+ id: id,
+ markerUnits: 'strokeWidth',
+ orient: 'auto',
+ style: 'pointer-events:none',
+ "class": seType
+ }
+ });
+ var mel = addElem(markerTypes[seType]);
+ var fillcolor = seType.substr(-2) === '_o' ? 'none' : color;
+ mel.setAttribute('fill', fillcolor);
+ mel.setAttribute('stroke', color);
+ mel.setAttribute('stroke-width', strokeWidth);
+ marker.append(mel);
+ marker.setAttribute('viewBox', viewBox);
+ marker.setAttribute('markerWidth', markerWidth);
+ marker.setAttribute('markerHeight', markerHeight);
+ marker.setAttribute('refX', refX);
+ marker.setAttribute('refY', refY);
+ svgCanvas.findDefs().append(marker);
+ return marker;
+ };
+
+ updateFont = function _updateFont(font) {
+ font = font.split(' ');
+ var fontSize = Number.parseInt(font.pop());
+ font = font.join(' ');
+ selElems.forEach(function (elem) {
+ if (elem && elem.getAttribute('class').includes('placemark')) {
+ $(elem).children().each(function (_, i) {
+ var _i$id$split3 = i.id.split('_'),
+ _i$id$split4 = _slicedToArray(_i$id$split3, 3),
+ type = _i$id$split4[2];
+
+ if (type === 'txt') {
+ $(i).attr({
+ 'font-family': font,
+ 'font-size': fontSize
+ });
+ }
+ });
+ }
+ });
+ };
+
+ updateText = function _updateText(txt) {
+ var items = txt.split(';');
+ selElems.forEach(function (elem) {
+ if (elem && elem.getAttribute('class').includes('placemark')) {
+ $(elem).children().each(function (_, i) {
+ var _i$id$split = i.id.split('_'),
+ _i$id$split2 = _slicedToArray(_i$id$split, 4),
+ type = _i$id$split2[2],
+ n = _i$id$split2[3];
+
+ if (type === 'txt') {
+ $(i).text(items[n]);
+ }
+ });
+ }
+ });
+ };
+
+ getLinked = function _getLinked(elem, attr) {
+ if (!elem) {
+ return null;
+ }
+
+ var str = elem.getAttribute(attr);
+
+ if (!str) {
+ return null;
+ } // const m = str.match(/\(#(?<id>.+)\)/);
+ // if (!m || !m.groups.id) {
+
+
+ var m = str.match(/\(#(.*)\)/);
+
+ if (!m || m.length !== 2) {
+ return null;
+ }
+
+ return svgCanvas.getElem(m[1]); // return svgCanvas.getElem(m.groups.id);
+ };
+
+ showPanel = function _showPanel(on) {
+ $('#placemark_panel').toggle(on);
+ };
+
+ svgEditor = _this;
+ svgCanvas = svgEditor.canvas;
+ addElem = svgCanvas.addSVGElementFromJson;
+ $ = S.$, importLocale = S.importLocale; // {svgcontent},
+
+ _context.next = 17;
+ return importLocale();
+
+ case 17:
+ strings = _context.sent;
+ markerTypes = {
+ nomarker: {},
+ forwardslash: {
+ element: 'path',
+ attr: {
+ d: 'M30,100 L70,0'
+ }
+ },
+ reverseslash: {
+ element: 'path',
+ attr: {
+ d: 'M30,0 L70,100'
+ }
+ },
+ verticalslash: {
+ element: 'path',
+ attr: {
+ d: 'M50,0 L50,100'
+ }
+ },
+ xmark: {
+ element: 'path',
+ attr: {
+ d: 'M20,80 L80,20 M80,80 L20,20'
+ }
+ },
+ leftarrow: {
+ element: 'path',
+ attr: {
+ d: 'M0,50 L100,90 L70,50 L100,10 Z'
+ }
+ },
+ rightarrow: {
+ element: 'path',
+ attr: {
+ d: 'M100,50 L0,90 L30,50 L0,10 Z'
+ }
+ },
+ box: {
+ element: 'path',
+ attr: {
+ d: 'M20,20 L20,80 L80,80 L80,20 Z'
+ }
+ },
+ star: {
+ element: 'path',
+ attr: {
+ d: 'M10,30 L90,30 L20,90 L50,10 L80,90 Z'
+ }
+ },
+ mcircle: {
+ element: 'circle',
+ attr: {
+ r: 30,
+ cx: 50,
+ cy: 50
+ }
+ },
+ triangle: {
+ element: 'path',
+ attr: {
+ d: 'M10,80 L50,20 L80,80 Z'
+ }
+ }
+ }; // duplicate shapes to support unfilled (open) marker types with an _o suffix
+
+ ['leftarrow', 'rightarrow', 'box', 'star', 'mcircle', 'triangle'].forEach(function (v) {
+ markerTypes[v + '_o'] = markerTypes[v];
});
- }
- });
- }
- });
- }
- /**
- * @param {string} id
- * @param {""|"\\nomarker"|"nomarker"|"leftarrow"|"rightarrow"|"textmarker"|"textmarker_top"|"textmarker_bottom"|"forwardslash"|"reverseslash"|"verticalslash"|"box"|"star"|"xmark"|"triangle"|"mcircle"} val
- * @returns {SVGMarkerElement}
- */
+ /**
+ *
+ * @param {boolean} on
+ * @returns {void}
+ */
+ buttons = [{
+ id: 'tool_placemark',
+ icon: svgEditor.curConfig.extIconsPath + 'placemark.png',
+ type: 'mode',
+ position: 12,
+ events: {
+ click: function click() {
+ showPanel(true);
+ svgCanvas.setMode('placemark');
+ }
+ }
+ }];
+ contextTools = [{
+ type: 'button-select',
+ panel: 'placemark_panel',
+ id: 'placemark_marker',
+ colnum: 3,
+ events: {
+ change: setArrowFromButton
+ }
+ }, {
+ type: 'input',
+ panel: 'placemark_panel',
+ id: 'placemarkText',
+ size: 20,
+ defval: '',
+ events: {
+ change: function change() {
+ updateText(this.value);
+ }
+ }
+ }, {
+ type: 'input',
+ panel: 'placemark_panel',
+ id: 'placemarkFont',
+ size: 7,
+ defval: 'Arial 10',
+ events: {
+ change: function change() {
+ updateFont(this.value);
+ }
+ }
+ }];
+ return _context.abrupt("return", {
+ name: strings.name,
+ svgicons: svgEditor.curConfig.extIconsPath + 'placemark-icons.xml',
+ buttons: addMarkerButtons(strings.buttons.map(function (button, i) {
+ return Object.assign(buttons[i], button);
+ })),
+ context_tools: strings.contextTools.map(function (contextTool, i) {
+ return Object.assign(contextTools[i], contextTool);
+ }),
+ callback: function callback() {
+ $('#placemark_panel').hide(); // const endChanges = function(){};
+ },
+ mouseDown: function mouseDown(opts) {
+ // const rgb = svgCanvas.getColor('fill');
+ var sRgb = svgCanvas.getColor('stroke');
+ var sWidth = svgCanvas.getStrokeWidth();
- function addMarker(id, val) {
- let marker = svgCanvas.getElem(id);
+ if (svgCanvas.getMode() === 'placemark') {
+ started = true;
+ var id = svgCanvas.getNextId();
+ var items = $('#placemarkText').val().split(';');
+ var font = $('#placemarkFont').val().split(' ');
+ var fontSize = Number.parseInt(font.pop());
+ font = font.join(' ');
+ var x0 = opts.start_x + 10,
+ y0 = opts.start_y + 10;
+ var maxlen = 0;
+ var children = [{
+ element: 'line',
+ attr: {
+ id: id + '_pline_0',
+ fill: 'none',
+ stroke: sRgb,
+ 'stroke-width': sWidth,
+ 'stroke-linecap': 'round',
+ x1: opts.start_x,
+ y1: opts.start_y,
+ x2: x0,
+ y2: y0
+ }
+ }];
+ items.forEach(function (i, n) {
+ maxlen = Math.max(maxlen, i.length);
+ children.push({
+ element: 'line',
+ attr: {
+ id: id + '_tline_' + n,
+ fill: 'none',
+ stroke: sRgb,
+ 'stroke-width': sWidth,
+ 'stroke-linecap': 'round',
+ x1: x0,
+ y1: y0 + (fontSize + 6) * n,
+ x2: x0 + i.length * fontSize * 0.5 + fontSize,
+ y2: y0 + (fontSize + 6) * n
+ }
+ });
+ children.push({
+ element: 'text',
+ attr: {
+ id: id + '_txt_' + n,
+ fill: sRgb,
+ stroke: 'none',
+ 'stroke-width': 0,
+ x: x0 + 3,
+ y: y0 - 3 + (fontSize + 6) * n,
+ 'font-family': font,
+ 'font-size': fontSize,
+ 'text-anchor': 'start'
+ },
+ children: [i]
+ });
+ });
- if (marker) {
- return undefined;
- } // console.log(id);
+ if (items.length > 0) {
+ children.push({
+ element: 'line',
+ attr: {
+ id: id + '_vline_0',
+ fill: 'none',
+ stroke: sRgb,
+ 'stroke-width': sWidth,
+ 'stroke-linecap': 'round',
+ x1: x0,
+ y1: y0,
+ x2: x0,
+ y2: y0 + (fontSize + 6) * (items.length - 1)
+ }
+ });
+ }
+ newPM = svgCanvas.addSVGElementFromJson({
+ element: 'g',
+ attr: {
+ id: id,
+ "class": 'placemark',
+ fontSize: fontSize,
+ maxlen: maxlen,
+ lines: items.length,
+ x: opts.start_x,
+ y: opts.start_y,
+ px: opts.start_x,
+ py: opts.start_y
+ },
+ children: children
+ });
+ setMarker(newPM.firstElementChild, $('#placemark_marker').attr('value') || 'leftarrow');
+ return {
+ started: true
+ };
+ }
- if (val === '' || val === 'nomarker') {
- return undefined;
- }
+ return undefined;
+ },
+ mouseMove: function mouseMove(opts) {
+ if (!started) {
+ return undefined;
+ }
- const color = svgCanvas.getColor('stroke'); // NOTE: Safari didn't like a negative value in viewBox
- // so we use a standardized 0 0 100 100
- // with 50 50 being mapped to the marker position
+ if (svgCanvas.getMode() === 'placemark') {
+ var x = opts.mouse_x / svgCanvas.getZoom();
+ var y = opts.mouse_y / svgCanvas.getZoom();
- const scale = 2; // parseFloat($('#marker_size').val());
+ var _$$attr = $(newPM).attr(['fontSize', 'maxlen', 'lines', 'px', 'py']),
+ fontSize = _$$attr.fontSize,
+ maxlen = _$$attr.maxlen,
+ lines = _$$attr.lines,
+ px = _$$attr.px,
+ py = _$$attr.py;
- const strokeWidth = 10;
- let refX = 50;
- const refY = 50;
- const viewBox = '0 0 100 100';
- const markerWidth = 5 * scale;
- const markerHeight = 5 * scale;
- const seType = val;
+ $(newPM).attr({
+ x: x,
+ y: y
+ });
+ $(newPM).children().each(function (_, i) {
+ var _i$id$split5 = i.id.split('_'),
+ _i$id$split6 = _slicedToArray(_i$id$split5, 4),
+ type = _i$id$split6[2],
+ n = _i$id$split6[3];
- if (!markerTypes[seType]) {
- return undefined;
- } // an unknown type!
- // positional markers(arrows) at end of line
+ var y0 = y + (fontSize + 6) * n,
+ x0 = x + maxlen * fontSize * 0.5 + fontSize;
+ var nx = x + (x0 - x) / 2 < px ? x0 : x;
+ var ny = y + (fontSize + 6) * (lines - 1) / 2 < py ? y + (fontSize + 6) * (lines - 1) : y;
+ if (type === 'pline') {
+ i.setAttribute('x2', nx);
+ i.setAttribute('y2', ny);
+ }
- if (seType.includes('left')) refX = 0;
- if (seType.includes('right')) refX = 100; // create a generic marker
+ if (type === 'tline') {
+ i.setAttribute('x1', x);
+ i.setAttribute('y1', y0);
+ i.setAttribute('x2', x0);
+ i.setAttribute('y2', y0);
+ }
- marker = addElem({
- element: 'marker',
- attr: {
- id,
- markerUnits: 'strokeWidth',
- orient: 'auto',
- style: 'pointer-events:none',
- class: seType
- }
- });
- const mel = addElem(markerTypes[seType]);
- const fillcolor = seType.substr(-2) === '_o' ? 'none' : color;
- mel.setAttribute('fill', fillcolor);
- mel.setAttribute('stroke', color);
- mel.setAttribute('stroke-width', strokeWidth);
- marker.append(mel);
- marker.setAttribute('viewBox', viewBox);
- marker.setAttribute('markerWidth', markerWidth);
- marker.setAttribute('markerHeight', markerHeight);
- marker.setAttribute('refX', refX);
- marker.setAttribute('refY', refY);
- svgCanvas.findDefs().append(marker);
- return marker;
- }
- /**
- * @param {Element} el
- * @param {string} val
- * @returns {void}
- */
+ if (type === 'vline') {
+ i.setAttribute('x1', nx);
+ i.setAttribute('y1', y);
+ i.setAttribute('x2', nx);
+ i.setAttribute('y2', y + (fontSize + 6) * (lines - 1));
+ }
+ if (type === 'txt') {
+ i.setAttribute('x', x + fontSize / 2);
+ i.setAttribute('y', y0 - 3);
+ }
+ });
+ return {
+ started: true
+ };
+ }
- function setMarker(el, val) {
- const markerName = 'marker-start';
- const marker = getLinked(el, markerName);
+ return undefined;
+ },
+ mouseUp: function mouseUp() {
+ if (svgCanvas.getMode() === 'placemark') {
+ var _$$attr2 = $(newPM).attr(['x', 'y', 'px', 'py']),
+ x = _$$attr2.x,
+ y = _$$attr2.y,
+ px = _$$attr2.px,
+ py = _$$attr2.py;
- if (marker) {
- $(marker).remove();
- }
+ return {
+ keep: x != px && y != py,
+ // eslint-disable-line eqeqeq
+ element: newPM
+ };
+ }
- el.removeAttribute(markerName);
+ return undefined;
+ },
+ selectedChanged: function selectedChanged(opts) {
+ // Use this to update the current selected elements
+ selElems = opts.elems;
+ selElems.forEach(function (elem) {
+ if (elem && elem.getAttribute('class').includes('placemark')) {
+ var txt = [];
+ $(elem).children().each(function (n, i) {
+ var _i$id$split7 = i.id.split('_'),
+ _i$id$split8 = _slicedToArray(_i$id$split7, 3),
+ type = _i$id$split8[2];
- if (val === 'nomarker') {
- svgCanvas.call('changed', [el]);
- return;
- } // Set marker on element
+ if (type === 'txt') {
+ $('#placemarkFont').val(i.getAttribute('font-family') + ' ' + i.getAttribute('font-size'));
+ txt.push($(i).text());
+ }
+ });
+ $('#placemarkText').val(txt.join(';'));
+ showPanel(true);
+ } else {
+ showPanel(false);
+ }
+ });
+ },
+ elementChanged: function elementChanged(opts) {
+ opts.elems.forEach(function (elem) {
+ if (elem.id.includes('pline_0')) {
+ // need update marker of pline_0
+ colorChanged(elem);
+ updateReferences(elem);
+ }
+ });
+ }
+ });
-
- const id = 'placemark_marker_' + el.id;
- addMarker(id, val);
- el.setAttribute(markerName, 'url(#' + id + ')');
- svgCanvas.call('changed', [el]);
- }
- /**
- * Called when the main system modifies an object. This routine changes
- * the associated markers to be the same color.
- * @param {Element} el
- * @returns {void}
- */
-
-
- function colorChanged(el) {
- const color = el.getAttribute('stroke');
- const marker = getLinked(el, 'marker-start'); // console.log(marker);
-
- if (!marker) {
- return;
- }
-
- if (!marker.attributes.class) {
- return;
- } // not created by this extension
-
-
- const ch = marker.lastElementChild;
-
- if (!ch) {
- return;
- }
-
- const curfill = ch.getAttribute('fill');
- const curstroke = ch.getAttribute('stroke');
-
- if (curfill && curfill !== 'none') {
- ch.setAttribute('fill', color);
- }
-
- if (curstroke && curstroke !== 'none') {
- ch.setAttribute('stroke', color);
- }
- }
- /**
- * Called when the main system creates or modifies an object.
- * Its primary purpose is to create new markers for cloned objects.
- * @param {Element} el
- * @returns {void}
- */
-
-
- function updateReferences(el) {
- const id = 'placemark_marker_' + el.id;
- const markerName = 'marker-start';
- const marker = getLinked(el, markerName);
-
- if (!marker || !marker.attributes.class) {
- return;
- } // not created by this extension
-
-
- const url = el.getAttribute(markerName);
-
- if (url) {
- const len = el.id.length;
- const linkid = url.substr(-len - 1, len);
-
- if (el.id !== linkid) {
- const val = $('#placemark_marker').attr('value') || 'leftarrow';
- addMarker(id, val);
- svgCanvas.changeSelectedAttribute(markerName, 'url(#' + id + ')');
- svgCanvas.call('changed', selElems);
- }
- }
- }
- /**
- * @param {Event} ev
- * @returns {void}
- */
-
-
- function setArrowFromButton(ev) {
- const parts = this.id.split('_');
- let val = parts[2];
-
- if (parts[3]) {
- val += '_' + parts[3];
- }
-
- $('#placemark_marker').attr('value', val);
- }
- /**
- * @param {"nomarker"|"leftarrow"|"rightarrow"|"textmarker"|"forwardslash"|"reverseslash"|"verticalslash"|"box"|"star"|"xmark"|"triangle"|"mcircle"} id
- * @returns {string}
- */
-
-
- function getTitle(id) {
- const {
- langList
- } = strings;
- const item = langList.find(itm => {
- return itm.id === id;
- });
- return item ? item.title : id;
- }
- /**
- * Build the toolbar button array from the marker definitions.
- * @param {module:SVGEditor.Button[]} buttons
- * @returns {module:SVGEditor.Button[]}
- */
-
-
- function addMarkerButtons(buttons) {
- Object.keys(markerTypes).forEach(function (id) {
- const title = getTitle(String(id));
- buttons.push({
- id: 'placemark_marker_' + id,
- svgicon: id,
- icon: svgEditor.curConfig.extIconsPath + 'markers-' + id + '.png',
- title,
- type: 'context',
- events: {
- click: setArrowFromButton
- },
- panel: 'placemark_panel',
- list: 'placemark_marker',
- isDefault: id === 'leftarrow'
- });
- });
- return buttons;
- }
-
- const buttons = [{
- id: 'tool_placemark',
- icon: svgEditor.curConfig.extIconsPath + 'placemark.png',
- type: 'mode',
- position: 12,
- events: {
- click() {
- showPanel(true);
- svgCanvas.setMode('placemark');
- }
-
- }
- }];
- const contextTools = [{
- type: 'button-select',
- panel: 'placemark_panel',
- id: 'placemark_marker',
- colnum: 3,
- events: {
- change: setArrowFromButton
- }
- }, {
- type: 'input',
- panel: 'placemark_panel',
- id: 'placemarkText',
- size: 20,
- defval: '',
- events: {
- change() {
- updateText(this.value);
- }
-
- }
- }, {
- type: 'input',
- panel: 'placemark_panel',
- id: 'placemarkFont',
- size: 7,
- defval: 'Arial 10',
- events: {
- change() {
- updateFont(this.value);
- }
-
- }
- }];
- return {
- name: strings.name,
- svgicons: svgEditor.curConfig.extIconsPath + 'placemark-icons.xml',
- buttons: addMarkerButtons(strings.buttons.map((button, i) => {
- return Object.assign(buttons[i], button);
- })),
- context_tools: strings.contextTools.map((contextTool, i) => {
- return Object.assign(contextTools[i], contextTool);
- }),
-
- callback() {
- $('#placemark_panel').hide(); // const endChanges = function(){};
- },
-
- mouseDown(opts) {
- // const rgb = svgCanvas.getColor('fill');
- const sRgb = svgCanvas.getColor('stroke');
- const sWidth = svgCanvas.getStrokeWidth();
-
- if (svgCanvas.getMode() === 'placemark') {
- started = true;
- const id = svgCanvas.getNextId();
- const items = $('#placemarkText').val().split(';');
- let font = $('#placemarkFont').val().split(' ');
- const fontSize = Number.parseInt(font.pop());
- font = font.join(' ');
- const x0 = opts.start_x + 10,
- y0 = opts.start_y + 10;
- let maxlen = 0;
- const children = [{
- element: 'line',
- attr: {
- id: id + '_pline_0',
- fill: 'none',
- stroke: sRgb,
- 'stroke-width': sWidth,
- 'stroke-linecap': 'round',
- x1: opts.start_x,
- y1: opts.start_y,
- x2: x0,
- y2: y0
- }
- }];
- items.forEach((i, n) => {
- maxlen = Math.max(maxlen, i.length);
- children.push({
- element: 'line',
- attr: {
- id: id + '_tline_' + n,
- fill: 'none',
- stroke: sRgb,
- 'stroke-width': sWidth,
- 'stroke-linecap': 'round',
- x1: x0,
- y1: y0 + (fontSize + 6) * n,
- x2: x0 + i.length * fontSize * 0.5 + fontSize,
- y2: y0 + (fontSize + 6) * n
- }
- });
- children.push({
- element: 'text',
- attr: {
- id: id + '_txt_' + n,
- fill: sRgb,
- stroke: 'none',
- 'stroke-width': 0,
- x: x0 + 3,
- y: y0 - 3 + (fontSize + 6) * n,
- 'font-family': font,
- 'font-size': fontSize,
- 'text-anchor': 'start'
- },
- children: [i]
- });
- });
-
- if (items.length > 0) {
- children.push({
- element: 'line',
- attr: {
- id: id + '_vline_0',
- fill: 'none',
- stroke: sRgb,
- 'stroke-width': sWidth,
- 'stroke-linecap': 'round',
- x1: x0,
- y1: y0,
- x2: x0,
- y2: y0 + (fontSize + 6) * (items.length - 1)
- }
- });
+ case 23:
+ case "end":
+ return _context.stop();
}
-
- newPM = svgCanvas.addSVGElementFromJson({
- element: 'g',
- attr: {
- id,
- class: 'placemark',
- fontSize,
- maxlen,
- lines: items.length,
- x: opts.start_x,
- y: opts.start_y,
- px: opts.start_x,
- py: opts.start_y
- },
- children
- });
- setMarker(newPM.firstElementChild, $('#placemark_marker').attr('value') || 'leftarrow');
- return {
- started: true
- };
}
-
- return undefined;
- },
-
- mouseMove(opts) {
- if (!started) {
- return undefined;
- }
-
- if (svgCanvas.getMode() === 'placemark') {
- const x = opts.mouse_x / svgCanvas.getZoom();
- const y = opts.mouse_y / svgCanvas.getZoom();
- const {
- fontSize,
- maxlen,
- lines,
- px,
- py
- } = $(newPM).attr(['fontSize', 'maxlen', 'lines', 'px', 'py']);
- $(newPM).attr({
- x,
- y
- });
- $(newPM).children().each((_, i) => {
- const [,, type, n] = i.id.split('_');
- const y0 = y + (fontSize + 6) * n,
- x0 = x + maxlen * fontSize * 0.5 + fontSize;
- const nx = x + (x0 - x) / 2 < px ? x0 : x;
- const ny = y + (fontSize + 6) * (lines - 1) / 2 < py ? y + (fontSize + 6) * (lines - 1) : y;
-
- if (type === 'pline') {
- i.setAttribute('x2', nx);
- i.setAttribute('y2', ny);
- }
-
- if (type === 'tline') {
- i.setAttribute('x1', x);
- i.setAttribute('y1', y0);
- i.setAttribute('x2', x0);
- i.setAttribute('y2', y0);
- }
-
- if (type === 'vline') {
- i.setAttribute('x1', nx);
- i.setAttribute('y1', y);
- i.setAttribute('x2', nx);
- i.setAttribute('y2', y + (fontSize + 6) * (lines - 1));
- }
-
- if (type === 'txt') {
- i.setAttribute('x', x + fontSize / 2);
- i.setAttribute('y', y0 - 3);
- }
- });
- return {
- started: true
- };
- }
-
- return undefined;
- },
-
- mouseUp() {
- if (svgCanvas.getMode() === 'placemark') {
- const {
- x,
- y,
- px,
- py
- } = $(newPM).attr(['x', 'y', 'px', 'py']);
- return {
- keep: x != px && y != py,
- // eslint-disable-line eqeqeq
- element: newPM
- };
- }
-
- return undefined;
- },
-
- selectedChanged(opts) {
- // Use this to update the current selected elements
- selElems = opts.elems;
- selElems.forEach(elem => {
- if (elem && elem.getAttribute('class').includes('placemark')) {
- const txt = [];
- $(elem).children().each((n, i) => {
- const [,, type] = i.id.split('_');
-
- if (type === 'txt') {
- $('#placemarkFont').val(i.getAttribute('font-family') + ' ' + i.getAttribute('font-size'));
- txt.push($(i).text());
- }
- });
- $('#placemarkText').val(txt.join(';'));
- showPanel(true);
- } else {
- showPanel(false);
- }
- });
- },
-
- elementChanged(opts) {
- opts.elems.forEach(elem => {
- if (elem.id.includes('pline_0')) {
- // need update marker of pline_0
- colorChanged(elem);
- updateReferences(elem);
- }
- });
- }
-
- };
+ }, _callee);
+ }))();
}
-
};
return extPlacemark;
diff --git a/dist/extensions/ext-polygon.js b/dist/extensions/ext-polygon.js
index 426720e5..37aa3a62 100644
--- a/dist/extensions/ext-polygon.js
+++ b/dist/extensions/ext-polygon.js
@@ -1,6 +1,42 @@
var svgEditorExtension_polygon = (function () {
'use strict';
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+ try {
+ var info = gen[key](arg);
+ var value = info.value;
+ } catch (error) {
+ reject(error);
+ return;
+ }
+
+ if (info.done) {
+ resolve(value);
+ } else {
+ Promise.resolve(value).then(_next, _throw);
+ }
+ }
+
+ function _asyncToGenerator(fn) {
+ return function () {
+ var self = this,
+ args = arguments;
+ return new Promise(function (resolve, reject) {
+ var gen = fn.apply(self, args);
+
+ function _next(value) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+ }
+
+ function _throw(err) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+ }
+
+ _next(undefined);
+ });
+ };
+ }
+
/**
* @file ext-polygon.js
*
@@ -10,305 +46,262 @@ var svgEditorExtension_polygon = (function () {
*/
var extPolygon = {
name: 'polygon',
+ init: function init(S) {
+ var _this = this;
- async init(S) {
- const svgEditor = this;
- const svgCanvas = svgEditor.canvas;
- const {
- $,
- importLocale
- } = S;
- const strings = await importLocale();
- let selElems, // svgdoc = S.svgroot.parentNode.ownerDocument,
- // newFOG, newFOGParent, newDef, newImageName, newMaskID, modeChangeG,
- // edg = 0,
- // undoCommand = 'Not image';
- started, newFO; // const ccZoom;
- // const wEl, hEl;
- // const wOffset, hOffset;
- // const ccRBG;
- // const ccOpacity;
- // const brushW, brushH;
- // const ccDebug = document.getElementById('debugpanel');
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+ var svgEditor, svgCanvas, $, importLocale, editingitex, strings, selElems, started, newFO, showPanel, setAttr, cot, sec, buttons, contextTools;
+ return regeneratorRuntime.wrap(function _callee$(_context) {
+ while (1) {
+ switch (_context.prev = _context.next) {
+ case 0:
+ sec = function _sec(n) {
+ return 1 / Math.cos(n);
+ };
- /* const properlySourceSizeTextArea = function(){
- // TODO: remove magic numbers here and get values from CSS
- const height = $('#svg_source_container').height() - 80;
- $('#svg_source_textarea').css('height', height);
- }; */
+ cot = function _cot(n) {
+ return 1 / Math.tan(n);
+ };
- /**
- * @param {boolean} on
- * @returns {void}
- */
+ setAttr = function _setAttr(attr, val) {
+ svgCanvas.changeSelectedAttribute(attr, val);
+ svgCanvas.call('changed', selElems);
+ };
- function showPanel(on) {
- let fcRules = $('#fc_rules');
+ showPanel = function _showPanel(on) {
+ var fcRules = $('#fc_rules');
- if (!fcRules.length) {
- fcRules = $('<style id="fc_rules"></style>').appendTo('head');
- }
+ if (!fcRules.length) {
+ fcRules = $('<style id="fc_rules"></style>').appendTo('head');
+ }
- fcRules.text(!on ? '' : ' #tool_topath { display: none !important; }');
- $('#polygon_panel').toggle(on);
- }
- /*
- function toggleSourceButtons(on){
- $('#tool_source_save, #tool_source_cancel').toggle(!on);
- $('#polygon_save, #polygon_cancel').toggle(on);
- }
- */
+ fcRules.text(!on ? '' : ' #tool_topath { display: none !important; }');
+ $('#polygon_panel').toggle(on);
+ };
- /**
- * @param {string} attr
- * @param {string|Float} val
- * @returns {void}
- */
+ svgEditor = _this;
+ svgCanvas = svgEditor.canvas;
+ $ = S.$, importLocale = S.importLocale, editingitex = false;
+ _context.next = 9;
+ return importLocale();
+
+ case 9:
+ strings = _context.sent;
+
+ /**
+ * Obtained from http://code.google.com/p/passenger-top/source/browse/instiki/public/svg-edit/editor/extensions/ext-itex.js?r=3
+ * This function sets the content of of the currently-selected foreignObject element,
+ * based on the itex contained in string.
+ * @param {string} tex The itex text.
+ * @returns {boolean} This function returns false if the set was unsuccessful, true otherwise.
+ */
+
+ /*
+ function setItexString(tex) {
+ const mathns = 'http://www.w3.org/1998/Math/MathML',
+ xmlnsns = 'http://www.w3.org/2000/xmlns/',
+ ajaxEndpoint = '../../itex';
+ const elt = selElems[0];
+ try {
+ const math = svgdoc.createElementNS(mathns, 'math');
+ math.setAttributeNS(xmlnsns, 'xmlns', mathns);
+ math.setAttribute('display', 'inline');
+ const semantics = document.createElementNS(mathns, 'semantics');
+ const annotation = document.createElementNS(mathns, 'annotation');
+ annotation.setAttribute('encoding', 'application/x-tex');
+ annotation.textContent = tex;
+ const mrow = document.createElementNS(mathns, 'mrow');
+ semantics.append(mrow, annotation);
+ math.append(semantics);
+ // make an AJAX request to the server, to get the MathML
+ $.post(ajaxEndpoint, {tex, display: 'inline'}, function(data){
+ const children = data.documentElement.childNodes;
+ while (children.length > 0) {
+ mrow.append(svgdoc.adoptNode(children[0], true));
+ }
+ svgCanvas.sanitizeSvg(math);
+ svgCanvas.call('changed', [elt]);
+ });
+ elt.firstChild.replaceWith(math);
+ svgCanvas.call('changed', [elt]);
+ svgCanvas.clearSelection();
+ } catch(e) {
+ console.log(e);
+ return false;
+ }
+ return true;
+ }
+ */
+ buttons = [{
+ id: 'tool_polygon',
+ icon: svgEditor.curConfig.extIconsPath + 'polygon.png',
+ type: 'mode',
+ position: 11,
+ events: {
+ click: function click() {
+ svgCanvas.setMode('polygon');
+ showPanel(true);
+ }
+ }
+ }];
+ contextTools = [{
+ type: 'input',
+ panel: 'polygon_panel',
+ id: 'polySides',
+ size: 3,
+ defval: 5,
+ events: {
+ change: function change() {
+ setAttr('sides', this.value);
+ }
+ }
+ }];
+ return _context.abrupt("return", {
+ name: strings.name,
+ svgicons: svgEditor.curConfig.extIconsPath + 'polygon-icons.svg',
+ buttons: strings.buttons.map(function (button, i) {
+ return Object.assign(buttons[i], button);
+ }),
+ context_tools: strings.contextTools.map(function (contextTool, i) {
+ return Object.assign(contextTools[i], contextTool);
+ }),
+ callback: function callback() {
+ $('#polygon_panel').hide();
- function setAttr(attr, val) {
- svgCanvas.changeSelectedAttribute(attr, val);
- svgCanvas.call('changed', selElems);
- }
- /**
- * @param {Float} n
- * @returns {Float}
- */
+ setTimeout(function () {
+ // Create source save/cancel buttons
+
+ /* const save = */
+ $('#tool_source_save').clone().hide().attr('id', 'polygon_save').unbind().appendTo('#tool_source_back').click(function () {
+ if (!editingitex) {
+ return;
+ } // Todo: Uncomment the setItexString() function above and handle ajaxEndpoint?
+ // setSelectMode();
+ });
+ /* const cancel = */
+
+ $('#tool_source_cancel').clone().hide().attr('id', 'polygon_cancel').unbind().appendTo('#tool_source_back').click(function () {
+ });
+ }, 3000);
+ },
+ mouseDown: function mouseDown(opts) {
+ if (svgCanvas.getMode() !== 'polygon') {
+ return undefined;
+ } // const e = opts.event;
- function cot(n) {
- return 1 / Math.tan(n);
- }
- /**
- * @param {Float} n
- * @returns {Float}
- */
+ var rgb = svgCanvas.getColor('fill'); // const ccRgbEl = rgb.substring(1, rgb.length);
+
+ var sRgb = svgCanvas.getColor('stroke'); // ccSRgbEl = sRgb.substring(1, rgb.length);
+
+ var sWidth = svgCanvas.getStrokeWidth();
+ started = true;
+ newFO = svgCanvas.addSVGElementFromJson({
+ element: 'polygon',
+ attr: {
+ cx: opts.start_x,
+ cy: opts.start_y,
+ id: svgCanvas.getNextId(),
+ shape: 'regularPoly',
+ sides: document.getElementById('polySides').value,
+ orient: 'x',
+ edge: 0,
+ fill: rgb,
+ strokecolor: sRgb,
+ strokeWidth: sWidth
+ }
+ });
+ return {
+ started: true
+ };
+ },
+ mouseMove: function mouseMove(opts) {
+ if (!started || svgCanvas.getMode() !== 'polygon') {
+ return undefined;
+ } // const e = opts.event;
- function sec(n) {
- return 1 / Math.cos(n);
- }
- /**
- * Obtained from http://code.google.com/p/passenger-top/source/browse/instiki/public/svg-edit/editor/extensions/ext-itex.js?r=3
- * This function sets the content of of the currently-selected foreignObject element,
- * based on the itex contained in string.
- * @param {string} tex The itex text.
- * @returns {boolean} This function returns false if the set was unsuccessful, true otherwise.
- */
+ var c = $(newFO).attr(['cx', 'cy', 'sides', 'orient', 'fill', 'strokecolor', 'strokeWidth']);
+ var x = opts.mouse_x;
+ var y = opts.mouse_y;
+ var cx = c.cx,
+ cy = c.cy,
+ fill = c.fill,
+ strokecolor = c.strokecolor,
+ strokeWidth = c.strokeWidth,
+ sides = c.sides,
+ edg = Math.sqrt((x - cx) * (x - cx) + (y - cy) * (y - cy)) / 1.5;
+ newFO.setAttribute('edge', edg);
+ var inradius = edg / 2 * cot(Math.PI / sides);
+ var circumradius = inradius * sec(Math.PI / sides);
+ var points = '';
- /*
- function setItexString(tex) {
- const mathns = 'http://www.w3.org/1998/Math/MathML',
- xmlnsns = 'http://www.w3.org/2000/xmlns/',
- ajaxEndpoint = '../../itex';
- const elt = selElems[0];
- try {
- const math = svgdoc.createElementNS(mathns, 'math');
- math.setAttributeNS(xmlnsns, 'xmlns', mathns);
- math.setAttribute('display', 'inline');
- const semantics = document.createElementNS(mathns, 'semantics');
- const annotation = document.createElementNS(mathns, 'annotation');
- annotation.setAttribute('encoding', 'application/x-tex');
- annotation.textContent = tex;
- const mrow = document.createElementNS(mathns, 'mrow');
- semantics.append(mrow, annotation);
- math.append(semantics);
- // make an AJAX request to the server, to get the MathML
- $.post(ajaxEndpoint, {tex, display: 'inline'}, function(data){
- const children = data.documentElement.childNodes;
- while (children.length > 0) {
- mrow.append(svgdoc.adoptNode(children[0], true));
- }
- svgCanvas.sanitizeSvg(math);
- svgCanvas.call('changed', [elt]);
- });
- elt.firstChild.replaceWith(math);
- svgCanvas.call('changed', [elt]);
- svgCanvas.clearSelection();
- } catch(e) {
- console.log(e);
- return false;
- }
- return true;
- }
- */
+ for (var s = 0; sides >= s; s++) {
+ var angle = 2.0 * Math.PI * s / sides;
+ x = circumradius * Math.cos(angle) + cx;
+ y = circumradius * Math.sin(angle) + cy;
+ points += x + ',' + y + ' ';
+ } // const poly = newFO.createElementNS(NS.SVG, 'polygon');
- const buttons = [{
- id: 'tool_polygon',
- icon: svgEditor.curConfig.extIconsPath + 'polygon.png',
- type: 'mode',
- position: 11,
- events: {
- click() {
- svgCanvas.setMode('polygon');
- showPanel(true);
- }
+ newFO.setAttribute('points', points);
+ newFO.setAttribute('fill', fill);
+ newFO.setAttribute('stroke', strokecolor);
+ newFO.setAttribute('stroke-width', strokeWidth); // newFO.setAttribute('transform', 'rotate(-90)');
+ // const shape = newFO.getAttribute('shape');
+ // newFO.append(poly);
+ // DrawPoly(cx, cy, sides, edg, orient);
- }
- }];
- const contextTools = [{
- type: 'input',
- panel: 'polygon_panel',
- id: 'polySides',
- size: 3,
- defval: 5,
- events: {
- change() {
- setAttr('sides', this.value);
- }
+ return {
+ started: true
+ };
+ },
+ mouseUp: function mouseUp(opts) {
+ if (svgCanvas.getMode() !== 'polygon') {
+ return undefined;
+ }
- }
- }];
- return {
- name: strings.name,
- svgicons: svgEditor.curConfig.extIconsPath + 'polygon-icons.svg',
- buttons: strings.buttons.map((button, i) => {
- return Object.assign(buttons[i], button);
- }),
- context_tools: strings.contextTools.map((contextTool, i) => {
- return Object.assign(contextTools[i], contextTool);
- }),
+ var attrs = $(newFO).attr('edge');
+ var keep = attrs.edge !== '0'; // svgCanvas.addToSelection([newFO], true);
- callback() {
- $('#polygon_panel').hide();
+ return {
+ keep: keep,
+ element: newFO
+ };
+ },
+ selectedChanged: function selectedChanged(opts) {
+ // Use this to update the current selected elements
+ selElems = opts.elems;
+ var i = selElems.length;
+ while (i--) {
+ var elem = selElems[i];
- setTimeout(function () {
- // Create source save/cancel buttons
+ if (elem && elem.getAttribute('shape') === 'regularPoly') {
+ if (opts.selectedElement && !opts.multiselected) {
+ $('#polySides').val(elem.getAttribute('sides'));
+ showPanel(true);
+ } else {
+ showPanel(false);
+ }
+ } else {
+ showPanel(false);
+ }
+ }
+ },
+ elementChanged: function elementChanged(opts) {// const elem = opts.elems[0];
+ }
+ });
- /* const save = */
- $('#tool_source_save').clone().hide().attr('id', 'polygon_save').unbind().appendTo('#tool_source_back').click(function () {
- {
- return;
- } // Todo: Uncomment the setItexString() function above and handle ajaxEndpoint?
- // setSelectMode();
- });
- /* const cancel = */
-
- $('#tool_source_cancel').clone().hide().attr('id', 'polygon_cancel').unbind().appendTo('#tool_source_back').click(function () {
- });
- }, 3000);
- },
-
- mouseDown(opts) {
- if (svgCanvas.getMode() !== 'polygon') {
- return undefined;
- } // const e = opts.event;
-
-
- const rgb = svgCanvas.getColor('fill'); // const ccRgbEl = rgb.substring(1, rgb.length);
-
- const sRgb = svgCanvas.getColor('stroke'); // ccSRgbEl = sRgb.substring(1, rgb.length);
-
- const sWidth = svgCanvas.getStrokeWidth();
- started = true;
- newFO = svgCanvas.addSVGElementFromJson({
- element: 'polygon',
- attr: {
- cx: opts.start_x,
- cy: opts.start_y,
- id: svgCanvas.getNextId(),
- shape: 'regularPoly',
- sides: document.getElementById('polySides').value,
- orient: 'x',
- edge: 0,
- fill: rgb,
- strokecolor: sRgb,
- strokeWidth: sWidth
- }
- });
- return {
- started: true
- };
- },
-
- mouseMove(opts) {
- if (!started || svgCanvas.getMode() !== 'polygon') {
- return undefined;
- } // const e = opts.event;
-
-
- const c = $(newFO).attr(['cx', 'cy', 'sides', 'orient', 'fill', 'strokecolor', 'strokeWidth']);
- let x = opts.mouse_x;
- let y = opts.mouse_y;
- const {
- cx,
- cy,
- fill,
- strokecolor,
- strokeWidth,
- sides
- } = c,
- // {orient} = c,
- edg = Math.sqrt((x - cx) * (x - cx) + (y - cy) * (y - cy)) / 1.5;
- newFO.setAttribute('edge', edg);
- const inradius = edg / 2 * cot(Math.PI / sides);
- const circumradius = inradius * sec(Math.PI / sides);
- let points = '';
-
- for (let s = 0; sides >= s; s++) {
- const angle = 2.0 * Math.PI * s / sides;
- x = circumradius * Math.cos(angle) + cx;
- y = circumradius * Math.sin(angle) + cy;
- points += x + ',' + y + ' ';
- } // const poly = newFO.createElementNS(NS.SVG, 'polygon');
-
-
- newFO.setAttribute('points', points);
- newFO.setAttribute('fill', fill);
- newFO.setAttribute('stroke', strokecolor);
- newFO.setAttribute('stroke-width', strokeWidth); // newFO.setAttribute('transform', 'rotate(-90)');
- // const shape = newFO.getAttribute('shape');
- // newFO.append(poly);
- // DrawPoly(cx, cy, sides, edg, orient);
-
- return {
- started: true
- };
- },
-
- mouseUp(opts) {
- if (svgCanvas.getMode() !== 'polygon') {
- return undefined;
- }
-
- const attrs = $(newFO).attr('edge');
- const keep = attrs.edge !== '0'; // svgCanvas.addToSelection([newFO], true);
-
- return {
- keep,
- element: newFO
- };
- },
-
- selectedChanged(opts) {
- // Use this to update the current selected elements
- selElems = opts.elems;
- let i = selElems.length;
-
- while (i--) {
- const elem = selElems[i];
-
- if (elem && elem.getAttribute('shape') === 'regularPoly') {
- if (opts.selectedElement && !opts.multiselected) {
- $('#polySides').val(elem.getAttribute('sides'));
- showPanel(true);
- } else {
- showPanel(false);
- }
- } else {
- showPanel(false);
+ case 13:
+ case "end":
+ return _context.stop();
}
}
- },
-
- elementChanged(opts) {// const elem = opts.elems[0];
- }
-
- };
+ }, _callee);
+ }))();
}
-
};
return extPolygon;
diff --git a/dist/extensions/ext-server_moinsave.js b/dist/extensions/ext-server_moinsave.js
index dbbd4425..7538a8c1 100644
--- a/dist/extensions/ext-server_moinsave.js
+++ b/dist/extensions/ext-server_moinsave.js
@@ -1,6 +1,262 @@
var svgEditorExtension_server_moinsave = (function () {
'use strict';
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+ try {
+ var info = gen[key](arg);
+ var value = info.value;
+ } catch (error) {
+ reject(error);
+ return;
+ }
+
+ if (info.done) {
+ resolve(value);
+ } else {
+ Promise.resolve(value).then(_next, _throw);
+ }
+ }
+
+ function _asyncToGenerator(fn) {
+ return function () {
+ var self = this,
+ args = arguments;
+ return new Promise(function (resolve, reject) {
+ var gen = fn.apply(self, args);
+
+ function _next(value) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+ }
+
+ function _throw(err) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+ }
+
+ _next(undefined);
+ });
+ };
+ }
+
+ function _classCallCheck(instance, Constructor) {
+ if (!(instance instanceof Constructor)) {
+ throw new TypeError("Cannot call a class as a function");
+ }
+ }
+
+ function _defineProperties(target, props) {
+ for (var i = 0; i < props.length; i++) {
+ var descriptor = props[i];
+ descriptor.enumerable = descriptor.enumerable || false;
+ descriptor.configurable = true;
+ if ("value" in descriptor) descriptor.writable = true;
+ Object.defineProperty(target, descriptor.key, descriptor);
+ }
+ }
+
+ function _createClass(Constructor, protoProps, staticProps) {
+ if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+ if (staticProps) _defineProperties(Constructor, staticProps);
+ return Constructor;
+ }
+
+ function _inherits(subClass, superClass) {
+ if (typeof superClass !== "function" && superClass !== null) {
+ throw new TypeError("Super expression must either be null or a function");
+ }
+
+ subClass.prototype = Object.create(superClass && superClass.prototype, {
+ constructor: {
+ value: subClass,
+ writable: true,
+ configurable: true
+ }
+ });
+ if (superClass) _setPrototypeOf(subClass, superClass);
+ }
+
+ function _getPrototypeOf(o) {
+ _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
+ return o.__proto__ || Object.getPrototypeOf(o);
+ };
+ return _getPrototypeOf(o);
+ }
+
+ function _setPrototypeOf(o, p) {
+ _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
+ o.__proto__ = p;
+ return o;
+ };
+
+ return _setPrototypeOf(o, p);
+ }
+
+ function _isNativeReflectConstruct() {
+ if (typeof Reflect === "undefined" || !Reflect.construct) return false;
+ if (Reflect.construct.sham) return false;
+ if (typeof Proxy === "function") return true;
+
+ try {
+ Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
+ return true;
+ } catch (e) {
+ return false;
+ }
+ }
+
+ function _construct(Parent, args, Class) {
+ if (_isNativeReflectConstruct()) {
+ _construct = Reflect.construct;
+ } else {
+ _construct = function _construct(Parent, args, Class) {
+ var a = [null];
+ a.push.apply(a, args);
+ var Constructor = Function.bind.apply(Parent, a);
+ var instance = new Constructor();
+ if (Class) _setPrototypeOf(instance, Class.prototype);
+ return instance;
+ };
+ }
+
+ return _construct.apply(null, arguments);
+ }
+
+ function _assertThisInitialized(self) {
+ if (self === void 0) {
+ throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+ }
+
+ return self;
+ }
+
+ function _possibleConstructorReturn(self, call) {
+ if (call && (typeof call === "object" || typeof call === "function")) {
+ return call;
+ }
+
+ return _assertThisInitialized(self);
+ }
+
+ function _createSuper(Derived) {
+ var hasNativeReflectConstruct = _isNativeReflectConstruct();
+
+ return function _createSuperInternal() {
+ var Super = _getPrototypeOf(Derived),
+ result;
+
+ if (hasNativeReflectConstruct) {
+ var NewTarget = _getPrototypeOf(this).constructor;
+
+ result = Reflect.construct(Super, arguments, NewTarget);
+ } else {
+ result = Super.apply(this, arguments);
+ }
+
+ return _possibleConstructorReturn(this, result);
+ };
+ }
+
+ function _superPropBase(object, property) {
+ while (!Object.prototype.hasOwnProperty.call(object, property)) {
+ object = _getPrototypeOf(object);
+ if (object === null) break;
+ }
+
+ return object;
+ }
+
+ function _get(target, property, receiver) {
+ if (typeof Reflect !== "undefined" && Reflect.get) {
+ _get = Reflect.get;
+ } else {
+ _get = function _get(target, property, receiver) {
+ var base = _superPropBase(target, property);
+
+ if (!base) return;
+ var desc = Object.getOwnPropertyDescriptor(base, property);
+
+ if (desc.get) {
+ return desc.get.call(receiver);
+ }
+
+ return desc.value;
+ };
+ }
+
+ return _get(target, property, receiver || target);
+ }
+
+ function _slicedToArray(arr, i) {
+ return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+ }
+
+ function _toConsumableArray(arr) {
+ return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
+ }
+
+ function _arrayWithoutHoles(arr) {
+ if (Array.isArray(arr)) return _arrayLikeToArray(arr);
+ }
+
+ function _arrayWithHoles(arr) {
+ if (Array.isArray(arr)) return arr;
+ }
+
+ function _iterableToArray(iter) {
+ if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter);
+ }
+
+ function _iterableToArrayLimit(arr, i) {
+ if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
+ var _arr = [];
+ var _n = true;
+ var _d = false;
+ var _e = undefined;
+
+ try {
+ for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
+ _arr.push(_s.value);
+
+ if (i && _arr.length === i) break;
+ }
+ } catch (err) {
+ _d = true;
+ _e = err;
+ } finally {
+ try {
+ if (!_n && _i["return"] != null) _i["return"]();
+ } finally {
+ if (_d) throw _e;
+ }
+ }
+
+ return _arr;
+ }
+
+ function _unsupportedIterableToArray(o, minLen) {
+ if (!o) return;
+ if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+ var n = Object.prototype.toString.call(o).slice(8, -1);
+ if (n === "Object" && o.constructor) n = o.constructor.name;
+ if (n === "Map" || n === "Set") return Array.from(o);
+ if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+ }
+
+ function _arrayLikeToArray(arr, len) {
+ if (len == null || len > arr.length) len = arr.length;
+
+ for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+
+ return arr2;
+ }
+
+ function _nonIterableSpread() {
+ throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+ }
+
+ function _nonIterableRest() {
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+ }
+
/**
* For parsing color values.
* @module RGBColor
@@ -8,7 +264,7 @@ var svgEditorExtension_server_moinsave = (function () {
* @see https://www.phpied.com/rgb-color-parser-in-javascript/
* @license MIT
*/
- const simpleColors = {
+ var simpleColors = {
aliceblue: 'f0f8ff',
antiquewhite: 'faebd7',
aqua: '00ffff',
@@ -154,43 +410,59 @@ var svgEditorExtension_server_moinsave = (function () {
yellowgreen: '9acd32'
}; // array of color definition objects
- const colorDefs = [{
+ var colorDefs = [{
re: /^rgb\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})\)$/,
// re: /^rgb\((?<r>\d{1,3}),\s*(?<g>\d{1,3}),\s*(?<b>\d{1,3})\)$/,
example: ['rgb(123, 234, 45)', 'rgb(255,234,245)'],
+ process: function process(_) {
+ for (var _len = arguments.length, bits = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+ bits[_key - 1] = arguments[_key];
+ }
- process(_, ...bits) {
- return bits.map(b => Number.parseInt(b));
+ return bits.map(function (b) {
+ return Number.parseInt(b);
+ });
}
-
}, {
re: /^(\w{2})(\w{2})(\w{2})$/,
// re: /^(?<r>\w{2})(?<g>\w{2})(?<b>\w{2})$/,
example: ['#00ff00', '336699'],
+ process: function process(_) {
+ for (var _len2 = arguments.length, bits = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
+ bits[_key2 - 1] = arguments[_key2];
+ }
- process(_, ...bits) {
- return bits.map(b => Number.parseInt(b, 16));
+ return bits.map(function (b) {
+ return Number.parseInt(b, 16);
+ });
}
-
}, {
re: /^(\w)(\w)(\w)$/,
// re: /^(?<r>\w{1})(?<g>\w{1})(?<b>\w{1})$/,
example: ['#fb0', 'f0f'],
+ process: function process(_) {
+ for (var _len3 = arguments.length, bits = new Array(_len3 > 1 ? _len3 - 1 : 0), _key3 = 1; _key3 < _len3; _key3++) {
+ bits[_key3 - 1] = arguments[_key3];
+ }
- process(_, ...bits) {
- return bits.map(b => Number.parseInt(b + b, 16));
+ return bits.map(function (b) {
+ return Number.parseInt(b + b, 16);
+ });
}
-
}];
/**
* A class to parse color values.
*/
- class RGBColor {
+ var RGBColor = /*#__PURE__*/function () {
/**
* @param {string} colorString
*/
- constructor(colorString) {
+ function RGBColor(colorString) {
+ var _this = this;
+
+ _classCallCheck(this, RGBColor);
+
this.ok = false; // strip any leading #
if (colorString.charAt(0) === '#') {
@@ -208,20 +480,24 @@ var svgEditorExtension_server_moinsave = (function () {
// search through the definitions to find a match
- colorDefs.forEach(({
- re,
- process: processor
- }) => {
- const bits = re.exec(colorString);
+ colorDefs.forEach(function (_ref) {
+ var re = _ref.re,
+ processor = _ref.process;
+ var bits = re.exec(colorString);
if (bits) {
- const [r, g, b] = processor(...bits);
- Object.assign(this, {
- r,
- g,
- b
+ var _processor = processor.apply(void 0, _toConsumableArray(bits)),
+ _processor2 = _slicedToArray(_processor, 3),
+ r = _processor2[0],
+ g = _processor2[1],
+ b = _processor2[2];
+
+ Object.assign(_this, {
+ r: r,
+ g: g,
+ b: b
});
- this.ok = true;
+ _this.ok = true;
}
}); // validate/cleanup values
@@ -235,81 +511,80 @@ var svgEditorExtension_server_moinsave = (function () {
*/
- toRGB() {
- return 'rgb(' + this.r + ', ' + this.g + ', ' + this.b + ')';
- }
- /**
- * @returns {string}
- */
-
-
- toHex() {
- let r = this.r.toString(16);
- let g = this.g.toString(16);
- let b = this.b.toString(16);
-
- if (r.length === 1) {
- r = '0' + r;
+ _createClass(RGBColor, [{
+ key: "toRGB",
+ value: function toRGB() {
+ return 'rgb(' + this.r + ', ' + this.g + ', ' + this.b + ')';
}
+ /**
+ * @returns {string}
+ */
- if (g.length === 1) {
- g = '0' + g;
- }
+ }, {
+ key: "toHex",
+ value: function toHex() {
+ var r = this.r.toString(16);
+ var g = this.g.toString(16);
+ var b = this.b.toString(16);
- if (b.length === 1) {
- b = '0' + b;
- }
-
- return '#' + r + g + b;
- }
- /**
- * Offers a bulleted list of help.
- * @returns {HTMLUListElement}
- */
-
-
- static getHelpXML() {
- const examples = [// add regexps
- ...colorDefs.flatMap(({
- example
- }) => {
- return example;
- }), // add type-in colors
- ...Object.keys(simpleColors)];
- const xml = document.createElement('ul');
- xml.setAttribute('id', 'rgbcolor-examples');
- xml.append(...examples.map(example => {
- try {
- const listItem = document.createElement('li');
- const listColor = new RGBColor(example);
- const exampleDiv = document.createElement('div');
- exampleDiv.style.cssText = `
- margin: 3px;
- border: 1px solid black;
- background: ${listColor.toHex()};
- color: ${listColor.toHex()};`;
- exampleDiv.append('test');
- const listItemValue = ` ${example} -> ${listColor.toRGB()} -> ${listColor.toHex()}`;
- listItem.append(exampleDiv, listItemValue);
- return listItem;
- } catch (e) {
- return '';
+ if (r.length === 1) {
+ r = '0' + r;
}
- }));
- return xml;
- }
- }
+ if (g.length === 1) {
+ g = '0' + g;
+ }
+
+ if (b.length === 1) {
+ b = '0' + b;
+ }
+
+ return '#' + r + g + b;
+ }
+ /**
+ * Offers a bulleted list of help.
+ * @returns {HTMLUListElement}
+ */
+
+ }], [{
+ key: "getHelpXML",
+ value: function getHelpXML() {
+ var examples = [].concat(_toConsumableArray(colorDefs.flatMap(function (_ref2) {
+ var example = _ref2.example;
+ return example;
+ })), _toConsumableArray(Object.keys(simpleColors)));
+ var xml = document.createElement('ul');
+ xml.setAttribute('id', 'rgbcolor-examples');
+ xml.append.apply(xml, _toConsumableArray(examples.map(function (example) {
+ try {
+ var listItem = document.createElement('li');
+ var listColor = new RGBColor(example);
+ var exampleDiv = document.createElement('div');
+ exampleDiv.style.cssText = "\n margin: 3px;\n border: 1px solid black;\n background: ".concat(listColor.toHex(), ";\n color: ").concat(listColor.toHex(), ";");
+ exampleDiv.append('test');
+ var listItemValue = " ".concat(example, " -> ").concat(listColor.toRGB(), " -> ").concat(listColor.toHex());
+ listItem.append(exampleDiv, listItemValue);
+ return listItem;
+ } catch (e) {
+ return '';
+ }
+ })));
+ return xml;
+ }
+ }]);
+
+ return RGBColor;
+ }();
function _typeof(obj) {
"@babel/helpers - typeof";
if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
- _typeof = function (obj) {
+ _typeof = function _typeof(obj) {
return typeof obj;
};
} else {
- _typeof = function (obj) {
+ _typeof = function _typeof(obj) {
return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
};
}
@@ -317,7 +592,7 @@ var svgEditorExtension_server_moinsave = (function () {
return _typeof(obj);
}
- function _classCallCheck(instance, Constructor) {
+ function _classCallCheck$1(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
@@ -634,7 +909,7 @@ var svgEditorExtension_server_moinsave = (function () {
* Set properties.
*/
function BlurStack() {
- _classCallCheck(this, BlurStack);
+ _classCallCheck$1(this, BlurStack);
this.r = 0;
this.g = 0;
@@ -643,14 +918,13 @@ var svgEditorExtension_server_moinsave = (function () {
this.next = null;
};
- /* eslint-disable new-cap, class-methods-use-this, jsdoc/require-jsdoc */
/**
* Whether a value is `null` or `undefined`.
* @param {any} val
* @returns {boolean}
*/
- const isNullish = val => {
+ var isNullish = function isNullish(val) {
return val === null || val === undefined;
};
/**
@@ -684,17 +958,17 @@ var svgEditorExtension_server_moinsave = (function () {
*/
- const canvg = function (target, s, opts) {
+ var canvg = function canvg(target, s, opts) {
// no parameters
if (isNullish(target) && isNullish(s) && isNullish(opts)) {
- const svgTags = document.querySelectorAll('svg');
- return Promise.all([...svgTags].map(svgTag => {
- const c = document.createElement('canvas');
+ var svgTags = document.querySelectorAll('svg');
+ return Promise.all(_toConsumableArray(svgTags).map(function (svgTag) {
+ var c = document.createElement('canvas');
c.width = svgTag.clientWidth;
c.height = svgTag.clientHeight;
svgTag.before(c);
svgTag.remove();
- const div = document.createElement('div');
+ var div = document.createElement('div');
div.append(svgTag);
return canvg(c, div.innerHTML);
}));
@@ -706,13 +980,13 @@ var svgEditorExtension_server_moinsave = (function () {
if (!isNullish(target.svg)) target.svg.stop();
- const svg = build(opts || {}); // on i.e. 8 for flash canvas, we can't assign the property so check for it
+ var svg = build(opts || {}); // on i.e. 8 for flash canvas, we can't assign the property so check for it
if (!(target.childNodes.length === 1 && target.childNodes[0].nodeName === 'OBJECT')) {
target.svg = svg;
}
- const ctx = target.getContext('2d');
+ var ctx = target.getContext('2d');
if (typeof s.documentElement !== 'undefined') {
// load from xml doc
@@ -737,8 +1011,8 @@ var svgEditorExtension_server_moinsave = (function () {
function build(opts) {
/* eslint-enable jsdoc/check-types */
- const svg = {
- opts
+ var svg = {
+ opts: opts
};
svg.FRAMERATE = 30;
svg.MAX_VIRTUAL_PIXELS = 30000;
@@ -756,7 +1030,7 @@ var svgEditorExtension_server_moinsave = (function () {
svg.init = function (ctx) {
- let uniqueId = 0;
+ var uniqueId = 0;
svg.UniqueId = function () {
uniqueId++;
@@ -770,48 +1044,42 @@ var svgEditorExtension_server_moinsave = (function () {
svg.ctx = ctx;
svg.ViewPort = {
viewPorts: [],
-
- Clear() {
+ Clear: function Clear() {
this.viewPorts = [];
},
-
- SetCurrent(width, height) {
+ SetCurrent: function SetCurrent(width, height) {
this.viewPorts.push({
- width,
- height
+ width: width,
+ height: height
});
},
-
- RemoveCurrent() {
+ RemoveCurrent: function RemoveCurrent() {
this.viewPorts.pop();
},
-
- Current() {
+ Current: function Current() {
return this.viewPorts[this.viewPorts.length - 1];
},
-
- width() {
+ width: function width() {
return this.Current().width;
},
-
- height() {
+ height: function height() {
return this.Current().height;
},
-
- ComputeSize(d) {
+ ComputeSize: function ComputeSize(d) {
if (!isNullish(d) && typeof d === 'number') return d;
if (d === 'x') return this.width();
if (d === 'y') return this.height();
- return Math.sqrt(this.width() ** 2 + this.height() ** 2) / Math.sqrt(2);
+ return Math.sqrt(Math.pow(this.width(), 2) + Math.pow(this.height(), 2)) / Math.sqrt(2);
}
-
};
};
svg.init(); // images loaded
svg.ImagesLoaded = function () {
- return svg.Images.every(img => img.loaded);
+ return svg.Images.every(function (img) {
+ return img.loaded;
+ });
}; // trim
@@ -827,13 +1095,13 @@ var svgEditorExtension_server_moinsave = (function () {
svg.ajax = function (url, asynch) {
- const AJAX = window.XMLHttpRequest ? new XMLHttpRequest() : new window.ActiveXObject('Microsoft.XMLHTTP');
+ var AJAX = window.XMLHttpRequest ? new XMLHttpRequest() : new window.ActiveXObject('Microsoft.XMLHTTP');
if (asynch) {
- return new Promise((resolve, reject) => {
+ return new Promise(function (resolve, reject) {
// eslint-disable-line promise/avoid-new
- const req = AJAX.open('GET', url, true);
- req.addEventListener('load', () => {
+ var req = AJAX.open('GET', url, true);
+ req.addEventListener('load', function () {
resolve(AJAX.responseText);
});
AJAX.send(null);
@@ -848,12 +1116,12 @@ var svgEditorExtension_server_moinsave = (function () {
svg.parseXml = function (xml) {
if (window.DOMParser) {
- const parser = new DOMParser();
+ var parser = new DOMParser();
return parser.parseFromString(xml, 'text/xml');
}
xml = xml.replace(/<!DOCTYPE svg[^>]*>/, '');
- const xmlDoc = new window.ActiveXObject('Microsoft.XMLDOM');
+ var xmlDoc = new window.ActiveXObject('Microsoft.XMLDOM');
xmlDoc.async = 'false';
xmlDoc.loadXML(xml);
return xmlDoc;
@@ -861,7 +1129,7 @@ var svgEditorExtension_server_moinsave = (function () {
// get the text baseline
- const textBaselineMapping = {
+ var textBaselineMapping = {
baseline: 'alphabetic',
'before-edge': 'top',
'text-before-edge': 'top',
@@ -874,210 +1142,231 @@ var svgEditorExtension_server_moinsave = (function () {
hanging: 'hanging',
mathematical: 'alphabetic'
};
- svg.Property = class Property {
- constructor(name, value) {
+
+ svg.Property = /*#__PURE__*/function () {
+ function Property(name, value) {
+ _classCallCheck(this, Property);
+
this.name = name;
this.value = value;
}
- getValue() {
- return this.value;
- }
-
- hasValue() {
- return !isNullish(this.value) && this.value !== '';
- } // return the numerical value of the property
-
-
- numValue() {
- if (!this.hasValue()) return 0;
- let n = Number.parseFloat(this.value);
-
- if (String(this.value).endsWith('%')) {
- n /= 100.0;
+ _createClass(Property, [{
+ key: "getValue",
+ value: function getValue() {
+ return this.value;
}
+ }, {
+ key: "hasValue",
+ value: function hasValue() {
+ return !isNullish(this.value) && this.value !== '';
+ } // return the numerical value of the property
- return n;
- }
+ }, {
+ key: "numValue",
+ value: function numValue() {
+ if (!this.hasValue()) return 0;
+ var n = Number.parseFloat(this.value);
- valueOrDefault(def) {
- if (this.hasValue()) return this.value;
- return def;
- }
-
- numValueOrDefault(def) {
- if (this.hasValue()) return this.numValue();
- return def;
- } // color extensions
- // augment the current color value with the opacity
-
-
- addOpacity(opacityProp) {
- let newValue = this.value;
-
- if (!isNullish(opacityProp.value) && opacityProp.value !== '' && typeof this.value === 'string') {
- // can only add opacity to colors, not patterns
- const color = new RGBColor(this.value);
-
- if (color.ok) {
- newValue = 'rgba(' + color.r + ', ' + color.g + ', ' + color.b + ', ' + opacityProp.numValue() + ')';
+ if (String(this.value).endsWith('%')) {
+ n /= 100.0;
}
+
+ return n;
}
-
- return new svg.Property(this.name, newValue);
- } // definition extensions
- // get the definition from the definitions table
-
-
- getDefinition() {
- let name = this.value.match(/#([^)'"]+)/);
-
- if (name) {
- name = name[1];
+ }, {
+ key: "valueOrDefault",
+ value: function valueOrDefault(def) {
+ if (this.hasValue()) return this.value;
+ return def;
}
+ }, {
+ key: "numValueOrDefault",
+ value: function numValueOrDefault(def) {
+ if (this.hasValue()) return this.numValue();
+ return def;
+ } // color extensions
+ // augment the current color value with the opacity
- if (!name) {
- name = this.value;
- }
+ }, {
+ key: "addOpacity",
+ value: function addOpacity(opacityProp) {
+ var newValue = this.value;
- return svg.Definitions[name];
- }
+ if (!isNullish(opacityProp.value) && opacityProp.value !== '' && typeof this.value === 'string') {
+ // can only add opacity to colors, not patterns
+ var color = new RGBColor(this.value);
- isUrlDefinition() {
- return this.value.startsWith('url(');
- }
-
- getFillStyleDefinition(e, opacityProp) {
- let def = this.getDefinition(); // gradient
-
- if (!isNullish(def) && def.createGradient) {
- return def.createGradient(svg.ctx, e, opacityProp);
- } // pattern
-
-
- if (!isNullish(def) && def.createPattern) {
- if (def.getHrefAttribute().hasValue()) {
- const pt = def.attribute('patternTransform');
- def = def.getHrefAttribute().getDefinition();
-
- if (pt.hasValue()) {
- def.attribute('patternTransform', true).value = pt.value;
+ if (color.ok) {
+ newValue = 'rgba(' + color.r + ', ' + color.g + ', ' + color.b + ', ' + opacityProp.numValue() + ')';
}
}
- return def.createPattern(svg.ctx, e);
+ return new svg.Property(this.name, newValue);
+ } // definition extensions
+ // get the definition from the definitions table
+
+ }, {
+ key: "getDefinition",
+ value: function getDefinition() {
+ var name = this.value.match(/#([^)'"]+)/);
+
+ if (name) {
+ name = name[1];
+ }
+
+ if (!name) {
+ name = this.value;
+ }
+
+ return svg.Definitions[name];
}
+ }, {
+ key: "isUrlDefinition",
+ value: function isUrlDefinition() {
+ return this.value.startsWith('url(');
+ }
+ }, {
+ key: "getFillStyleDefinition",
+ value: function getFillStyleDefinition(e, opacityProp) {
+ var def = this.getDefinition(); // gradient
- return null;
- } // length extensions
+ if (!isNullish(def) && def.createGradient) {
+ return def.createGradient(svg.ctx, e, opacityProp);
+ } // pattern
- getDPI(viewPort) {
- return 96.0; // TODO: compute?
- }
+ if (!isNullish(def) && def.createPattern) {
+ if (def.getHrefAttribute().hasValue()) {
+ var pt = def.attribute('patternTransform');
+ def = def.getHrefAttribute().getDefinition();
- getEM(viewPort) {
- let em = 12;
- const fontSize = new svg.Property('fontSize', svg.Font.Parse(svg.ctx.font).fontSize);
- if (fontSize.hasValue()) em = fontSize.toPixels(viewPort);
- return em;
- }
+ if (pt.hasValue()) {
+ def.attribute('patternTransform', true).value = pt.value;
+ }
+ }
- getUnits() {
- return String(this.value).replace(/[\d.-]/g, '');
- } // get the length as pixels
+ return def.createPattern(svg.ctx, e);
+ }
+ return null;
+ } // length extensions
- toPixels(viewPort, processPercent) {
- if (!this.hasValue()) return 0;
- const s = String(this.value);
- if (s.endsWith('em')) return this.numValue() * this.getEM(viewPort);
- if (s.endsWith('ex')) return this.numValue() * this.getEM(viewPort) / 2.0;
- if (s.endsWith('px')) return this.numValue();
- if (s.endsWith('pt')) return this.numValue() * this.getDPI(viewPort) * (1.0 / 72.0);
- if (s.endsWith('pc')) return this.numValue() * 15;
- if (s.endsWith('cm')) return this.numValue() * this.getDPI(viewPort) / 2.54;
- if (s.endsWith('mm')) return this.numValue() * this.getDPI(viewPort) / 25.4;
- if (s.endsWith('in')) return this.numValue() * this.getDPI(viewPort);
- if (s.endsWith('%')) return this.numValue() * svg.ViewPort.ComputeSize(viewPort);
- const n = this.numValue();
- if (processPercent && n < 1.0) return n * svg.ViewPort.ComputeSize(viewPort);
- return n;
- } // time extensions
- // get the time as milliseconds
+ }, {
+ key: "getDPI",
+ value: function getDPI(viewPort) {
+ return 96.0; // TODO: compute?
+ }
+ }, {
+ key: "getEM",
+ value: function getEM(viewPort) {
+ var em = 12;
+ var fontSize = new svg.Property('fontSize', svg.Font.Parse(svg.ctx.font).fontSize);
+ if (fontSize.hasValue()) em = fontSize.toPixels(viewPort);
+ return em;
+ }
+ }, {
+ key: "getUnits",
+ value: function getUnits() {
+ return String(this.value).replace(/[\d.-]/g, '');
+ } // get the length as pixels
+ }, {
+ key: "toPixels",
+ value: function toPixels(viewPort, processPercent) {
+ if (!this.hasValue()) return 0;
+ var s = String(this.value);
+ if (s.endsWith('em')) return this.numValue() * this.getEM(viewPort);
+ if (s.endsWith('ex')) return this.numValue() * this.getEM(viewPort) / 2.0;
+ if (s.endsWith('px')) return this.numValue();
+ if (s.endsWith('pt')) return this.numValue() * this.getDPI(viewPort) * (1.0 / 72.0);
+ if (s.endsWith('pc')) return this.numValue() * 15;
+ if (s.endsWith('cm')) return this.numValue() * this.getDPI(viewPort) / 2.54;
+ if (s.endsWith('mm')) return this.numValue() * this.getDPI(viewPort) / 25.4;
+ if (s.endsWith('in')) return this.numValue() * this.getDPI(viewPort);
+ if (s.endsWith('%')) return this.numValue() * svg.ViewPort.ComputeSize(viewPort);
+ var n = this.numValue();
+ if (processPercent && n < 1.0) return n * svg.ViewPort.ComputeSize(viewPort);
+ return n;
+ } // time extensions
+ // get the time as milliseconds
- toMilliseconds() {
- if (!this.hasValue()) return 0;
- const s = String(this.value);
- if (s.endsWith('ms')) return this.numValue();
- if (s.endsWith('s')) return this.numValue() * 1000;
- return this.numValue();
- } // angle extensions
- // get the angle as radians
+ }, {
+ key: "toMilliseconds",
+ value: function toMilliseconds() {
+ if (!this.hasValue()) return 0;
+ var s = String(this.value);
+ if (s.endsWith('ms')) return this.numValue();
+ if (s.endsWith('s')) return this.numValue() * 1000;
+ return this.numValue();
+ } // angle extensions
+ // get the angle as radians
+ }, {
+ key: "toRadians",
+ value: function toRadians() {
+ if (!this.hasValue()) return 0;
+ var s = String(this.value);
+ if (s.endsWith('deg')) return this.numValue() * (Math.PI / 180.0);
+ if (s.endsWith('grad')) return this.numValue() * (Math.PI / 200.0);
+ if (s.endsWith('rad')) return this.numValue();
+ return this.numValue() * (Math.PI / 180.0);
+ }
+ }, {
+ key: "toTextBaseline",
+ value: function toTextBaseline() {
+ if (!this.hasValue()) return null;
+ return textBaselineMapping[this.value];
+ }
+ }]);
- toRadians() {
- if (!this.hasValue()) return 0;
- const s = String(this.value);
- if (s.endsWith('deg')) return this.numValue() * (Math.PI / 180.0);
- if (s.endsWith('grad')) return this.numValue() * (Math.PI / 200.0);
- if (s.endsWith('rad')) return this.numValue();
- return this.numValue() * (Math.PI / 180.0);
- }
+ return Property;
+ }(); // fonts
- toTextBaseline() {
- if (!this.hasValue()) return null;
- return textBaselineMapping[this.value];
- }
-
- }; // fonts
svg.Font = {
Styles: 'normal|italic|oblique|inherit',
Variants: 'normal|small-caps|inherit',
Weights: 'normal|bold|bolder|lighter|100|200|300|400|500|600|700|800|900|inherit',
-
- CreateFont(fontStyle, fontVariant, fontWeight, fontSize, fontFamily, inherit) {
- const f = !isNullish(inherit) ? this.Parse(inherit) : this.CreateFont('', '', '', '', '', svg.ctx.font);
+ CreateFont: function CreateFont(fontStyle, fontVariant, fontWeight, fontSize, fontFamily, inherit) {
+ var f = !isNullish(inherit) ? this.Parse(inherit) : this.CreateFont('', '', '', '', '', svg.ctx.font);
return {
fontFamily: fontFamily || f.fontFamily,
fontSize: fontSize || f.fontSize,
fontStyle: fontStyle || f.fontStyle,
fontWeight: fontWeight || f.fontWeight,
fontVariant: fontVariant || f.fontVariant,
-
- toString() {
+ toString: function toString() {
return [this.fontStyle, this.fontVariant, this.fontWeight, this.fontSize, this.fontFamily].join(' ');
}
-
};
},
+ Parse: function Parse(s) {
+ var _this = this;
- Parse(s) {
- const f = {};
- const ds = svg.trim(svg.compressSpaces(s || '')).split(' ');
- const set = {
+ var f = {};
+ var ds = svg.trim(svg.compressSpaces(s || '')).split(' ');
+ var set = {
fontSize: false,
fontStyle: false,
fontWeight: false,
fontVariant: false
};
- let ff = '';
- ds.forEach(d => {
- if (!set.fontStyle && this.Styles.includes(d)) {
+ var ff = '';
+ ds.forEach(function (d) {
+ if (!set.fontStyle && _this.Styles.includes(d)) {
if (d !== 'inherit') {
f.fontStyle = d;
}
set.fontStyle = true;
- } else if (!set.fontVariant && this.Variants.includes(d)) {
+ } else if (!set.fontVariant && _this.Variants.includes(d)) {
if (d !== 'inherit') {
f.fontVariant = d;
}
set.fontStyle = set.fontVariant = true;
- } else if (!set.fontWeight && this.Weights.includes(d)) {
+ } else if (!set.fontWeight && _this.Weights.includes(d)) {
if (d !== 'inherit') {
f.fontWeight = d;
}
@@ -1100,43 +1389,51 @@ var svgEditorExtension_server_moinsave = (function () {
return f;
}
-
}; // points and paths
svg.ToNumberArray = function (s) {
- const a = svg.trim(svg.compressSpaces((s || '').replace(/,/g, ' '))).split(' ');
- return a.map(_a => Number.parseFloat(_a));
+ var a = svg.trim(svg.compressSpaces((s || '').replace(/,/g, ' '))).split(' ');
+ return a.map(function (_a) {
+ return Number.parseFloat(_a);
+ });
};
- svg.Point = class {
- constructor(x, y) {
+ svg.Point = /*#__PURE__*/function () {
+ function _class(x, y) {
+ _classCallCheck(this, _class);
+
this.x = x;
this.y = y;
}
- angleTo(p) {
- return Math.atan2(p.y - this.y, p.x - this.x);
- }
+ _createClass(_class, [{
+ key: "angleTo",
+ value: function angleTo(p) {
+ return Math.atan2(p.y - this.y, p.x - this.x);
+ }
+ }, {
+ key: "applyTransform",
+ value: function applyTransform(v) {
+ var xp = this.x * v[0] + this.y * v[2] + v[4];
+ var yp = this.x * v[1] + this.y * v[3] + v[5];
+ this.x = xp;
+ this.y = yp;
+ }
+ }]);
- applyTransform(v) {
- const xp = this.x * v[0] + this.y * v[2] + v[4];
- const yp = this.x * v[1] + this.y * v[3] + v[5];
- this.x = xp;
- this.y = yp;
- }
-
- };
+ return _class;
+ }();
svg.CreatePoint = function (s) {
- const a = svg.ToNumberArray(s);
+ var a = svg.ToNumberArray(s);
return new svg.Point(a[0], a[1]);
};
svg.CreatePath = function (s) {
- const a = svg.ToNumberArray(s);
- const path = [];
+ var a = svg.ToNumberArray(s);
+ var path = [];
- for (let i = 0; i < a.length; i += 2) {
+ for (var i = 0; i < a.length; i += 2) {
path.push(new svg.Point(a[i], a[i + 1]));
}
@@ -1144,8 +1441,10 @@ var svgEditorExtension_server_moinsave = (function () {
}; // bounding box
- svg.BoundingBox = class {
- constructor(x1, y1, x2, y2) {
+ svg.BoundingBox = /*#__PURE__*/function () {
+ function _class2(x1, y1, x2, y2) {
+ _classCallCheck(this, _class2);
+
// pass in initial points if you want
this.x1 = Number.NaN;
this.y1 = Number.NaN;
@@ -1155,273 +1454,333 @@ var svgEditorExtension_server_moinsave = (function () {
this.addPoint(x2, y2);
}
- x() {
- return this.x1;
- }
+ _createClass(_class2, [{
+ key: "x",
+ value: function x() {
+ return this.x1;
+ }
+ }, {
+ key: "y",
+ value: function y() {
+ return this.y1;
+ }
+ }, {
+ key: "width",
+ value: function width() {
+ return this.x2 - this.x1;
+ }
+ }, {
+ key: "height",
+ value: function height() {
+ return this.y2 - this.y1;
+ }
+ }, {
+ key: "addPoint",
+ value: function addPoint(x, y) {
+ if (!isNullish(x)) {
+ if (isNaN(this.x1) || isNaN(this.x2)) {
+ this.x1 = x;
+ this.x2 = x;
+ }
- y() {
- return this.y1;
- }
-
- width() {
- return this.x2 - this.x1;
- }
-
- height() {
- return this.y2 - this.y1;
- }
-
- addPoint(x, y) {
- if (!isNullish(x)) {
- if (isNaN(this.x1) || isNaN(this.x2)) {
- this.x1 = x;
- this.x2 = x;
+ if (x < this.x1) this.x1 = x;
+ if (x > this.x2) this.x2 = x;
}
- if (x < this.x1) this.x1 = x;
- if (x > this.x2) this.x2 = x;
- }
+ if (!isNullish(y)) {
+ if (isNaN(this.y1) || isNaN(this.y2)) {
+ this.y1 = y;
+ this.y2 = y;
+ }
- if (!isNullish(y)) {
- if (isNaN(this.y1) || isNaN(this.y2)) {
- this.y1 = y;
- this.y2 = y;
+ if (y < this.y1) this.y1 = y;
+ if (y > this.y2) this.y2 = y;
}
-
- if (y < this.y1) this.y1 = y;
- if (y > this.y2) this.y2 = y;
}
- }
+ }, {
+ key: "addX",
+ value: function addX(x) {
+ this.addPoint(x, null);
+ }
+ }, {
+ key: "addY",
+ value: function addY(y) {
+ this.addPoint(null, y);
+ }
+ }, {
+ key: "addBoundingBox",
+ value: function addBoundingBox(bb) {
+ this.addPoint(bb.x1, bb.y1);
+ this.addPoint(bb.x2, bb.y2);
+ }
+ }, {
+ key: "addQuadraticCurve",
+ value: function addQuadraticCurve(p0x, p0y, p1x, p1y, p2x, p2y) {
+ var cp1x = p0x + 2 / 3 * (p1x - p0x); // CP1 = QP0 + 2/3 *(QP1-QP0)
- addX(x) {
- this.addPoint(x, null);
- }
+ var cp1y = p0y + 2 / 3 * (p1y - p0y); // CP1 = QP0 + 2/3 *(QP1-QP0)
- addY(y) {
- this.addPoint(null, y);
- }
+ var cp2x = cp1x + 1 / 3 * (p2x - p0x); // CP2 = CP1 + 1/3 *(QP2-QP0)
- addBoundingBox(bb) {
- this.addPoint(bb.x1, bb.y1);
- this.addPoint(bb.x2, bb.y2);
- }
+ var cp2y = cp1y + 1 / 3 * (p2y - p0y); // CP2 = CP1 + 1/3 *(QP2-QP0)
- addQuadraticCurve(p0x, p0y, p1x, p1y, p2x, p2y) {
- const cp1x = p0x + 2 / 3 * (p1x - p0x); // CP1 = QP0 + 2/3 *(QP1-QP0)
+ this.addBezierCurve(p0x, p0y, cp1x, cp2x, cp1y, cp2y, p2x, p2y);
+ }
+ }, {
+ key: "addBezierCurve",
+ value: function addBezierCurve(p0x, p0y, p1x, p1y, p2x, p2y, p3x, p3y) {
+ var _this2 = this;
- const cp1y = p0y + 2 / 3 * (p1y - p0y); // CP1 = QP0 + 2/3 *(QP1-QP0)
-
- const cp2x = cp1x + 1 / 3 * (p2x - p0x); // CP2 = CP1 + 1/3 *(QP2-QP0)
-
- const cp2y = cp1y + 1 / 3 * (p2y - p0y); // CP2 = CP1 + 1/3 *(QP2-QP0)
-
- this.addBezierCurve(p0x, p0y, cp1x, cp2x, cp1y, cp2y, p2x, p2y);
- }
-
- addBezierCurve(p0x, p0y, p1x, p1y, p2x, p2y, p3x, p3y) {
- // from http://blog.hackers-cafe.net/2009/06/how-to-calculate-bezier-curves-bounding.html
- const p0 = [p0x, p0y],
+ // from http://blog.hackers-cafe.net/2009/06/how-to-calculate-bezier-curves-bounding.html
+ var p0 = [p0x, p0y],
p1 = [p1x, p1y],
p2 = [p2x, p2y],
p3 = [p3x, p3y];
- this.addPoint(p0[0], p0[1]);
- this.addPoint(p3[0], p3[1]);
+ this.addPoint(p0[0], p0[1]);
+ this.addPoint(p3[0], p3[1]);
- for (let i = 0; i <= 1; i++) {
- const f = function (t) {
- return (1 - t) ** 3 * p0[i] + 3 * (1 - t) ** 2 * t * p1[i] + 3 * (1 - t) * t ** 2 * p2[i] + t ** 3 * p3[i];
+ var _loop = function _loop(i) {
+ var f = function f(t) {
+ return Math.pow(1 - t, 3) * p0[i] + 3 * Math.pow(1 - t, 2) * t * p1[i] + 3 * (1 - t) * Math.pow(t, 2) * p2[i] + Math.pow(t, 3) * p3[i];
+ };
+
+ var b = 6 * p0[i] - 12 * p1[i] + 6 * p2[i];
+ var a = -3 * p0[i] + 9 * p1[i] - 9 * p2[i] + 3 * p3[i];
+ var c = 3 * p1[i] - 3 * p0[i];
+
+ if (a === 0) {
+ if (b === 0) return "continue";
+ var t = -c / b;
+
+ if (t > 0 && t < 1) {
+ if (i === 0) _this2.addX(f(t));
+ if (i === 1) _this2.addY(f(t));
+ }
+
+ return "continue";
+ }
+
+ var b2ac = Math.pow(b, 2) - 4 * c * a;
+ if (b2ac < 0) return "continue";
+ var t1 = (-b + Math.sqrt(b2ac)) / (2 * a);
+
+ if (t1 > 0 && t1 < 1) {
+ if (i === 0) _this2.addX(f(t1));
+ if (i === 1) _this2.addY(f(t1));
+ }
+
+ var t2 = (-b - Math.sqrt(b2ac)) / (2 * a);
+
+ if (t2 > 0 && t2 < 1) {
+ if (i === 0) _this2.addX(f(t2));
+ if (i === 1) _this2.addY(f(t2));
+ }
};
- const b = 6 * p0[i] - 12 * p1[i] + 6 * p2[i];
- const a = -3 * p0[i] + 9 * p1[i] - 9 * p2[i] + 3 * p3[i];
- const c = 3 * p1[i] - 3 * p0[i];
+ for (var i = 0; i <= 1; i++) {
+ var _ret = _loop(i);
- if (a === 0) {
- if (b === 0) continue;
- const t = -c / b;
-
- if (t > 0 && t < 1) {
- if (i === 0) this.addX(f(t));
- if (i === 1) this.addY(f(t));
- }
-
- continue;
- }
-
- const b2ac = b ** 2 - 4 * c * a;
- if (b2ac < 0) continue;
- const t1 = (-b + Math.sqrt(b2ac)) / (2 * a);
-
- if (t1 > 0 && t1 < 1) {
- if (i === 0) this.addX(f(t1));
- if (i === 1) this.addY(f(t1));
- }
-
- const t2 = (-b - Math.sqrt(b2ac)) / (2 * a);
-
- if (t2 > 0 && t2 < 1) {
- if (i === 0) this.addX(f(t2));
- if (i === 1) this.addY(f(t2));
+ if (_ret === "continue") continue;
}
}
- }
+ }, {
+ key: "isPointInBox",
+ value: function isPointInBox(x, y) {
+ return this.x1 <= x && x <= this.x2 && this.y1 <= y && y <= this.y2;
+ }
+ }]);
- isPointInBox(x, y) {
- return this.x1 <= x && x <= this.x2 && this.y1 <= y && y <= this.y2;
- }
+ return _class2;
+ }(); // transforms
- }; // transforms
- svg.Transform = class {
- constructor(v) {
+ svg.Transform = /*#__PURE__*/function () {
+ function _class3(v) {
+ var _this6 = this;
+
+ _classCallCheck(this, _class3);
+
this.Type = {
- translate: class {
- constructor(s) {
- this.p = svg.CreatePoint(s);
+ translate: function translate(s) {
+ _classCallCheck(this, translate);
- this.apply = function (ctx) {
- ctx.translate(this.p.x || 0.0, this.p.y || 0.0);
- };
+ this.p = svg.CreatePoint(s);
- this.unapply = function (ctx) {
- ctx.translate(-1.0 * this.p.x || 0.0, -1.0 * this.p.y || 0.0);
- };
+ this.apply = function (ctx) {
+ ctx.translate(this.p.x || 0.0, this.p.y || 0.0);
+ };
- this.applyToPoint = function (p) {
- p.applyTransform([1, 0, 0, 1, this.p.x || 0.0, this.p.y || 0.0]);
- };
- }
+ this.unapply = function (ctx) {
+ ctx.translate(-1.0 * this.p.x || 0.0, -1.0 * this.p.y || 0.0);
+ };
+ this.applyToPoint = function (p) {
+ p.applyTransform([1, 0, 0, 1, this.p.x || 0.0, this.p.y || 0.0]);
+ };
},
- rotate: class {
- constructor(s) {
- const a = svg.ToNumberArray(s);
- this.angle = new svg.Property('angle', a[0]);
- this.cx = a[1] || 0;
- this.cy = a[2] || 0;
+ rotate: function rotate(s) {
+ _classCallCheck(this, rotate);
- this.apply = function (ctx) {
- ctx.translate(this.cx, this.cy);
- ctx.rotate(this.angle.toRadians());
- ctx.translate(-this.cx, -this.cy);
- };
+ var a = svg.ToNumberArray(s);
+ this.angle = new svg.Property('angle', a[0]);
+ this.cx = a[1] || 0;
+ this.cy = a[2] || 0;
- this.unapply = function (ctx) {
- ctx.translate(this.cx, this.cy);
- ctx.rotate(-1.0 * this.angle.toRadians());
- ctx.translate(-this.cx, -this.cy);
- };
+ this.apply = function (ctx) {
+ ctx.translate(this.cx, this.cy);
+ ctx.rotate(this.angle.toRadians());
+ ctx.translate(-this.cx, -this.cy);
+ };
- this.applyToPoint = function (p) {
- const _a = this.angle.toRadians();
+ this.unapply = function (ctx) {
+ ctx.translate(this.cx, this.cy);
+ ctx.rotate(-1.0 * this.angle.toRadians());
+ ctx.translate(-this.cx, -this.cy);
+ };
- p.applyTransform([1, 0, 0, 1, this.p.x || 0.0, this.p.y || 0.0]);
- p.applyTransform([Math.cos(_a), Math.sin(_a), -Math.sin(_a), Math.cos(_a), 0, 0]);
- p.applyTransform([1, 0, 0, 1, -this.p.x || 0.0, -this.p.y || 0.0]);
- };
- }
+ this.applyToPoint = function (p) {
+ var _a = this.angle.toRadians();
+ p.applyTransform([1, 0, 0, 1, this.p.x || 0.0, this.p.y || 0.0]);
+ p.applyTransform([Math.cos(_a), Math.sin(_a), -Math.sin(_a), Math.cos(_a), 0, 0]);
+ p.applyTransform([1, 0, 0, 1, -this.p.x || 0.0, -this.p.y || 0.0]);
+ };
},
- scale: class {
- constructor(s) {
- this.p = svg.CreatePoint(s);
+ scale: function scale(s) {
+ _classCallCheck(this, scale);
- this.apply = function (ctx) {
- ctx.scale(this.p.x || 1.0, this.p.y || this.p.x || 1.0);
- };
+ this.p = svg.CreatePoint(s);
- this.unapply = function (ctx) {
- ctx.scale(1.0 / this.p.x || 1.0, 1.0 / this.p.y || this.p.x || 1.0);
- };
+ this.apply = function (ctx) {
+ ctx.scale(this.p.x || 1.0, this.p.y || this.p.x || 1.0);
+ };
- this.applyToPoint = function (p) {
- p.applyTransform([this.p.x || 0.0, 0, 0, this.p.y || 0.0, 0, 0]);
- };
- }
+ this.unapply = function (ctx) {
+ ctx.scale(1.0 / this.p.x || 1.0, 1.0 / this.p.y || this.p.x || 1.0);
+ };
+ this.applyToPoint = function (p) {
+ p.applyTransform([this.p.x || 0.0, 0, 0, this.p.y || 0.0, 0, 0]);
+ };
},
- matrix: class {
- constructor(s) {
- this.m = svg.ToNumberArray(s);
+ matrix: function matrix(s) {
+ _classCallCheck(this, matrix);
- this.apply = function (ctx) {
- ctx.transform(this.m[0], this.m[1], this.m[2], this.m[3], this.m[4], this.m[5]);
- };
+ this.m = svg.ToNumberArray(s);
- this.applyToPoint = function (p) {
- p.applyTransform(this.m);
- };
- }
+ this.apply = function (ctx) {
+ ctx.transform(this.m[0], this.m[1], this.m[2], this.m[3], this.m[4], this.m[5]);
+ };
+ this.applyToPoint = function (p) {
+ p.applyTransform(this.m);
+ };
}
};
Object.assign(this.Type, {
- SkewBase: class extends this.Type.matrix {
- constructor(s) {
- super(s);
- this.angle = new svg.Property('angle', s);
+ SkewBase: /*#__PURE__*/function (_this$Type$matrix) {
+ _inherits(SkewBase, _this$Type$matrix);
+
+ var _super = _createSuper(SkewBase);
+
+ function SkewBase(s) {
+ var _this3;
+
+ _classCallCheck(this, SkewBase);
+
+ _this3 = _super.call(this, s);
+ _this3.angle = new svg.Property('angle', s);
+ return _this3;
}
- }
+ return SkewBase;
+ }(this.Type.matrix)
});
Object.assign(this.Type, {
- skewX: class extends this.Type.SkewBase {
- constructor(s) {
- super(s);
- this.m = [1, 0, Math.tan(this.angle.toRadians()), 1, 0, 0];
+ skewX: /*#__PURE__*/function (_this$Type$SkewBase) {
+ _inherits(skewX, _this$Type$SkewBase);
+
+ var _super2 = _createSuper(skewX);
+
+ function skewX(s) {
+ var _this4;
+
+ _classCallCheck(this, skewX);
+
+ _this4 = _super2.call(this, s);
+ _this4.m = [1, 0, Math.tan(_this4.angle.toRadians()), 1, 0, 0];
+ return _this4;
}
- },
- skewY: class extends this.Type.SkewBase {
- constructor(s) {
- super(s);
- this.m = [1, Math.tan(this.angle.toRadians()), 0, 1, 0, 0];
+ return skewX;
+ }(this.Type.SkewBase),
+ skewY: /*#__PURE__*/function (_this$Type$SkewBase2) {
+ _inherits(skewY, _this$Type$SkewBase2);
+
+ var _super3 = _createSuper(skewY);
+
+ function skewY(s) {
+ var _this5;
+
+ _classCallCheck(this, skewY);
+
+ _this5 = _super3.call(this, s);
+ _this5.m = [1, Math.tan(_this5.angle.toRadians()), 0, 1, 0, 0];
+ return _this5;
}
- }
+ return skewY;
+ }(this.Type.SkewBase)
});
- const data = svg.trim(svg.compressSpaces(v)).replace(/\)([a-zA-Z])/g, ') $1').replace(/\)(\s?,\s?)/g, ') ').split(/\s(?=[a-z])/);
- this.transforms = data.map(d => {
- const type = svg.trim(d.split('(')[0]);
- const s = d.split('(')[1].replace(')', '');
- const transform = new this.Type[type](s);
+ var data = svg.trim(svg.compressSpaces(v)).replace(/\)([a-zA-Z])/g, ') $1').replace(/\)(\s?,\s?)/g, ') ').split(/\s(?=[a-z])/);
+ this.transforms = data.map(function (d) {
+ var type = svg.trim(d.split('(')[0]);
+ var s = d.split('(')[1].replace(')', '');
+ var transform = new _this6.Type[type](s);
transform.type = type;
return transform;
});
}
- apply(ctx) {
- this.transforms.forEach(transform => {
- transform.apply(ctx);
- });
- }
-
- unapply(ctx) {
- for (let i = this.transforms.length - 1; i >= 0; i--) {
- this.transforms[i].unapply(ctx);
+ _createClass(_class3, [{
+ key: "apply",
+ value: function apply(ctx) {
+ this.transforms.forEach(function (transform) {
+ transform.apply(ctx);
+ });
}
- }
+ }, {
+ key: "unapply",
+ value: function unapply(ctx) {
+ for (var i = this.transforms.length - 1; i >= 0; i--) {
+ this.transforms[i].unapply(ctx);
+ }
+ }
+ }, {
+ key: "applyToPoint",
+ value: function applyToPoint(p) {
+ this.transforms.forEach(function (transform) {
+ transform.applyToPoint(p);
+ });
+ }
+ }]);
- applyToPoint(p) {
- this.transforms.forEach(transform => {
- transform.applyToPoint(p);
- });
- }
+ return _class3;
+ }(); // aspect ratio
- }; // aspect ratio
svg.AspectRatio = function (ctx, aspectRatio, width, desiredWidth, height, desiredHeight, minX, minY, refX, refY) {
// aspect ratio - https://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute
aspectRatio = svg.compressSpaces(aspectRatio);
aspectRatio = aspectRatio.replace(/^defer\s/, ''); // ignore defer
- const align = aspectRatio.split(' ')[0] || 'xMidYMid';
- const meetOrSlice = aspectRatio.split(' ')[1] || 'meet'; // calculate scale
+ var align = aspectRatio.split(' ')[0] || 'xMidYMid';
+ var meetOrSlice = aspectRatio.split(' ')[1] || 'meet'; // calculate scale
- const scaleX = width / desiredWidth;
- const scaleY = height / desiredHeight;
- const scaleMin = Math.min(scaleX, scaleY);
- const scaleMax = Math.max(scaleX, scaleY);
+ var scaleX = width / desiredWidth;
+ var scaleY = height / desiredHeight;
+ var scaleMin = Math.min(scaleX, scaleY);
+ var scaleMax = Math.max(scaleX, scaleY);
if (meetOrSlice === 'meet') {
desiredWidth *= scaleMin;
@@ -1455,8 +1814,13 @@ var svgEditorExtension_server_moinsave = (function () {
svg.Element = {};
svg.EmptyProperty = new svg.Property('EMPTY', '');
- svg.Element.ElementBase = class {
- constructor(node) {
+
+ svg.Element.ElementBase = /*#__PURE__*/function () {
+ function _class4(node) {
+ var _this7 = this;
+
+ _classCallCheck(this, _class4);
+
// Argument from inheriting class
this.captureTextNodes = arguments[1]; // eslint-disable-line prefer-rest-params
@@ -1467,52 +1831,67 @@ var svgEditorExtension_server_moinsave = (function () {
if (!isNullish(node) && node.nodeType === 1) {
// ELEMENT_NODE
// add children
- [...node.childNodes].forEach(childNode => {
+ _toConsumableArray(node.childNodes).forEach(function (childNode) {
if (childNode.nodeType === 1) {
- this.addChild(childNode, true); // ELEMENT_NODE
+ _this7.addChild(childNode, true); // ELEMENT_NODE
+
}
- if (this.captureTextNodes && (childNode.nodeType === 3 || childNode.nodeType === 4)) {
- const text = childNode.nodeValue || childNode.text || '';
+ if (_this7.captureTextNodes && (childNode.nodeType === 3 || childNode.nodeType === 4)) {
+ var text = childNode.nodeValue || childNode.text || '';
if (svg.trim(svg.compressSpaces(text)) !== '') {
- this.addChild(new svg.Element.tspan(childNode), false); // TEXT_NODE
+ _this7.addChild(new svg.Element.tspan(childNode), false); // TEXT_NODE
+
}
}
}); // add attributes
- [...node.attributes].forEach(({
- nodeName,
- nodeValue
- }) => {
- this.attributes[nodeName] = new svg.Property(nodeName, nodeValue);
+
+ _toConsumableArray(node.attributes).forEach(function (_ref) {
+ var nodeName = _ref.nodeName,
+ nodeValue = _ref.nodeValue;
+ _this7.attributes[nodeName] = new svg.Property(nodeName, nodeValue);
}); // add tag styles
- let styles = svg.Styles[node.nodeName];
+
+ var styles = svg.Styles[node.nodeName];
if (!isNullish(styles)) {
- Object.entries(styles).forEach(([name, styleValue]) => {
- this.styles[name] = styleValue;
+ Object.entries(styles).forEach(function (_ref2) {
+ var _ref3 = _slicedToArray(_ref2, 2),
+ name = _ref3[0],
+ styleValue = _ref3[1];
+
+ _this7.styles[name] = styleValue;
});
} // add class styles
if (this.attribute('class').hasValue()) {
- const classes = svg.compressSpaces(this.attribute('class').value).split(' ');
- classes.forEach(clss => {
+ var classes = svg.compressSpaces(this.attribute('class').value).split(' ');
+ classes.forEach(function (clss) {
styles = svg.Styles['.' + clss];
if (!isNullish(styles)) {
- Object.entries(styles).forEach(([name, styleValue]) => {
- this.styles[name] = styleValue;
+ Object.entries(styles).forEach(function (_ref4) {
+ var _ref5 = _slicedToArray(_ref4, 2),
+ name = _ref5[0],
+ styleValue = _ref5[1];
+
+ _this7.styles[name] = styleValue;
});
}
styles = svg.Styles[node.nodeName + '.' + clss];
if (!isNullish(styles)) {
- Object.entries(styles).forEach(([name, styleValue]) => {
- this.styles[name] = styleValue;
+ Object.entries(styles).forEach(function (_ref6) {
+ var _ref7 = _slicedToArray(_ref6, 2),
+ name = _ref7[0],
+ styleValue = _ref7[1];
+
+ _this7.styles[name] = styleValue;
});
}
});
@@ -1520,28 +1899,32 @@ var svgEditorExtension_server_moinsave = (function () {
if (this.attribute('id').hasValue()) {
- const _styles = svg.Styles['#' + this.attribute('id').value];
+ var _styles = svg.Styles['#' + this.attribute('id').value];
if (!isNullish(_styles)) {
- Object.entries(_styles).forEach(([name, styleValue]) => {
- this.styles[name] = styleValue;
+ Object.entries(_styles).forEach(function (_ref8) {
+ var _ref9 = _slicedToArray(_ref8, 2),
+ name = _ref9[0],
+ styleValue = _ref9[1];
+
+ _this7.styles[name] = styleValue;
});
}
} // add inline styles
if (this.attribute('style').hasValue()) {
- const _styles = this.attribute('style').value.split(';');
+ var _styles2 = this.attribute('style').value.split(';');
- _styles.forEach(style => {
+ _styles2.forEach(function (style) {
if (svg.trim(style) !== '') {
- let {
- name,
- value
- } = style.split(':');
+ var _style$split = style.split(':'),
+ name = _style$split.name,
+ value = _style$split.value;
+
name = svg.trim(name);
value = svg.trim(value);
- this.styles[name] = new svg.Property(name, value);
+ _this7.styles[name] = new svg.Property(name, value);
}
});
} // add id
@@ -1556,474 +1939,641 @@ var svgEditorExtension_server_moinsave = (function () {
} // get or create attribute
- attribute(name, createIfNotExists) {
- let a = this.attributes[name];
- if (!isNullish(a)) return a;
+ _createClass(_class4, [{
+ key: "attribute",
+ value: function attribute(name, createIfNotExists) {
+ var a = this.attributes[name];
+ if (!isNullish(a)) return a;
- if (createIfNotExists === true) {
- a = new svg.Property(name, '');
- this.attributes[name] = a;
- }
-
- return a || svg.EmptyProperty;
- }
-
- getHrefAttribute() {
- for (const a in this.attributes) {
- if (a.endsWith(':href')) {
- return this.attributes[a];
+ if (createIfNotExists === true) {
+ a = new svg.Property(name, '');
+ this.attributes[name] = a;
}
+
+ return a || svg.EmptyProperty;
}
-
- return svg.EmptyProperty;
- } // get or create style, crawls up node tree
-
-
- style(name, createIfNotExists, skipAncestors) {
- let s = this.styles[name];
- if (!isNullish(s)) return s;
- const a = this.attribute(name);
-
- if (!isNullish(a) && a.hasValue()) {
- this.styles[name] = a; // move up to me to cache
-
- return a;
- }
-
- if (skipAncestors !== true) {
- const p = this.parent;
-
- if (!isNullish(p)) {
- const ps = p.style(name);
-
- if (!isNullish(ps) && ps.hasValue()) {
- return ps;
+ }, {
+ key: "getHrefAttribute",
+ value: function getHrefAttribute() {
+ for (var a in this.attributes) {
+ if (a.endsWith(':href')) {
+ return this.attributes[a];
}
}
- }
- if (createIfNotExists === true) {
- s = new svg.Property(name, '');
- this.styles[name] = s;
- }
+ return svg.EmptyProperty;
+ } // get or create style, crawls up node tree
- return s || svg.EmptyProperty;
- } // base render
+ }, {
+ key: "style",
+ value: function style(name, createIfNotExists, skipAncestors) {
+ var s = this.styles[name];
+ if (!isNullish(s)) return s;
+ var a = this.attribute(name);
+ if (!isNullish(a) && a.hasValue()) {
+ this.styles[name] = a; // move up to me to cache
- render(ctx) {
- // don't render display=none
- if (this.style('display').value === 'none') return; // don't render visibility=hidden
-
- if (this.style('visibility').value === 'hidden') return;
- ctx.save();
-
- if (this.attribute('mask').hasValue()) {
- // mask
- const mask = this.attribute('mask').getDefinition();
- if (!isNullish(mask)) mask.apply(ctx, this);
- } else if (this.style('filter').hasValue()) {
- // filter
- const filter = this.style('filter').getDefinition();
- if (!isNullish(filter)) filter.apply(ctx, this);
- } else {
- this.setContext(ctx);
- this.renderChildren(ctx);
- this.clearContext(ctx);
- }
-
- ctx.restore();
- } // base set context
-
-
- setContext(ctx) {// OVERRIDE ME!
- } // base clear context
-
-
- clearContext(ctx) {// OVERRIDE ME!
- } // base render children
-
-
- renderChildren(ctx) {
- this.children.forEach(child => {
- child.render(ctx);
- });
- }
-
- addChild(childNode, create) {
- const child = create ? svg.CreateElement(childNode) : childNode;
- child.parent = this;
-
- if (child.type !== 'title') {
- this.children.push(child);
- }
- }
-
- };
- svg.Element.RenderedElementBase = class extends svg.Element.ElementBase {
- setContext(ctx) {
- // fill
- if (this.style('fill').isUrlDefinition()) {
- const fs = this.style('fill').getFillStyleDefinition(this, this.style('fill-opacity'));
- if (!isNullish(fs)) ctx.fillStyle = fs;
- } else if (this.style('fill').hasValue()) {
- const fillStyle = this.style('fill');
- if (fillStyle.value === 'currentColor') fillStyle.value = this.style('color').value;
- ctx.fillStyle = fillStyle.value === 'none' ? 'rgba(0,0,0,0)' : fillStyle.value;
- }
-
- if (this.style('fill-opacity').hasValue()) {
- let fillStyle = new svg.Property('fill', ctx.fillStyle);
- fillStyle = fillStyle.addOpacity(this.style('fill-opacity'));
- ctx.fillStyle = fillStyle.value;
- } // stroke
-
-
- if (this.style('stroke').isUrlDefinition()) {
- const fs = this.style('stroke').getFillStyleDefinition(this, this.style('stroke-opacity'));
- if (!isNullish(fs)) ctx.strokeStyle = fs;
- } else if (this.style('stroke').hasValue()) {
- const strokeStyle = this.style('stroke');
- if (strokeStyle.value === 'currentColor') strokeStyle.value = this.style('color').value;
- ctx.strokeStyle = strokeStyle.value === 'none' ? 'rgba(0,0,0,0)' : strokeStyle.value;
- }
-
- if (this.style('stroke-opacity').hasValue()) {
- let strokeStyle = new svg.Property('stroke', ctx.strokeStyle);
- strokeStyle = strokeStyle.addOpacity(this.style('stroke-opacity'));
- ctx.strokeStyle = strokeStyle.value;
- }
-
- if (this.style('stroke-width').hasValue()) {
- const newLineWidth = this.style('stroke-width').toPixels();
- ctx.lineWidth = newLineWidth === 0 ? 0.001 : newLineWidth; // browsers don't respect 0
- }
-
- if (this.style('stroke-linecap').hasValue()) ctx.lineCap = this.style('stroke-linecap').value;
- if (this.style('stroke-linejoin').hasValue()) ctx.lineJoin = this.style('stroke-linejoin').value;
- if (this.style('stroke-miterlimit').hasValue()) ctx.miterLimit = this.style('stroke-miterlimit').value;
-
- if (this.style('stroke-dasharray').hasValue() && this.style('stroke-dasharray').value !== 'none') {
- const gaps = svg.ToNumberArray(this.style('stroke-dasharray').value);
-
- if (typeof ctx.setLineDash !== 'undefined') {
- ctx.setLineDash(gaps);
- } else if (typeof ctx.webkitLineDash !== 'undefined') {
- ctx.webkitLineDash = gaps;
- } else if (typeof ctx.mozDash !== 'undefined' && !(gaps.length === 1 && gaps[0] === 0)) {
- ctx.mozDash = gaps;
+ return a;
}
- const offset = this.style('stroke-dashoffset').numValueOrDefault(1);
+ if (skipAncestors !== true) {
+ var p = this.parent;
- if (typeof ctx.lineDashOffset !== 'undefined') {
- ctx.lineDashOffset = offset;
- } else if (typeof ctx.webkitLineDashOffset !== 'undefined') {
- ctx.webkitLineDashOffset = offset;
- } else if (typeof ctx.mozDashOffset !== 'undefined') {
- ctx.mozDashOffset = offset;
+ if (!isNullish(p)) {
+ var ps = p.style(name);
+
+ if (!isNullish(ps) && ps.hasValue()) {
+ return ps;
+ }
+ }
}
- } // font
+ if (createIfNotExists === true) {
+ s = new svg.Property(name, '');
+ this.styles[name] = s;
+ }
- if (typeof ctx.font !== 'undefined') {
- ctx.font = svg.Font.CreateFont(this.style('font-style').value, this.style('font-variant').value, this.style('font-weight').value, this.style('font-size').hasValue() ? this.style('font-size').toPixels() + 'px' : '', this.style('font-family').value).toString();
- } // transform
+ return s || svg.EmptyProperty;
+ } // base render
+ }, {
+ key: "render",
+ value: function render(ctx) {
+ // don't render display=none
+ if (this.style('display').value === 'none') return; // don't render visibility=hidden
- if (this.attribute('transform').hasValue()) {
- const transform = new svg.Transform(this.attribute('transform').value);
- transform.apply(ctx);
- } // clip
+ if (this.style('visibility').value === 'hidden') return;
+ ctx.save();
-
- if (this.style('clip-path', false, true).hasValue()) {
- const clip = this.style('clip-path', false, true).getDefinition();
- if (!isNullish(clip)) clip.apply(ctx);
- } // opacity
-
-
- if (this.style('opacity').hasValue()) {
- ctx.globalAlpha = this.style('opacity').numValue();
- }
- }
-
- };
- svg.Element.PathElementBase = class extends svg.Element.RenderedElementBase {
- path(ctx) {
- if (!isNullish(ctx)) ctx.beginPath();
- return new svg.BoundingBox();
- }
-
- renderChildren(ctx) {
- this.path(ctx);
- svg.Mouse.checkPath(this, ctx);
-
- if (ctx.fillStyle !== '') {
- if (this.style('fill-rule').valueOrDefault('inherit') !== 'inherit') {
- ctx.fill(this.style('fill-rule').value);
+ if (this.attribute('mask').hasValue()) {
+ // mask
+ var mask = this.attribute('mask').getDefinition();
+ if (!isNullish(mask)) mask.apply(ctx, this);
+ } else if (this.style('filter').hasValue()) {
+ // filter
+ var filter = this.style('filter').getDefinition();
+ if (!isNullish(filter)) filter.apply(ctx, this);
} else {
- ctx.fill();
+ this.setContext(ctx);
+ this.renderChildren(ctx);
+ this.clearContext(ctx);
+ }
+
+ ctx.restore();
+ } // base set context
+
+ }, {
+ key: "setContext",
+ value: function setContext(ctx) {// OVERRIDE ME!
+ } // base clear context
+
+ }, {
+ key: "clearContext",
+ value: function clearContext(ctx) {// OVERRIDE ME!
+ } // base render children
+
+ }, {
+ key: "renderChildren",
+ value: function renderChildren(ctx) {
+ this.children.forEach(function (child) {
+ child.render(ctx);
+ });
+ }
+ }, {
+ key: "addChild",
+ value: function addChild(childNode, create) {
+ var child = create ? svg.CreateElement(childNode) : childNode;
+ child.parent = this;
+
+ if (child.type !== 'title') {
+ this.children.push(child);
}
}
+ }]);
- if (ctx.strokeStyle !== '') ctx.stroke();
- const markers = this.getMarkers();
+ return _class4;
+ }();
- if (!isNullish(markers)) {
- if (this.style('marker-start').isUrlDefinition()) {
- const marker = this.style('marker-start').getDefinition();
- marker.render(ctx, markers[0][0], markers[0][1]);
+ svg.Element.RenderedElementBase = /*#__PURE__*/function (_svg$Element$ElementB) {
+ _inherits(_class5, _svg$Element$ElementB);
+
+ var _super4 = _createSuper(_class5);
+
+ function _class5() {
+ _classCallCheck(this, _class5);
+
+ return _super4.apply(this, arguments);
+ }
+
+ _createClass(_class5, [{
+ key: "setContext",
+ value: function setContext(ctx) {
+ // fill
+ if (this.style('fill').isUrlDefinition()) {
+ var fs = this.style('fill').getFillStyleDefinition(this, this.style('fill-opacity'));
+ if (!isNullish(fs)) ctx.fillStyle = fs;
+ } else if (this.style('fill').hasValue()) {
+ var fillStyle = this.style('fill');
+ if (fillStyle.value === 'currentColor') fillStyle.value = this.style('color').value;
+ ctx.fillStyle = fillStyle.value === 'none' ? 'rgba(0,0,0,0)' : fillStyle.value;
}
- if (this.style('marker-mid').isUrlDefinition()) {
- const marker = this.style('marker-mid').getDefinition();
+ if (this.style('fill-opacity').hasValue()) {
+ var _fillStyle = new svg.Property('fill', ctx.fillStyle);
- for (let i = 1; i < markers.length - 1; i++) {
- marker.render(ctx, markers[i][0], markers[i][1]);
+ _fillStyle = _fillStyle.addOpacity(this.style('fill-opacity'));
+ ctx.fillStyle = _fillStyle.value;
+ } // stroke
+
+
+ if (this.style('stroke').isUrlDefinition()) {
+ var _fs = this.style('stroke').getFillStyleDefinition(this, this.style('stroke-opacity'));
+
+ if (!isNullish(_fs)) ctx.strokeStyle = _fs;
+ } else if (this.style('stroke').hasValue()) {
+ var strokeStyle = this.style('stroke');
+ if (strokeStyle.value === 'currentColor') strokeStyle.value = this.style('color').value;
+ ctx.strokeStyle = strokeStyle.value === 'none' ? 'rgba(0,0,0,0)' : strokeStyle.value;
+ }
+
+ if (this.style('stroke-opacity').hasValue()) {
+ var _strokeStyle = new svg.Property('stroke', ctx.strokeStyle);
+
+ _strokeStyle = _strokeStyle.addOpacity(this.style('stroke-opacity'));
+ ctx.strokeStyle = _strokeStyle.value;
+ }
+
+ if (this.style('stroke-width').hasValue()) {
+ var newLineWidth = this.style('stroke-width').toPixels();
+ ctx.lineWidth = newLineWidth === 0 ? 0.001 : newLineWidth; // browsers don't respect 0
+ }
+
+ if (this.style('stroke-linecap').hasValue()) ctx.lineCap = this.style('stroke-linecap').value;
+ if (this.style('stroke-linejoin').hasValue()) ctx.lineJoin = this.style('stroke-linejoin').value;
+ if (this.style('stroke-miterlimit').hasValue()) ctx.miterLimit = this.style('stroke-miterlimit').value;
+
+ if (this.style('stroke-dasharray').hasValue() && this.style('stroke-dasharray').value !== 'none') {
+ var gaps = svg.ToNumberArray(this.style('stroke-dasharray').value);
+
+ if (typeof ctx.setLineDash !== 'undefined') {
+ ctx.setLineDash(gaps);
+ } else if (typeof ctx.webkitLineDash !== 'undefined') {
+ ctx.webkitLineDash = gaps;
+ } else if (typeof ctx.mozDash !== 'undefined' && !(gaps.length === 1 && gaps[0] === 0)) {
+ ctx.mozDash = gaps;
+ }
+
+ var offset = this.style('stroke-dashoffset').numValueOrDefault(1);
+
+ if (typeof ctx.lineDashOffset !== 'undefined') {
+ ctx.lineDashOffset = offset;
+ } else if (typeof ctx.webkitLineDashOffset !== 'undefined') {
+ ctx.webkitLineDashOffset = offset;
+ } else if (typeof ctx.mozDashOffset !== 'undefined') {
+ ctx.mozDashOffset = offset;
+ }
+ } // font
+
+
+ if (typeof ctx.font !== 'undefined') {
+ ctx.font = svg.Font.CreateFont(this.style('font-style').value, this.style('font-variant').value, this.style('font-weight').value, this.style('font-size').hasValue() ? this.style('font-size').toPixels() + 'px' : '', this.style('font-family').value).toString();
+ } // transform
+
+
+ if (this.attribute('transform').hasValue()) {
+ var transform = new svg.Transform(this.attribute('transform').value);
+ transform.apply(ctx);
+ } // clip
+
+
+ if (this.style('clip-path', false, true).hasValue()) {
+ var clip = this.style('clip-path', false, true).getDefinition();
+ if (!isNullish(clip)) clip.apply(ctx);
+ } // opacity
+
+
+ if (this.style('opacity').hasValue()) {
+ ctx.globalAlpha = this.style('opacity').numValue();
+ }
+ }
+ }]);
+
+ return _class5;
+ }(svg.Element.ElementBase);
+
+ svg.Element.PathElementBase = /*#__PURE__*/function (_svg$Element$Rendered) {
+ _inherits(_class6, _svg$Element$Rendered);
+
+ var _super5 = _createSuper(_class6);
+
+ function _class6() {
+ _classCallCheck(this, _class6);
+
+ return _super5.apply(this, arguments);
+ }
+
+ _createClass(_class6, [{
+ key: "path",
+ value: function path(ctx) {
+ if (!isNullish(ctx)) ctx.beginPath();
+ return new svg.BoundingBox();
+ }
+ }, {
+ key: "renderChildren",
+ value: function renderChildren(ctx) {
+ this.path(ctx);
+ svg.Mouse.checkPath(this, ctx);
+
+ if (ctx.fillStyle !== '') {
+ if (this.style('fill-rule').valueOrDefault('inherit') !== 'inherit') {
+ ctx.fill(this.style('fill-rule').value);
+ } else {
+ ctx.fill();
}
}
- if (this.style('marker-end').isUrlDefinition()) {
- const marker = this.style('marker-end').getDefinition();
- marker.render(ctx, markers[markers.length - 1][0], markers[markers.length - 1][1]);
+ if (ctx.strokeStyle !== '') ctx.stroke();
+ var markers = this.getMarkers();
+
+ if (!isNullish(markers)) {
+ if (this.style('marker-start').isUrlDefinition()) {
+ var marker = this.style('marker-start').getDefinition();
+ marker.render(ctx, markers[0][0], markers[0][1]);
+ }
+
+ if (this.style('marker-mid').isUrlDefinition()) {
+ var _marker = this.style('marker-mid').getDefinition();
+
+ for (var i = 1; i < markers.length - 1; i++) {
+ _marker.render(ctx, markers[i][0], markers[i][1]);
+ }
+ }
+
+ if (this.style('marker-end').isUrlDefinition()) {
+ var _marker2 = this.style('marker-end').getDefinition();
+
+ _marker2.render(ctx, markers[markers.length - 1][0], markers[markers.length - 1][1]);
+ }
}
}
- }
-
- getBoundingBox() {
- return this.path();
- }
-
- getMarkers() {
- return null;
- }
-
- }; // svg element
-
- svg.Element.svg = class extends svg.Element.RenderedElementBase {
- clearContext(ctx) {
- super.clearContext(ctx);
- svg.ViewPort.RemoveCurrent();
- }
-
- setContext(ctx) {
- // initial values and defaults
- ctx.strokeStyle = 'rgba(0,0,0,0)';
- ctx.lineCap = 'butt';
- ctx.lineJoin = 'miter';
- ctx.miterLimit = 4;
-
- if (typeof ctx.font !== 'undefined' && typeof window.getComputedStyle !== 'undefined') {
- ctx.font = window.getComputedStyle(ctx.canvas).getPropertyValue('font');
+ }, {
+ key: "getBoundingBox",
+ value: function getBoundingBox() {
+ return this.path();
}
+ }, {
+ key: "getMarkers",
+ value: function getMarkers() {
+ return null;
+ }
+ }]);
- super.setContext(ctx); // create new view port
+ return _class6;
+ }(svg.Element.RenderedElementBase); // svg element
- if (!this.attribute('x').hasValue()) this.attribute('x', true).value = 0;
- if (!this.attribute('y').hasValue()) this.attribute('y', true).value = 0;
- ctx.translate(this.attribute('x').toPixels('x'), this.attribute('y').toPixels('y'));
- let width = svg.ViewPort.width();
- let height = svg.ViewPort.height();
- if (!this.attribute('width').hasValue()) this.attribute('width', true).value = '100%';
- if (!this.attribute('height').hasValue()) this.attribute('height', true).value = '100%';
- if (typeof this.root === 'undefined') {
- width = this.attribute('width').toPixels('x');
- height = this.attribute('height').toPixels('y');
- let x = 0;
- let y = 0;
+ svg.Element.svg = /*#__PURE__*/function (_svg$Element$Rendered2) {
+ _inherits(_class7, _svg$Element$Rendered2);
- if (this.attribute('refX').hasValue() && this.attribute('refY').hasValue()) {
- x = -this.attribute('refX').toPixels('x');
- y = -this.attribute('refY').toPixels('y');
+ var _super6 = _createSuper(_class7);
+
+ function _class7() {
+ _classCallCheck(this, _class7);
+
+ return _super6.apply(this, arguments);
+ }
+
+ _createClass(_class7, [{
+ key: "clearContext",
+ value: function clearContext(ctx) {
+ _get(_getPrototypeOf(_class7.prototype), "clearContext", this).call(this, ctx);
+
+ svg.ViewPort.RemoveCurrent();
+ }
+ }, {
+ key: "setContext",
+ value: function setContext(ctx) {
+ // initial values and defaults
+ ctx.strokeStyle = 'rgba(0,0,0,0)';
+ ctx.lineCap = 'butt';
+ ctx.lineJoin = 'miter';
+ ctx.miterLimit = 4;
+
+ if (typeof ctx.font !== 'undefined' && typeof window.getComputedStyle !== 'undefined') {
+ ctx.font = window.getComputedStyle(ctx.canvas).getPropertyValue('font');
}
- if (this.attribute('overflow').valueOrDefault('hidden') !== 'visible') {
+ _get(_getPrototypeOf(_class7.prototype), "setContext", this).call(this, ctx); // create new view port
+
+
+ if (!this.attribute('x').hasValue()) this.attribute('x', true).value = 0;
+ if (!this.attribute('y').hasValue()) this.attribute('y', true).value = 0;
+ ctx.translate(this.attribute('x').toPixels('x'), this.attribute('y').toPixels('y'));
+ var width = svg.ViewPort.width();
+ var height = svg.ViewPort.height();
+ if (!this.attribute('width').hasValue()) this.attribute('width', true).value = '100%';
+ if (!this.attribute('height').hasValue()) this.attribute('height', true).value = '100%';
+
+ if (typeof this.root === 'undefined') {
+ width = this.attribute('width').toPixels('x');
+ height = this.attribute('height').toPixels('y');
+ var x = 0;
+ var y = 0;
+
+ if (this.attribute('refX').hasValue() && this.attribute('refY').hasValue()) {
+ x = -this.attribute('refX').toPixels('x');
+ y = -this.attribute('refY').toPixels('y');
+ }
+
+ if (this.attribute('overflow').valueOrDefault('hidden') !== 'visible') {
+ ctx.beginPath();
+ ctx.moveTo(x, y);
+ ctx.lineTo(width, y);
+ ctx.lineTo(width, height);
+ ctx.lineTo(x, height);
+ ctx.closePath();
+ ctx.clip();
+ }
+ }
+
+ svg.ViewPort.SetCurrent(width, height); // viewbox
+
+ if (this.attribute('viewBox').hasValue()) {
+ var viewBox = svg.ToNumberArray(this.attribute('viewBox').value);
+ var minX = viewBox[0];
+ var minY = viewBox[1];
+ width = viewBox[2];
+ height = viewBox[3];
+ svg.AspectRatio(ctx, this.attribute('preserveAspectRatio').value, svg.ViewPort.width(), width, svg.ViewPort.height(), height, minX, minY, this.attribute('refX').value, this.attribute('refY').value);
+ svg.ViewPort.RemoveCurrent();
+ svg.ViewPort.SetCurrent(viewBox[2], viewBox[3]);
+ }
+ }
+ }]);
+
+ return _class7;
+ }(svg.Element.RenderedElementBase); // rect element
+
+
+ svg.Element.rect = /*#__PURE__*/function (_svg$Element$PathElem) {
+ _inherits(_class8, _svg$Element$PathElem);
+
+ var _super7 = _createSuper(_class8);
+
+ function _class8() {
+ _classCallCheck(this, _class8);
+
+ return _super7.apply(this, arguments);
+ }
+
+ _createClass(_class8, [{
+ key: "path",
+ value: function path(ctx) {
+ var x = this.attribute('x').toPixels('x');
+ var y = this.attribute('y').toPixels('y');
+ var width = this.attribute('width').toPixels('x');
+ var height = this.attribute('height').toPixels('y');
+ var rx = this.attribute('rx').toPixels('x');
+ var ry = this.attribute('ry').toPixels('y');
+ if (this.attribute('rx').hasValue() && !this.attribute('ry').hasValue()) ry = rx;
+ if (this.attribute('ry').hasValue() && !this.attribute('rx').hasValue()) rx = ry;
+ rx = Math.min(rx, width / 2.0);
+ ry = Math.min(ry, height / 2.0);
+
+ if (!isNullish(ctx)) {
+ ctx.beginPath();
+ ctx.moveTo(x + rx, y);
+ ctx.lineTo(x + width - rx, y);
+ ctx.quadraticCurveTo(x + width, y, x + width, y + ry);
+ ctx.lineTo(x + width, y + height - ry);
+ ctx.quadraticCurveTo(x + width, y + height, x + width - rx, y + height);
+ ctx.lineTo(x + rx, y + height);
+ ctx.quadraticCurveTo(x, y + height, x, y + height - ry);
+ ctx.lineTo(x, y + ry);
+ ctx.quadraticCurveTo(x, y, x + rx, y);
+ ctx.closePath();
+ }
+
+ return new svg.BoundingBox(x, y, x + width, y + height);
+ }
+ }]);
+
+ return _class8;
+ }(svg.Element.PathElementBase); // circle element
+
+
+ svg.Element.circle = /*#__PURE__*/function (_svg$Element$PathElem2) {
+ _inherits(_class9, _svg$Element$PathElem2);
+
+ var _super8 = _createSuper(_class9);
+
+ function _class9() {
+ _classCallCheck(this, _class9);
+
+ return _super8.apply(this, arguments);
+ }
+
+ _createClass(_class9, [{
+ key: "path",
+ value: function path(ctx) {
+ var cx = this.attribute('cx').toPixels('x');
+ var cy = this.attribute('cy').toPixels('y');
+ var r = this.attribute('r').toPixels();
+
+ if (!isNullish(ctx)) {
+ ctx.beginPath();
+ ctx.arc(cx, cy, r, 0, Math.PI * 2, true);
+ ctx.closePath();
+ }
+
+ return new svg.BoundingBox(cx - r, cy - r, cx + r, cy + r);
+ }
+ }]);
+
+ return _class9;
+ }(svg.Element.PathElementBase); // ellipse element
+
+
+ var KAPPA = 4 * ((Math.sqrt(2) - 1) / 3);
+
+ svg.Element.ellipse = /*#__PURE__*/function (_svg$Element$PathElem3) {
+ _inherits(_class10, _svg$Element$PathElem3);
+
+ var _super9 = _createSuper(_class10);
+
+ function _class10() {
+ _classCallCheck(this, _class10);
+
+ return _super9.apply(this, arguments);
+ }
+
+ _createClass(_class10, [{
+ key: "path",
+ value: function path(ctx) {
+ var rx = this.attribute('rx').toPixels('x');
+ var ry = this.attribute('ry').toPixels('y');
+ var cx = this.attribute('cx').toPixels('x');
+ var cy = this.attribute('cy').toPixels('y');
+
+ if (!isNullish(ctx)) {
+ ctx.beginPath();
+ ctx.moveTo(cx, cy - ry);
+ ctx.bezierCurveTo(cx + KAPPA * rx, cy - ry, cx + rx, cy - KAPPA * ry, cx + rx, cy);
+ ctx.bezierCurveTo(cx + rx, cy + KAPPA * ry, cx + KAPPA * rx, cy + ry, cx, cy + ry);
+ ctx.bezierCurveTo(cx - KAPPA * rx, cy + ry, cx - rx, cy + KAPPA * ry, cx - rx, cy);
+ ctx.bezierCurveTo(cx - rx, cy - KAPPA * ry, cx - KAPPA * rx, cy - ry, cx, cy - ry);
+ ctx.closePath();
+ }
+
+ return new svg.BoundingBox(cx - rx, cy - ry, cx + rx, cy + ry);
+ }
+ }]);
+
+ return _class10;
+ }(svg.Element.PathElementBase); // line element
+
+
+ svg.Element.line = /*#__PURE__*/function (_svg$Element$PathElem4) {
+ _inherits(_class11, _svg$Element$PathElem4);
+
+ var _super10 = _createSuper(_class11);
+
+ function _class11() {
+ _classCallCheck(this, _class11);
+
+ return _super10.apply(this, arguments);
+ }
+
+ _createClass(_class11, [{
+ key: "getPoints",
+ value: function getPoints() {
+ return [new svg.Point(this.attribute('x1').toPixels('x'), this.attribute('y1').toPixels('y')), new svg.Point(this.attribute('x2').toPixels('x'), this.attribute('y2').toPixels('y'))];
+ }
+ }, {
+ key: "path",
+ value: function path(ctx) {
+ var points = this.getPoints();
+
+ if (!isNullish(ctx)) {
+ ctx.beginPath();
+ ctx.moveTo(points[0].x, points[0].y);
+ ctx.lineTo(points[1].x, points[1].y);
+ }
+
+ return new svg.BoundingBox(points[0].x, points[0].y, points[1].x, points[1].y);
+ }
+ }, {
+ key: "getMarkers",
+ value: function getMarkers() {
+ var points = this.getPoints();
+ var a = points[0].angleTo(points[1]);
+ return [[points[0], a], [points[1], a]];
+ }
+ }]);
+
+ return _class11;
+ }(svg.Element.PathElementBase); // polyline element
+
+
+ svg.Element.polyline = /*#__PURE__*/function (_svg$Element$PathElem5) {
+ _inherits(_class12, _svg$Element$PathElem5);
+
+ var _super11 = _createSuper(_class12);
+
+ function _class12(node) {
+ var _this8;
+
+ _classCallCheck(this, _class12);
+
+ _this8 = _super11.call(this, node);
+ _this8.points = svg.CreatePath(_this8.attribute('points').value);
+ return _this8;
+ }
+
+ _createClass(_class12, [{
+ key: "path",
+ value: function path(ctx) {
+ var _this$points$ = this.points[0],
+ x = _this$points$.x,
+ y = _this$points$.y;
+ var bb = new svg.BoundingBox(x, y);
+
+ if (!isNullish(ctx)) {
ctx.beginPath();
ctx.moveTo(x, y);
- ctx.lineTo(width, y);
- ctx.lineTo(width, height);
- ctx.lineTo(x, height);
- ctx.closePath();
- ctx.clip();
}
+
+ for (var i = 1; i < this.points.length; i++) {
+ var _this$points$i = this.points[i],
+ _x = _this$points$i.x,
+ _y = _this$points$i.y;
+ bb.addPoint(_x, _y);
+ if (!isNullish(ctx)) ctx.lineTo(_x, _y);
+ }
+
+ return bb;
}
+ }, {
+ key: "getMarkers",
+ value: function getMarkers() {
+ var markers = [];
- svg.ViewPort.SetCurrent(width, height); // viewbox
+ for (var i = 0; i < this.points.length - 1; i++) {
+ markers.push([this.points[i], this.points[i].angleTo(this.points[i + 1])]);
+ }
- if (this.attribute('viewBox').hasValue()) {
- const viewBox = svg.ToNumberArray(this.attribute('viewBox').value);
- const minX = viewBox[0];
- const minY = viewBox[1];
- width = viewBox[2];
- height = viewBox[3];
- svg.AspectRatio(ctx, this.attribute('preserveAspectRatio').value, svg.ViewPort.width(), width, svg.ViewPort.height(), height, minX, minY, this.attribute('refX').value, this.attribute('refY').value);
- svg.ViewPort.RemoveCurrent();
- svg.ViewPort.SetCurrent(viewBox[2], viewBox[3]);
+ markers.push([this.points[this.points.length - 1], markers[markers.length - 1][1]]);
+ return markers;
}
+ }]);
+
+ return _class12;
+ }(svg.Element.PathElementBase); // polygon element
+
+
+ svg.Element.polygon = /*#__PURE__*/function (_svg$Element$polyline) {
+ _inherits(_class13, _svg$Element$polyline);
+
+ var _super12 = _createSuper(_class13);
+
+ function _class13() {
+ _classCallCheck(this, _class13);
+
+ return _super12.apply(this, arguments);
}
- }; // rect element
+ _createClass(_class13, [{
+ key: "path",
+ value: function path(ctx) {
+ var bb = _get(_getPrototypeOf(_class13.prototype), "path", this).call(this, ctx);
- svg.Element.rect = class extends svg.Element.PathElementBase {
- path(ctx) {
- const x = this.attribute('x').toPixels('x');
- const y = this.attribute('y').toPixels('y');
- const width = this.attribute('width').toPixels('x');
- const height = this.attribute('height').toPixels('y');
- let rx = this.attribute('rx').toPixels('x');
- let ry = this.attribute('ry').toPixels('y');
- if (this.attribute('rx').hasValue() && !this.attribute('ry').hasValue()) ry = rx;
- if (this.attribute('ry').hasValue() && !this.attribute('rx').hasValue()) rx = ry;
- rx = Math.min(rx, width / 2.0);
- ry = Math.min(ry, height / 2.0);
+ if (!isNullish(ctx)) {
+ ctx.lineTo(this.points[0].x, this.points[0].y);
+ ctx.closePath();
+ }
- if (!isNullish(ctx)) {
- ctx.beginPath();
- ctx.moveTo(x + rx, y);
- ctx.lineTo(x + width - rx, y);
- ctx.quadraticCurveTo(x + width, y, x + width, y + ry);
- ctx.lineTo(x + width, y + height - ry);
- ctx.quadraticCurveTo(x + width, y + height, x + width - rx, y + height);
- ctx.lineTo(x + rx, y + height);
- ctx.quadraticCurveTo(x, y + height, x, y + height - ry);
- ctx.lineTo(x, y + ry);
- ctx.quadraticCurveTo(x, y, x + rx, y);
- ctx.closePath();
+ return bb;
}
+ }]);
- return new svg.BoundingBox(x, y, x + width, y + height);
- }
+ return _class13;
+ }(svg.Element.polyline); // path element
- }; // circle element
- svg.Element.circle = class extends svg.Element.PathElementBase {
- path(ctx) {
- const cx = this.attribute('cx').toPixels('x');
- const cy = this.attribute('cy').toPixels('y');
- const r = this.attribute('r').toPixels();
+ svg.Element.path = /*#__PURE__*/function (_svg$Element$PathElem6) {
+ _inherits(_class14, _svg$Element$PathElem6);
- if (!isNullish(ctx)) {
- ctx.beginPath();
- ctx.arc(cx, cy, r, 0, Math.PI * 2, true);
- ctx.closePath();
- }
+ var _super13 = _createSuper(_class14);
- return new svg.BoundingBox(cx - r, cy - r, cx + r, cy + r);
- }
+ function _class14(node) {
+ var _this9;
- }; // ellipse element
+ _classCallCheck(this, _class14);
- const KAPPA = 4 * ((Math.sqrt(2) - 1) / 3);
- svg.Element.ellipse = class extends svg.Element.PathElementBase {
- path(ctx) {
- const rx = this.attribute('rx').toPixels('x');
- const ry = this.attribute('ry').toPixels('y');
- const cx = this.attribute('cx').toPixels('x');
- const cy = this.attribute('cy').toPixels('y');
+ _this9 = _super13.call(this, node);
- if (!isNullish(ctx)) {
- ctx.beginPath();
- ctx.moveTo(cx, cy - ry);
- ctx.bezierCurveTo(cx + KAPPA * rx, cy - ry, cx + rx, cy - KAPPA * ry, cx + rx, cy);
- ctx.bezierCurveTo(cx + rx, cy + KAPPA * ry, cx + KAPPA * rx, cy + ry, cx, cy + ry);
- ctx.bezierCurveTo(cx - KAPPA * rx, cy + ry, cx - rx, cy + KAPPA * ry, cx - rx, cy);
- ctx.bezierCurveTo(cx - rx, cy - KAPPA * ry, cx - KAPPA * rx, cy - ry, cx, cy - ry);
- ctx.closePath();
- }
-
- return new svg.BoundingBox(cx - rx, cy - ry, cx + rx, cy + ry);
- }
-
- }; // line element
-
- svg.Element.line = class extends svg.Element.PathElementBase {
- getPoints() {
- return [new svg.Point(this.attribute('x1').toPixels('x'), this.attribute('y1').toPixels('y')), new svg.Point(this.attribute('x2').toPixels('x'), this.attribute('y2').toPixels('y'))];
- }
-
- path(ctx) {
- const points = this.getPoints();
-
- if (!isNullish(ctx)) {
- ctx.beginPath();
- ctx.moveTo(points[0].x, points[0].y);
- ctx.lineTo(points[1].x, points[1].y);
- }
-
- return new svg.BoundingBox(points[0].x, points[0].y, points[1].x, points[1].y);
- }
-
- getMarkers() {
- const points = this.getPoints();
- const a = points[0].angleTo(points[1]);
- return [[points[0], a], [points[1], a]];
- }
-
- }; // polyline element
-
- svg.Element.polyline = class extends svg.Element.PathElementBase {
- constructor(node) {
- super(node);
- this.points = svg.CreatePath(this.attribute('points').value);
- }
-
- path(ctx) {
- const {
- x,
- y
- } = this.points[0];
- const bb = new svg.BoundingBox(x, y);
-
- if (!isNullish(ctx)) {
- ctx.beginPath();
- ctx.moveTo(x, y);
- }
-
- for (let i = 1; i < this.points.length; i++) {
- const {
- x: _x,
- y: _y
- } = this.points[i];
- bb.addPoint(_x, _y);
- if (!isNullish(ctx)) ctx.lineTo(_x, _y);
- }
-
- return bb;
- }
-
- getMarkers() {
- const markers = [];
-
- for (let i = 0; i < this.points.length - 1; i++) {
- markers.push([this.points[i], this.points[i].angleTo(this.points[i + 1])]);
- }
-
- markers.push([this.points[this.points.length - 1], markers[markers.length - 1][1]]);
- return markers;
- }
-
- }; // polygon element
-
- svg.Element.polygon = class extends svg.Element.polyline {
- path(ctx) {
- const bb = super.path(ctx);
-
- if (!isNullish(ctx)) {
- ctx.lineTo(this.points[0].x, this.points[0].y);
- ctx.closePath();
- }
-
- return bb;
- }
-
- }; // path element
-
- svg.Element.path = class extends svg.Element.PathElementBase {
- constructor(node) {
- super(node);
- let d = this.attribute('d').value // TODO: convert to real lexer based on https://www.w3.org/TR/SVG11/paths.html#PathDataBNF
+ var d = _this9.attribute('d').value // TODO: convert to real lexer based on https://www.w3.org/TR/SVG11/paths.html#PathDataBNF
.replace(/,/gm, ' ') // get rid of all commas
.replace(/([MmZzLlHhVvCcSsQqTtAa])([MmZzLlHhVvCcSsQqTtAa])/gm, '$1 $2') // separate commands from commands
.replace(/([MmZzLlHhVvCcSsQqTtAa])([MmZzLlHhVvCcSsQqTtAa])/gm, '$1 $2') // separate commands from commands
@@ -2033,13 +2583,13 @@ var svgEditorExtension_server_moinsave = (function () {
.replace(/(\.\d*)(\.)/gm, '$1 $2') // separate digits when no comma
.replace(/([Aa](\s+\d+)(\s+\d+)(\s+\d+))\s+([01])\s*([01])/gm, '$1 $5 $6 '); // shorthand elliptical arc path syntax
+
d = svg.compressSpaces(d); // compress multiple spaces
d = svg.trim(d);
- this.PathParser = {
+ _this9.PathParser = {
tokens: d.split(' '),
-
- reset() {
+ reset: function reset() {
this.i = -1;
this.command = '';
this.previousCommand = '';
@@ -2049,17 +2599,14 @@ var svgEditorExtension_server_moinsave = (function () {
this.points = [];
this.angles = [];
},
-
- isEnd() {
+ isEnd: function isEnd() {
return this.i >= this.tokens.length - 1;
},
-
- isCommandOrEnd() {
+ isCommandOrEnd: function isCommandOrEnd() {
if (this.isEnd()) return true;
return !isNullish(this.tokens[this.i + 1].match(/^[A-Za-z]$/));
},
-
- isRelativeCommand() {
+ isRelativeCommand: function isRelativeCommand() {
switch (this.command) {
case 'm':
case 'l':
@@ -2076,49 +2623,41 @@ var svgEditorExtension_server_moinsave = (function () {
return false;
},
-
- getToken() {
+ getToken: function getToken() {
this.i++;
return this.tokens[this.i];
},
-
- getScalar() {
+ getScalar: function getScalar() {
return Number.parseFloat(this.getToken());
},
-
- nextCommand() {
+ nextCommand: function nextCommand() {
this.previousCommand = this.command;
this.command = this.getToken();
},
-
- getPoint() {
- const p = new svg.Point(this.getScalar(), this.getScalar());
+ getPoint: function getPoint() {
+ var p = new svg.Point(this.getScalar(), this.getScalar());
return this.makeAbsolute(p);
},
-
- getAsControlPoint() {
- const p = this.getPoint();
+ getAsControlPoint: function getAsControlPoint() {
+ var p = this.getPoint();
this.control = p;
return p;
},
-
- getAsCurrentPoint() {
- const p = this.getPoint();
+ getAsCurrentPoint: function getAsCurrentPoint() {
+ var p = this.getPoint();
this.current = p;
return p;
},
-
- getReflectedControlPoint() {
+ getReflectedControlPoint: function getReflectedControlPoint() {
if (this.previousCommand.toLowerCase() !== 'c' && this.previousCommand.toLowerCase() !== 's' && this.previousCommand.toLowerCase() !== 'q' && this.previousCommand.toLowerCase() !== 't') {
return this.current;
} // reflect point
- const p = new svg.Point(2 * this.current.x - this.control.x, 2 * this.current.y - this.control.y);
+ var p = new svg.Point(2 * this.current.x - this.control.x, 2 * this.current.y - this.control.y);
return p;
},
-
- makeAbsolute(p) {
+ makeAbsolute: function makeAbsolute(p) {
if (this.isRelativeCommand()) {
p.x += this.current.x;
p.y += this.current.y;
@@ -2126,8 +2665,7 @@ var svgEditorExtension_server_moinsave = (function () {
return p;
},
-
- addMarker(p, from, priorTo) {
+ addMarker: function addMarker(p, from, priorTo) {
// if the last angle isn't filled in because we didn't have this point yet ...
if (!isNullish(priorTo) && this.angles.length > 0 && isNullish(this.angles[this.angles.length - 1])) {
this.angles[this.angles.length - 1] = this.points[this.points.length - 1].angleTo(priorTo);
@@ -2135,20 +2673,17 @@ var svgEditorExtension_server_moinsave = (function () {
this.addMarkerAngle(p, isNullish(from) ? null : from.angleTo(p));
},
-
- addMarkerAngle(p, a) {
+ addMarkerAngle: function addMarkerAngle(p, a) {
this.points.push(p);
this.angles.push(a);
},
-
- getMarkerPoints() {
+ getMarkerPoints: function getMarkerPoints() {
return this.points;
},
-
- getMarkerAngles() {
- for (let i = 0; i < this.angles.length; i++) {
+ getMarkerAngles: function getMarkerAngles() {
+ for (var i = 0; i < this.angles.length; i++) {
if (isNullish(this.angles[i])) {
- for (let j = i + 1; j < this.angles.length; j++) {
+ for (var j = i + 1; j < this.angles.length; j++) {
if (!isNullish(this.angles[j])) {
this.angles[i] = this.angles[j];
break;
@@ -2159,1002 +2694,1386 @@ var svgEditorExtension_server_moinsave = (function () {
return this.angles;
}
-
};
+ return _this9;
}
- path(ctx) {
- const pp = this.PathParser;
- pp.reset();
- const bb = new svg.BoundingBox();
- if (!isNullish(ctx)) ctx.beginPath();
+ _createClass(_class14, [{
+ key: "path",
+ value: function path(ctx) {
+ var pp = this.PathParser;
+ pp.reset();
+ var bb = new svg.BoundingBox();
+ if (!isNullish(ctx)) ctx.beginPath();
- while (!pp.isEnd()) {
- pp.nextCommand();
+ while (!pp.isEnd()) {
+ pp.nextCommand();
- switch (pp.command) {
- case 'M':
- case 'm':
- {
- const p = pp.getAsCurrentPoint();
- pp.addMarker(p);
- bb.addPoint(p.x, p.y);
- if (!isNullish(ctx)) ctx.moveTo(p.x, p.y);
- pp.start = pp.current;
+ switch (pp.command) {
+ case 'M':
+ case 'm':
+ {
+ var p = pp.getAsCurrentPoint();
+ pp.addMarker(p);
+ bb.addPoint(p.x, p.y);
+ if (!isNullish(ctx)) ctx.moveTo(p.x, p.y);
+ pp.start = pp.current;
+ while (!pp.isCommandOrEnd()) {
+ var _p = pp.getAsCurrentPoint();
+
+ pp.addMarker(_p, pp.start);
+ bb.addPoint(_p.x, _p.y);
+ if (!isNullish(ctx)) ctx.lineTo(_p.x, _p.y);
+ }
+
+ break;
+ }
+
+ case 'L':
+ case 'l':
while (!pp.isCommandOrEnd()) {
- const _p = pp.getAsCurrentPoint();
+ var c = pp.current;
- pp.addMarker(_p, pp.start);
- bb.addPoint(_p.x, _p.y);
- if (!isNullish(ctx)) ctx.lineTo(_p.x, _p.y);
+ var _p2 = pp.getAsCurrentPoint();
+
+ pp.addMarker(_p2, c);
+ bb.addPoint(_p2.x, _p2.y);
+ if (!isNullish(ctx)) ctx.lineTo(_p2.x, _p2.y);
}
break;
- }
- case 'L':
- case 'l':
- while (!pp.isCommandOrEnd()) {
- const c = pp.current;
- const p = pp.getAsCurrentPoint();
- pp.addMarker(p, c);
- bb.addPoint(p.x, p.y);
- if (!isNullish(ctx)) ctx.lineTo(p.x, p.y);
- }
-
- break;
-
- case 'H':
- case 'h':
- while (!pp.isCommandOrEnd()) {
- const newP = new svg.Point((pp.isRelativeCommand() ? pp.current.x : 0) + pp.getScalar(), pp.current.y);
- pp.addMarker(newP, pp.current);
- pp.current = newP;
- bb.addPoint(pp.current.x, pp.current.y);
- if (!isNullish(ctx)) ctx.lineTo(pp.current.x, pp.current.y);
- }
-
- break;
-
- case 'V':
- case 'v':
- while (!pp.isCommandOrEnd()) {
- const newP = new svg.Point(pp.current.x, (pp.isRelativeCommand() ? pp.current.y : 0) + pp.getScalar());
- pp.addMarker(newP, pp.current);
- pp.current = newP;
- bb.addPoint(pp.current.x, pp.current.y);
- if (!isNullish(ctx)) ctx.lineTo(pp.current.x, pp.current.y);
- }
-
- break;
-
- case 'C':
- case 'c':
- while (!pp.isCommandOrEnd()) {
- const curr = pp.current;
- const p1 = pp.getPoint();
- const cntrl = pp.getAsControlPoint();
- const cp = pp.getAsCurrentPoint();
- pp.addMarker(cp, cntrl, p1);
- bb.addBezierCurve(curr.x, curr.y, p1.x, p1.y, cntrl.x, cntrl.y, cp.x, cp.y);
- if (!isNullish(ctx)) ctx.bezierCurveTo(p1.x, p1.y, cntrl.x, cntrl.y, cp.x, cp.y);
- }
-
- break;
-
- case 'S':
- case 's':
- while (!pp.isCommandOrEnd()) {
- const curr = pp.current;
- const p1 = pp.getReflectedControlPoint();
- const cntrl = pp.getAsControlPoint();
- const cp = pp.getAsCurrentPoint();
- pp.addMarker(cp, cntrl, p1);
- bb.addBezierCurve(curr.x, curr.y, p1.x, p1.y, cntrl.x, cntrl.y, cp.x, cp.y);
- if (!isNullish(ctx)) ctx.bezierCurveTo(p1.x, p1.y, cntrl.x, cntrl.y, cp.x, cp.y);
- }
-
- break;
-
- case 'Q':
- case 'q':
- while (!pp.isCommandOrEnd()) {
- const curr = pp.current;
- const cntrl = pp.getAsControlPoint();
- const cp = pp.getAsCurrentPoint();
- pp.addMarker(cp, cntrl, cntrl);
- bb.addQuadraticCurve(curr.x, curr.y, cntrl.x, cntrl.y, cp.x, cp.y);
- if (!isNullish(ctx)) ctx.quadraticCurveTo(cntrl.x, cntrl.y, cp.x, cp.y);
- }
-
- break;
-
- case 'T':
- case 't':
- while (!pp.isCommandOrEnd()) {
- const curr = pp.current;
- const cntrl = pp.getReflectedControlPoint();
- pp.control = cntrl;
- const cp = pp.getAsCurrentPoint();
- pp.addMarker(cp, cntrl, cntrl);
- bb.addQuadraticCurve(curr.x, curr.y, cntrl.x, cntrl.y, cp.x, cp.y);
- if (!isNullish(ctx)) ctx.quadraticCurveTo(cntrl.x, cntrl.y, cp.x, cp.y);
- }
-
- break;
-
- case 'A':
- case 'a':
- while (!pp.isCommandOrEnd()) {
- const curr = pp.current;
- let rx = pp.getScalar();
- let ry = pp.getScalar();
- const xAxisRotation = pp.getScalar() * (Math.PI / 180.0);
- const largeArcFlag = pp.getScalar();
- const sweepFlag = pp.getScalar();
- const cp = pp.getAsCurrentPoint(); // Conversion from endpoint to center parameterization
- // https://www.w3.org/TR/SVG11/implnote.html#ArcConversionEndpointToCenter
- // x1', y1'
-
- const currp = new svg.Point(Math.cos(xAxisRotation) * (curr.x - cp.x) / 2.0 + Math.sin(xAxisRotation) * (curr.y - cp.y) / 2.0, -Math.sin(xAxisRotation) * (curr.x - cp.x) / 2.0 + Math.cos(xAxisRotation) * (curr.y - cp.y) / 2.0); // adjust radii
-
- const l = currp.x ** 2 / rx ** 2 + currp.y ** 2 / ry ** 2;
-
- if (l > 1) {
- rx *= Math.sqrt(l);
- ry *= Math.sqrt(l);
- } // cx', cy'
-
-
- let s = (largeArcFlag === sweepFlag ? -1 : 1) * Math.sqrt((rx ** 2 * ry ** 2 - rx ** 2 * currp.y ** 2 - ry ** 2 * currp.x ** 2) / (rx ** 2 * currp.y ** 2 + ry ** 2 * currp.x ** 2));
- if (isNaN(s)) s = 0;
- const cpp = new svg.Point(s * rx * currp.y / ry, s * -ry * currp.x / rx); // cx, cy
-
- const centp = new svg.Point((curr.x + cp.x) / 2.0 + Math.cos(xAxisRotation) * cpp.x - Math.sin(xAxisRotation) * cpp.y, (curr.y + cp.y) / 2.0 + Math.sin(xAxisRotation) * cpp.x + Math.cos(xAxisRotation) * cpp.y); // vector magnitude
-
- const m = function (v) {
- return Math.sqrt(v[0] ** 2 + v[1] ** 2);
- }; // ratio between two vectors
-
-
- const r = function (u, v) {
- return (u[0] * v[0] + u[1] * v[1]) / (m(u) * m(v));
- }; // angle between two vectors
-
-
- const a = function (u, v) {
- return (u[0] * v[1] < u[1] * v[0] ? -1 : 1) * Math.acos(r(u, v));
- }; // initial angle
-
-
- const a1 = a([1, 0], [(currp.x - cpp.x) / rx, (currp.y - cpp.y) / ry]); // angle delta
-
- const u = [(currp.x - cpp.x) / rx, (currp.y - cpp.y) / ry];
- const v = [(-currp.x - cpp.x) / rx, (-currp.y - cpp.y) / ry];
- let ad = a(u, v);
- if (r(u, v) <= -1) ad = Math.PI;
- if (r(u, v) >= 1) ad = 0; // for markers
-
- const dir = 1 - sweepFlag ? 1.0 : -1.0;
- const ah = a1 + dir * (ad / 2.0);
- const halfWay = new svg.Point(centp.x + rx * Math.cos(ah), centp.y + ry * Math.sin(ah));
- pp.addMarkerAngle(halfWay, ah - dir * Math.PI / 2);
- pp.addMarkerAngle(cp, ah - dir * Math.PI);
- bb.addPoint(cp.x, cp.y); // TODO: this is too naive, make it better
-
- if (!isNullish(ctx)) {
- const _r = rx > ry ? rx : ry;
-
- const sx = rx > ry ? 1 : rx / ry;
- const sy = rx > ry ? ry / rx : 1;
- ctx.translate(centp.x, centp.y);
- ctx.rotate(xAxisRotation);
- ctx.scale(sx, sy);
- ctx.arc(0, 0, _r, a1, a1 + ad, 1 - sweepFlag);
- ctx.scale(1 / sx, 1 / sy);
- ctx.rotate(-xAxisRotation);
- ctx.translate(-centp.x, -centp.y);
+ case 'H':
+ case 'h':
+ while (!pp.isCommandOrEnd()) {
+ var newP = new svg.Point((pp.isRelativeCommand() ? pp.current.x : 0) + pp.getScalar(), pp.current.y);
+ pp.addMarker(newP, pp.current);
+ pp.current = newP;
+ bb.addPoint(pp.current.x, pp.current.y);
+ if (!isNullish(ctx)) ctx.lineTo(pp.current.x, pp.current.y);
}
- }
- break;
+ break;
- case 'Z':
- case 'z':
- if (!isNullish(ctx)) ctx.closePath();
- pp.current = pp.start;
+ case 'V':
+ case 'v':
+ while (!pp.isCommandOrEnd()) {
+ var _newP = new svg.Point(pp.current.x, (pp.isRelativeCommand() ? pp.current.y : 0) + pp.getScalar());
+
+ pp.addMarker(_newP, pp.current);
+ pp.current = _newP;
+ bb.addPoint(pp.current.x, pp.current.y);
+ if (!isNullish(ctx)) ctx.lineTo(pp.current.x, pp.current.y);
+ }
+
+ break;
+
+ case 'C':
+ case 'c':
+ while (!pp.isCommandOrEnd()) {
+ var curr = pp.current;
+ var p1 = pp.getPoint();
+ var cntrl = pp.getAsControlPoint();
+ var cp = pp.getAsCurrentPoint();
+ pp.addMarker(cp, cntrl, p1);
+ bb.addBezierCurve(curr.x, curr.y, p1.x, p1.y, cntrl.x, cntrl.y, cp.x, cp.y);
+ if (!isNullish(ctx)) ctx.bezierCurveTo(p1.x, p1.y, cntrl.x, cntrl.y, cp.x, cp.y);
+ }
+
+ break;
+
+ case 'S':
+ case 's':
+ while (!pp.isCommandOrEnd()) {
+ var _curr = pp.current;
+
+ var _p3 = pp.getReflectedControlPoint();
+
+ var _cntrl = pp.getAsControlPoint();
+
+ var _cp = pp.getAsCurrentPoint();
+
+ pp.addMarker(_cp, _cntrl, _p3);
+ bb.addBezierCurve(_curr.x, _curr.y, _p3.x, _p3.y, _cntrl.x, _cntrl.y, _cp.x, _cp.y);
+ if (!isNullish(ctx)) ctx.bezierCurveTo(_p3.x, _p3.y, _cntrl.x, _cntrl.y, _cp.x, _cp.y);
+ }
+
+ break;
+
+ case 'Q':
+ case 'q':
+ while (!pp.isCommandOrEnd()) {
+ var _curr2 = pp.current;
+
+ var _cntrl2 = pp.getAsControlPoint();
+
+ var _cp2 = pp.getAsCurrentPoint();
+
+ pp.addMarker(_cp2, _cntrl2, _cntrl2);
+ bb.addQuadraticCurve(_curr2.x, _curr2.y, _cntrl2.x, _cntrl2.y, _cp2.x, _cp2.y);
+ if (!isNullish(ctx)) ctx.quadraticCurveTo(_cntrl2.x, _cntrl2.y, _cp2.x, _cp2.y);
+ }
+
+ break;
+
+ case 'T':
+ case 't':
+ while (!pp.isCommandOrEnd()) {
+ var _curr3 = pp.current;
+
+ var _cntrl3 = pp.getReflectedControlPoint();
+
+ pp.control = _cntrl3;
+
+ var _cp3 = pp.getAsCurrentPoint();
+
+ pp.addMarker(_cp3, _cntrl3, _cntrl3);
+ bb.addQuadraticCurve(_curr3.x, _curr3.y, _cntrl3.x, _cntrl3.y, _cp3.x, _cp3.y);
+ if (!isNullish(ctx)) ctx.quadraticCurveTo(_cntrl3.x, _cntrl3.y, _cp3.x, _cp3.y);
+ }
+
+ break;
+
+ case 'A':
+ case 'a':
+ var _loop2 = function _loop2() {
+ var curr = pp.current;
+ var rx = pp.getScalar();
+ var ry = pp.getScalar();
+ var xAxisRotation = pp.getScalar() * (Math.PI / 180.0);
+ var largeArcFlag = pp.getScalar();
+ var sweepFlag = pp.getScalar();
+ var cp = pp.getAsCurrentPoint(); // Conversion from endpoint to center parameterization
+ // https://www.w3.org/TR/SVG11/implnote.html#ArcConversionEndpointToCenter
+ // x1', y1'
+
+ var currp = new svg.Point(Math.cos(xAxisRotation) * (curr.x - cp.x) / 2.0 + Math.sin(xAxisRotation) * (curr.y - cp.y) / 2.0, -Math.sin(xAxisRotation) * (curr.x - cp.x) / 2.0 + Math.cos(xAxisRotation) * (curr.y - cp.y) / 2.0); // adjust radii
+
+ var l = Math.pow(currp.x, 2) / Math.pow(rx, 2) + Math.pow(currp.y, 2) / Math.pow(ry, 2);
+
+ if (l > 1) {
+ rx *= Math.sqrt(l);
+ ry *= Math.sqrt(l);
+ } // cx', cy'
+
+
+ var s = (largeArcFlag === sweepFlag ? -1 : 1) * Math.sqrt((Math.pow(rx, 2) * Math.pow(ry, 2) - Math.pow(rx, 2) * Math.pow(currp.y, 2) - Math.pow(ry, 2) * Math.pow(currp.x, 2)) / (Math.pow(rx, 2) * Math.pow(currp.y, 2) + Math.pow(ry, 2) * Math.pow(currp.x, 2)));
+ if (isNaN(s)) s = 0;
+ var cpp = new svg.Point(s * rx * currp.y / ry, s * -ry * currp.x / rx); // cx, cy
+
+ var centp = new svg.Point((curr.x + cp.x) / 2.0 + Math.cos(xAxisRotation) * cpp.x - Math.sin(xAxisRotation) * cpp.y, (curr.y + cp.y) / 2.0 + Math.sin(xAxisRotation) * cpp.x + Math.cos(xAxisRotation) * cpp.y); // vector magnitude
+
+ var m = function m(v) {
+ return Math.sqrt(Math.pow(v[0], 2) + Math.pow(v[1], 2));
+ }; // ratio between two vectors
+
+
+ var r = function r(u, v) {
+ return (u[0] * v[0] + u[1] * v[1]) / (m(u) * m(v));
+ }; // angle between two vectors
+
+
+ var a = function a(u, v) {
+ return (u[0] * v[1] < u[1] * v[0] ? -1 : 1) * Math.acos(r(u, v));
+ }; // initial angle
+
+
+ var a1 = a([1, 0], [(currp.x - cpp.x) / rx, (currp.y - cpp.y) / ry]); // angle delta
+
+ var u = [(currp.x - cpp.x) / rx, (currp.y - cpp.y) / ry];
+ var v = [(-currp.x - cpp.x) / rx, (-currp.y - cpp.y) / ry];
+ var ad = a(u, v);
+ if (r(u, v) <= -1) ad = Math.PI;
+ if (r(u, v) >= 1) ad = 0; // for markers
+
+ var dir = 1 - sweepFlag ? 1.0 : -1.0;
+ var ah = a1 + dir * (ad / 2.0);
+ var halfWay = new svg.Point(centp.x + rx * Math.cos(ah), centp.y + ry * Math.sin(ah));
+ pp.addMarkerAngle(halfWay, ah - dir * Math.PI / 2);
+ pp.addMarkerAngle(cp, ah - dir * Math.PI);
+ bb.addPoint(cp.x, cp.y); // TODO: this is too naive, make it better
+
+ if (!isNullish(ctx)) {
+ var _r = rx > ry ? rx : ry;
+
+ var sx = rx > ry ? 1 : rx / ry;
+ var sy = rx > ry ? ry / rx : 1;
+ ctx.translate(centp.x, centp.y);
+ ctx.rotate(xAxisRotation);
+ ctx.scale(sx, sy);
+ ctx.arc(0, 0, _r, a1, a1 + ad, 1 - sweepFlag);
+ ctx.scale(1 / sx, 1 / sy);
+ ctx.rotate(-xAxisRotation);
+ ctx.translate(-centp.x, -centp.y);
+ }
+ };
+
+ while (!pp.isCommandOrEnd()) {
+ _loop2();
+ }
+
+ break;
+
+ case 'Z':
+ case 'z':
+ if (!isNullish(ctx)) ctx.closePath();
+ pp.current = pp.start;
+ }
}
+
+ return bb;
}
+ }, {
+ key: "getMarkers",
+ value: function getMarkers() {
+ var points = this.PathParser.getMarkerPoints();
+ var angles = this.PathParser.getMarkerAngles();
+ var markers = points.map(function (point, i) {
+ return [point, angles[i]];
+ });
+ return markers;
+ }
+ }]);
- return bb;
+ return _class14;
+ }(svg.Element.PathElementBase); // pattern element
+
+
+ svg.Element.pattern = /*#__PURE__*/function (_svg$Element$ElementB2) {
+ _inherits(_class15, _svg$Element$ElementB2);
+
+ var _super14 = _createSuper(_class15);
+
+ function _class15() {
+ _classCallCheck(this, _class15);
+
+ return _super14.apply(this, arguments);
}
- getMarkers() {
- const points = this.PathParser.getMarkerPoints();
- const angles = this.PathParser.getMarkerAngles();
- const markers = points.map((point, i) => {
- return [point, angles[i]];
- });
- return markers;
- }
+ _createClass(_class15, [{
+ key: "createPattern",
+ value: function createPattern(ctx, element) {
+ var width = this.attribute('width').toPixels('x', true);
+ var height = this.attribute('height').toPixels('y', true); // render me using a temporary svg element
- }; // pattern element
+ var tempSvg = new svg.Element.svg();
+ tempSvg.attributes.viewBox = new svg.Property('viewBox', this.attribute('viewBox').value);
+ tempSvg.attributes.width = new svg.Property('width', width + 'px');
+ tempSvg.attributes.height = new svg.Property('height', height + 'px');
+ tempSvg.attributes.transform = new svg.Property('transform', this.attribute('patternTransform').value);
+ tempSvg.children = this.children;
+ var c = document.createElement('canvas');
+ c.width = width;
+ c.height = height;
+ var cctx = c.getContext('2d');
- svg.Element.pattern = class extends svg.Element.ElementBase {
- createPattern(ctx, element) {
- const width = this.attribute('width').toPixels('x', true);
- const height = this.attribute('height').toPixels('y', true); // render me using a temporary svg element
-
- const tempSvg = new svg.Element.svg();
- tempSvg.attributes.viewBox = new svg.Property('viewBox', this.attribute('viewBox').value);
- tempSvg.attributes.width = new svg.Property('width', width + 'px');
- tempSvg.attributes.height = new svg.Property('height', height + 'px');
- tempSvg.attributes.transform = new svg.Property('transform', this.attribute('patternTransform').value);
- tempSvg.children = this.children;
- const c = document.createElement('canvas');
- c.width = width;
- c.height = height;
- const cctx = c.getContext('2d');
-
- if (this.attribute('x').hasValue() && this.attribute('y').hasValue()) {
- cctx.translate(this.attribute('x').toPixels('x', true), this.attribute('y').toPixels('y', true));
- } // render 3x3 grid so when we transform there's no white space on edges
+ if (this.attribute('x').hasValue() && this.attribute('y').hasValue()) {
+ cctx.translate(this.attribute('x').toPixels('x', true), this.attribute('y').toPixels('y', true));
+ } // render 3x3 grid so when we transform there's no white space on edges
- for (let x = -1; x <= 1; x++) {
- for (let y = -1; y <= 1; y++) {
- cctx.save();
- cctx.translate(x * c.width, y * c.height);
- tempSvg.render(cctx);
- cctx.restore();
+ for (var x = -1; x <= 1; x++) {
+ for (var y = -1; y <= 1; y++) {
+ cctx.save();
+ cctx.translate(x * c.width, y * c.height);
+ tempSvg.render(cctx);
+ cctx.restore();
+ }
}
+
+ var pattern = ctx.createPattern(c, 'repeat');
+ return pattern;
}
+ }]);
- const pattern = ctx.createPattern(c, 'repeat');
- return pattern;
+ return _class15;
+ }(svg.Element.ElementBase); // marker element
+
+
+ svg.Element.marker = /*#__PURE__*/function (_svg$Element$ElementB3) {
+ _inherits(_class16, _svg$Element$ElementB3);
+
+ var _super15 = _createSuper(_class16);
+
+ function _class16() {
+ _classCallCheck(this, _class16);
+
+ return _super15.apply(this, arguments);
}
- }; // marker element
+ _createClass(_class16, [{
+ key: "render",
+ value: function render(ctx, point, angle) {
+ ctx.translate(point.x, point.y);
+ if (this.attribute('orient').valueOrDefault('auto') === 'auto') ctx.rotate(angle);
+ if (this.attribute('markerUnits').valueOrDefault('strokeWidth') === 'strokeWidth') ctx.scale(ctx.lineWidth, ctx.lineWidth);
+ ctx.save(); // render me using a temporary svg element
- svg.Element.marker = class extends svg.Element.ElementBase {
- render(ctx, point, angle) {
- ctx.translate(point.x, point.y);
- if (this.attribute('orient').valueOrDefault('auto') === 'auto') ctx.rotate(angle);
- if (this.attribute('markerUnits').valueOrDefault('strokeWidth') === 'strokeWidth') ctx.scale(ctx.lineWidth, ctx.lineWidth);
- ctx.save(); // render me using a temporary svg element
+ var tempSvg = new svg.Element.svg();
+ tempSvg.attributes.viewBox = new svg.Property('viewBox', this.attribute('viewBox').value);
+ tempSvg.attributes.refX = new svg.Property('refX', this.attribute('refX').value);
+ tempSvg.attributes.refY = new svg.Property('refY', this.attribute('refY').value);
+ tempSvg.attributes.width = new svg.Property('width', this.attribute('markerWidth').value);
+ tempSvg.attributes.height = new svg.Property('height', this.attribute('markerHeight').value);
+ tempSvg.attributes.fill = new svg.Property('fill', this.attribute('fill').valueOrDefault('black'));
+ tempSvg.attributes.stroke = new svg.Property('stroke', this.attribute('stroke').valueOrDefault('none'));
+ tempSvg.children = this.children;
+ tempSvg.render(ctx);
+ ctx.restore();
+ if (this.attribute('markerUnits').valueOrDefault('strokeWidth') === 'strokeWidth') ctx.scale(1 / ctx.lineWidth, 1 / ctx.lineWidth);
+ if (this.attribute('orient').valueOrDefault('auto') === 'auto') ctx.rotate(-angle);
+ ctx.translate(-point.x, -point.y);
+ }
+ }]);
- const tempSvg = new svg.Element.svg();
- tempSvg.attributes.viewBox = new svg.Property('viewBox', this.attribute('viewBox').value);
- tempSvg.attributes.refX = new svg.Property('refX', this.attribute('refX').value);
- tempSvg.attributes.refY = new svg.Property('refY', this.attribute('refY').value);
- tempSvg.attributes.width = new svg.Property('width', this.attribute('markerWidth').value);
- tempSvg.attributes.height = new svg.Property('height', this.attribute('markerHeight').value);
- tempSvg.attributes.fill = new svg.Property('fill', this.attribute('fill').valueOrDefault('black'));
- tempSvg.attributes.stroke = new svg.Property('stroke', this.attribute('stroke').valueOrDefault('none'));
- tempSvg.children = this.children;
- tempSvg.render(ctx);
- ctx.restore();
- if (this.attribute('markerUnits').valueOrDefault('strokeWidth') === 'strokeWidth') ctx.scale(1 / ctx.lineWidth, 1 / ctx.lineWidth);
- if (this.attribute('orient').valueOrDefault('auto') === 'auto') ctx.rotate(-angle);
- ctx.translate(-point.x, -point.y);
+ return _class16;
+ }(svg.Element.ElementBase); // definitions element
+
+
+ svg.Element.defs = /*#__PURE__*/function (_svg$Element$ElementB4) {
+ _inherits(_class17, _svg$Element$ElementB4);
+
+ var _super16 = _createSuper(_class17);
+
+ function _class17() {
+ _classCallCheck(this, _class17);
+
+ return _super16.apply(this, arguments);
}
- }; // definitions element
+ _createClass(_class17, [{
+ key: "render",
+ value: function render(ctx) {// NOOP
+ }
+ }]);
- svg.Element.defs = class extends svg.Element.ElementBase {
- render(ctx) {// NOOP
- }
+ return _class17;
+ }(svg.Element.ElementBase); // base for gradients
- }; // base for gradients
- svg.Element.GradientBase = class extends svg.Element.ElementBase {
- constructor(node) {
- super(node);
- this.gradientUnits = this.attribute('gradientUnits').valueOrDefault('objectBoundingBox');
- this.stops = [];
- this.children.forEach(child => {
+ svg.Element.GradientBase = /*#__PURE__*/function (_svg$Element$ElementB5) {
+ _inherits(_class18, _svg$Element$ElementB5);
+
+ var _super17 = _createSuper(_class18);
+
+ function _class18(node) {
+ var _this10;
+
+ _classCallCheck(this, _class18);
+
+ _this10 = _super17.call(this, node);
+ _this10.gradientUnits = _this10.attribute('gradientUnits').valueOrDefault('objectBoundingBox');
+ _this10.stops = [];
+
+ _this10.children.forEach(function (child) {
if (child.type === 'stop') {
- this.stops.push(child);
+ _this10.stops.push(child);
}
});
+
+ return _this10;
}
- getGradient() {// OVERRIDE ME!
- }
+ _createClass(_class18, [{
+ key: "getGradient",
+ value: function getGradient() {// OVERRIDE ME!
+ }
+ }, {
+ key: "createGradient",
+ value: function createGradient(ctx, element, parentOpacityProp) {
+ var stopsContainer = this.getHrefAttribute().hasValue() ? this.getHrefAttribute().getDefinition() : this;
- createGradient(ctx, element, parentOpacityProp) {
- const stopsContainer = this.getHrefAttribute().hasValue() ? this.getHrefAttribute().getDefinition() : this;
+ var addParentOpacity = function addParentOpacity(color) {
+ if (parentOpacityProp.hasValue()) {
+ var p = new svg.Property('color', color);
+ return p.addOpacity(parentOpacityProp).value;
+ }
- const addParentOpacity = function (color) {
- if (parentOpacityProp.hasValue()) {
- const p = new svg.Property('color', color);
- return p.addOpacity(parentOpacityProp).value;
+ return color;
+ };
+
+ var g = this.getGradient(ctx, element);
+ if (isNullish(g)) return addParentOpacity(stopsContainer.stops[stopsContainer.stops.length - 1].color);
+ stopsContainer.stops.forEach(function (_ref10) {
+ var offset = _ref10.offset,
+ color = _ref10.color;
+ g.addColorStop(offset, addParentOpacity(color));
+ });
+
+ if (this.attribute('gradientTransform').hasValue()) {
+ // render as transformed pattern on temporary canvas
+ var rootView = svg.ViewPort.viewPorts[0];
+ var rect = new svg.Element.rect();
+ rect.attributes.x = new svg.Property('x', -svg.MAX_VIRTUAL_PIXELS / 3.0);
+ rect.attributes.y = new svg.Property('y', -svg.MAX_VIRTUAL_PIXELS / 3.0);
+ rect.attributes.width = new svg.Property('width', svg.MAX_VIRTUAL_PIXELS);
+ rect.attributes.height = new svg.Property('height', svg.MAX_VIRTUAL_PIXELS);
+ var group = new svg.Element.g();
+ group.attributes.transform = new svg.Property('transform', this.attribute('gradientTransform').value);
+ group.children = [rect];
+ var tempSvg = new svg.Element.svg();
+ tempSvg.attributes.x = new svg.Property('x', 0);
+ tempSvg.attributes.y = new svg.Property('y', 0);
+ tempSvg.attributes.width = new svg.Property('width', rootView.width);
+ tempSvg.attributes.height = new svg.Property('height', rootView.height);
+ tempSvg.children = [group];
+ var c = document.createElement('canvas');
+ c.width = rootView.width;
+ c.height = rootView.height;
+ var tempCtx = c.getContext('2d');
+ tempCtx.fillStyle = g;
+ tempSvg.render(tempCtx);
+ return tempCtx.createPattern(c, 'no-repeat');
}
- return color;
- };
-
- const g = this.getGradient(ctx, element);
- if (isNullish(g)) return addParentOpacity(stopsContainer.stops[stopsContainer.stops.length - 1].color);
- stopsContainer.stops.forEach(({
- offset,
- color
- }) => {
- g.addColorStop(offset, addParentOpacity(color));
- });
-
- if (this.attribute('gradientTransform').hasValue()) {
- // render as transformed pattern on temporary canvas
- const rootView = svg.ViewPort.viewPorts[0];
- const rect = new svg.Element.rect();
- rect.attributes.x = new svg.Property('x', -svg.MAX_VIRTUAL_PIXELS / 3.0);
- rect.attributes.y = new svg.Property('y', -svg.MAX_VIRTUAL_PIXELS / 3.0);
- rect.attributes.width = new svg.Property('width', svg.MAX_VIRTUAL_PIXELS);
- rect.attributes.height = new svg.Property('height', svg.MAX_VIRTUAL_PIXELS);
- const group = new svg.Element.g();
- group.attributes.transform = new svg.Property('transform', this.attribute('gradientTransform').value);
- group.children = [rect];
- const tempSvg = new svg.Element.svg();
- tempSvg.attributes.x = new svg.Property('x', 0);
- tempSvg.attributes.y = new svg.Property('y', 0);
- tempSvg.attributes.width = new svg.Property('width', rootView.width);
- tempSvg.attributes.height = new svg.Property('height', rootView.height);
- tempSvg.children = [group];
- const c = document.createElement('canvas');
- c.width = rootView.width;
- c.height = rootView.height;
- const tempCtx = c.getContext('2d');
- tempCtx.fillStyle = g;
- tempSvg.render(tempCtx);
- return tempCtx.createPattern(c, 'no-repeat');
+ return g;
}
+ }]);
- return g;
+ return _class18;
+ }(svg.Element.ElementBase); // linear gradient element
+
+
+ svg.Element.linearGradient = /*#__PURE__*/function (_svg$Element$Gradient) {
+ _inherits(_class19, _svg$Element$Gradient);
+
+ var _super18 = _createSuper(_class19);
+
+ function _class19() {
+ _classCallCheck(this, _class19);
+
+ return _super18.apply(this, arguments);
}
- }; // linear gradient element
+ _createClass(_class19, [{
+ key: "getGradient",
+ value: function getGradient(ctx, element) {
+ var useBB = this.gradientUnits === 'objectBoundingBox' && element.getBoundingBox;
+ var bb = useBB ? element.getBoundingBox() : null;
- svg.Element.linearGradient = class extends svg.Element.GradientBase {
- getGradient(ctx, element) {
- const useBB = this.gradientUnits === 'objectBoundingBox' && element.getBoundingBox;
- const bb = useBB ? element.getBoundingBox() : null;
-
- if (!this.attribute('x1').hasValue() && !this.attribute('y1').hasValue() && !this.attribute('x2').hasValue() && !this.attribute('y2').hasValue()) {
- this.attribute('x1', true).value = 0;
- this.attribute('y1', true).value = 0;
- this.attribute('x2', true).value = 1;
- this.attribute('y2', true).value = 0;
- }
-
- const x1 = useBB ? bb.x() + bb.width() * this.attribute('x1').numValue() : this.attribute('x1').toPixels('x');
- const y1 = useBB ? bb.y() + bb.height() * this.attribute('y1').numValue() : this.attribute('y1').toPixels('y');
- const x2 = useBB ? bb.x() + bb.width() * this.attribute('x2').numValue() : this.attribute('x2').toPixels('x');
- const y2 = useBB ? bb.y() + bb.height() * this.attribute('y2').numValue() : this.attribute('y2').toPixels('y');
- if (x1 === x2 && y1 === y2) return null;
- return ctx.createLinearGradient(x1, y1, x2, y2);
- }
-
- }; // radial gradient element
-
- svg.Element.radialGradient = class extends svg.Element.GradientBase {
- getGradient(ctx, element) {
- const useBB = this.gradientUnits === 'objectBoundingBox' && element.getBoundingBox;
- const bb = useBB ? element.getBoundingBox() : null;
- if (!this.attribute('cx').hasValue()) this.attribute('cx', true).value = '50%';
- if (!this.attribute('cy').hasValue()) this.attribute('cy', true).value = '50%';
- if (!this.attribute('r').hasValue()) this.attribute('r', true).value = '50%';
- const cx = useBB ? bb.x() + bb.width() * this.attribute('cx').numValue() : this.attribute('cx').toPixels('x');
- const cy = useBB ? bb.y() + bb.height() * this.attribute('cy').numValue() : this.attribute('cy').toPixels('y');
- let fx = cx;
- let fy = cy;
-
- if (this.attribute('fx').hasValue()) {
- fx = useBB ? bb.x() + bb.width() * this.attribute('fx').numValue() : this.attribute('fx').toPixels('x');
- }
-
- if (this.attribute('fy').hasValue()) {
- fy = useBB ? bb.y() + bb.height() * this.attribute('fy').numValue() : this.attribute('fy').toPixels('y');
- }
-
- const r = useBB ? (bb.width() + bb.height()) / 2.0 * this.attribute('r').numValue() : this.attribute('r').toPixels();
- return ctx.createRadialGradient(fx, fy, 0, cx, cy, r);
- }
-
- }; // gradient stop element
-
- svg.Element.stop = class extends svg.Element.ElementBase {
- constructor(node) {
- super(node);
- this.offset = this.attribute('offset').numValue();
- if (this.offset < 0) this.offset = 0;
- if (this.offset > 1) this.offset = 1;
- let stopColor = this.style('stop-color');
-
- if (this.style('stop-opacity').hasValue()) {
- stopColor = stopColor.addOpacity(this.style('stop-opacity'));
- }
-
- this.color = stopColor.value;
- }
-
- }; // animation base element
-
- svg.Element.AnimateBase = class extends svg.Element.ElementBase {
- constructor(node) {
- super(node);
- svg.Animations.push(this);
- this.duration = 0.0;
- this.begin = this.attribute('begin').toMilliseconds();
- this.maxDuration = this.begin + this.attribute('dur').toMilliseconds();
- this.initialValue = null;
- this.initialUnits = '';
- this.removed = false;
- this.from = this.attribute('from');
- this.to = this.attribute('to');
- this.values = this.attribute('values');
- if (this.values.hasValue()) this.values.value = this.values.value.split(';');
- }
-
- getProperty() {
- const attributeType = this.attribute('attributeType').value;
- const attributeName = this.attribute('attributeName').value;
-
- if (attributeType === 'CSS') {
- return this.parent.style(attributeName, true);
- }
-
- return this.parent.attribute(attributeName, true);
- }
-
- calcValue() {
- // OVERRIDE ME!
- return '';
- }
-
- update(delta) {
- // set initial value
- if (isNullish(this.initialValue)) {
- this.initialValue = this.getProperty().value;
- this.initialUnits = this.getProperty().getUnits();
- } // if we're past the end time
-
-
- if (this.duration > this.maxDuration) {
- // loop for indefinitely repeating animations
- if (this.attribute('repeatCount').value === 'indefinite' || this.attribute('repeatDur').value === 'indefinite') {
- this.duration = 0.0;
- } else if (this.attribute('fill').valueOrDefault('remove') === 'freeze' && !this.frozen) {
- this.frozen = true;
- this.parent.animationFrozen = true;
- this.parent.animationFrozenValue = this.getProperty().value;
- } else if (this.attribute('fill').valueOrDefault('remove') === 'remove' && !this.removed) {
- this.removed = true;
- this.getProperty().value = this.parent.animationFrozen ? this.parent.animationFrozenValue : this.initialValue;
- return true;
+ if (!this.attribute('x1').hasValue() && !this.attribute('y1').hasValue() && !this.attribute('x2').hasValue() && !this.attribute('y2').hasValue()) {
+ this.attribute('x1', true).value = 0;
+ this.attribute('y1', true).value = 0;
+ this.attribute('x2', true).value = 1;
+ this.attribute('y2', true).value = 0;
}
- return false;
+ var x1 = useBB ? bb.x() + bb.width() * this.attribute('x1').numValue() : this.attribute('x1').toPixels('x');
+ var y1 = useBB ? bb.y() + bb.height() * this.attribute('y1').numValue() : this.attribute('y1').toPixels('y');
+ var x2 = useBB ? bb.x() + bb.width() * this.attribute('x2').numValue() : this.attribute('x2').toPixels('x');
+ var y2 = useBB ? bb.y() + bb.height() * this.attribute('y2').numValue() : this.attribute('y2').toPixels('y');
+ if (x1 === x2 && y1 === y2) return null;
+ return ctx.createLinearGradient(x1, y1, x2, y2);
}
+ }]);
- this.duration += delta; // if we're past the begin time
+ return _class19;
+ }(svg.Element.GradientBase); // radial gradient element
- let updated = false;
- if (this.begin < this.duration) {
- let newValue = this.calcValue(); // tween
+ svg.Element.radialGradient = /*#__PURE__*/function (_svg$Element$Gradient2) {
+ _inherits(_class20, _svg$Element$Gradient2);
- if (this.attribute('type').hasValue()) {
- // for transform, etc.
- const type = this.attribute('type').value;
- newValue = type + '(' + newValue + ')';
+ var _super19 = _createSuper(_class20);
+
+ function _class20() {
+ _classCallCheck(this, _class20);
+
+ return _super19.apply(this, arguments);
+ }
+
+ _createClass(_class20, [{
+ key: "getGradient",
+ value: function getGradient(ctx, element) {
+ var useBB = this.gradientUnits === 'objectBoundingBox' && element.getBoundingBox;
+ var bb = useBB ? element.getBoundingBox() : null;
+ if (!this.attribute('cx').hasValue()) this.attribute('cx', true).value = '50%';
+ if (!this.attribute('cy').hasValue()) this.attribute('cy', true).value = '50%';
+ if (!this.attribute('r').hasValue()) this.attribute('r', true).value = '50%';
+ var cx = useBB ? bb.x() + bb.width() * this.attribute('cx').numValue() : this.attribute('cx').toPixels('x');
+ var cy = useBB ? bb.y() + bb.height() * this.attribute('cy').numValue() : this.attribute('cy').toPixels('y');
+ var fx = cx;
+ var fy = cy;
+
+ if (this.attribute('fx').hasValue()) {
+ fx = useBB ? bb.x() + bb.width() * this.attribute('fx').numValue() : this.attribute('fx').toPixels('x');
}
- this.getProperty().value = newValue;
- updated = true;
+ if (this.attribute('fy').hasValue()) {
+ fy = useBB ? bb.y() + bb.height() * this.attribute('fy').numValue() : this.attribute('fy').toPixels('y');
+ }
+
+ var r = useBB ? (bb.width() + bb.height()) / 2.0 * this.attribute('r').numValue() : this.attribute('r').toPixels();
+ return ctx.createRadialGradient(fx, fy, 0, cx, cy, r);
+ }
+ }]);
+
+ return _class20;
+ }(svg.Element.GradientBase); // gradient stop element
+
+
+ svg.Element.stop = /*#__PURE__*/function (_svg$Element$ElementB6) {
+ _inherits(_class21, _svg$Element$ElementB6);
+
+ var _super20 = _createSuper(_class21);
+
+ function _class21(node) {
+ var _this11;
+
+ _classCallCheck(this, _class21);
+
+ _this11 = _super20.call(this, node);
+ _this11.offset = _this11.attribute('offset').numValue();
+ if (_this11.offset < 0) _this11.offset = 0;
+ if (_this11.offset > 1) _this11.offset = 1;
+
+ var stopColor = _this11.style('stop-color');
+
+ if (_this11.style('stop-opacity').hasValue()) {
+ stopColor = stopColor.addOpacity(_this11.style('stop-opacity'));
}
- return updated;
- } // fraction of duration we've covered
+ _this11.color = stopColor.value;
+ return _this11;
+ }
+
+ return _class21;
+ }(svg.Element.ElementBase); // animation base element
- progress() {
- const ret = {
- progress: (this.duration - this.begin) / (this.maxDuration - this.begin)
- };
+ svg.Element.AnimateBase = /*#__PURE__*/function (_svg$Element$ElementB7) {
+ _inherits(_class22, _svg$Element$ElementB7);
- if (this.values.hasValue()) {
- const p = ret.progress * (this.values.value.length - 1);
- const lb = Math.floor(p),
+ var _super21 = _createSuper(_class22);
+
+ function _class22(node) {
+ var _this12;
+
+ _classCallCheck(this, _class22);
+
+ _this12 = _super21.call(this, node);
+ svg.Animations.push(_assertThisInitialized(_this12));
+ _this12.duration = 0.0;
+ _this12.begin = _this12.attribute('begin').toMilliseconds();
+ _this12.maxDuration = _this12.begin + _this12.attribute('dur').toMilliseconds();
+ _this12.initialValue = null;
+ _this12.initialUnits = '';
+ _this12.removed = false;
+ _this12.from = _this12.attribute('from');
+ _this12.to = _this12.attribute('to');
+ _this12.values = _this12.attribute('values');
+ if (_this12.values.hasValue()) _this12.values.value = _this12.values.value.split(';');
+ return _this12;
+ }
+
+ _createClass(_class22, [{
+ key: "getProperty",
+ value: function getProperty() {
+ var attributeType = this.attribute('attributeType').value;
+ var attributeName = this.attribute('attributeName').value;
+
+ if (attributeType === 'CSS') {
+ return this.parent.style(attributeName, true);
+ }
+
+ return this.parent.attribute(attributeName, true);
+ }
+ }, {
+ key: "calcValue",
+ value: function calcValue() {
+ // OVERRIDE ME!
+ return '';
+ }
+ }, {
+ key: "update",
+ value: function update(delta) {
+ // set initial value
+ if (isNullish(this.initialValue)) {
+ this.initialValue = this.getProperty().value;
+ this.initialUnits = this.getProperty().getUnits();
+ } // if we're past the end time
+
+
+ if (this.duration > this.maxDuration) {
+ // loop for indefinitely repeating animations
+ if (this.attribute('repeatCount').value === 'indefinite' || this.attribute('repeatDur').value === 'indefinite') {
+ this.duration = 0.0;
+ } else if (this.attribute('fill').valueOrDefault('remove') === 'freeze' && !this.frozen) {
+ this.frozen = true;
+ this.parent.animationFrozen = true;
+ this.parent.animationFrozenValue = this.getProperty().value;
+ } else if (this.attribute('fill').valueOrDefault('remove') === 'remove' && !this.removed) {
+ this.removed = true;
+ this.getProperty().value = this.parent.animationFrozen ? this.parent.animationFrozenValue : this.initialValue;
+ return true;
+ }
+
+ return false;
+ }
+
+ this.duration += delta; // if we're past the begin time
+
+ var updated = false;
+
+ if (this.begin < this.duration) {
+ var newValue = this.calcValue(); // tween
+
+ if (this.attribute('type').hasValue()) {
+ // for transform, etc.
+ var type = this.attribute('type').value;
+ newValue = type + '(' + newValue + ')';
+ }
+
+ this.getProperty().value = newValue;
+ updated = true;
+ }
+
+ return updated;
+ } // fraction of duration we've covered
+
+ }, {
+ key: "progress",
+ value: function progress() {
+ var ret = {
+ progress: (this.duration - this.begin) / (this.maxDuration - this.begin)
+ };
+
+ if (this.values.hasValue()) {
+ var p = ret.progress * (this.values.value.length - 1);
+ var lb = Math.floor(p),
ub = Math.ceil(p);
- ret.from = new svg.Property('from', Number.parseFloat(this.values.value[lb]));
- ret.to = new svg.Property('to', Number.parseFloat(this.values.value[ub]));
- ret.progress = (p - lb) / (ub - lb);
- } else {
- ret.from = this.from;
- ret.to = this.to;
+ ret.from = new svg.Property('from', Number.parseFloat(this.values.value[lb]));
+ ret.to = new svg.Property('to', Number.parseFloat(this.values.value[ub]));
+ ret.progress = (p - lb) / (ub - lb);
+ } else {
+ ret.from = this.from;
+ ret.to = this.to;
+ }
+
+ return ret;
}
+ }]);
- return ret;
+ return _class22;
+ }(svg.Element.ElementBase); // animate element
+
+
+ svg.Element.animate = /*#__PURE__*/function (_svg$Element$AnimateB) {
+ _inherits(_class23, _svg$Element$AnimateB);
+
+ var _super22 = _createSuper(_class23);
+
+ function _class23() {
+ _classCallCheck(this, _class23);
+
+ return _super22.apply(this, arguments);
}
- }; // animate element
+ _createClass(_class23, [{
+ key: "calcValue",
+ value: function calcValue() {
+ var p = this.progress(); // tween value linearly
- svg.Element.animate = class extends svg.Element.AnimateBase {
- calcValue() {
- const p = this.progress(); // tween value linearly
-
- const newValue = p.from.numValue() + (p.to.numValue() - p.from.numValue()) * p.progress;
- return newValue + this.initialUnits;
- }
-
- }; // animate color element
-
- svg.Element.animateColor = class extends svg.Element.AnimateBase {
- calcValue() {
- const p = this.progress();
- const from = new RGBColor(p.from.value);
- const to = new RGBColor(p.to.value);
-
- if (from.ok && to.ok) {
- // tween color linearly
- const r = from.r + (to.r - from.r) * p.progress;
- const g = from.g + (to.g - from.g) * p.progress;
- const b = from.b + (to.b - from.b) * p.progress;
- return 'rgb(' + Number.parseInt(r) + ',' + Number.parseInt(g) + ',' + Number.parseInt(b) + ')';
+ var newValue = p.from.numValue() + (p.to.numValue() - p.from.numValue()) * p.progress;
+ return newValue + this.initialUnits;
}
+ }]);
- return this.attribute('from').value;
+ return _class23;
+ }(svg.Element.AnimateBase); // animate color element
+
+
+ svg.Element.animateColor = /*#__PURE__*/function (_svg$Element$AnimateB2) {
+ _inherits(_class24, _svg$Element$AnimateB2);
+
+ var _super23 = _createSuper(_class24);
+
+ function _class24() {
+ _classCallCheck(this, _class24);
+
+ return _super23.apply(this, arguments);
}
- }; // animate transform element
+ _createClass(_class24, [{
+ key: "calcValue",
+ value: function calcValue() {
+ var p = this.progress();
+ var from = new RGBColor(p.from.value);
+ var to = new RGBColor(p.to.value);
- svg.Element.animateTransform = class extends svg.Element.animate {
- calcValue() {
- const p = this.progress(); // tween value linearly
+ if (from.ok && to.ok) {
+ // tween color linearly
+ var r = from.r + (to.r - from.r) * p.progress;
+ var g = from.g + (to.g - from.g) * p.progress;
+ var b = from.b + (to.b - from.b) * p.progress;
+ return 'rgb(' + Number.parseInt(r) + ',' + Number.parseInt(g) + ',' + Number.parseInt(b) + ')';
+ }
- const from = svg.ToNumberArray(p.from.value);
- const to = svg.ToNumberArray(p.to.value);
- let newValue = '';
- from.forEach((fr, i) => {
- newValue += fr + (to[i] - fr) * p.progress + ' ';
- });
- return newValue;
+ return this.attribute('from').value;
+ }
+ }]);
+
+ return _class24;
+ }(svg.Element.AnimateBase); // animate transform element
+
+
+ svg.Element.animateTransform = /*#__PURE__*/function (_svg$Element$animate) {
+ _inherits(_class25, _svg$Element$animate);
+
+ var _super24 = _createSuper(_class25);
+
+ function _class25() {
+ _classCallCheck(this, _class25);
+
+ return _super24.apply(this, arguments);
}
- }; // font element
+ _createClass(_class25, [{
+ key: "calcValue",
+ value: function calcValue() {
+ var p = this.progress(); // tween value linearly
- svg.Element.font = class extends svg.Element.ElementBase {
- constructor(node) {
- super(node);
- this.horizAdvX = this.attribute('horiz-adv-x').numValue();
- this.isRTL = false;
- this.isArabic = false;
- this.fontFace = null;
- this.missingGlyph = null;
- this.glyphs = [];
- this.children.forEach(child => {
+ var from = svg.ToNumberArray(p.from.value);
+ var to = svg.ToNumberArray(p.to.value);
+ var newValue = '';
+ from.forEach(function (fr, i) {
+ newValue += fr + (to[i] - fr) * p.progress + ' ';
+ });
+ return newValue;
+ }
+ }]);
+
+ return _class25;
+ }(svg.Element.animate); // font element
+
+
+ svg.Element.font = /*#__PURE__*/function (_svg$Element$ElementB8) {
+ _inherits(_class26, _svg$Element$ElementB8);
+
+ var _super25 = _createSuper(_class26);
+
+ function _class26(node) {
+ var _this13;
+
+ _classCallCheck(this, _class26);
+
+ _this13 = _super25.call(this, node);
+ _this13.horizAdvX = _this13.attribute('horiz-adv-x').numValue();
+ _this13.isRTL = false;
+ _this13.isArabic = false;
+ _this13.fontFace = null;
+ _this13.missingGlyph = null;
+ _this13.glyphs = [];
+
+ _this13.children.forEach(function (child) {
if (child.type === 'font-face') {
- this.fontFace = child;
+ _this13.fontFace = child;
if (child.style('font-family').hasValue()) {
- svg.Definitions[child.style('font-family').value] = this;
+ svg.Definitions[child.style('font-family').value] = _assertThisInitialized(_this13);
}
} else if (child.type === 'missing-glyph') {
- this.missingGlyph = child;
+ _this13.missingGlyph = child;
} else if (child.type === 'glyph') {
if (child.arabicForm !== '') {
- this.isRTL = true;
- this.isArabic = true;
+ _this13.isRTL = true;
+ _this13.isArabic = true;
- if (typeof this.glyphs[child.unicode] === 'undefined') {
- this.glyphs[child.unicode] = [];
+ if (typeof _this13.glyphs[child.unicode] === 'undefined') {
+ _this13.glyphs[child.unicode] = [];
}
- this.glyphs[child.unicode][child.arabicForm] = child;
+ _this13.glyphs[child.unicode][child.arabicForm] = child;
} else {
- this.glyphs[child.unicode] = child;
+ _this13.glyphs[child.unicode] = child;
}
}
});
+
+ return _this13;
}
- }; // font-face element
+ return _class26;
+ }(svg.Element.ElementBase); // font-face element
- svg.Element.fontface = class extends svg.Element.ElementBase {
- constructor(node) {
- super(node);
- this.ascent = this.attribute('ascent').value;
- this.descent = this.attribute('descent').value;
- this.unitsPerEm = this.attribute('units-per-em').numValue();
+
+ svg.Element.fontface = /*#__PURE__*/function (_svg$Element$ElementB9) {
+ _inherits(_class27, _svg$Element$ElementB9);
+
+ var _super26 = _createSuper(_class27);
+
+ function _class27(node) {
+ var _this14;
+
+ _classCallCheck(this, _class27);
+
+ _this14 = _super26.call(this, node);
+ _this14.ascent = _this14.attribute('ascent').value;
+ _this14.descent = _this14.attribute('descent').value;
+ _this14.unitsPerEm = _this14.attribute('units-per-em').numValue();
+ return _this14;
}
- }; // missing-glyph element
+ return _class27;
+ }(svg.Element.ElementBase); // missing-glyph element
- svg.Element.missingglyph = class extends svg.Element.path {
- constructor(node) {
- super(node);
- this.horizAdvX = 0;
+
+ svg.Element.missingglyph = /*#__PURE__*/function (_svg$Element$path) {
+ _inherits(_class28, _svg$Element$path);
+
+ var _super27 = _createSuper(_class28);
+
+ function _class28(node) {
+ var _this15;
+
+ _classCallCheck(this, _class28);
+
+ _this15 = _super27.call(this, node);
+ _this15.horizAdvX = 0;
+ return _this15;
}
- }; // glyph element
+ return _class28;
+ }(svg.Element.path); // glyph element
- svg.Element.glyph = class extends svg.Element.path {
- constructor(node) {
- super(node);
- this.horizAdvX = this.attribute('horiz-adv-x').numValue();
- this.unicode = this.attribute('unicode').value;
- this.arabicForm = this.attribute('arabic-form').value;
+
+ svg.Element.glyph = /*#__PURE__*/function (_svg$Element$path2) {
+ _inherits(_class29, _svg$Element$path2);
+
+ var _super28 = _createSuper(_class29);
+
+ function _class29(node) {
+ var _this16;
+
+ _classCallCheck(this, _class29);
+
+ _this16 = _super28.call(this, node);
+ _this16.horizAdvX = _this16.attribute('horiz-adv-x').numValue();
+ _this16.unicode = _this16.attribute('unicode').value;
+ _this16.arabicForm = _this16.attribute('arabic-form').value;
+ return _this16;
}
- }; // text element
+ return _class29;
+ }(svg.Element.path); // text element
- svg.Element.text = class extends svg.Element.RenderedElementBase {
- constructor(node) {
- super(node, true);
+
+ svg.Element.text = /*#__PURE__*/function (_svg$Element$Rendered3) {
+ _inherits(_class30, _svg$Element$Rendered3);
+
+ var _super29 = _createSuper(_class30);
+
+ function _class30(node) {
+ _classCallCheck(this, _class30);
+
+ return _super29.call(this, node, true);
}
- setContext(ctx) {
- super.setContext(ctx);
- let textBaseline = this.style('dominant-baseline').toTextBaseline();
- if (isNullish(textBaseline)) textBaseline = this.style('alignment-baseline').toTextBaseline();
- if (!isNullish(textBaseline)) ctx.textBaseline = textBaseline;
+ _createClass(_class30, [{
+ key: "setContext",
+ value: function setContext(ctx) {
+ _get(_getPrototypeOf(_class30.prototype), "setContext", this).call(this, ctx);
+
+ var textBaseline = this.style('dominant-baseline').toTextBaseline();
+ if (isNullish(textBaseline)) textBaseline = this.style('alignment-baseline').toTextBaseline();
+ if (!isNullish(textBaseline)) ctx.textBaseline = textBaseline;
+ }
+ }, {
+ key: "getBoundingBox",
+ value: function getBoundingBox() {
+ var x = this.attribute('x').toPixels('x');
+ var y = this.attribute('y').toPixels('y');
+ var fontSize = this.parent.style('font-size').numValueOrDefault(svg.Font.Parse(svg.ctx.font).fontSize);
+ return new svg.BoundingBox(x, y - fontSize, x + Math.floor(fontSize * 2.0 / 3.0) * this.children[0].getText().length, y);
+ }
+ }, {
+ key: "renderChildren",
+ value: function renderChildren(ctx) {
+ var _this17 = this;
+
+ this.x = this.attribute('x').toPixels('x');
+ this.y = this.attribute('y').toPixels('y');
+ this.x += this.getAnchorDelta(ctx, this, 0);
+ this.children.forEach(function (child, i) {
+ _this17.renderChild(ctx, _this17, i);
+ });
+ }
+ }, {
+ key: "getAnchorDelta",
+ value: function getAnchorDelta(ctx, parent, startI) {
+ var textAnchor = this.style('text-anchor').valueOrDefault('start');
+
+ if (textAnchor !== 'start') {
+ var width = 0;
+
+ for (var i = startI; i < parent.children.length; i++) {
+ var child = parent.children[i];
+ if (i > startI && child.attribute('x').hasValue()) break; // new group
+
+ width += child.measureTextRecursive(ctx);
+ }
+
+ return -1 * (textAnchor === 'end' ? width : width / 2.0);
+ }
+
+ return 0;
+ }
+ }, {
+ key: "renderChild",
+ value: function renderChild(ctx, parent, i) {
+ var child = parent.children[i];
+
+ if (child.attribute('x').hasValue()) {
+ child.x = child.attribute('x').toPixels('x') + this.getAnchorDelta(ctx, parent, i);
+ if (child.attribute('dx').hasValue()) child.x += child.attribute('dx').toPixels('x');
+ } else {
+ if (this.attribute('dx').hasValue()) this.x += this.attribute('dx').toPixels('x');
+ if (child.attribute('dx').hasValue()) this.x += child.attribute('dx').toPixels('x');
+ child.x = this.x;
+ }
+
+ this.x = child.x + child.measureText(ctx);
+
+ if (child.attribute('y').hasValue()) {
+ child.y = child.attribute('y').toPixels('y');
+ if (child.attribute('dy').hasValue()) child.y += child.attribute('dy').toPixels('y');
+ } else {
+ if (this.attribute('dy').hasValue()) this.y += this.attribute('dy').toPixels('y');
+ if (child.attribute('dy').hasValue()) this.y += child.attribute('dy').toPixels('y');
+ child.y = this.y;
+ }
+
+ this.y = child.y;
+ child.render(ctx);
+
+ for (var j = 0; j < child.children.length; j++) {
+ this.renderChild(ctx, child, j);
+ }
+ }
+ }]);
+
+ return _class30;
+ }(svg.Element.RenderedElementBase); // text base
+
+
+ svg.Element.TextElementBase = /*#__PURE__*/function (_svg$Element$Rendered4) {
+ _inherits(_class31, _svg$Element$Rendered4);
+
+ var _super30 = _createSuper(_class31);
+
+ function _class31() {
+ _classCallCheck(this, _class31);
+
+ return _super30.apply(this, arguments);
}
- getBoundingBox() {
- const x = this.attribute('x').toPixels('x');
- const y = this.attribute('y').toPixels('y');
- const fontSize = this.parent.style('font-size').numValueOrDefault(svg.Font.Parse(svg.ctx.font).fontSize);
- return new svg.BoundingBox(x, y - fontSize, x + Math.floor(fontSize * 2.0 / 3.0) * this.children[0].getText().length, y);
- }
+ _createClass(_class31, [{
+ key: "getGlyph",
+ value: function getGlyph(font, text, i) {
+ var c = text[i];
+ var glyph = null;
- renderChildren(ctx) {
- this.x = this.attribute('x').toPixels('x');
- this.y = this.attribute('y').toPixels('y');
- this.x += this.getAnchorDelta(ctx, this, 0);
- this.children.forEach((child, i) => {
- this.renderChild(ctx, this, i);
- });
- }
+ if (font.isArabic) {
+ var arabicForm = 'isolated';
+ if ((i === 0 || text[i - 1] === ' ') && i < text.length - 2 && text[i + 1] !== ' ') arabicForm = 'terminal';
+ if (i > 0 && text[i - 1] !== ' ' && i < text.length - 2 && text[i + 1] !== ' ') arabicForm = 'medial';
+ if (i > 0 && text[i - 1] !== ' ' && (i === text.length - 1 || text[i + 1] === ' ')) arabicForm = 'initial';
- getAnchorDelta(ctx, parent, startI) {
- const textAnchor = this.style('text-anchor').valueOrDefault('start');
+ if (typeof font.glyphs[c] !== 'undefined') {
+ glyph = font.glyphs[c][arabicForm];
+ if (isNullish(glyph) && font.glyphs[c].type === 'glyph') glyph = font.glyphs[c];
+ }
+ } else {
+ glyph = font.glyphs[c];
+ }
- if (textAnchor !== 'start') {
- let width = 0;
+ if (isNullish(glyph)) glyph = font.missingGlyph;
+ return glyph;
+ }
+ }, {
+ key: "renderChildren",
+ value: function renderChildren(ctx) {
+ var customFont = this.parent.style('font-family').getDefinition();
- for (let i = startI; i < parent.children.length; i++) {
- const child = parent.children[i];
- if (i > startI && child.attribute('x').hasValue()) break; // new group
+ if (!isNullish(customFont)) {
+ var fontSize = this.parent.style('font-size').numValueOrDefault(svg.Font.Parse(svg.ctx.font).fontSize);
+ var fontStyle = this.parent.style('font-style').valueOrDefault(svg.Font.Parse(svg.ctx.font).fontStyle);
+ var text = this.getText();
+ if (customFont.isRTL) text = text.split('').reverse().join('');
+ var dx = svg.ToNumberArray(this.parent.attribute('dx').value);
+ for (var i = 0; i < text.length; i++) {
+ var glyph = this.getGlyph(customFont, text, i);
+ var scale = fontSize / customFont.fontFace.unitsPerEm;
+ ctx.translate(this.x, this.y);
+ ctx.scale(scale, -scale);
+ var lw = ctx.lineWidth;
+ ctx.lineWidth = ctx.lineWidth * customFont.fontFace.unitsPerEm / fontSize;
+ if (fontStyle === 'italic') ctx.transform(1, 0, 0.4, 1, 0, 0);
+ glyph.render(ctx);
+ if (fontStyle === 'italic') ctx.transform(1, 0, -0.4, 1, 0, 0);
+ ctx.lineWidth = lw;
+ ctx.scale(1 / scale, -1 / scale);
+ ctx.translate(-this.x, -this.y);
+ this.x += fontSize * (glyph.horizAdvX || customFont.horizAdvX) / customFont.fontFace.unitsPerEm;
+
+ if (typeof dx[i] !== 'undefined' && !isNaN(dx[i])) {
+ this.x += dx[i];
+ }
+ }
+
+ return;
+ }
+
+ if (ctx.fillStyle !== '') ctx.fillText(svg.compressSpaces(this.getText()), this.x, this.y);
+ if (ctx.strokeStyle !== '') ctx.strokeText(svg.compressSpaces(this.getText()), this.x, this.y);
+ }
+ }, {
+ key: "getText",
+ value: function getText() {// OVERRIDE ME
+ }
+ }, {
+ key: "measureTextRecursive",
+ value: function measureTextRecursive(ctx) {
+ var width = this.measureText(ctx);
+ this.children.forEach(function (child) {
width += child.measureTextRecursive(ctx);
- }
-
- return -1 * (textAnchor === 'end' ? width : width / 2.0);
+ });
+ return width;
}
+ }, {
+ key: "measureText",
+ value: function measureText(ctx) {
+ var customFont = this.parent.style('font-family').getDefinition();
- return 0;
- }
+ if (!isNullish(customFont)) {
+ var fontSize = this.parent.style('font-size').numValueOrDefault(svg.Font.Parse(svg.ctx.font).fontSize);
+ var measure = 0;
+ var text = this.getText();
+ if (customFont.isRTL) text = text.split('').reverse().join('');
+ var dx = svg.ToNumberArray(this.parent.attribute('dx').value);
- renderChild(ctx, parent, i) {
- const child = parent.children[i];
+ for (var i = 0; i < text.length; i++) {
+ var glyph = this.getGlyph(customFont, text, i);
+ measure += (glyph.horizAdvX || customFont.horizAdvX) * fontSize / customFont.fontFace.unitsPerEm;
- if (child.attribute('x').hasValue()) {
- child.x = child.attribute('x').toPixels('x') + this.getAnchorDelta(ctx, parent, i);
- if (child.attribute('dx').hasValue()) child.x += child.attribute('dx').toPixels('x');
- } else {
- if (this.attribute('dx').hasValue()) this.x += this.attribute('dx').toPixels('x');
- if (child.attribute('dx').hasValue()) this.x += child.attribute('dx').toPixels('x');
- child.x = this.x;
- }
-
- this.x = child.x + child.measureText(ctx);
-
- if (child.attribute('y').hasValue()) {
- child.y = child.attribute('y').toPixels('y');
- if (child.attribute('dy').hasValue()) child.y += child.attribute('dy').toPixels('y');
- } else {
- if (this.attribute('dy').hasValue()) this.y += this.attribute('dy').toPixels('y');
- if (child.attribute('dy').hasValue()) this.y += child.attribute('dy').toPixels('y');
- child.y = this.y;
- }
-
- this.y = child.y;
- child.render(ctx);
-
- for (let j = 0; j < child.children.length; j++) {
- this.renderChild(ctx, child, j);
- }
- }
-
- }; // text base
-
- svg.Element.TextElementBase = class extends svg.Element.RenderedElementBase {
- getGlyph(font, text, i) {
- const c = text[i];
- let glyph = null;
-
- if (font.isArabic) {
- let arabicForm = 'isolated';
- if ((i === 0 || text[i - 1] === ' ') && i < text.length - 2 && text[i + 1] !== ' ') arabicForm = 'terminal';
- if (i > 0 && text[i - 1] !== ' ' && i < text.length - 2 && text[i + 1] !== ' ') arabicForm = 'medial';
- if (i > 0 && text[i - 1] !== ' ' && (i === text.length - 1 || text[i + 1] === ' ')) arabicForm = 'initial';
-
- if (typeof font.glyphs[c] !== 'undefined') {
- glyph = font.glyphs[c][arabicForm];
- if (isNullish(glyph) && font.glyphs[c].type === 'glyph') glyph = font.glyphs[c];
- }
- } else {
- glyph = font.glyphs[c];
- }
-
- if (isNullish(glyph)) glyph = font.missingGlyph;
- return glyph;
- }
-
- renderChildren(ctx) {
- const customFont = this.parent.style('font-family').getDefinition();
-
- if (!isNullish(customFont)) {
- const fontSize = this.parent.style('font-size').numValueOrDefault(svg.Font.Parse(svg.ctx.font).fontSize);
- const fontStyle = this.parent.style('font-style').valueOrDefault(svg.Font.Parse(svg.ctx.font).fontStyle);
- let text = this.getText();
- if (customFont.isRTL) text = text.split('').reverse().join('');
- const dx = svg.ToNumberArray(this.parent.attribute('dx').value);
-
- for (let i = 0; i < text.length; i++) {
- const glyph = this.getGlyph(customFont, text, i);
- const scale = fontSize / customFont.fontFace.unitsPerEm;
- ctx.translate(this.x, this.y);
- ctx.scale(scale, -scale);
- const lw = ctx.lineWidth;
- ctx.lineWidth = ctx.lineWidth * customFont.fontFace.unitsPerEm / fontSize;
- if (fontStyle === 'italic') ctx.transform(1, 0, 0.4, 1, 0, 0);
- glyph.render(ctx);
- if (fontStyle === 'italic') ctx.transform(1, 0, -0.4, 1, 0, 0);
- ctx.lineWidth = lw;
- ctx.scale(1 / scale, -1 / scale);
- ctx.translate(-this.x, -this.y);
- this.x += fontSize * (glyph.horizAdvX || customFont.horizAdvX) / customFont.fontFace.unitsPerEm;
-
- if (typeof dx[i] !== 'undefined' && !isNaN(dx[i])) {
- this.x += dx[i];
+ if (typeof dx[i] !== 'undefined' && !isNaN(dx[i])) {
+ measure += dx[i];
+ }
}
+
+ return measure;
}
- return;
+ var textToMeasure = svg.compressSpaces(this.getText());
+ if (!ctx.measureText) return textToMeasure.length * 10;
+ ctx.save();
+ this.setContext(ctx);
+
+ var _ctx$measureText = ctx.measureText(textToMeasure),
+ width = _ctx$measureText.width;
+
+ ctx.restore();
+ return width;
}
+ }]);
- if (ctx.fillStyle !== '') ctx.fillText(svg.compressSpaces(this.getText()), this.x, this.y);
- if (ctx.strokeStyle !== '') ctx.strokeText(svg.compressSpaces(this.getText()), this.x, this.y);
+ return _class31;
+ }(svg.Element.RenderedElementBase); // tspan
+
+
+ svg.Element.tspan = /*#__PURE__*/function (_svg$Element$TextElem) {
+ _inherits(_class32, _svg$Element$TextElem);
+
+ var _super31 = _createSuper(_class32);
+
+ function _class32(node) {
+ var _this18;
+
+ _classCallCheck(this, _class32);
+
+ _this18 = _super31.call(this, node, true);
+ _this18.text = node.nodeValue || node.text || '';
+ return _this18;
}
- getText() {// OVERRIDE ME
- }
-
- measureTextRecursive(ctx) {
- let width = this.measureText(ctx);
- this.children.forEach(child => {
- width += child.measureTextRecursive(ctx);
- });
- return width;
- }
-
- measureText(ctx) {
- const customFont = this.parent.style('font-family').getDefinition();
-
- if (!isNullish(customFont)) {
- const fontSize = this.parent.style('font-size').numValueOrDefault(svg.Font.Parse(svg.ctx.font).fontSize);
- let measure = 0;
- let text = this.getText();
- if (customFont.isRTL) text = text.split('').reverse().join('');
- const dx = svg.ToNumberArray(this.parent.attribute('dx').value);
-
- for (let i = 0; i < text.length; i++) {
- const glyph = this.getGlyph(customFont, text, i);
- measure += (glyph.horizAdvX || customFont.horizAdvX) * fontSize / customFont.fontFace.unitsPerEm;
-
- if (typeof dx[i] !== 'undefined' && !isNaN(dx[i])) {
- measure += dx[i];
- }
- }
-
- return measure;
+ _createClass(_class32, [{
+ key: "getText",
+ value: function getText() {
+ return this.text;
}
+ }]);
- const textToMeasure = svg.compressSpaces(this.getText());
- if (!ctx.measureText) return textToMeasure.length * 10;
- ctx.save();
- this.setContext(ctx);
- const {
- width
- } = ctx.measureText(textToMeasure);
- ctx.restore();
- return width;
+ return _class32;
+ }(svg.Element.TextElementBase); // tref
+
+
+ svg.Element.tref = /*#__PURE__*/function (_svg$Element$TextElem2) {
+ _inherits(_class33, _svg$Element$TextElem2);
+
+ var _super32 = _createSuper(_class33);
+
+ function _class33() {
+ _classCallCheck(this, _class33);
+
+ return _super32.apply(this, arguments);
}
- }; // tspan
+ _createClass(_class33, [{
+ key: "getText",
+ value: function getText() {
+ var element = this.getHrefAttribute().getDefinition();
+ if (!isNullish(element)) return element.children[0].getText();
+ return undefined;
+ }
+ }]);
- svg.Element.tspan = class extends svg.Element.TextElementBase {
- constructor(node) {
- super(node, true);
- this.text = node.nodeValue || node.text || '';
- }
+ return _class33;
+ }(svg.Element.TextElementBase); // a element
- getText() {
- return this.text;
- }
- }; // tref
+ svg.Element.a = /*#__PURE__*/function (_svg$Element$TextElem3) {
+ _inherits(_class34, _svg$Element$TextElem3);
- svg.Element.tref = class extends svg.Element.TextElementBase {
- getText() {
- const element = this.getHrefAttribute().getDefinition();
- if (!isNullish(element)) return element.children[0].getText();
- return undefined;
- }
+ var _super33 = _createSuper(_class34);
- }; // a element
+ function _class34(node) {
+ var _this19;
- svg.Element.a = class extends svg.Element.TextElementBase {
- constructor(node) {
- super(node);
- this.hasText = true;
- [...node.childNodes].forEach(childNode => {
+ _classCallCheck(this, _class34);
+
+ _this19 = _super33.call(this, node);
+ _this19.hasText = true;
+
+ _toConsumableArray(node.childNodes).forEach(function (childNode) {
if (childNode.nodeType !== 3) {
- this.hasText = false;
+ _this19.hasText = false;
}
}); // this might contain text
- this.text = this.hasText ? node.childNodes[0].nodeValue : '';
+
+ _this19.text = _this19.hasText ? node.childNodes[0].nodeValue : '';
+ return _this19;
}
- getText() {
- return this.text;
- }
-
- renderChildren(ctx) {
- if (this.hasText) {
- // render as text element
- super.renderChildren(ctx);
- const fontSize = new svg.Property('fontSize', svg.Font.Parse(svg.ctx.font).fontSize);
- svg.Mouse.checkBoundingBox(this, new svg.BoundingBox(this.x, this.y - fontSize.toPixels('y'), this.x + this.measureText(ctx), this.y));
- } else {
- // render as temporary group
- const g = new svg.Element.g();
- g.children = this.children;
- g.parent = this;
- g.render(ctx);
+ _createClass(_class34, [{
+ key: "getText",
+ value: function getText() {
+ return this.text;
}
- }
+ }, {
+ key: "renderChildren",
+ value: function renderChildren(ctx) {
+ if (this.hasText) {
+ // render as text element
+ _get(_getPrototypeOf(_class34.prototype), "renderChildren", this).call(this, ctx);
- onclick() {
- window.open(this.getHrefAttribute().value);
- }
+ var fontSize = new svg.Property('fontSize', svg.Font.Parse(svg.ctx.font).fontSize);
+ svg.Mouse.checkBoundingBox(this, new svg.BoundingBox(this.x, this.y - fontSize.toPixels('y'), this.x + this.measureText(ctx), this.y));
+ } else {
+ // render as temporary group
+ var g = new svg.Element.g();
+ g.children = this.children;
+ g.parent = this;
+ g.render(ctx);
+ }
+ }
+ }, {
+ key: "onclick",
+ value: function onclick() {
+ window.open(this.getHrefAttribute().value);
+ }
+ }, {
+ key: "onmousemove",
+ value: function onmousemove() {
+ svg.ctx.canvas.style.cursor = 'pointer';
+ }
+ }]);
- onmousemove() {
- svg.ctx.canvas.style.cursor = 'pointer';
- }
+ return _class34;
+ }(svg.Element.TextElementBase); // image element
- }; // image element
- svg.Element.image = class extends svg.Element.RenderedElementBase {
- constructor(node) {
- super(node);
- const href = this.getHrefAttribute().value;
+ svg.Element.image = /*#__PURE__*/function (_svg$Element$Rendered5) {
+ _inherits(_class35, _svg$Element$Rendered5);
+
+ var _super34 = _createSuper(_class35);
+
+ function _class35(node) {
+ var _this20;
+
+ _classCallCheck(this, _class35);
+
+ _this20 = _super34.call(this, node);
+
+ var href = _this20.getHrefAttribute().value;
if (href === '') {
- return;
+ return _possibleConstructorReturn(_this20);
}
- this._isSvg = href.match(/\.svg$/);
- svg.Images.push(this);
- this.loaded = false;
+ _this20._isSvg = href.match(/\.svg$/);
+ svg.Images.push(_assertThisInitialized(_this20));
+ _this20.loaded = false;
- if (!this._isSvg) {
- this.img = document.createElement('img');
+ if (!_this20._isSvg) {
+ _this20.img = document.createElement('img');
if (svg.opts.useCORS === true) {
- this.img.crossOrigin = 'Anonymous';
+ _this20.img.crossOrigin = 'Anonymous';
}
- this.img.addEventListener('load', () => {
- this.loaded = true;
+ _this20.img.addEventListener('load', function () {
+ _this20.loaded = true;
});
- this.img.addEventListener('error', () => {
+
+ _this20.img.addEventListener('error', function () {
svg.log('ERROR: image "' + href + '" not found');
- this.loaded = true;
+ _this20.loaded = true;
});
- this.img.src = href;
+
+ _this20.img.src = href;
} else {
- svg.ajax(href, true).then(img => {
+ svg.ajax(href, true).then(function (img) {
// eslint-disable-line promise/prefer-await-to-then, promise/always-return
- this.img = img;
- this.loaded = true;
- }).catch(err => {
+ _this20.img = img;
+ _this20.loaded = true;
+ })["catch"](function (err) {
// eslint-disable-line promise/prefer-await-to-callbacks
- this.erred = true;
+ _this20.erred = true;
console.error('Ajax error for canvg', err); // eslint-disable-line no-console
});
}
+
+ return _this20;
}
- renderChildren(ctx) {
- const x = this.attribute('x').toPixels('x');
- const y = this.attribute('y').toPixels('y');
- const width = this.attribute('width').toPixels('x');
- const height = this.attribute('height').toPixels('y');
- if (width === 0 || height === 0) return;
- ctx.save();
+ _createClass(_class35, [{
+ key: "renderChildren",
+ value: function renderChildren(ctx) {
+ var x = this.attribute('x').toPixels('x');
+ var y = this.attribute('y').toPixels('y');
+ var width = this.attribute('width').toPixels('x');
+ var height = this.attribute('height').toPixels('y');
+ if (width === 0 || height === 0) return;
+ ctx.save();
- if (this._isSvg) {
- ctx.drawSvg(this.img, x, y, width, height);
- } else {
- ctx.translate(x, y);
- svg.AspectRatio(ctx, this.attribute('preserveAspectRatio').value, width, this.img.width, height, this.img.height, 0, 0);
- ctx.drawImage(this.img, 0, 0);
+ if (this._isSvg) {
+ ctx.drawSvg(this.img, x, y, width, height);
+ } else {
+ ctx.translate(x, y);
+ svg.AspectRatio(ctx, this.attribute('preserveAspectRatio').value, width, this.img.width, height, this.img.height, 0, 0);
+ ctx.drawImage(this.img, 0, 0);
+ }
+
+ ctx.restore();
}
+ }, {
+ key: "getBoundingBox",
+ value: function getBoundingBox() {
+ var x = this.attribute('x').toPixels('x');
+ var y = this.attribute('y').toPixels('y');
+ var width = this.attribute('width').toPixels('x');
+ var height = this.attribute('height').toPixels('y');
+ return new svg.BoundingBox(x, y, x + width, y + height);
+ }
+ }]);
- ctx.restore();
+ return _class35;
+ }(svg.Element.RenderedElementBase); // group element
+
+
+ svg.Element.g = /*#__PURE__*/function (_svg$Element$Rendered6) {
+ _inherits(_class36, _svg$Element$Rendered6);
+
+ var _super35 = _createSuper(_class36);
+
+ function _class36() {
+ _classCallCheck(this, _class36);
+
+ return _super35.apply(this, arguments);
}
- getBoundingBox() {
- const x = this.attribute('x').toPixels('x');
- const y = this.attribute('y').toPixels('y');
- const width = this.attribute('width').toPixels('x');
- const height = this.attribute('height').toPixels('y');
- return new svg.BoundingBox(x, y, x + width, y + height);
+ _createClass(_class36, [{
+ key: "getBoundingBox",
+ value: function getBoundingBox() {
+ var bb = new svg.BoundingBox();
+ this.children.forEach(function (child) {
+ bb.addBoundingBox(child.getBoundingBox());
+ });
+ return bb;
+ }
+ }]);
+
+ return _class36;
+ }(svg.Element.RenderedElementBase); // symbol element
+
+
+ svg.Element.symbol = /*#__PURE__*/function (_svg$Element$Rendered7) {
+ _inherits(_class37, _svg$Element$Rendered7);
+
+ var _super36 = _createSuper(_class37);
+
+ function _class37() {
+ _classCallCheck(this, _class37);
+
+ return _super36.apply(this, arguments);
}
- }; // group element
+ _createClass(_class37, [{
+ key: "render",
+ value: function render(ctx) {// NO RENDER
+ }
+ }]);
- svg.Element.g = class extends svg.Element.RenderedElementBase {
- getBoundingBox() {
- const bb = new svg.BoundingBox();
- this.children.forEach(child => {
- bb.addBoundingBox(child.getBoundingBox());
- });
- return bb;
- }
+ return _class37;
+ }(svg.Element.RenderedElementBase); // style element
- }; // symbol element
- svg.Element.symbol = class extends svg.Element.RenderedElementBase {
- render(ctx) {// NO RENDER
- }
+ svg.Element.style = /*#__PURE__*/function (_svg$Element$ElementB10) {
+ _inherits(_class38, _svg$Element$ElementB10);
- }; // style element
+ var _super37 = _createSuper(_class38);
- svg.Element.style = class extends svg.Element.ElementBase {
- constructor(node) {
- super(node); // text, or spaces then CDATA
+ function _class38(node) {
+ var _this21;
- let css = '';
- [...node.childNodes].forEach(({
- nodeValue
- }) => {
+ _classCallCheck(this, _class38);
+
+ _this21 = _super37.call(this, node); // text, or spaces then CDATA
+
+ var css = '';
+
+ _toConsumableArray(node.childNodes).forEach(function (_ref11) {
+ var nodeValue = _ref11.nodeValue;
css += nodeValue;
}); // remove comments
+
css = css.replace(/(\/\*([^*]|[\r\n]|(\*+([^*/]|[\r\n])))*\*+\/)|(^\s*\/\/.*)/gm, ''); // eslint-disable-line unicorn/no-unsafe-regex
// replace whitespace
css = svg.compressSpaces(css);
- const cssDefs = css.split('}');
- cssDefs.forEach(cssDef => {
+ var cssDefs = css.split('}');
+ cssDefs.forEach(function (cssDef) {
if (svg.trim(cssDef) !== '') {
- let [cssClasses, cssProps] = cssDef.split('{');
+ var _cssDef$split = cssDef.split('{'),
+ _cssDef$split2 = _slicedToArray(_cssDef$split, 2),
+ cssClasses = _cssDef$split2[0],
+ cssProps = _cssDef$split2[1];
+
cssClasses = cssClasses.split(',');
cssProps = cssProps.split(';');
- cssClasses.forEach(cssClass => {
+ cssClasses.forEach(function (cssClass) {
cssClass = svg.trim(cssClass);
if (cssClass !== '') {
- const props = {};
- cssProps.forEach(cssProp => {
- const prop = cssProp.indexOf(':');
- const name = cssProp.substr(0, prop);
- const value = cssProp.substr(prop + 1, cssProp.length - prop);
+ var props = {};
+ cssProps.forEach(function (cssProp) {
+ var prop = cssProp.indexOf(':');
+ var name = cssProp.substr(0, prop);
+ var value = cssProp.substr(prop + 1, cssProp.length - prop);
if (!isNullish(name) && !isNullish(value)) {
props[svg.trim(name)] = new svg.Property(svg.trim(name), svg.trim(value));
@@ -3163,17 +4082,18 @@ var svgEditorExtension_server_moinsave = (function () {
svg.Styles[cssClass] = props;
if (cssClass === '@font-face') {
- const fontFamily = props['font-family'].value.replace(/"/g, '');
- const srcs = props.src.value.split(',');
- srcs.forEach(src => {
+ var fontFamily = props['font-family'].value.replace(/"/g, '');
+ var srcs = props.src.value.split(',');
+ srcs.forEach(function (src) {
if (src.includes('format("svg")')) {
- const urlStart = src.indexOf('url');
- const urlEnd = src.indexOf(')', urlStart);
- const url = src.substr(urlStart + 5, urlEnd - urlStart - 6); // Can this ajax safely be converted to async?
+ var urlStart = src.indexOf('url');
+ var urlEnd = src.indexOf(')', urlStart);
+ var url = src.substr(urlStart + 5, urlEnd - urlStart - 6); // Can this ajax safely be converted to async?
- const doc = svg.parseXml(svg.ajax(url));
- const fonts = doc.getElementsByTagName('font');
- [...fonts].forEach(font => {
+ var doc = svg.parseXml(svg.ajax(url));
+ var fonts = doc.getElementsByTagName('font');
+
+ _toConsumableArray(fonts).forEach(function (font) {
font = svg.CreateElement(font);
svg.Definitions[fontFamily] = font;
});
@@ -3184,190 +4104,282 @@ var svgEditorExtension_server_moinsave = (function () {
});
}
});
+ return _this21;
}
- }; // use element
+ return _class38;
+ }(svg.Element.ElementBase); // use element
- svg.Element.use = class extends svg.Element.RenderedElementBase {
- constructor(node) {
- super(node);
- this._el = this.getHrefAttribute().getDefinition();
+
+ svg.Element.use = /*#__PURE__*/function (_svg$Element$Rendered8) {
+ _inherits(_class39, _svg$Element$Rendered8);
+
+ var _super38 = _createSuper(_class39);
+
+ function _class39(node) {
+ var _this22;
+
+ _classCallCheck(this, _class39);
+
+ _this22 = _super38.call(this, node);
+ _this22._el = _this22.getHrefAttribute().getDefinition();
+ return _this22;
}
- setContext(ctx) {
- super.setContext(ctx);
- if (this.attribute('x').hasValue()) ctx.translate(this.attribute('x').toPixels('x'), 0);
- if (this.attribute('y').hasValue()) ctx.translate(0, this.attribute('y').toPixels('y'));
- }
+ _createClass(_class39, [{
+ key: "setContext",
+ value: function setContext(ctx) {
+ _get(_getPrototypeOf(_class39.prototype), "setContext", this).call(this, ctx);
- path(ctx) {
- const {
- _el: element
- } = this;
- if (!isNullish(element)) element.path(ctx);
- }
-
- getBoundingBox() {
- const {
- _el: element
- } = this;
- if (!isNullish(element)) return element.getBoundingBox();
- return undefined;
- }
-
- renderChildren(ctx) {
- const {
- _el: element
- } = this;
-
- if (!isNullish(element)) {
- let tempSvg = element;
-
- if (element.type === 'symbol') {
- // render me using a temporary svg element in symbol cases (https://www.w3.org/TR/SVG/struct.html#UseElement)
- tempSvg = new svg.Element.svg();
- tempSvg.type = 'svg';
- tempSvg.attributes.viewBox = new svg.Property('viewBox', element.attribute('viewBox').value);
- tempSvg.attributes.preserveAspectRatio = new svg.Property('preserveAspectRatio', element.attribute('preserveAspectRatio').value);
- tempSvg.attributes.overflow = new svg.Property('overflow', element.attribute('overflow').value);
- tempSvg.children = element.children;
- }
-
- if (tempSvg.type === 'svg') {
- // if symbol or svg, inherit width/height from me
- if (this.attribute('width').hasValue()) tempSvg.attributes.width = new svg.Property('width', this.attribute('width').value);
- if (this.attribute('height').hasValue()) tempSvg.attributes.height = new svg.Property('height', this.attribute('height').value);
- }
-
- const oldParent = tempSvg.parent;
- tempSvg.parent = null;
- tempSvg.render(ctx);
- tempSvg.parent = oldParent;
+ if (this.attribute('x').hasValue()) ctx.translate(this.attribute('x').toPixels('x'), 0);
+ if (this.attribute('y').hasValue()) ctx.translate(0, this.attribute('y').toPixels('y'));
}
- }
+ }, {
+ key: "path",
+ value: function path(ctx) {
+ var element = this._el;
+ if (!isNullish(element)) element.path(ctx);
+ }
+ }, {
+ key: "getBoundingBox",
+ value: function getBoundingBox() {
+ var element = this._el;
+ if (!isNullish(element)) return element.getBoundingBox();
+ return undefined;
+ }
+ }, {
+ key: "renderChildren",
+ value: function renderChildren(ctx) {
+ var element = this._el;
- }; // mask element
+ if (!isNullish(element)) {
+ var tempSvg = element;
- svg.Element.mask = class extends svg.Element.ElementBase {
- apply(ctx, element) {
- // render as temp svg
- let x = this.attribute('x').toPixels('x');
- let y = this.attribute('y').toPixels('y');
- let width = this.attribute('width').toPixels('x');
- let height = this.attribute('height').toPixels('y');
-
- if (width === 0 && height === 0) {
- const bb = new svg.BoundingBox();
- this.children.forEach(child => {
- bb.addBoundingBox(child.getBoundingBox());
- });
- x = Math.floor(bb.x1);
- y = Math.floor(bb.y1);
- width = Math.floor(bb.width());
- height = Math.floor(bb.height());
- } // temporarily remove mask to avoid recursion
-
-
- const mask = element.attribute('mask').value;
- element.attribute('mask').value = '';
- const cMask = document.createElement('canvas');
- cMask.width = x + width;
- cMask.height = y + height;
- const maskCtx = cMask.getContext('2d');
- this.renderChildren(maskCtx);
- const c = document.createElement('canvas');
- c.width = x + width;
- c.height = y + height;
- const tempCtx = c.getContext('2d');
- element.render(tempCtx);
- tempCtx.globalCompositeOperation = 'destination-in';
- tempCtx.fillStyle = maskCtx.createPattern(cMask, 'no-repeat');
- tempCtx.fillRect(0, 0, x + width, y + height);
- ctx.fillStyle = tempCtx.createPattern(c, 'no-repeat');
- ctx.fillRect(0, 0, x + width, y + height); // reassign mask
-
- element.attribute('mask').value = mask;
- }
-
- render(ctx) {// NO RENDER
- }
-
- }; // clip element
-
- svg.Element.clipPath = class extends svg.Element.ElementBase {
- apply(ctx) {
- this.children.forEach(child => {
- if (typeof child.path !== 'undefined') {
- let transform = null;
-
- if (child.attribute('transform').hasValue()) {
- transform = new svg.Transform(child.attribute('transform').value);
- transform.apply(ctx);
+ if (element.type === 'symbol') {
+ // render me using a temporary svg element in symbol cases (https://www.w3.org/TR/SVG/struct.html#UseElement)
+ tempSvg = new svg.Element.svg();
+ tempSvg.type = 'svg';
+ tempSvg.attributes.viewBox = new svg.Property('viewBox', element.attribute('viewBox').value);
+ tempSvg.attributes.preserveAspectRatio = new svg.Property('preserveAspectRatio', element.attribute('preserveAspectRatio').value);
+ tempSvg.attributes.overflow = new svg.Property('overflow', element.attribute('overflow').value);
+ tempSvg.children = element.children;
}
- child.path(ctx);
- ctx.clip();
-
- if (transform) {
- transform.unapply(ctx);
+ if (tempSvg.type === 'svg') {
+ // if symbol or svg, inherit width/height from me
+ if (this.attribute('width').hasValue()) tempSvg.attributes.width = new svg.Property('width', this.attribute('width').value);
+ if (this.attribute('height').hasValue()) tempSvg.attributes.height = new svg.Property('height', this.attribute('height').value);
}
+
+ var oldParent = tempSvg.parent;
+ tempSvg.parent = null;
+ tempSvg.render(ctx);
+ tempSvg.parent = oldParent;
}
- });
+ }
+ }]);
+
+ return _class39;
+ }(svg.Element.RenderedElementBase); // mask element
+
+
+ svg.Element.mask = /*#__PURE__*/function (_svg$Element$ElementB11) {
+ _inherits(_class40, _svg$Element$ElementB11);
+
+ var _super39 = _createSuper(_class40);
+
+ function _class40() {
+ _classCallCheck(this, _class40);
+
+ return _super39.apply(this, arguments);
}
- render(ctx) {// NO RENDER
+ _createClass(_class40, [{
+ key: "apply",
+ value: function apply(ctx, element) {
+ // render as temp svg
+ var x = this.attribute('x').toPixels('x');
+ var y = this.attribute('y').toPixels('y');
+ var width = this.attribute('width').toPixels('x');
+ var height = this.attribute('height').toPixels('y');
+
+ if (width === 0 && height === 0) {
+ var bb = new svg.BoundingBox();
+ this.children.forEach(function (child) {
+ bb.addBoundingBox(child.getBoundingBox());
+ });
+ x = Math.floor(bb.x1);
+ y = Math.floor(bb.y1);
+ width = Math.floor(bb.width());
+ height = Math.floor(bb.height());
+ } // temporarily remove mask to avoid recursion
+
+
+ var mask = element.attribute('mask').value;
+ element.attribute('mask').value = '';
+ var cMask = document.createElement('canvas');
+ cMask.width = x + width;
+ cMask.height = y + height;
+ var maskCtx = cMask.getContext('2d');
+ this.renderChildren(maskCtx);
+ var c = document.createElement('canvas');
+ c.width = x + width;
+ c.height = y + height;
+ var tempCtx = c.getContext('2d');
+ element.render(tempCtx);
+ tempCtx.globalCompositeOperation = 'destination-in';
+ tempCtx.fillStyle = maskCtx.createPattern(cMask, 'no-repeat');
+ tempCtx.fillRect(0, 0, x + width, y + height);
+ ctx.fillStyle = tempCtx.createPattern(c, 'no-repeat');
+ ctx.fillRect(0, 0, x + width, y + height); // reassign mask
+
+ element.attribute('mask').value = mask;
+ }
+ }, {
+ key: "render",
+ value: function render(ctx) {// NO RENDER
+ }
+ }]);
+
+ return _class40;
+ }(svg.Element.ElementBase); // clip element
+
+
+ svg.Element.clipPath = /*#__PURE__*/function (_svg$Element$ElementB12) {
+ _inherits(_class41, _svg$Element$ElementB12);
+
+ var _super40 = _createSuper(_class41);
+
+ function _class41() {
+ _classCallCheck(this, _class41);
+
+ return _super40.apply(this, arguments);
}
- }; // filters
+ _createClass(_class41, [{
+ key: "apply",
+ value: function apply(ctx) {
+ this.children.forEach(function (child) {
+ if (typeof child.path !== 'undefined') {
+ var transform = null;
- svg.Element.filter = class extends svg.Element.ElementBase {
- apply(ctx, element) {
- // render as temp svg
- const bb = element.getBoundingBox();
- const x = Math.floor(bb.x1);
- const y = Math.floor(bb.y1);
- const width = Math.floor(bb.width());
- const height = Math.floor(bb.height()); // temporarily remove filter to avoid recursion
+ if (child.attribute('transform').hasValue()) {
+ transform = new svg.Transform(child.attribute('transform').value);
+ transform.apply(ctx);
+ }
- const filter = element.style('filter').value;
- element.style('filter').value = '';
- let px = 0,
- py = 0;
- this.children.forEach(child => {
- const efd = child.extraFilterDistance || 0;
- px = Math.max(px, efd);
- py = Math.max(py, efd);
- });
- const c = document.createElement('canvas');
- c.width = width + 2 * px;
- c.height = height + 2 * py;
- const tempCtx = c.getContext('2d');
- tempCtx.translate(-x + px, -y + py);
- element.render(tempCtx); // apply filters
+ child.path(ctx);
+ ctx.clip();
- this.children.forEach(child => {
- child.apply(tempCtx, 0, 0, width + 2 * px, height + 2 * py);
- }); // render on me
+ if (transform) {
+ transform.unapply(ctx);
+ }
+ }
+ });
+ }
+ }, {
+ key: "render",
+ value: function render(ctx) {// NO RENDER
+ }
+ }]);
- ctx.drawImage(c, 0, 0, width + 2 * px, height + 2 * py, x - px, y - py, width + 2 * px, height + 2 * py); // reassign filter
+ return _class41;
+ }(svg.Element.ElementBase); // filters
- element.style('filter', true).value = filter;
+
+ svg.Element.filter = /*#__PURE__*/function (_svg$Element$ElementB13) {
+ _inherits(_class42, _svg$Element$ElementB13);
+
+ var _super41 = _createSuper(_class42);
+
+ function _class42() {
+ _classCallCheck(this, _class42);
+
+ return _super41.apply(this, arguments);
}
- render(ctx) {// NO RENDER
+ _createClass(_class42, [{
+ key: "apply",
+ value: function apply(ctx, element) {
+ // render as temp svg
+ var bb = element.getBoundingBox();
+ var x = Math.floor(bb.x1);
+ var y = Math.floor(bb.y1);
+ var width = Math.floor(bb.width());
+ var height = Math.floor(bb.height()); // temporarily remove filter to avoid recursion
+
+ var filter = element.style('filter').value;
+ element.style('filter').value = '';
+ var px = 0,
+ py = 0;
+ this.children.forEach(function (child) {
+ var efd = child.extraFilterDistance || 0;
+ px = Math.max(px, efd);
+ py = Math.max(py, efd);
+ });
+ var c = document.createElement('canvas');
+ c.width = width + 2 * px;
+ c.height = height + 2 * py;
+ var tempCtx = c.getContext('2d');
+ tempCtx.translate(-x + px, -y + py);
+ element.render(tempCtx); // apply filters
+
+ this.children.forEach(function (child) {
+ child.apply(tempCtx, 0, 0, width + 2 * px, height + 2 * py);
+ }); // render on me
+
+ ctx.drawImage(c, 0, 0, width + 2 * px, height + 2 * py, x - px, y - py, width + 2 * px, height + 2 * py); // reassign filter
+
+ element.style('filter', true).value = filter;
+ }
+ }, {
+ key: "render",
+ value: function render(ctx) {// NO RENDER
+ }
+ }]);
+
+ return _class42;
+ }(svg.Element.ElementBase);
+
+ svg.Element.feMorphology = /*#__PURE__*/function (_svg$Element$ElementB14) {
+ _inherits(_class43, _svg$Element$ElementB14);
+
+ var _super42 = _createSuper(_class43);
+
+ function _class43() {
+ _classCallCheck(this, _class43);
+
+ return _super42.apply(this, arguments);
}
- };
- svg.Element.feMorphology = class extends svg.Element.ElementBase {
- apply(ctx, x, y, width, height) {// TODO: implement
+ _createClass(_class43, [{
+ key: "apply",
+ value: function apply(ctx, x, y, width, height) {// TODO: implement
+ }
+ }]);
+
+ return _class43;
+ }(svg.Element.ElementBase);
+
+ svg.Element.feComposite = /*#__PURE__*/function (_svg$Element$ElementB15) {
+ _inherits(_class44, _svg$Element$ElementB15);
+
+ var _super43 = _createSuper(_class44);
+
+ function _class44() {
+ _classCallCheck(this, _class44);
+
+ return _super43.apply(this, arguments);
}
- };
- svg.Element.feComposite = class extends svg.Element.ElementBase {
- apply(ctx, x, y, width, height) {// TODO: implement
- }
+ _createClass(_class44, [{
+ key: "apply",
+ value: function apply(ctx, x, y, width, height) {// TODO: implement
+ }
+ }]);
- };
+ return _class44;
+ }(svg.Element.ElementBase);
/**
* @param {Uint8ClampedArray} img
* @param {Integer} x
@@ -3378,6 +4390,7 @@ var svgEditorExtension_server_moinsave = (function () {
* @returns {Integer}
*/
+
function imGet(img, x, y, width, height, rgba) {
return img[y * width * 4 + x * 4 + rgba];
}
@@ -3397,25 +4410,33 @@ var svgEditorExtension_server_moinsave = (function () {
img[y * width * 4 + x * 4 + rgba] = val;
}
- svg.Element.feColorMatrix = class extends svg.Element.ElementBase {
- constructor(node) {
- super(node);
- let matrix = svg.ToNumberArray(this.attribute('values').value);
+ svg.Element.feColorMatrix = /*#__PURE__*/function (_svg$Element$ElementB16) {
+ _inherits(_class45, _svg$Element$ElementB16);
- switch (this.attribute('type').valueOrDefault('matrix')) {
+ var _super44 = _createSuper(_class45);
+
+ function _class45(node) {
+ var _this23;
+
+ _classCallCheck(this, _class45);
+
+ _this23 = _super44.call(this, node);
+ var matrix = svg.ToNumberArray(_this23.attribute('values').value);
+
+ switch (_this23.attribute('type').valueOrDefault('matrix')) {
// https://www.w3.org/TR/SVG/filters.html#feColorMatrixElement
case 'saturate':
{
- const s = matrix[0];
+ var s = matrix[0];
matrix = [0.213 + 0.787 * s, 0.715 - 0.715 * s, 0.072 - 0.072 * s, 0, 0, 0.213 - 0.213 * s, 0.715 + 0.285 * s, 0.072 - 0.072 * s, 0, 0, 0.213 - 0.213 * s, 0.715 - 0.715 * s, 0.072 + 0.928 * s, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1];
break;
}
case 'hueRotate':
{
- const a = matrix[0] * Math.PI / 180.0;
+ var a = matrix[0] * Math.PI / 180.0;
- const c = function (m1, m2, m3) {
+ var c = function c(m1, m2, m3) {
return m1 + Math.cos(a) * m2 + Math.sin(a) * m3;
};
@@ -3428,84 +4449,130 @@ var svgEditorExtension_server_moinsave = (function () {
break;
}
- this.matrix = matrix;
+ _this23.matrix = matrix;
- this._m = (i, v) => {
- const mi = matrix[i];
+ _this23._m = function (i, v) {
+ var mi = matrix[i];
return mi * (mi < 0 ? v - 255 : v);
};
+
+ return _this23;
}
- apply(ctx, x, y, width, height) {
- const {
- _m: m
- } = this; // assuming x==0 && y==0 for now
+ _createClass(_class45, [{
+ key: "apply",
+ value: function apply(ctx, x, y, width, height) {
+ var m = this._m; // assuming x==0 && y==0 for now
- const srcData = ctx.getImageData(0, 0, width, height);
+ var srcData = ctx.getImageData(0, 0, width, height);
- for (let _y = 0; _y < height; _y++) {
- for (let _x = 0; _x < width; _x++) {
- const r = imGet(srcData.data, _x, _y, width, height, 0);
- const g = imGet(srcData.data, _x, _y, width, height, 1);
- const b = imGet(srcData.data, _x, _y, width, height, 2);
- const a = imGet(srcData.data, _x, _y, width, height, 3);
- imSet(srcData.data, _x, _y, width, height, 0, m(0, r) + m(1, g) + m(2, b) + m(3, a) + m(4, 1));
- imSet(srcData.data, _x, _y, width, height, 1, m(5, r) + m(6, g) + m(7, b) + m(8, a) + m(9, 1));
- imSet(srcData.data, _x, _y, width, height, 2, m(10, r) + m(11, g) + m(12, b) + m(13, a) + m(14, 1));
- imSet(srcData.data, _x, _y, width, height, 3, m(15, r) + m(16, g) + m(17, b) + m(18, a) + m(19, 1));
+ for (var _y = 0; _y < height; _y++) {
+ for (var _x = 0; _x < width; _x++) {
+ var r = imGet(srcData.data, _x, _y, width, height, 0);
+ var g = imGet(srcData.data, _x, _y, width, height, 1);
+ var b = imGet(srcData.data, _x, _y, width, height, 2);
+ var a = imGet(srcData.data, _x, _y, width, height, 3);
+ imSet(srcData.data, _x, _y, width, height, 0, m(0, r) + m(1, g) + m(2, b) + m(3, a) + m(4, 1));
+ imSet(srcData.data, _x, _y, width, height, 1, m(5, r) + m(6, g) + m(7, b) + m(8, a) + m(9, 1));
+ imSet(srcData.data, _x, _y, width, height, 2, m(10, r) + m(11, g) + m(12, b) + m(13, a) + m(14, 1));
+ imSet(srcData.data, _x, _y, width, height, 3, m(15, r) + m(16, g) + m(17, b) + m(18, a) + m(19, 1));
+ }
}
+
+ ctx.clearRect(0, 0, width, height);
+ ctx.putImageData(srcData, 0, 0);
}
+ }]);
- ctx.clearRect(0, 0, width, height);
- ctx.putImageData(srcData, 0, 0);
+ return _class45;
+ }(svg.Element.ElementBase);
+
+ svg.Element.feGaussianBlur = /*#__PURE__*/function (_svg$Element$ElementB17) {
+ _inherits(_class46, _svg$Element$ElementB17);
+
+ var _super45 = _createSuper(_class46);
+
+ function _class46(node) {
+ var _this24;
+
+ _classCallCheck(this, _class46);
+
+ _this24 = _super45.call(this, node);
+ _this24.blurRadius = Math.floor(_this24.attribute('stdDeviation').numValue());
+ _this24.extraFilterDistance = _this24.blurRadius;
+ return _this24;
}
- };
- svg.Element.feGaussianBlur = class extends svg.Element.ElementBase {
- constructor(node) {
- super(node);
- this.blurRadius = Math.floor(this.attribute('stdDeviation').numValue());
- this.extraFilterDistance = this.blurRadius;
+ _createClass(_class46, [{
+ key: "apply",
+ value: function apply(ctx, x, y, width, height) {
+ // Todo: This might not be a problem anymore with out `instanceof` fix
+ // StackBlur requires canvas be on document
+ ctx.canvas.id = svg.UniqueId();
+ ctx.canvas.style.display = 'none';
+ document.body.append(ctx.canvas);
+ processCanvasRGBA(ctx.canvas, x, y, width, height, this.blurRadius);
+ ctx.canvas.remove();
+ }
+ }]);
+
+ return _class46;
+ }(svg.Element.ElementBase); // title element, do nothing
+
+
+ svg.Element.title = /*#__PURE__*/function (_svg$Element$ElementB18) {
+ _inherits(_class47, _svg$Element$ElementB18);
+
+ var _super46 = _createSuper(_class47);
+
+ function _class47(node) {
+ _classCallCheck(this, _class47);
+
+ return _super46.call(this);
}
- apply(ctx, x, y, width, height) {
- // Todo: This might not be a problem anymore with out `instanceof` fix
- // StackBlur requires canvas be on document
- ctx.canvas.id = svg.UniqueId();
- ctx.canvas.style.display = 'none';
- document.body.append(ctx.canvas);
- processCanvasRGBA(ctx.canvas, x, y, width, height, this.blurRadius);
- ctx.canvas.remove();
+ return _class47;
+ }(svg.Element.ElementBase); // desc element, do nothing
+
+
+ svg.Element.desc = /*#__PURE__*/function (_svg$Element$ElementB19) {
+ _inherits(_class48, _svg$Element$ElementB19);
+
+ var _super47 = _createSuper(_class48);
+
+ function _class48(node) {
+ _classCallCheck(this, _class48);
+
+ return _super47.call(this);
}
- }; // title element, do nothing
+ return _class48;
+ }(svg.Element.ElementBase);
- svg.Element.title = class extends svg.Element.ElementBase {
- constructor(node) {
- super();
- }
+ svg.Element.MISSING = /*#__PURE__*/function (_svg$Element$ElementB20) {
+ _inherits(_class49, _svg$Element$ElementB20);
- }; // desc element, do nothing
+ var _super48 = _createSuper(_class49);
- svg.Element.desc = class extends svg.Element.ElementBase {
- constructor(node) {
- super();
- }
+ function _class49(node) {
+ var _this25;
- };
- svg.Element.MISSING = class extends svg.Element.ElementBase {
- constructor(node) {
- super();
+ _classCallCheck(this, _class49);
+
+ _this25 = _super48.call(this);
svg.log('ERROR: Element \'' + node.nodeName + '\' not yet implemented.');
+ return _this25;
}
- }; // element factory
+ return _class49;
+ }(svg.Element.ElementBase); // element factory
+
svg.CreateElement = function (node) {
- const className = node.nodeName.replace(/^[^:]+:/, '') // remove namespace
+ var className = node.nodeName.replace(/^[^:]+:/, '') // remove namespace
.replace(/-/g, ''); // remove dashes
- let e;
+ var e;
if (typeof svg.Element[className] !== 'undefined') {
e = new svg.Element[className](node);
@@ -3518,10 +4585,32 @@ var svgEditorExtension_server_moinsave = (function () {
}; // load from url
- svg.load = async function (ctx, url) {
- const dom = await svg.ajax(url, true);
- return svg.loadXml(ctx, dom);
- }; // load from xml
+ svg.load = /*#__PURE__*/function () {
+ var _ref12 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(ctx, url) {
+ var dom;
+ return regeneratorRuntime.wrap(function _callee$(_context) {
+ while (1) {
+ switch (_context.prev = _context.next) {
+ case 0:
+ _context.next = 2;
+ return svg.ajax(url, true);
+
+ case 2:
+ dom = _context.sent;
+ return _context.abrupt("return", svg.loadXml(ctx, dom));
+
+ case 4:
+ case "end":
+ return _context.stop();
+ }
+ }
+ }, _callee);
+ }));
+
+ return function (_x2, _x3) {
+ return _ref12.apply(this, arguments);
+ };
+ }(); // load from xml
svg.loadXml = function (ctx, xml) {
@@ -3529,11 +4618,11 @@ var svgEditorExtension_server_moinsave = (function () {
};
svg.loadXmlDoc = function (ctx, dom) {
- let res;
+ var res;
svg.init(ctx);
- const mapXY = function (p) {
- let e = ctx.canvas;
+ var mapXY = function mapXY(p) {
+ var e = ctx.canvas;
while (e) {
p.x -= e.offsetLeft;
@@ -3549,31 +4638,31 @@ var svgEditorExtension_server_moinsave = (function () {
if (svg.opts.ignoreMouse !== true) {
ctx.canvas.addEventListener('click', function (e) {
- const args = !isNullish(e) ? [e.clientX, e.clientY] : [event.clientX, event.clientY]; // eslint-disable-line no-restricted-globals
+ var args = !isNullish(e) ? [e.clientX, e.clientY] : [event.clientX, event.clientY]; // eslint-disable-line no-restricted-globals
+
+ var _mapXY = mapXY(_construct(svg.Point, args)),
+ x = _mapXY.x,
+ y = _mapXY.y;
- const {
- x,
- y
- } = mapXY(new svg.Point(...args));
svg.Mouse.onclick(x, y);
});
ctx.canvas.addEventListener('mousemove', function (e) {
- const args = !isNullish(e) ? [e.clientX, e.clientY] : [event.clientX, event.clientY]; // eslint-disable-line no-restricted-globals
+ var args = !isNullish(e) ? [e.clientX, e.clientY] : [event.clientX, event.clientY]; // eslint-disable-line no-restricted-globals
+
+ var _mapXY2 = mapXY(_construct(svg.Point, args)),
+ x = _mapXY2.x,
+ y = _mapXY2.y;
- const {
- x,
- y
- } = mapXY(new svg.Point(...args));
svg.Mouse.onmousemove(x, y);
});
}
- const e = svg.CreateElement(dom.documentElement);
+ var e = svg.CreateElement(dom.documentElement);
e.root = true; // render loop
- let isFirstRender = true;
+ var isFirstRender = true;
- const draw = function (resolve) {
+ var draw = function draw(resolve) {
svg.ViewPort.Clear();
if (ctx.canvas.parentNode) {
@@ -3593,8 +4682,8 @@ var svgEditorExtension_server_moinsave = (function () {
}
}
- let cWidth = ctx.canvas.clientWidth || ctx.canvas.width;
- let cHeight = ctx.canvas.clientHeight || ctx.canvas.height;
+ var cWidth = ctx.canvas.clientWidth || ctx.canvas.width;
+ var cHeight = ctx.canvas.clientHeight || ctx.canvas.height;
if (svg.opts.ignoreDimensions === true && e.style('width').hasValue() && e.style('height').hasValue()) {
cWidth = e.style('width').toPixels('x');
@@ -3612,8 +4701,8 @@ var svgEditorExtension_server_moinsave = (function () {
}
if (!isNullish(svg.opts.scaleWidth) || !isNullish(svg.opts.scaleHeight)) {
- const viewBox = svg.ToNumberArray(e.attribute('viewBox').value);
- let xRatio = null,
+ var viewBox = svg.ToNumberArray(e.attribute('viewBox').value);
+ var xRatio = null,
yRatio = null;
if (!isNullish(svg.opts.scaleWidth)) {
@@ -3659,9 +4748,9 @@ var svgEditorExtension_server_moinsave = (function () {
}
};
- let waitingForImages = true;
+ var waitingForImages = true;
svg.intervalID = setInterval(function () {
- let needUpdate = false;
+ var needUpdate = false;
if (waitingForImages && svg.ImagesLoaded()) {
waitingForImages = false;
@@ -3675,8 +4764,8 @@ var svgEditorExtension_server_moinsave = (function () {
if (svg.opts.ignoreAnimation !== true) {
- svg.Animations.forEach(animation => {
- const needAnimationUpdate = animation.update(1000 / svg.FRAMERATE);
+ svg.Animations.forEach(function (animation) {
+ var needAnimationUpdate = animation.update(1000 / svg.FRAMERATE);
needUpdate = needUpdate || needAnimationUpdate;
});
} // need update from redraw?
@@ -3695,7 +4784,7 @@ var svgEditorExtension_server_moinsave = (function () {
}
}, 1000 / svg.FRAMERATE); // Todo: Replace with an image loading Promise utility?
- return new Promise((resolve, reject) => {
+ return new Promise(function (resolve, reject) {
// eslint-disable-line promise/avoid-new
if (svg.ImagesLoaded()) {
waitingForImages = false;
@@ -3707,7 +4796,7 @@ var svgEditorExtension_server_moinsave = (function () {
});
};
- svg.stop = () => {
+ svg.stop = function () {
if (svg.intervalID) {
clearInterval(svg.intervalID);
}
@@ -3715,65 +4804,60 @@ var svgEditorExtension_server_moinsave = (function () {
svg.Mouse = {
events: [],
-
- hasEvents() {
+ hasEvents: function hasEvents() {
return this.events.length !== 0;
},
-
- onclick(x, y) {
+ onclick: function onclick(x, y) {
this.events.push({
type: 'onclick',
- x,
- y,
-
- run(e) {
+ x: x,
+ y: y,
+ run: function run(e) {
if (e.onclick) e.onclick();
}
-
});
},
-
- onmousemove(x, y) {
+ onmousemove: function onmousemove(x, y) {
this.events.push({
type: 'onmousemove',
- x,
- y,
-
- run(e) {
+ x: x,
+ y: y,
+ run: function run(e) {
if (e.onmousemove) e.onmousemove();
}
-
});
},
-
eventElements: [],
+ checkPath: function checkPath(element, ctx) {
+ var _this26 = this;
+
+ this.events.forEach(function (_ref13, i) {
+ var x = _ref13.x,
+ y = _ref13.y;
- checkPath(element, ctx) {
- this.events.forEach(({
- x,
- y
- }, i) => {
if (ctx.isPointInPath && ctx.isPointInPath(x, y)) {
- this.eventElements[i] = element;
+ _this26.eventElements[i] = element;
}
});
},
+ checkBoundingBox: function checkBoundingBox(element, bb) {
+ var _this27 = this;
+
+ this.events.forEach(function (_ref14, i) {
+ var x = _ref14.x,
+ y = _ref14.y;
- checkBoundingBox(element, bb) {
- this.events.forEach(({
- x,
- y
- }, i) => {
if (bb.isPointInBox(x, y)) {
- this.eventElements[i] = element;
+ _this27.eventElements[i] = element;
}
});
},
+ runEvents: function runEvents() {
+ var _this28 = this;
- runEvents() {
svg.ctx.canvas.style.cursor = '';
- this.events.forEach((e, i) => {
- let element = this.eventElements[i];
+ this.events.forEach(function (e, i) {
+ var element = _this28.eventElements[i];
while (element) {
e.run(element);
@@ -3784,7 +4868,6 @@ var svgEditorExtension_server_moinsave = (function () {
this.events = [];
this.eventElements = [];
}
-
};
return svg;
}
@@ -3804,76 +4887,91 @@ var svgEditorExtension_server_moinsave = (function () {
};
}
- /**
- * @file ext-server_moinsave.js
- *
- * @license (MIT OR GPL-2.0-or-later)
- *
- * @copyright 2010 Alexis Deveria, 2011 MoinMoin:ReimarBauer
- * adopted for moinmoins item storage. It sends in one post png and svg data
- * (I agree to dual license my work to additional GPLv2 or later)
- */
var extServer_moinsave = {
name: 'server_moinsave',
+ init: function init(_ref) {
+ var _this = this;
- async init({
- $,
- encode64,
- importLocale
- }) {
- const strings = await importLocale();
- const svgEditor = this;
- const svgCanvas = svgEditor.canvas;
- const saveSvgAction = '/+modify'; // Create upload target (hidden iframe)
- // Hiding by size instead of display to avoid FF console errors
- // with `getBBox` in browser.js `supportsPathBBox_`)
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
+ var $, encode64, importLocale, strings, svgEditor, svgCanvas, saveSvgAction;
+ return regeneratorRuntime.wrap(function _callee2$(_context2) {
+ while (1) {
+ switch (_context2.prev = _context2.next) {
+ case 0:
+ $ = _ref.$, encode64 = _ref.encode64, importLocale = _ref.importLocale;
+ _context2.next = 3;
+ return importLocale();
- /* const target = */
+ case 3:
+ strings = _context2.sent;
+ svgEditor = _this;
+ svgCanvas = svgEditor.canvas;
+ saveSvgAction = '/+modify'; // Create upload target (hidden iframe)
+ // Hiding by size instead of display to avoid FF console errors
+ // with `getBBox` in browser.js `supportsPathBBox_`)
- $(`<iframe name="output_frame" title="${strings.hiddenframe}"
- style="width: 0; height: 0;" src="data:text/html;base64,PGh0bWw+PC9odG1sPg=="/>`).appendTo('body');
- svgEditor.setCustomHandlers({
- async save(win, data) {
- const svg = '<?xml version="1.0"?>\n' + data;
- const {
- pathname
- } = new URL(location);
- const name = pathname.replace(/\/+get\//, '');
- const svgData = encode64(svg);
+ /* const target = */
- if (!$('#export_canvas').length) {
- $('<canvas>', {
- id: 'export_canvas'
- }).hide().appendTo('body');
+ $("<iframe name=\"output_frame\" title=\"".concat(strings.hiddenframe, "\"\n style=\"width: 0; height: 0;\" src=\"data:text/html;base64,PGh0bWw+PC9odG1sPg==\"/>")).appendTo('body');
+ svgEditor.setCustomHandlers({
+ save: function save(win, data) {
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+ var svg, _URL, pathname, name, svgData, c, datauri, pngData;
+
+ return regeneratorRuntime.wrap(function _callee$(_context) {
+ while (1) {
+ switch (_context.prev = _context.next) {
+ case 0:
+ svg = '<?xml version="1.0"?>\n' + data;
+ _URL = new URL(location), pathname = _URL.pathname;
+ name = pathname.replace(/\/+get\//, '');
+ svgData = encode64(svg);
+
+ if (!$('#export_canvas').length) {
+ $('<canvas>', {
+ id: 'export_canvas'
+ }).hide().appendTo('body');
+ }
+
+ c = $('#export_canvas')[0];
+ c.width = svgCanvas.contentW;
+ c.height = svgCanvas.contentH;
+ _context.next = 10;
+ return canvg(c, svg);
+
+ case 10:
+ datauri = c.toDataURL('image/png'); // const {uiStrings} = svgEditor;
+
+ pngData = encode64(datauri); // Brett: This encoding seems unnecessary
+
+ /* const form = */
+
+ $('<form>').attr({
+ method: 'post',
+ action: saveSvgAction + '/' + name,
+ target: 'output_frame'
+ }).append("\n <input type=\"hidden\" name=\"png_data\" value=\"".concat(pngData, "\">\n <input type=\"hidden\" name=\"filepath\" value=\"").concat(svgData, "\">\n <input type=\"hidden\" name=\"filename\" value=\"drawing.svg\">\n <input type=\"hidden\" name=\"contenttype\" value=\"application/x-svgdraw\">\n ")).appendTo('body').submit().remove();
+ $.alert(strings.saved);
+ top.window.location = '/' + name;
+
+ case 15:
+ case "end":
+ return _context.stop();
+ }
+ }
+ }, _callee);
+ }))();
+ }
+ });
+
+ case 9:
+ case "end":
+ return _context2.stop();
+ }
}
-
- const c = $('#export_canvas')[0];
- c.width = svgCanvas.contentW;
- c.height = svgCanvas.contentH;
- await canvg(c, svg);
- const datauri = c.toDataURL('image/png'); // const {uiStrings} = svgEditor;
-
- const pngData = encode64(datauri); // Brett: This encoding seems unnecessary
-
- /* const form = */
-
- $('<form>').attr({
- method: 'post',
- action: saveSvgAction + '/' + name,
- target: 'output_frame'
- }).append(`
- <input type="hidden" name="png_data" value="${pngData}">
- <input type="hidden" name="filepath" value="${svgData}">
- <input type="hidden" name="filename" value="drawing.svg">
- <input type="hidden" name="contenttype" value="application/x-svgdraw">
- `).appendTo('body').submit().remove();
- $.alert(strings.saved);
- top.window.location = '/' + name;
- }
-
- });
+ }, _callee2);
+ }))();
}
-
};
return extServer_moinsave;
diff --git a/dist/extensions/ext-server_opensave.js b/dist/extensions/ext-server_opensave.js
index f1142e44..377e77f7 100644
--- a/dist/extensions/ext-server_opensave.js
+++ b/dist/extensions/ext-server_opensave.js
@@ -1,6 +1,262 @@
var svgEditorExtension_server_opensave = (function () {
'use strict';
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+ try {
+ var info = gen[key](arg);
+ var value = info.value;
+ } catch (error) {
+ reject(error);
+ return;
+ }
+
+ if (info.done) {
+ resolve(value);
+ } else {
+ Promise.resolve(value).then(_next, _throw);
+ }
+ }
+
+ function _asyncToGenerator(fn) {
+ return function () {
+ var self = this,
+ args = arguments;
+ return new Promise(function (resolve, reject) {
+ var gen = fn.apply(self, args);
+
+ function _next(value) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+ }
+
+ function _throw(err) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+ }
+
+ _next(undefined);
+ });
+ };
+ }
+
+ function _classCallCheck(instance, Constructor) {
+ if (!(instance instanceof Constructor)) {
+ throw new TypeError("Cannot call a class as a function");
+ }
+ }
+
+ function _defineProperties(target, props) {
+ for (var i = 0; i < props.length; i++) {
+ var descriptor = props[i];
+ descriptor.enumerable = descriptor.enumerable || false;
+ descriptor.configurable = true;
+ if ("value" in descriptor) descriptor.writable = true;
+ Object.defineProperty(target, descriptor.key, descriptor);
+ }
+ }
+
+ function _createClass(Constructor, protoProps, staticProps) {
+ if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+ if (staticProps) _defineProperties(Constructor, staticProps);
+ return Constructor;
+ }
+
+ function _inherits(subClass, superClass) {
+ if (typeof superClass !== "function" && superClass !== null) {
+ throw new TypeError("Super expression must either be null or a function");
+ }
+
+ subClass.prototype = Object.create(superClass && superClass.prototype, {
+ constructor: {
+ value: subClass,
+ writable: true,
+ configurable: true
+ }
+ });
+ if (superClass) _setPrototypeOf(subClass, superClass);
+ }
+
+ function _getPrototypeOf(o) {
+ _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
+ return o.__proto__ || Object.getPrototypeOf(o);
+ };
+ return _getPrototypeOf(o);
+ }
+
+ function _setPrototypeOf(o, p) {
+ _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
+ o.__proto__ = p;
+ return o;
+ };
+
+ return _setPrototypeOf(o, p);
+ }
+
+ function _isNativeReflectConstruct() {
+ if (typeof Reflect === "undefined" || !Reflect.construct) return false;
+ if (Reflect.construct.sham) return false;
+ if (typeof Proxy === "function") return true;
+
+ try {
+ Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
+ return true;
+ } catch (e) {
+ return false;
+ }
+ }
+
+ function _construct(Parent, args, Class) {
+ if (_isNativeReflectConstruct()) {
+ _construct = Reflect.construct;
+ } else {
+ _construct = function _construct(Parent, args, Class) {
+ var a = [null];
+ a.push.apply(a, args);
+ var Constructor = Function.bind.apply(Parent, a);
+ var instance = new Constructor();
+ if (Class) _setPrototypeOf(instance, Class.prototype);
+ return instance;
+ };
+ }
+
+ return _construct.apply(null, arguments);
+ }
+
+ function _assertThisInitialized(self) {
+ if (self === void 0) {
+ throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+ }
+
+ return self;
+ }
+
+ function _possibleConstructorReturn(self, call) {
+ if (call && (typeof call === "object" || typeof call === "function")) {
+ return call;
+ }
+
+ return _assertThisInitialized(self);
+ }
+
+ function _createSuper(Derived) {
+ var hasNativeReflectConstruct = _isNativeReflectConstruct();
+
+ return function _createSuperInternal() {
+ var Super = _getPrototypeOf(Derived),
+ result;
+
+ if (hasNativeReflectConstruct) {
+ var NewTarget = _getPrototypeOf(this).constructor;
+
+ result = Reflect.construct(Super, arguments, NewTarget);
+ } else {
+ result = Super.apply(this, arguments);
+ }
+
+ return _possibleConstructorReturn(this, result);
+ };
+ }
+
+ function _superPropBase(object, property) {
+ while (!Object.prototype.hasOwnProperty.call(object, property)) {
+ object = _getPrototypeOf(object);
+ if (object === null) break;
+ }
+
+ return object;
+ }
+
+ function _get(target, property, receiver) {
+ if (typeof Reflect !== "undefined" && Reflect.get) {
+ _get = Reflect.get;
+ } else {
+ _get = function _get(target, property, receiver) {
+ var base = _superPropBase(target, property);
+
+ if (!base) return;
+ var desc = Object.getOwnPropertyDescriptor(base, property);
+
+ if (desc.get) {
+ return desc.get.call(receiver);
+ }
+
+ return desc.value;
+ };
+ }
+
+ return _get(target, property, receiver || target);
+ }
+
+ function _slicedToArray(arr, i) {
+ return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+ }
+
+ function _toConsumableArray(arr) {
+ return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
+ }
+
+ function _arrayWithoutHoles(arr) {
+ if (Array.isArray(arr)) return _arrayLikeToArray(arr);
+ }
+
+ function _arrayWithHoles(arr) {
+ if (Array.isArray(arr)) return arr;
+ }
+
+ function _iterableToArray(iter) {
+ if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter);
+ }
+
+ function _iterableToArrayLimit(arr, i) {
+ if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
+ var _arr = [];
+ var _n = true;
+ var _d = false;
+ var _e = undefined;
+
+ try {
+ for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
+ _arr.push(_s.value);
+
+ if (i && _arr.length === i) break;
+ }
+ } catch (err) {
+ _d = true;
+ _e = err;
+ } finally {
+ try {
+ if (!_n && _i["return"] != null) _i["return"]();
+ } finally {
+ if (_d) throw _e;
+ }
+ }
+
+ return _arr;
+ }
+
+ function _unsupportedIterableToArray(o, minLen) {
+ if (!o) return;
+ if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+ var n = Object.prototype.toString.call(o).slice(8, -1);
+ if (n === "Object" && o.constructor) n = o.constructor.name;
+ if (n === "Map" || n === "Set") return Array.from(o);
+ if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+ }
+
+ function _arrayLikeToArray(arr, len) {
+ if (len == null || len > arr.length) len = arr.length;
+
+ for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+
+ return arr2;
+ }
+
+ function _nonIterableSpread() {
+ throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+ }
+
+ function _nonIterableRest() {
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+ }
+
/**
* For parsing color values.
* @module RGBColor
@@ -8,7 +264,7 @@ var svgEditorExtension_server_opensave = (function () {
* @see https://www.phpied.com/rgb-color-parser-in-javascript/
* @license MIT
*/
- const simpleColors = {
+ var simpleColors = {
aliceblue: 'f0f8ff',
antiquewhite: 'faebd7',
aqua: '00ffff',
@@ -154,43 +410,59 @@ var svgEditorExtension_server_opensave = (function () {
yellowgreen: '9acd32'
}; // array of color definition objects
- const colorDefs = [{
+ var colorDefs = [{
re: /^rgb\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})\)$/,
// re: /^rgb\((?<r>\d{1,3}),\s*(?<g>\d{1,3}),\s*(?<b>\d{1,3})\)$/,
example: ['rgb(123, 234, 45)', 'rgb(255,234,245)'],
+ process: function process(_) {
+ for (var _len = arguments.length, bits = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+ bits[_key - 1] = arguments[_key];
+ }
- process(_, ...bits) {
- return bits.map(b => Number.parseInt(b));
+ return bits.map(function (b) {
+ return Number.parseInt(b);
+ });
}
-
}, {
re: /^(\w{2})(\w{2})(\w{2})$/,
// re: /^(?<r>\w{2})(?<g>\w{2})(?<b>\w{2})$/,
example: ['#00ff00', '336699'],
+ process: function process(_) {
+ for (var _len2 = arguments.length, bits = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
+ bits[_key2 - 1] = arguments[_key2];
+ }
- process(_, ...bits) {
- return bits.map(b => Number.parseInt(b, 16));
+ return bits.map(function (b) {
+ return Number.parseInt(b, 16);
+ });
}
-
}, {
re: /^(\w)(\w)(\w)$/,
// re: /^(?<r>\w{1})(?<g>\w{1})(?<b>\w{1})$/,
example: ['#fb0', 'f0f'],
+ process: function process(_) {
+ for (var _len3 = arguments.length, bits = new Array(_len3 > 1 ? _len3 - 1 : 0), _key3 = 1; _key3 < _len3; _key3++) {
+ bits[_key3 - 1] = arguments[_key3];
+ }
- process(_, ...bits) {
- return bits.map(b => Number.parseInt(b + b, 16));
+ return bits.map(function (b) {
+ return Number.parseInt(b + b, 16);
+ });
}
-
}];
/**
* A class to parse color values.
*/
- class RGBColor {
+ var RGBColor = /*#__PURE__*/function () {
/**
* @param {string} colorString
*/
- constructor(colorString) {
+ function RGBColor(colorString) {
+ var _this = this;
+
+ _classCallCheck(this, RGBColor);
+
this.ok = false; // strip any leading #
if (colorString.charAt(0) === '#') {
@@ -208,20 +480,24 @@ var svgEditorExtension_server_opensave = (function () {
// search through the definitions to find a match
- colorDefs.forEach(({
- re,
- process: processor
- }) => {
- const bits = re.exec(colorString);
+ colorDefs.forEach(function (_ref) {
+ var re = _ref.re,
+ processor = _ref.process;
+ var bits = re.exec(colorString);
if (bits) {
- const [r, g, b] = processor(...bits);
- Object.assign(this, {
- r,
- g,
- b
+ var _processor = processor.apply(void 0, _toConsumableArray(bits)),
+ _processor2 = _slicedToArray(_processor, 3),
+ r = _processor2[0],
+ g = _processor2[1],
+ b = _processor2[2];
+
+ Object.assign(_this, {
+ r: r,
+ g: g,
+ b: b
});
- this.ok = true;
+ _this.ok = true;
}
}); // validate/cleanup values
@@ -235,81 +511,80 @@ var svgEditorExtension_server_opensave = (function () {
*/
- toRGB() {
- return 'rgb(' + this.r + ', ' + this.g + ', ' + this.b + ')';
- }
- /**
- * @returns {string}
- */
-
-
- toHex() {
- let r = this.r.toString(16);
- let g = this.g.toString(16);
- let b = this.b.toString(16);
-
- if (r.length === 1) {
- r = '0' + r;
+ _createClass(RGBColor, [{
+ key: "toRGB",
+ value: function toRGB() {
+ return 'rgb(' + this.r + ', ' + this.g + ', ' + this.b + ')';
}
+ /**
+ * @returns {string}
+ */
- if (g.length === 1) {
- g = '0' + g;
- }
+ }, {
+ key: "toHex",
+ value: function toHex() {
+ var r = this.r.toString(16);
+ var g = this.g.toString(16);
+ var b = this.b.toString(16);
- if (b.length === 1) {
- b = '0' + b;
- }
-
- return '#' + r + g + b;
- }
- /**
- * Offers a bulleted list of help.
- * @returns {HTMLUListElement}
- */
-
-
- static getHelpXML() {
- const examples = [// add regexps
- ...colorDefs.flatMap(({
- example
- }) => {
- return example;
- }), // add type-in colors
- ...Object.keys(simpleColors)];
- const xml = document.createElement('ul');
- xml.setAttribute('id', 'rgbcolor-examples');
- xml.append(...examples.map(example => {
- try {
- const listItem = document.createElement('li');
- const listColor = new RGBColor(example);
- const exampleDiv = document.createElement('div');
- exampleDiv.style.cssText = `
- margin: 3px;
- border: 1px solid black;
- background: ${listColor.toHex()};
- color: ${listColor.toHex()};`;
- exampleDiv.append('test');
- const listItemValue = ` ${example} -> ${listColor.toRGB()} -> ${listColor.toHex()}`;
- listItem.append(exampleDiv, listItemValue);
- return listItem;
- } catch (e) {
- return '';
+ if (r.length === 1) {
+ r = '0' + r;
}
- }));
- return xml;
- }
- }
+ if (g.length === 1) {
+ g = '0' + g;
+ }
+
+ if (b.length === 1) {
+ b = '0' + b;
+ }
+
+ return '#' + r + g + b;
+ }
+ /**
+ * Offers a bulleted list of help.
+ * @returns {HTMLUListElement}
+ */
+
+ }], [{
+ key: "getHelpXML",
+ value: function getHelpXML() {
+ var examples = [].concat(_toConsumableArray(colorDefs.flatMap(function (_ref2) {
+ var example = _ref2.example;
+ return example;
+ })), _toConsumableArray(Object.keys(simpleColors)));
+ var xml = document.createElement('ul');
+ xml.setAttribute('id', 'rgbcolor-examples');
+ xml.append.apply(xml, _toConsumableArray(examples.map(function (example) {
+ try {
+ var listItem = document.createElement('li');
+ var listColor = new RGBColor(example);
+ var exampleDiv = document.createElement('div');
+ exampleDiv.style.cssText = "\n margin: 3px;\n border: 1px solid black;\n background: ".concat(listColor.toHex(), ";\n color: ").concat(listColor.toHex(), ";");
+ exampleDiv.append('test');
+ var listItemValue = " ".concat(example, " -> ").concat(listColor.toRGB(), " -> ").concat(listColor.toHex());
+ listItem.append(exampleDiv, listItemValue);
+ return listItem;
+ } catch (e) {
+ return '';
+ }
+ })));
+ return xml;
+ }
+ }]);
+
+ return RGBColor;
+ }();
function _typeof(obj) {
"@babel/helpers - typeof";
if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
- _typeof = function (obj) {
+ _typeof = function _typeof(obj) {
return typeof obj;
};
} else {
- _typeof = function (obj) {
+ _typeof = function _typeof(obj) {
return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
};
}
@@ -317,7 +592,7 @@ var svgEditorExtension_server_opensave = (function () {
return _typeof(obj);
}
- function _classCallCheck(instance, Constructor) {
+ function _classCallCheck$1(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
@@ -634,7 +909,7 @@ var svgEditorExtension_server_opensave = (function () {
* Set properties.
*/
function BlurStack() {
- _classCallCheck(this, BlurStack);
+ _classCallCheck$1(this, BlurStack);
this.r = 0;
this.g = 0;
@@ -643,14 +918,13 @@ var svgEditorExtension_server_opensave = (function () {
this.next = null;
};
- /* eslint-disable new-cap, class-methods-use-this, jsdoc/require-jsdoc */
/**
* Whether a value is `null` or `undefined`.
* @param {any} val
* @returns {boolean}
*/
- const isNullish = val => {
+ var isNullish = function isNullish(val) {
return val === null || val === undefined;
};
/**
@@ -684,17 +958,17 @@ var svgEditorExtension_server_opensave = (function () {
*/
- const canvg = function (target, s, opts) {
+ var canvg = function canvg(target, s, opts) {
// no parameters
if (isNullish(target) && isNullish(s) && isNullish(opts)) {
- const svgTags = document.querySelectorAll('svg');
- return Promise.all([...svgTags].map(svgTag => {
- const c = document.createElement('canvas');
+ var svgTags = document.querySelectorAll('svg');
+ return Promise.all(_toConsumableArray(svgTags).map(function (svgTag) {
+ var c = document.createElement('canvas');
c.width = svgTag.clientWidth;
c.height = svgTag.clientHeight;
svgTag.before(c);
svgTag.remove();
- const div = document.createElement('div');
+ var div = document.createElement('div');
div.append(svgTag);
return canvg(c, div.innerHTML);
}));
@@ -706,13 +980,13 @@ var svgEditorExtension_server_opensave = (function () {
if (!isNullish(target.svg)) target.svg.stop();
- const svg = build(opts || {}); // on i.e. 8 for flash canvas, we can't assign the property so check for it
+ var svg = build(opts || {}); // on i.e. 8 for flash canvas, we can't assign the property so check for it
if (!(target.childNodes.length === 1 && target.childNodes[0].nodeName === 'OBJECT')) {
target.svg = svg;
}
- const ctx = target.getContext('2d');
+ var ctx = target.getContext('2d');
if (typeof s.documentElement !== 'undefined') {
// load from xml doc
@@ -737,8 +1011,8 @@ var svgEditorExtension_server_opensave = (function () {
function build(opts) {
/* eslint-enable jsdoc/check-types */
- const svg = {
- opts
+ var svg = {
+ opts: opts
};
svg.FRAMERATE = 30;
svg.MAX_VIRTUAL_PIXELS = 30000;
@@ -756,7 +1030,7 @@ var svgEditorExtension_server_opensave = (function () {
svg.init = function (ctx) {
- let uniqueId = 0;
+ var uniqueId = 0;
svg.UniqueId = function () {
uniqueId++;
@@ -770,48 +1044,42 @@ var svgEditorExtension_server_opensave = (function () {
svg.ctx = ctx;
svg.ViewPort = {
viewPorts: [],
-
- Clear() {
+ Clear: function Clear() {
this.viewPorts = [];
},
-
- SetCurrent(width, height) {
+ SetCurrent: function SetCurrent(width, height) {
this.viewPorts.push({
- width,
- height
+ width: width,
+ height: height
});
},
-
- RemoveCurrent() {
+ RemoveCurrent: function RemoveCurrent() {
this.viewPorts.pop();
},
-
- Current() {
+ Current: function Current() {
return this.viewPorts[this.viewPorts.length - 1];
},
-
- width() {
+ width: function width() {
return this.Current().width;
},
-
- height() {
+ height: function height() {
return this.Current().height;
},
-
- ComputeSize(d) {
+ ComputeSize: function ComputeSize(d) {
if (!isNullish(d) && typeof d === 'number') return d;
if (d === 'x') return this.width();
if (d === 'y') return this.height();
- return Math.sqrt(this.width() ** 2 + this.height() ** 2) / Math.sqrt(2);
+ return Math.sqrt(Math.pow(this.width(), 2) + Math.pow(this.height(), 2)) / Math.sqrt(2);
}
-
};
};
svg.init(); // images loaded
svg.ImagesLoaded = function () {
- return svg.Images.every(img => img.loaded);
+ return svg.Images.every(function (img) {
+ return img.loaded;
+ });
}; // trim
@@ -827,13 +1095,13 @@ var svgEditorExtension_server_opensave = (function () {
svg.ajax = function (url, asynch) {
- const AJAX = window.XMLHttpRequest ? new XMLHttpRequest() : new window.ActiveXObject('Microsoft.XMLHTTP');
+ var AJAX = window.XMLHttpRequest ? new XMLHttpRequest() : new window.ActiveXObject('Microsoft.XMLHTTP');
if (asynch) {
- return new Promise((resolve, reject) => {
+ return new Promise(function (resolve, reject) {
// eslint-disable-line promise/avoid-new
- const req = AJAX.open('GET', url, true);
- req.addEventListener('load', () => {
+ var req = AJAX.open('GET', url, true);
+ req.addEventListener('load', function () {
resolve(AJAX.responseText);
});
AJAX.send(null);
@@ -848,12 +1116,12 @@ var svgEditorExtension_server_opensave = (function () {
svg.parseXml = function (xml) {
if (window.DOMParser) {
- const parser = new DOMParser();
+ var parser = new DOMParser();
return parser.parseFromString(xml, 'text/xml');
}
xml = xml.replace(/<!DOCTYPE svg[^>]*>/, '');
- const xmlDoc = new window.ActiveXObject('Microsoft.XMLDOM');
+ var xmlDoc = new window.ActiveXObject('Microsoft.XMLDOM');
xmlDoc.async = 'false';
xmlDoc.loadXML(xml);
return xmlDoc;
@@ -861,7 +1129,7 @@ var svgEditorExtension_server_opensave = (function () {
// get the text baseline
- const textBaselineMapping = {
+ var textBaselineMapping = {
baseline: 'alphabetic',
'before-edge': 'top',
'text-before-edge': 'top',
@@ -874,210 +1142,231 @@ var svgEditorExtension_server_opensave = (function () {
hanging: 'hanging',
mathematical: 'alphabetic'
};
- svg.Property = class Property {
- constructor(name, value) {
+
+ svg.Property = /*#__PURE__*/function () {
+ function Property(name, value) {
+ _classCallCheck(this, Property);
+
this.name = name;
this.value = value;
}
- getValue() {
- return this.value;
- }
-
- hasValue() {
- return !isNullish(this.value) && this.value !== '';
- } // return the numerical value of the property
-
-
- numValue() {
- if (!this.hasValue()) return 0;
- let n = Number.parseFloat(this.value);
-
- if (String(this.value).endsWith('%')) {
- n /= 100.0;
+ _createClass(Property, [{
+ key: "getValue",
+ value: function getValue() {
+ return this.value;
}
+ }, {
+ key: "hasValue",
+ value: function hasValue() {
+ return !isNullish(this.value) && this.value !== '';
+ } // return the numerical value of the property
- return n;
- }
+ }, {
+ key: "numValue",
+ value: function numValue() {
+ if (!this.hasValue()) return 0;
+ var n = Number.parseFloat(this.value);
- valueOrDefault(def) {
- if (this.hasValue()) return this.value;
- return def;
- }
-
- numValueOrDefault(def) {
- if (this.hasValue()) return this.numValue();
- return def;
- } // color extensions
- // augment the current color value with the opacity
-
-
- addOpacity(opacityProp) {
- let newValue = this.value;
-
- if (!isNullish(opacityProp.value) && opacityProp.value !== '' && typeof this.value === 'string') {
- // can only add opacity to colors, not patterns
- const color = new RGBColor(this.value);
-
- if (color.ok) {
- newValue = 'rgba(' + color.r + ', ' + color.g + ', ' + color.b + ', ' + opacityProp.numValue() + ')';
+ if (String(this.value).endsWith('%')) {
+ n /= 100.0;
}
+
+ return n;
}
-
- return new svg.Property(this.name, newValue);
- } // definition extensions
- // get the definition from the definitions table
-
-
- getDefinition() {
- let name = this.value.match(/#([^)'"]+)/);
-
- if (name) {
- name = name[1];
+ }, {
+ key: "valueOrDefault",
+ value: function valueOrDefault(def) {
+ if (this.hasValue()) return this.value;
+ return def;
}
+ }, {
+ key: "numValueOrDefault",
+ value: function numValueOrDefault(def) {
+ if (this.hasValue()) return this.numValue();
+ return def;
+ } // color extensions
+ // augment the current color value with the opacity
- if (!name) {
- name = this.value;
- }
+ }, {
+ key: "addOpacity",
+ value: function addOpacity(opacityProp) {
+ var newValue = this.value;
- return svg.Definitions[name];
- }
+ if (!isNullish(opacityProp.value) && opacityProp.value !== '' && typeof this.value === 'string') {
+ // can only add opacity to colors, not patterns
+ var color = new RGBColor(this.value);
- isUrlDefinition() {
- return this.value.startsWith('url(');
- }
-
- getFillStyleDefinition(e, opacityProp) {
- let def = this.getDefinition(); // gradient
-
- if (!isNullish(def) && def.createGradient) {
- return def.createGradient(svg.ctx, e, opacityProp);
- } // pattern
-
-
- if (!isNullish(def) && def.createPattern) {
- if (def.getHrefAttribute().hasValue()) {
- const pt = def.attribute('patternTransform');
- def = def.getHrefAttribute().getDefinition();
-
- if (pt.hasValue()) {
- def.attribute('patternTransform', true).value = pt.value;
+ if (color.ok) {
+ newValue = 'rgba(' + color.r + ', ' + color.g + ', ' + color.b + ', ' + opacityProp.numValue() + ')';
}
}
- return def.createPattern(svg.ctx, e);
+ return new svg.Property(this.name, newValue);
+ } // definition extensions
+ // get the definition from the definitions table
+
+ }, {
+ key: "getDefinition",
+ value: function getDefinition() {
+ var name = this.value.match(/#([^)'"]+)/);
+
+ if (name) {
+ name = name[1];
+ }
+
+ if (!name) {
+ name = this.value;
+ }
+
+ return svg.Definitions[name];
}
+ }, {
+ key: "isUrlDefinition",
+ value: function isUrlDefinition() {
+ return this.value.startsWith('url(');
+ }
+ }, {
+ key: "getFillStyleDefinition",
+ value: function getFillStyleDefinition(e, opacityProp) {
+ var def = this.getDefinition(); // gradient
- return null;
- } // length extensions
+ if (!isNullish(def) && def.createGradient) {
+ return def.createGradient(svg.ctx, e, opacityProp);
+ } // pattern
- getDPI(viewPort) {
- return 96.0; // TODO: compute?
- }
+ if (!isNullish(def) && def.createPattern) {
+ if (def.getHrefAttribute().hasValue()) {
+ var pt = def.attribute('patternTransform');
+ def = def.getHrefAttribute().getDefinition();
- getEM(viewPort) {
- let em = 12;
- const fontSize = new svg.Property('fontSize', svg.Font.Parse(svg.ctx.font).fontSize);
- if (fontSize.hasValue()) em = fontSize.toPixels(viewPort);
- return em;
- }
+ if (pt.hasValue()) {
+ def.attribute('patternTransform', true).value = pt.value;
+ }
+ }
- getUnits() {
- return String(this.value).replace(/[\d.-]/g, '');
- } // get the length as pixels
+ return def.createPattern(svg.ctx, e);
+ }
+ return null;
+ } // length extensions
- toPixels(viewPort, processPercent) {
- if (!this.hasValue()) return 0;
- const s = String(this.value);
- if (s.endsWith('em')) return this.numValue() * this.getEM(viewPort);
- if (s.endsWith('ex')) return this.numValue() * this.getEM(viewPort) / 2.0;
- if (s.endsWith('px')) return this.numValue();
- if (s.endsWith('pt')) return this.numValue() * this.getDPI(viewPort) * (1.0 / 72.0);
- if (s.endsWith('pc')) return this.numValue() * 15;
- if (s.endsWith('cm')) return this.numValue() * this.getDPI(viewPort) / 2.54;
- if (s.endsWith('mm')) return this.numValue() * this.getDPI(viewPort) / 25.4;
- if (s.endsWith('in')) return this.numValue() * this.getDPI(viewPort);
- if (s.endsWith('%')) return this.numValue() * svg.ViewPort.ComputeSize(viewPort);
- const n = this.numValue();
- if (processPercent && n < 1.0) return n * svg.ViewPort.ComputeSize(viewPort);
- return n;
- } // time extensions
- // get the time as milliseconds
+ }, {
+ key: "getDPI",
+ value: function getDPI(viewPort) {
+ return 96.0; // TODO: compute?
+ }
+ }, {
+ key: "getEM",
+ value: function getEM(viewPort) {
+ var em = 12;
+ var fontSize = new svg.Property('fontSize', svg.Font.Parse(svg.ctx.font).fontSize);
+ if (fontSize.hasValue()) em = fontSize.toPixels(viewPort);
+ return em;
+ }
+ }, {
+ key: "getUnits",
+ value: function getUnits() {
+ return String(this.value).replace(/[\d.-]/g, '');
+ } // get the length as pixels
+ }, {
+ key: "toPixels",
+ value: function toPixels(viewPort, processPercent) {
+ if (!this.hasValue()) return 0;
+ var s = String(this.value);
+ if (s.endsWith('em')) return this.numValue() * this.getEM(viewPort);
+ if (s.endsWith('ex')) return this.numValue() * this.getEM(viewPort) / 2.0;
+ if (s.endsWith('px')) return this.numValue();
+ if (s.endsWith('pt')) return this.numValue() * this.getDPI(viewPort) * (1.0 / 72.0);
+ if (s.endsWith('pc')) return this.numValue() * 15;
+ if (s.endsWith('cm')) return this.numValue() * this.getDPI(viewPort) / 2.54;
+ if (s.endsWith('mm')) return this.numValue() * this.getDPI(viewPort) / 25.4;
+ if (s.endsWith('in')) return this.numValue() * this.getDPI(viewPort);
+ if (s.endsWith('%')) return this.numValue() * svg.ViewPort.ComputeSize(viewPort);
+ var n = this.numValue();
+ if (processPercent && n < 1.0) return n * svg.ViewPort.ComputeSize(viewPort);
+ return n;
+ } // time extensions
+ // get the time as milliseconds
- toMilliseconds() {
- if (!this.hasValue()) return 0;
- const s = String(this.value);
- if (s.endsWith('ms')) return this.numValue();
- if (s.endsWith('s')) return this.numValue() * 1000;
- return this.numValue();
- } // angle extensions
- // get the angle as radians
+ }, {
+ key: "toMilliseconds",
+ value: function toMilliseconds() {
+ if (!this.hasValue()) return 0;
+ var s = String(this.value);
+ if (s.endsWith('ms')) return this.numValue();
+ if (s.endsWith('s')) return this.numValue() * 1000;
+ return this.numValue();
+ } // angle extensions
+ // get the angle as radians
+ }, {
+ key: "toRadians",
+ value: function toRadians() {
+ if (!this.hasValue()) return 0;
+ var s = String(this.value);
+ if (s.endsWith('deg')) return this.numValue() * (Math.PI / 180.0);
+ if (s.endsWith('grad')) return this.numValue() * (Math.PI / 200.0);
+ if (s.endsWith('rad')) return this.numValue();
+ return this.numValue() * (Math.PI / 180.0);
+ }
+ }, {
+ key: "toTextBaseline",
+ value: function toTextBaseline() {
+ if (!this.hasValue()) return null;
+ return textBaselineMapping[this.value];
+ }
+ }]);
- toRadians() {
- if (!this.hasValue()) return 0;
- const s = String(this.value);
- if (s.endsWith('deg')) return this.numValue() * (Math.PI / 180.0);
- if (s.endsWith('grad')) return this.numValue() * (Math.PI / 200.0);
- if (s.endsWith('rad')) return this.numValue();
- return this.numValue() * (Math.PI / 180.0);
- }
+ return Property;
+ }(); // fonts
- toTextBaseline() {
- if (!this.hasValue()) return null;
- return textBaselineMapping[this.value];
- }
-
- }; // fonts
svg.Font = {
Styles: 'normal|italic|oblique|inherit',
Variants: 'normal|small-caps|inherit',
Weights: 'normal|bold|bolder|lighter|100|200|300|400|500|600|700|800|900|inherit',
-
- CreateFont(fontStyle, fontVariant, fontWeight, fontSize, fontFamily, inherit) {
- const f = !isNullish(inherit) ? this.Parse(inherit) : this.CreateFont('', '', '', '', '', svg.ctx.font);
+ CreateFont: function CreateFont(fontStyle, fontVariant, fontWeight, fontSize, fontFamily, inherit) {
+ var f = !isNullish(inherit) ? this.Parse(inherit) : this.CreateFont('', '', '', '', '', svg.ctx.font);
return {
fontFamily: fontFamily || f.fontFamily,
fontSize: fontSize || f.fontSize,
fontStyle: fontStyle || f.fontStyle,
fontWeight: fontWeight || f.fontWeight,
fontVariant: fontVariant || f.fontVariant,
-
- toString() {
+ toString: function toString() {
return [this.fontStyle, this.fontVariant, this.fontWeight, this.fontSize, this.fontFamily].join(' ');
}
-
};
},
+ Parse: function Parse(s) {
+ var _this = this;
- Parse(s) {
- const f = {};
- const ds = svg.trim(svg.compressSpaces(s || '')).split(' ');
- const set = {
+ var f = {};
+ var ds = svg.trim(svg.compressSpaces(s || '')).split(' ');
+ var set = {
fontSize: false,
fontStyle: false,
fontWeight: false,
fontVariant: false
};
- let ff = '';
- ds.forEach(d => {
- if (!set.fontStyle && this.Styles.includes(d)) {
+ var ff = '';
+ ds.forEach(function (d) {
+ if (!set.fontStyle && _this.Styles.includes(d)) {
if (d !== 'inherit') {
f.fontStyle = d;
}
set.fontStyle = true;
- } else if (!set.fontVariant && this.Variants.includes(d)) {
+ } else if (!set.fontVariant && _this.Variants.includes(d)) {
if (d !== 'inherit') {
f.fontVariant = d;
}
set.fontStyle = set.fontVariant = true;
- } else if (!set.fontWeight && this.Weights.includes(d)) {
+ } else if (!set.fontWeight && _this.Weights.includes(d)) {
if (d !== 'inherit') {
f.fontWeight = d;
}
@@ -1100,43 +1389,51 @@ var svgEditorExtension_server_opensave = (function () {
return f;
}
-
}; // points and paths
svg.ToNumberArray = function (s) {
- const a = svg.trim(svg.compressSpaces((s || '').replace(/,/g, ' '))).split(' ');
- return a.map(_a => Number.parseFloat(_a));
+ var a = svg.trim(svg.compressSpaces((s || '').replace(/,/g, ' '))).split(' ');
+ return a.map(function (_a) {
+ return Number.parseFloat(_a);
+ });
};
- svg.Point = class {
- constructor(x, y) {
+ svg.Point = /*#__PURE__*/function () {
+ function _class(x, y) {
+ _classCallCheck(this, _class);
+
this.x = x;
this.y = y;
}
- angleTo(p) {
- return Math.atan2(p.y - this.y, p.x - this.x);
- }
+ _createClass(_class, [{
+ key: "angleTo",
+ value: function angleTo(p) {
+ return Math.atan2(p.y - this.y, p.x - this.x);
+ }
+ }, {
+ key: "applyTransform",
+ value: function applyTransform(v) {
+ var xp = this.x * v[0] + this.y * v[2] + v[4];
+ var yp = this.x * v[1] + this.y * v[3] + v[5];
+ this.x = xp;
+ this.y = yp;
+ }
+ }]);
- applyTransform(v) {
- const xp = this.x * v[0] + this.y * v[2] + v[4];
- const yp = this.x * v[1] + this.y * v[3] + v[5];
- this.x = xp;
- this.y = yp;
- }
-
- };
+ return _class;
+ }();
svg.CreatePoint = function (s) {
- const a = svg.ToNumberArray(s);
+ var a = svg.ToNumberArray(s);
return new svg.Point(a[0], a[1]);
};
svg.CreatePath = function (s) {
- const a = svg.ToNumberArray(s);
- const path = [];
+ var a = svg.ToNumberArray(s);
+ var path = [];
- for (let i = 0; i < a.length; i += 2) {
+ for (var i = 0; i < a.length; i += 2) {
path.push(new svg.Point(a[i], a[i + 1]));
}
@@ -1144,8 +1441,10 @@ var svgEditorExtension_server_opensave = (function () {
}; // bounding box
- svg.BoundingBox = class {
- constructor(x1, y1, x2, y2) {
+ svg.BoundingBox = /*#__PURE__*/function () {
+ function _class2(x1, y1, x2, y2) {
+ _classCallCheck(this, _class2);
+
// pass in initial points if you want
this.x1 = Number.NaN;
this.y1 = Number.NaN;
@@ -1155,273 +1454,333 @@ var svgEditorExtension_server_opensave = (function () {
this.addPoint(x2, y2);
}
- x() {
- return this.x1;
- }
+ _createClass(_class2, [{
+ key: "x",
+ value: function x() {
+ return this.x1;
+ }
+ }, {
+ key: "y",
+ value: function y() {
+ return this.y1;
+ }
+ }, {
+ key: "width",
+ value: function width() {
+ return this.x2 - this.x1;
+ }
+ }, {
+ key: "height",
+ value: function height() {
+ return this.y2 - this.y1;
+ }
+ }, {
+ key: "addPoint",
+ value: function addPoint(x, y) {
+ if (!isNullish(x)) {
+ if (isNaN(this.x1) || isNaN(this.x2)) {
+ this.x1 = x;
+ this.x2 = x;
+ }
- y() {
- return this.y1;
- }
-
- width() {
- return this.x2 - this.x1;
- }
-
- height() {
- return this.y2 - this.y1;
- }
-
- addPoint(x, y) {
- if (!isNullish(x)) {
- if (isNaN(this.x1) || isNaN(this.x2)) {
- this.x1 = x;
- this.x2 = x;
+ if (x < this.x1) this.x1 = x;
+ if (x > this.x2) this.x2 = x;
}
- if (x < this.x1) this.x1 = x;
- if (x > this.x2) this.x2 = x;
- }
+ if (!isNullish(y)) {
+ if (isNaN(this.y1) || isNaN(this.y2)) {
+ this.y1 = y;
+ this.y2 = y;
+ }
- if (!isNullish(y)) {
- if (isNaN(this.y1) || isNaN(this.y2)) {
- this.y1 = y;
- this.y2 = y;
+ if (y < this.y1) this.y1 = y;
+ if (y > this.y2) this.y2 = y;
}
-
- if (y < this.y1) this.y1 = y;
- if (y > this.y2) this.y2 = y;
}
- }
+ }, {
+ key: "addX",
+ value: function addX(x) {
+ this.addPoint(x, null);
+ }
+ }, {
+ key: "addY",
+ value: function addY(y) {
+ this.addPoint(null, y);
+ }
+ }, {
+ key: "addBoundingBox",
+ value: function addBoundingBox(bb) {
+ this.addPoint(bb.x1, bb.y1);
+ this.addPoint(bb.x2, bb.y2);
+ }
+ }, {
+ key: "addQuadraticCurve",
+ value: function addQuadraticCurve(p0x, p0y, p1x, p1y, p2x, p2y) {
+ var cp1x = p0x + 2 / 3 * (p1x - p0x); // CP1 = QP0 + 2/3 *(QP1-QP0)
- addX(x) {
- this.addPoint(x, null);
- }
+ var cp1y = p0y + 2 / 3 * (p1y - p0y); // CP1 = QP0 + 2/3 *(QP1-QP0)
- addY(y) {
- this.addPoint(null, y);
- }
+ var cp2x = cp1x + 1 / 3 * (p2x - p0x); // CP2 = CP1 + 1/3 *(QP2-QP0)
- addBoundingBox(bb) {
- this.addPoint(bb.x1, bb.y1);
- this.addPoint(bb.x2, bb.y2);
- }
+ var cp2y = cp1y + 1 / 3 * (p2y - p0y); // CP2 = CP1 + 1/3 *(QP2-QP0)
- addQuadraticCurve(p0x, p0y, p1x, p1y, p2x, p2y) {
- const cp1x = p0x + 2 / 3 * (p1x - p0x); // CP1 = QP0 + 2/3 *(QP1-QP0)
+ this.addBezierCurve(p0x, p0y, cp1x, cp2x, cp1y, cp2y, p2x, p2y);
+ }
+ }, {
+ key: "addBezierCurve",
+ value: function addBezierCurve(p0x, p0y, p1x, p1y, p2x, p2y, p3x, p3y) {
+ var _this2 = this;
- const cp1y = p0y + 2 / 3 * (p1y - p0y); // CP1 = QP0 + 2/3 *(QP1-QP0)
-
- const cp2x = cp1x + 1 / 3 * (p2x - p0x); // CP2 = CP1 + 1/3 *(QP2-QP0)
-
- const cp2y = cp1y + 1 / 3 * (p2y - p0y); // CP2 = CP1 + 1/3 *(QP2-QP0)
-
- this.addBezierCurve(p0x, p0y, cp1x, cp2x, cp1y, cp2y, p2x, p2y);
- }
-
- addBezierCurve(p0x, p0y, p1x, p1y, p2x, p2y, p3x, p3y) {
- // from http://blog.hackers-cafe.net/2009/06/how-to-calculate-bezier-curves-bounding.html
- const p0 = [p0x, p0y],
+ // from http://blog.hackers-cafe.net/2009/06/how-to-calculate-bezier-curves-bounding.html
+ var p0 = [p0x, p0y],
p1 = [p1x, p1y],
p2 = [p2x, p2y],
p3 = [p3x, p3y];
- this.addPoint(p0[0], p0[1]);
- this.addPoint(p3[0], p3[1]);
+ this.addPoint(p0[0], p0[1]);
+ this.addPoint(p3[0], p3[1]);
- for (let i = 0; i <= 1; i++) {
- const f = function (t) {
- return (1 - t) ** 3 * p0[i] + 3 * (1 - t) ** 2 * t * p1[i] + 3 * (1 - t) * t ** 2 * p2[i] + t ** 3 * p3[i];
+ var _loop = function _loop(i) {
+ var f = function f(t) {
+ return Math.pow(1 - t, 3) * p0[i] + 3 * Math.pow(1 - t, 2) * t * p1[i] + 3 * (1 - t) * Math.pow(t, 2) * p2[i] + Math.pow(t, 3) * p3[i];
+ };
+
+ var b = 6 * p0[i] - 12 * p1[i] + 6 * p2[i];
+ var a = -3 * p0[i] + 9 * p1[i] - 9 * p2[i] + 3 * p3[i];
+ var c = 3 * p1[i] - 3 * p0[i];
+
+ if (a === 0) {
+ if (b === 0) return "continue";
+ var t = -c / b;
+
+ if (t > 0 && t < 1) {
+ if (i === 0) _this2.addX(f(t));
+ if (i === 1) _this2.addY(f(t));
+ }
+
+ return "continue";
+ }
+
+ var b2ac = Math.pow(b, 2) - 4 * c * a;
+ if (b2ac < 0) return "continue";
+ var t1 = (-b + Math.sqrt(b2ac)) / (2 * a);
+
+ if (t1 > 0 && t1 < 1) {
+ if (i === 0) _this2.addX(f(t1));
+ if (i === 1) _this2.addY(f(t1));
+ }
+
+ var t2 = (-b - Math.sqrt(b2ac)) / (2 * a);
+
+ if (t2 > 0 && t2 < 1) {
+ if (i === 0) _this2.addX(f(t2));
+ if (i === 1) _this2.addY(f(t2));
+ }
};
- const b = 6 * p0[i] - 12 * p1[i] + 6 * p2[i];
- const a = -3 * p0[i] + 9 * p1[i] - 9 * p2[i] + 3 * p3[i];
- const c = 3 * p1[i] - 3 * p0[i];
+ for (var i = 0; i <= 1; i++) {
+ var _ret = _loop(i);
- if (a === 0) {
- if (b === 0) continue;
- const t = -c / b;
-
- if (t > 0 && t < 1) {
- if (i === 0) this.addX(f(t));
- if (i === 1) this.addY(f(t));
- }
-
- continue;
- }
-
- const b2ac = b ** 2 - 4 * c * a;
- if (b2ac < 0) continue;
- const t1 = (-b + Math.sqrt(b2ac)) / (2 * a);
-
- if (t1 > 0 && t1 < 1) {
- if (i === 0) this.addX(f(t1));
- if (i === 1) this.addY(f(t1));
- }
-
- const t2 = (-b - Math.sqrt(b2ac)) / (2 * a);
-
- if (t2 > 0 && t2 < 1) {
- if (i === 0) this.addX(f(t2));
- if (i === 1) this.addY(f(t2));
+ if (_ret === "continue") continue;
}
}
- }
+ }, {
+ key: "isPointInBox",
+ value: function isPointInBox(x, y) {
+ return this.x1 <= x && x <= this.x2 && this.y1 <= y && y <= this.y2;
+ }
+ }]);
- isPointInBox(x, y) {
- return this.x1 <= x && x <= this.x2 && this.y1 <= y && y <= this.y2;
- }
+ return _class2;
+ }(); // transforms
- }; // transforms
- svg.Transform = class {
- constructor(v) {
+ svg.Transform = /*#__PURE__*/function () {
+ function _class3(v) {
+ var _this6 = this;
+
+ _classCallCheck(this, _class3);
+
this.Type = {
- translate: class {
- constructor(s) {
- this.p = svg.CreatePoint(s);
+ translate: function translate(s) {
+ _classCallCheck(this, translate);
- this.apply = function (ctx) {
- ctx.translate(this.p.x || 0.0, this.p.y || 0.0);
- };
+ this.p = svg.CreatePoint(s);
- this.unapply = function (ctx) {
- ctx.translate(-1.0 * this.p.x || 0.0, -1.0 * this.p.y || 0.0);
- };
+ this.apply = function (ctx) {
+ ctx.translate(this.p.x || 0.0, this.p.y || 0.0);
+ };
- this.applyToPoint = function (p) {
- p.applyTransform([1, 0, 0, 1, this.p.x || 0.0, this.p.y || 0.0]);
- };
- }
+ this.unapply = function (ctx) {
+ ctx.translate(-1.0 * this.p.x || 0.0, -1.0 * this.p.y || 0.0);
+ };
+ this.applyToPoint = function (p) {
+ p.applyTransform([1, 0, 0, 1, this.p.x || 0.0, this.p.y || 0.0]);
+ };
},
- rotate: class {
- constructor(s) {
- const a = svg.ToNumberArray(s);
- this.angle = new svg.Property('angle', a[0]);
- this.cx = a[1] || 0;
- this.cy = a[2] || 0;
+ rotate: function rotate(s) {
+ _classCallCheck(this, rotate);
- this.apply = function (ctx) {
- ctx.translate(this.cx, this.cy);
- ctx.rotate(this.angle.toRadians());
- ctx.translate(-this.cx, -this.cy);
- };
+ var a = svg.ToNumberArray(s);
+ this.angle = new svg.Property('angle', a[0]);
+ this.cx = a[1] || 0;
+ this.cy = a[2] || 0;
- this.unapply = function (ctx) {
- ctx.translate(this.cx, this.cy);
- ctx.rotate(-1.0 * this.angle.toRadians());
- ctx.translate(-this.cx, -this.cy);
- };
+ this.apply = function (ctx) {
+ ctx.translate(this.cx, this.cy);
+ ctx.rotate(this.angle.toRadians());
+ ctx.translate(-this.cx, -this.cy);
+ };
- this.applyToPoint = function (p) {
- const _a = this.angle.toRadians();
+ this.unapply = function (ctx) {
+ ctx.translate(this.cx, this.cy);
+ ctx.rotate(-1.0 * this.angle.toRadians());
+ ctx.translate(-this.cx, -this.cy);
+ };
- p.applyTransform([1, 0, 0, 1, this.p.x || 0.0, this.p.y || 0.0]);
- p.applyTransform([Math.cos(_a), Math.sin(_a), -Math.sin(_a), Math.cos(_a), 0, 0]);
- p.applyTransform([1, 0, 0, 1, -this.p.x || 0.0, -this.p.y || 0.0]);
- };
- }
+ this.applyToPoint = function (p) {
+ var _a = this.angle.toRadians();
+ p.applyTransform([1, 0, 0, 1, this.p.x || 0.0, this.p.y || 0.0]);
+ p.applyTransform([Math.cos(_a), Math.sin(_a), -Math.sin(_a), Math.cos(_a), 0, 0]);
+ p.applyTransform([1, 0, 0, 1, -this.p.x || 0.0, -this.p.y || 0.0]);
+ };
},
- scale: class {
- constructor(s) {
- this.p = svg.CreatePoint(s);
+ scale: function scale(s) {
+ _classCallCheck(this, scale);
- this.apply = function (ctx) {
- ctx.scale(this.p.x || 1.0, this.p.y || this.p.x || 1.0);
- };
+ this.p = svg.CreatePoint(s);
- this.unapply = function (ctx) {
- ctx.scale(1.0 / this.p.x || 1.0, 1.0 / this.p.y || this.p.x || 1.0);
- };
+ this.apply = function (ctx) {
+ ctx.scale(this.p.x || 1.0, this.p.y || this.p.x || 1.0);
+ };
- this.applyToPoint = function (p) {
- p.applyTransform([this.p.x || 0.0, 0, 0, this.p.y || 0.0, 0, 0]);
- };
- }
+ this.unapply = function (ctx) {
+ ctx.scale(1.0 / this.p.x || 1.0, 1.0 / this.p.y || this.p.x || 1.0);
+ };
+ this.applyToPoint = function (p) {
+ p.applyTransform([this.p.x || 0.0, 0, 0, this.p.y || 0.0, 0, 0]);
+ };
},
- matrix: class {
- constructor(s) {
- this.m = svg.ToNumberArray(s);
+ matrix: function matrix(s) {
+ _classCallCheck(this, matrix);
- this.apply = function (ctx) {
- ctx.transform(this.m[0], this.m[1], this.m[2], this.m[3], this.m[4], this.m[5]);
- };
+ this.m = svg.ToNumberArray(s);
- this.applyToPoint = function (p) {
- p.applyTransform(this.m);
- };
- }
+ this.apply = function (ctx) {
+ ctx.transform(this.m[0], this.m[1], this.m[2], this.m[3], this.m[4], this.m[5]);
+ };
+ this.applyToPoint = function (p) {
+ p.applyTransform(this.m);
+ };
}
};
Object.assign(this.Type, {
- SkewBase: class extends this.Type.matrix {
- constructor(s) {
- super(s);
- this.angle = new svg.Property('angle', s);
+ SkewBase: /*#__PURE__*/function (_this$Type$matrix) {
+ _inherits(SkewBase, _this$Type$matrix);
+
+ var _super = _createSuper(SkewBase);
+
+ function SkewBase(s) {
+ var _this3;
+
+ _classCallCheck(this, SkewBase);
+
+ _this3 = _super.call(this, s);
+ _this3.angle = new svg.Property('angle', s);
+ return _this3;
}
- }
+ return SkewBase;
+ }(this.Type.matrix)
});
Object.assign(this.Type, {
- skewX: class extends this.Type.SkewBase {
- constructor(s) {
- super(s);
- this.m = [1, 0, Math.tan(this.angle.toRadians()), 1, 0, 0];
+ skewX: /*#__PURE__*/function (_this$Type$SkewBase) {
+ _inherits(skewX, _this$Type$SkewBase);
+
+ var _super2 = _createSuper(skewX);
+
+ function skewX(s) {
+ var _this4;
+
+ _classCallCheck(this, skewX);
+
+ _this4 = _super2.call(this, s);
+ _this4.m = [1, 0, Math.tan(_this4.angle.toRadians()), 1, 0, 0];
+ return _this4;
}
- },
- skewY: class extends this.Type.SkewBase {
- constructor(s) {
- super(s);
- this.m = [1, Math.tan(this.angle.toRadians()), 0, 1, 0, 0];
+ return skewX;
+ }(this.Type.SkewBase),
+ skewY: /*#__PURE__*/function (_this$Type$SkewBase2) {
+ _inherits(skewY, _this$Type$SkewBase2);
+
+ var _super3 = _createSuper(skewY);
+
+ function skewY(s) {
+ var _this5;
+
+ _classCallCheck(this, skewY);
+
+ _this5 = _super3.call(this, s);
+ _this5.m = [1, Math.tan(_this5.angle.toRadians()), 0, 1, 0, 0];
+ return _this5;
}
- }
+ return skewY;
+ }(this.Type.SkewBase)
});
- const data = svg.trim(svg.compressSpaces(v)).replace(/\)([a-zA-Z])/g, ') $1').replace(/\)(\s?,\s?)/g, ') ').split(/\s(?=[a-z])/);
- this.transforms = data.map(d => {
- const type = svg.trim(d.split('(')[0]);
- const s = d.split('(')[1].replace(')', '');
- const transform = new this.Type[type](s);
+ var data = svg.trim(svg.compressSpaces(v)).replace(/\)([a-zA-Z])/g, ') $1').replace(/\)(\s?,\s?)/g, ') ').split(/\s(?=[a-z])/);
+ this.transforms = data.map(function (d) {
+ var type = svg.trim(d.split('(')[0]);
+ var s = d.split('(')[1].replace(')', '');
+ var transform = new _this6.Type[type](s);
transform.type = type;
return transform;
});
}
- apply(ctx) {
- this.transforms.forEach(transform => {
- transform.apply(ctx);
- });
- }
-
- unapply(ctx) {
- for (let i = this.transforms.length - 1; i >= 0; i--) {
- this.transforms[i].unapply(ctx);
+ _createClass(_class3, [{
+ key: "apply",
+ value: function apply(ctx) {
+ this.transforms.forEach(function (transform) {
+ transform.apply(ctx);
+ });
}
- }
+ }, {
+ key: "unapply",
+ value: function unapply(ctx) {
+ for (var i = this.transforms.length - 1; i >= 0; i--) {
+ this.transforms[i].unapply(ctx);
+ }
+ }
+ }, {
+ key: "applyToPoint",
+ value: function applyToPoint(p) {
+ this.transforms.forEach(function (transform) {
+ transform.applyToPoint(p);
+ });
+ }
+ }]);
- applyToPoint(p) {
- this.transforms.forEach(transform => {
- transform.applyToPoint(p);
- });
- }
+ return _class3;
+ }(); // aspect ratio
- }; // aspect ratio
svg.AspectRatio = function (ctx, aspectRatio, width, desiredWidth, height, desiredHeight, minX, minY, refX, refY) {
// aspect ratio - https://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute
aspectRatio = svg.compressSpaces(aspectRatio);
aspectRatio = aspectRatio.replace(/^defer\s/, ''); // ignore defer
- const align = aspectRatio.split(' ')[0] || 'xMidYMid';
- const meetOrSlice = aspectRatio.split(' ')[1] || 'meet'; // calculate scale
+ var align = aspectRatio.split(' ')[0] || 'xMidYMid';
+ var meetOrSlice = aspectRatio.split(' ')[1] || 'meet'; // calculate scale
- const scaleX = width / desiredWidth;
- const scaleY = height / desiredHeight;
- const scaleMin = Math.min(scaleX, scaleY);
- const scaleMax = Math.max(scaleX, scaleY);
+ var scaleX = width / desiredWidth;
+ var scaleY = height / desiredHeight;
+ var scaleMin = Math.min(scaleX, scaleY);
+ var scaleMax = Math.max(scaleX, scaleY);
if (meetOrSlice === 'meet') {
desiredWidth *= scaleMin;
@@ -1455,8 +1814,13 @@ var svgEditorExtension_server_opensave = (function () {
svg.Element = {};
svg.EmptyProperty = new svg.Property('EMPTY', '');
- svg.Element.ElementBase = class {
- constructor(node) {
+
+ svg.Element.ElementBase = /*#__PURE__*/function () {
+ function _class4(node) {
+ var _this7 = this;
+
+ _classCallCheck(this, _class4);
+
// Argument from inheriting class
this.captureTextNodes = arguments[1]; // eslint-disable-line prefer-rest-params
@@ -1467,52 +1831,67 @@ var svgEditorExtension_server_opensave = (function () {
if (!isNullish(node) && node.nodeType === 1) {
// ELEMENT_NODE
// add children
- [...node.childNodes].forEach(childNode => {
+ _toConsumableArray(node.childNodes).forEach(function (childNode) {
if (childNode.nodeType === 1) {
- this.addChild(childNode, true); // ELEMENT_NODE
+ _this7.addChild(childNode, true); // ELEMENT_NODE
+
}
- if (this.captureTextNodes && (childNode.nodeType === 3 || childNode.nodeType === 4)) {
- const text = childNode.nodeValue || childNode.text || '';
+ if (_this7.captureTextNodes && (childNode.nodeType === 3 || childNode.nodeType === 4)) {
+ var text = childNode.nodeValue || childNode.text || '';
if (svg.trim(svg.compressSpaces(text)) !== '') {
- this.addChild(new svg.Element.tspan(childNode), false); // TEXT_NODE
+ _this7.addChild(new svg.Element.tspan(childNode), false); // TEXT_NODE
+
}
}
}); // add attributes
- [...node.attributes].forEach(({
- nodeName,
- nodeValue
- }) => {
- this.attributes[nodeName] = new svg.Property(nodeName, nodeValue);
+
+ _toConsumableArray(node.attributes).forEach(function (_ref) {
+ var nodeName = _ref.nodeName,
+ nodeValue = _ref.nodeValue;
+ _this7.attributes[nodeName] = new svg.Property(nodeName, nodeValue);
}); // add tag styles
- let styles = svg.Styles[node.nodeName];
+
+ var styles = svg.Styles[node.nodeName];
if (!isNullish(styles)) {
- Object.entries(styles).forEach(([name, styleValue]) => {
- this.styles[name] = styleValue;
+ Object.entries(styles).forEach(function (_ref2) {
+ var _ref3 = _slicedToArray(_ref2, 2),
+ name = _ref3[0],
+ styleValue = _ref3[1];
+
+ _this7.styles[name] = styleValue;
});
} // add class styles
if (this.attribute('class').hasValue()) {
- const classes = svg.compressSpaces(this.attribute('class').value).split(' ');
- classes.forEach(clss => {
+ var classes = svg.compressSpaces(this.attribute('class').value).split(' ');
+ classes.forEach(function (clss) {
styles = svg.Styles['.' + clss];
if (!isNullish(styles)) {
- Object.entries(styles).forEach(([name, styleValue]) => {
- this.styles[name] = styleValue;
+ Object.entries(styles).forEach(function (_ref4) {
+ var _ref5 = _slicedToArray(_ref4, 2),
+ name = _ref5[0],
+ styleValue = _ref5[1];
+
+ _this7.styles[name] = styleValue;
});
}
styles = svg.Styles[node.nodeName + '.' + clss];
if (!isNullish(styles)) {
- Object.entries(styles).forEach(([name, styleValue]) => {
- this.styles[name] = styleValue;
+ Object.entries(styles).forEach(function (_ref6) {
+ var _ref7 = _slicedToArray(_ref6, 2),
+ name = _ref7[0],
+ styleValue = _ref7[1];
+
+ _this7.styles[name] = styleValue;
});
}
});
@@ -1520,28 +1899,32 @@ var svgEditorExtension_server_opensave = (function () {
if (this.attribute('id').hasValue()) {
- const _styles = svg.Styles['#' + this.attribute('id').value];
+ var _styles = svg.Styles['#' + this.attribute('id').value];
if (!isNullish(_styles)) {
- Object.entries(_styles).forEach(([name, styleValue]) => {
- this.styles[name] = styleValue;
+ Object.entries(_styles).forEach(function (_ref8) {
+ var _ref9 = _slicedToArray(_ref8, 2),
+ name = _ref9[0],
+ styleValue = _ref9[1];
+
+ _this7.styles[name] = styleValue;
});
}
} // add inline styles
if (this.attribute('style').hasValue()) {
- const _styles = this.attribute('style').value.split(';');
+ var _styles2 = this.attribute('style').value.split(';');
- _styles.forEach(style => {
+ _styles2.forEach(function (style) {
if (svg.trim(style) !== '') {
- let {
- name,
- value
- } = style.split(':');
+ var _style$split = style.split(':'),
+ name = _style$split.name,
+ value = _style$split.value;
+
name = svg.trim(name);
value = svg.trim(value);
- this.styles[name] = new svg.Property(name, value);
+ _this7.styles[name] = new svg.Property(name, value);
}
});
} // add id
@@ -1556,474 +1939,641 @@ var svgEditorExtension_server_opensave = (function () {
} // get or create attribute
- attribute(name, createIfNotExists) {
- let a = this.attributes[name];
- if (!isNullish(a)) return a;
+ _createClass(_class4, [{
+ key: "attribute",
+ value: function attribute(name, createIfNotExists) {
+ var a = this.attributes[name];
+ if (!isNullish(a)) return a;
- if (createIfNotExists === true) {
- a = new svg.Property(name, '');
- this.attributes[name] = a;
- }
-
- return a || svg.EmptyProperty;
- }
-
- getHrefAttribute() {
- for (const a in this.attributes) {
- if (a.endsWith(':href')) {
- return this.attributes[a];
+ if (createIfNotExists === true) {
+ a = new svg.Property(name, '');
+ this.attributes[name] = a;
}
+
+ return a || svg.EmptyProperty;
}
-
- return svg.EmptyProperty;
- } // get or create style, crawls up node tree
-
-
- style(name, createIfNotExists, skipAncestors) {
- let s = this.styles[name];
- if (!isNullish(s)) return s;
- const a = this.attribute(name);
-
- if (!isNullish(a) && a.hasValue()) {
- this.styles[name] = a; // move up to me to cache
-
- return a;
- }
-
- if (skipAncestors !== true) {
- const p = this.parent;
-
- if (!isNullish(p)) {
- const ps = p.style(name);
-
- if (!isNullish(ps) && ps.hasValue()) {
- return ps;
+ }, {
+ key: "getHrefAttribute",
+ value: function getHrefAttribute() {
+ for (var a in this.attributes) {
+ if (a.endsWith(':href')) {
+ return this.attributes[a];
}
}
- }
- if (createIfNotExists === true) {
- s = new svg.Property(name, '');
- this.styles[name] = s;
- }
+ return svg.EmptyProperty;
+ } // get or create style, crawls up node tree
- return s || svg.EmptyProperty;
- } // base render
+ }, {
+ key: "style",
+ value: function style(name, createIfNotExists, skipAncestors) {
+ var s = this.styles[name];
+ if (!isNullish(s)) return s;
+ var a = this.attribute(name);
+ if (!isNullish(a) && a.hasValue()) {
+ this.styles[name] = a; // move up to me to cache
- render(ctx) {
- // don't render display=none
- if (this.style('display').value === 'none') return; // don't render visibility=hidden
-
- if (this.style('visibility').value === 'hidden') return;
- ctx.save();
-
- if (this.attribute('mask').hasValue()) {
- // mask
- const mask = this.attribute('mask').getDefinition();
- if (!isNullish(mask)) mask.apply(ctx, this);
- } else if (this.style('filter').hasValue()) {
- // filter
- const filter = this.style('filter').getDefinition();
- if (!isNullish(filter)) filter.apply(ctx, this);
- } else {
- this.setContext(ctx);
- this.renderChildren(ctx);
- this.clearContext(ctx);
- }
-
- ctx.restore();
- } // base set context
-
-
- setContext(ctx) {// OVERRIDE ME!
- } // base clear context
-
-
- clearContext(ctx) {// OVERRIDE ME!
- } // base render children
-
-
- renderChildren(ctx) {
- this.children.forEach(child => {
- child.render(ctx);
- });
- }
-
- addChild(childNode, create) {
- const child = create ? svg.CreateElement(childNode) : childNode;
- child.parent = this;
-
- if (child.type !== 'title') {
- this.children.push(child);
- }
- }
-
- };
- svg.Element.RenderedElementBase = class extends svg.Element.ElementBase {
- setContext(ctx) {
- // fill
- if (this.style('fill').isUrlDefinition()) {
- const fs = this.style('fill').getFillStyleDefinition(this, this.style('fill-opacity'));
- if (!isNullish(fs)) ctx.fillStyle = fs;
- } else if (this.style('fill').hasValue()) {
- const fillStyle = this.style('fill');
- if (fillStyle.value === 'currentColor') fillStyle.value = this.style('color').value;
- ctx.fillStyle = fillStyle.value === 'none' ? 'rgba(0,0,0,0)' : fillStyle.value;
- }
-
- if (this.style('fill-opacity').hasValue()) {
- let fillStyle = new svg.Property('fill', ctx.fillStyle);
- fillStyle = fillStyle.addOpacity(this.style('fill-opacity'));
- ctx.fillStyle = fillStyle.value;
- } // stroke
-
-
- if (this.style('stroke').isUrlDefinition()) {
- const fs = this.style('stroke').getFillStyleDefinition(this, this.style('stroke-opacity'));
- if (!isNullish(fs)) ctx.strokeStyle = fs;
- } else if (this.style('stroke').hasValue()) {
- const strokeStyle = this.style('stroke');
- if (strokeStyle.value === 'currentColor') strokeStyle.value = this.style('color').value;
- ctx.strokeStyle = strokeStyle.value === 'none' ? 'rgba(0,0,0,0)' : strokeStyle.value;
- }
-
- if (this.style('stroke-opacity').hasValue()) {
- let strokeStyle = new svg.Property('stroke', ctx.strokeStyle);
- strokeStyle = strokeStyle.addOpacity(this.style('stroke-opacity'));
- ctx.strokeStyle = strokeStyle.value;
- }
-
- if (this.style('stroke-width').hasValue()) {
- const newLineWidth = this.style('stroke-width').toPixels();
- ctx.lineWidth = newLineWidth === 0 ? 0.001 : newLineWidth; // browsers don't respect 0
- }
-
- if (this.style('stroke-linecap').hasValue()) ctx.lineCap = this.style('stroke-linecap').value;
- if (this.style('stroke-linejoin').hasValue()) ctx.lineJoin = this.style('stroke-linejoin').value;
- if (this.style('stroke-miterlimit').hasValue()) ctx.miterLimit = this.style('stroke-miterlimit').value;
-
- if (this.style('stroke-dasharray').hasValue() && this.style('stroke-dasharray').value !== 'none') {
- const gaps = svg.ToNumberArray(this.style('stroke-dasharray').value);
-
- if (typeof ctx.setLineDash !== 'undefined') {
- ctx.setLineDash(gaps);
- } else if (typeof ctx.webkitLineDash !== 'undefined') {
- ctx.webkitLineDash = gaps;
- } else if (typeof ctx.mozDash !== 'undefined' && !(gaps.length === 1 && gaps[0] === 0)) {
- ctx.mozDash = gaps;
+ return a;
}
- const offset = this.style('stroke-dashoffset').numValueOrDefault(1);
+ if (skipAncestors !== true) {
+ var p = this.parent;
- if (typeof ctx.lineDashOffset !== 'undefined') {
- ctx.lineDashOffset = offset;
- } else if (typeof ctx.webkitLineDashOffset !== 'undefined') {
- ctx.webkitLineDashOffset = offset;
- } else if (typeof ctx.mozDashOffset !== 'undefined') {
- ctx.mozDashOffset = offset;
+ if (!isNullish(p)) {
+ var ps = p.style(name);
+
+ if (!isNullish(ps) && ps.hasValue()) {
+ return ps;
+ }
+ }
}
- } // font
+ if (createIfNotExists === true) {
+ s = new svg.Property(name, '');
+ this.styles[name] = s;
+ }
- if (typeof ctx.font !== 'undefined') {
- ctx.font = svg.Font.CreateFont(this.style('font-style').value, this.style('font-variant').value, this.style('font-weight').value, this.style('font-size').hasValue() ? this.style('font-size').toPixels() + 'px' : '', this.style('font-family').value).toString();
- } // transform
+ return s || svg.EmptyProperty;
+ } // base render
+ }, {
+ key: "render",
+ value: function render(ctx) {
+ // don't render display=none
+ if (this.style('display').value === 'none') return; // don't render visibility=hidden
- if (this.attribute('transform').hasValue()) {
- const transform = new svg.Transform(this.attribute('transform').value);
- transform.apply(ctx);
- } // clip
+ if (this.style('visibility').value === 'hidden') return;
+ ctx.save();
-
- if (this.style('clip-path', false, true).hasValue()) {
- const clip = this.style('clip-path', false, true).getDefinition();
- if (!isNullish(clip)) clip.apply(ctx);
- } // opacity
-
-
- if (this.style('opacity').hasValue()) {
- ctx.globalAlpha = this.style('opacity').numValue();
- }
- }
-
- };
- svg.Element.PathElementBase = class extends svg.Element.RenderedElementBase {
- path(ctx) {
- if (!isNullish(ctx)) ctx.beginPath();
- return new svg.BoundingBox();
- }
-
- renderChildren(ctx) {
- this.path(ctx);
- svg.Mouse.checkPath(this, ctx);
-
- if (ctx.fillStyle !== '') {
- if (this.style('fill-rule').valueOrDefault('inherit') !== 'inherit') {
- ctx.fill(this.style('fill-rule').value);
+ if (this.attribute('mask').hasValue()) {
+ // mask
+ var mask = this.attribute('mask').getDefinition();
+ if (!isNullish(mask)) mask.apply(ctx, this);
+ } else if (this.style('filter').hasValue()) {
+ // filter
+ var filter = this.style('filter').getDefinition();
+ if (!isNullish(filter)) filter.apply(ctx, this);
} else {
- ctx.fill();
+ this.setContext(ctx);
+ this.renderChildren(ctx);
+ this.clearContext(ctx);
+ }
+
+ ctx.restore();
+ } // base set context
+
+ }, {
+ key: "setContext",
+ value: function setContext(ctx) {// OVERRIDE ME!
+ } // base clear context
+
+ }, {
+ key: "clearContext",
+ value: function clearContext(ctx) {// OVERRIDE ME!
+ } // base render children
+
+ }, {
+ key: "renderChildren",
+ value: function renderChildren(ctx) {
+ this.children.forEach(function (child) {
+ child.render(ctx);
+ });
+ }
+ }, {
+ key: "addChild",
+ value: function addChild(childNode, create) {
+ var child = create ? svg.CreateElement(childNode) : childNode;
+ child.parent = this;
+
+ if (child.type !== 'title') {
+ this.children.push(child);
}
}
+ }]);
- if (ctx.strokeStyle !== '') ctx.stroke();
- const markers = this.getMarkers();
+ return _class4;
+ }();
- if (!isNullish(markers)) {
- if (this.style('marker-start').isUrlDefinition()) {
- const marker = this.style('marker-start').getDefinition();
- marker.render(ctx, markers[0][0], markers[0][1]);
+ svg.Element.RenderedElementBase = /*#__PURE__*/function (_svg$Element$ElementB) {
+ _inherits(_class5, _svg$Element$ElementB);
+
+ var _super4 = _createSuper(_class5);
+
+ function _class5() {
+ _classCallCheck(this, _class5);
+
+ return _super4.apply(this, arguments);
+ }
+
+ _createClass(_class5, [{
+ key: "setContext",
+ value: function setContext(ctx) {
+ // fill
+ if (this.style('fill').isUrlDefinition()) {
+ var fs = this.style('fill').getFillStyleDefinition(this, this.style('fill-opacity'));
+ if (!isNullish(fs)) ctx.fillStyle = fs;
+ } else if (this.style('fill').hasValue()) {
+ var fillStyle = this.style('fill');
+ if (fillStyle.value === 'currentColor') fillStyle.value = this.style('color').value;
+ ctx.fillStyle = fillStyle.value === 'none' ? 'rgba(0,0,0,0)' : fillStyle.value;
}
- if (this.style('marker-mid').isUrlDefinition()) {
- const marker = this.style('marker-mid').getDefinition();
+ if (this.style('fill-opacity').hasValue()) {
+ var _fillStyle = new svg.Property('fill', ctx.fillStyle);
- for (let i = 1; i < markers.length - 1; i++) {
- marker.render(ctx, markers[i][0], markers[i][1]);
+ _fillStyle = _fillStyle.addOpacity(this.style('fill-opacity'));
+ ctx.fillStyle = _fillStyle.value;
+ } // stroke
+
+
+ if (this.style('stroke').isUrlDefinition()) {
+ var _fs = this.style('stroke').getFillStyleDefinition(this, this.style('stroke-opacity'));
+
+ if (!isNullish(_fs)) ctx.strokeStyle = _fs;
+ } else if (this.style('stroke').hasValue()) {
+ var strokeStyle = this.style('stroke');
+ if (strokeStyle.value === 'currentColor') strokeStyle.value = this.style('color').value;
+ ctx.strokeStyle = strokeStyle.value === 'none' ? 'rgba(0,0,0,0)' : strokeStyle.value;
+ }
+
+ if (this.style('stroke-opacity').hasValue()) {
+ var _strokeStyle = new svg.Property('stroke', ctx.strokeStyle);
+
+ _strokeStyle = _strokeStyle.addOpacity(this.style('stroke-opacity'));
+ ctx.strokeStyle = _strokeStyle.value;
+ }
+
+ if (this.style('stroke-width').hasValue()) {
+ var newLineWidth = this.style('stroke-width').toPixels();
+ ctx.lineWidth = newLineWidth === 0 ? 0.001 : newLineWidth; // browsers don't respect 0
+ }
+
+ if (this.style('stroke-linecap').hasValue()) ctx.lineCap = this.style('stroke-linecap').value;
+ if (this.style('stroke-linejoin').hasValue()) ctx.lineJoin = this.style('stroke-linejoin').value;
+ if (this.style('stroke-miterlimit').hasValue()) ctx.miterLimit = this.style('stroke-miterlimit').value;
+
+ if (this.style('stroke-dasharray').hasValue() && this.style('stroke-dasharray').value !== 'none') {
+ var gaps = svg.ToNumberArray(this.style('stroke-dasharray').value);
+
+ if (typeof ctx.setLineDash !== 'undefined') {
+ ctx.setLineDash(gaps);
+ } else if (typeof ctx.webkitLineDash !== 'undefined') {
+ ctx.webkitLineDash = gaps;
+ } else if (typeof ctx.mozDash !== 'undefined' && !(gaps.length === 1 && gaps[0] === 0)) {
+ ctx.mozDash = gaps;
+ }
+
+ var offset = this.style('stroke-dashoffset').numValueOrDefault(1);
+
+ if (typeof ctx.lineDashOffset !== 'undefined') {
+ ctx.lineDashOffset = offset;
+ } else if (typeof ctx.webkitLineDashOffset !== 'undefined') {
+ ctx.webkitLineDashOffset = offset;
+ } else if (typeof ctx.mozDashOffset !== 'undefined') {
+ ctx.mozDashOffset = offset;
+ }
+ } // font
+
+
+ if (typeof ctx.font !== 'undefined') {
+ ctx.font = svg.Font.CreateFont(this.style('font-style').value, this.style('font-variant').value, this.style('font-weight').value, this.style('font-size').hasValue() ? this.style('font-size').toPixels() + 'px' : '', this.style('font-family').value).toString();
+ } // transform
+
+
+ if (this.attribute('transform').hasValue()) {
+ var transform = new svg.Transform(this.attribute('transform').value);
+ transform.apply(ctx);
+ } // clip
+
+
+ if (this.style('clip-path', false, true).hasValue()) {
+ var clip = this.style('clip-path', false, true).getDefinition();
+ if (!isNullish(clip)) clip.apply(ctx);
+ } // opacity
+
+
+ if (this.style('opacity').hasValue()) {
+ ctx.globalAlpha = this.style('opacity').numValue();
+ }
+ }
+ }]);
+
+ return _class5;
+ }(svg.Element.ElementBase);
+
+ svg.Element.PathElementBase = /*#__PURE__*/function (_svg$Element$Rendered) {
+ _inherits(_class6, _svg$Element$Rendered);
+
+ var _super5 = _createSuper(_class6);
+
+ function _class6() {
+ _classCallCheck(this, _class6);
+
+ return _super5.apply(this, arguments);
+ }
+
+ _createClass(_class6, [{
+ key: "path",
+ value: function path(ctx) {
+ if (!isNullish(ctx)) ctx.beginPath();
+ return new svg.BoundingBox();
+ }
+ }, {
+ key: "renderChildren",
+ value: function renderChildren(ctx) {
+ this.path(ctx);
+ svg.Mouse.checkPath(this, ctx);
+
+ if (ctx.fillStyle !== '') {
+ if (this.style('fill-rule').valueOrDefault('inherit') !== 'inherit') {
+ ctx.fill(this.style('fill-rule').value);
+ } else {
+ ctx.fill();
}
}
- if (this.style('marker-end').isUrlDefinition()) {
- const marker = this.style('marker-end').getDefinition();
- marker.render(ctx, markers[markers.length - 1][0], markers[markers.length - 1][1]);
+ if (ctx.strokeStyle !== '') ctx.stroke();
+ var markers = this.getMarkers();
+
+ if (!isNullish(markers)) {
+ if (this.style('marker-start').isUrlDefinition()) {
+ var marker = this.style('marker-start').getDefinition();
+ marker.render(ctx, markers[0][0], markers[0][1]);
+ }
+
+ if (this.style('marker-mid').isUrlDefinition()) {
+ var _marker = this.style('marker-mid').getDefinition();
+
+ for (var i = 1; i < markers.length - 1; i++) {
+ _marker.render(ctx, markers[i][0], markers[i][1]);
+ }
+ }
+
+ if (this.style('marker-end').isUrlDefinition()) {
+ var _marker2 = this.style('marker-end').getDefinition();
+
+ _marker2.render(ctx, markers[markers.length - 1][0], markers[markers.length - 1][1]);
+ }
}
}
- }
-
- getBoundingBox() {
- return this.path();
- }
-
- getMarkers() {
- return null;
- }
-
- }; // svg element
-
- svg.Element.svg = class extends svg.Element.RenderedElementBase {
- clearContext(ctx) {
- super.clearContext(ctx);
- svg.ViewPort.RemoveCurrent();
- }
-
- setContext(ctx) {
- // initial values and defaults
- ctx.strokeStyle = 'rgba(0,0,0,0)';
- ctx.lineCap = 'butt';
- ctx.lineJoin = 'miter';
- ctx.miterLimit = 4;
-
- if (typeof ctx.font !== 'undefined' && typeof window.getComputedStyle !== 'undefined') {
- ctx.font = window.getComputedStyle(ctx.canvas).getPropertyValue('font');
+ }, {
+ key: "getBoundingBox",
+ value: function getBoundingBox() {
+ return this.path();
}
+ }, {
+ key: "getMarkers",
+ value: function getMarkers() {
+ return null;
+ }
+ }]);
- super.setContext(ctx); // create new view port
+ return _class6;
+ }(svg.Element.RenderedElementBase); // svg element
- if (!this.attribute('x').hasValue()) this.attribute('x', true).value = 0;
- if (!this.attribute('y').hasValue()) this.attribute('y', true).value = 0;
- ctx.translate(this.attribute('x').toPixels('x'), this.attribute('y').toPixels('y'));
- let width = svg.ViewPort.width();
- let height = svg.ViewPort.height();
- if (!this.attribute('width').hasValue()) this.attribute('width', true).value = '100%';
- if (!this.attribute('height').hasValue()) this.attribute('height', true).value = '100%';
- if (typeof this.root === 'undefined') {
- width = this.attribute('width').toPixels('x');
- height = this.attribute('height').toPixels('y');
- let x = 0;
- let y = 0;
+ svg.Element.svg = /*#__PURE__*/function (_svg$Element$Rendered2) {
+ _inherits(_class7, _svg$Element$Rendered2);
- if (this.attribute('refX').hasValue() && this.attribute('refY').hasValue()) {
- x = -this.attribute('refX').toPixels('x');
- y = -this.attribute('refY').toPixels('y');
+ var _super6 = _createSuper(_class7);
+
+ function _class7() {
+ _classCallCheck(this, _class7);
+
+ return _super6.apply(this, arguments);
+ }
+
+ _createClass(_class7, [{
+ key: "clearContext",
+ value: function clearContext(ctx) {
+ _get(_getPrototypeOf(_class7.prototype), "clearContext", this).call(this, ctx);
+
+ svg.ViewPort.RemoveCurrent();
+ }
+ }, {
+ key: "setContext",
+ value: function setContext(ctx) {
+ // initial values and defaults
+ ctx.strokeStyle = 'rgba(0,0,0,0)';
+ ctx.lineCap = 'butt';
+ ctx.lineJoin = 'miter';
+ ctx.miterLimit = 4;
+
+ if (typeof ctx.font !== 'undefined' && typeof window.getComputedStyle !== 'undefined') {
+ ctx.font = window.getComputedStyle(ctx.canvas).getPropertyValue('font');
}
- if (this.attribute('overflow').valueOrDefault('hidden') !== 'visible') {
+ _get(_getPrototypeOf(_class7.prototype), "setContext", this).call(this, ctx); // create new view port
+
+
+ if (!this.attribute('x').hasValue()) this.attribute('x', true).value = 0;
+ if (!this.attribute('y').hasValue()) this.attribute('y', true).value = 0;
+ ctx.translate(this.attribute('x').toPixels('x'), this.attribute('y').toPixels('y'));
+ var width = svg.ViewPort.width();
+ var height = svg.ViewPort.height();
+ if (!this.attribute('width').hasValue()) this.attribute('width', true).value = '100%';
+ if (!this.attribute('height').hasValue()) this.attribute('height', true).value = '100%';
+
+ if (typeof this.root === 'undefined') {
+ width = this.attribute('width').toPixels('x');
+ height = this.attribute('height').toPixels('y');
+ var x = 0;
+ var y = 0;
+
+ if (this.attribute('refX').hasValue() && this.attribute('refY').hasValue()) {
+ x = -this.attribute('refX').toPixels('x');
+ y = -this.attribute('refY').toPixels('y');
+ }
+
+ if (this.attribute('overflow').valueOrDefault('hidden') !== 'visible') {
+ ctx.beginPath();
+ ctx.moveTo(x, y);
+ ctx.lineTo(width, y);
+ ctx.lineTo(width, height);
+ ctx.lineTo(x, height);
+ ctx.closePath();
+ ctx.clip();
+ }
+ }
+
+ svg.ViewPort.SetCurrent(width, height); // viewbox
+
+ if (this.attribute('viewBox').hasValue()) {
+ var viewBox = svg.ToNumberArray(this.attribute('viewBox').value);
+ var minX = viewBox[0];
+ var minY = viewBox[1];
+ width = viewBox[2];
+ height = viewBox[3];
+ svg.AspectRatio(ctx, this.attribute('preserveAspectRatio').value, svg.ViewPort.width(), width, svg.ViewPort.height(), height, minX, minY, this.attribute('refX').value, this.attribute('refY').value);
+ svg.ViewPort.RemoveCurrent();
+ svg.ViewPort.SetCurrent(viewBox[2], viewBox[3]);
+ }
+ }
+ }]);
+
+ return _class7;
+ }(svg.Element.RenderedElementBase); // rect element
+
+
+ svg.Element.rect = /*#__PURE__*/function (_svg$Element$PathElem) {
+ _inherits(_class8, _svg$Element$PathElem);
+
+ var _super7 = _createSuper(_class8);
+
+ function _class8() {
+ _classCallCheck(this, _class8);
+
+ return _super7.apply(this, arguments);
+ }
+
+ _createClass(_class8, [{
+ key: "path",
+ value: function path(ctx) {
+ var x = this.attribute('x').toPixels('x');
+ var y = this.attribute('y').toPixels('y');
+ var width = this.attribute('width').toPixels('x');
+ var height = this.attribute('height').toPixels('y');
+ var rx = this.attribute('rx').toPixels('x');
+ var ry = this.attribute('ry').toPixels('y');
+ if (this.attribute('rx').hasValue() && !this.attribute('ry').hasValue()) ry = rx;
+ if (this.attribute('ry').hasValue() && !this.attribute('rx').hasValue()) rx = ry;
+ rx = Math.min(rx, width / 2.0);
+ ry = Math.min(ry, height / 2.0);
+
+ if (!isNullish(ctx)) {
+ ctx.beginPath();
+ ctx.moveTo(x + rx, y);
+ ctx.lineTo(x + width - rx, y);
+ ctx.quadraticCurveTo(x + width, y, x + width, y + ry);
+ ctx.lineTo(x + width, y + height - ry);
+ ctx.quadraticCurveTo(x + width, y + height, x + width - rx, y + height);
+ ctx.lineTo(x + rx, y + height);
+ ctx.quadraticCurveTo(x, y + height, x, y + height - ry);
+ ctx.lineTo(x, y + ry);
+ ctx.quadraticCurveTo(x, y, x + rx, y);
+ ctx.closePath();
+ }
+
+ return new svg.BoundingBox(x, y, x + width, y + height);
+ }
+ }]);
+
+ return _class8;
+ }(svg.Element.PathElementBase); // circle element
+
+
+ svg.Element.circle = /*#__PURE__*/function (_svg$Element$PathElem2) {
+ _inherits(_class9, _svg$Element$PathElem2);
+
+ var _super8 = _createSuper(_class9);
+
+ function _class9() {
+ _classCallCheck(this, _class9);
+
+ return _super8.apply(this, arguments);
+ }
+
+ _createClass(_class9, [{
+ key: "path",
+ value: function path(ctx) {
+ var cx = this.attribute('cx').toPixels('x');
+ var cy = this.attribute('cy').toPixels('y');
+ var r = this.attribute('r').toPixels();
+
+ if (!isNullish(ctx)) {
+ ctx.beginPath();
+ ctx.arc(cx, cy, r, 0, Math.PI * 2, true);
+ ctx.closePath();
+ }
+
+ return new svg.BoundingBox(cx - r, cy - r, cx + r, cy + r);
+ }
+ }]);
+
+ return _class9;
+ }(svg.Element.PathElementBase); // ellipse element
+
+
+ var KAPPA = 4 * ((Math.sqrt(2) - 1) / 3);
+
+ svg.Element.ellipse = /*#__PURE__*/function (_svg$Element$PathElem3) {
+ _inherits(_class10, _svg$Element$PathElem3);
+
+ var _super9 = _createSuper(_class10);
+
+ function _class10() {
+ _classCallCheck(this, _class10);
+
+ return _super9.apply(this, arguments);
+ }
+
+ _createClass(_class10, [{
+ key: "path",
+ value: function path(ctx) {
+ var rx = this.attribute('rx').toPixels('x');
+ var ry = this.attribute('ry').toPixels('y');
+ var cx = this.attribute('cx').toPixels('x');
+ var cy = this.attribute('cy').toPixels('y');
+
+ if (!isNullish(ctx)) {
+ ctx.beginPath();
+ ctx.moveTo(cx, cy - ry);
+ ctx.bezierCurveTo(cx + KAPPA * rx, cy - ry, cx + rx, cy - KAPPA * ry, cx + rx, cy);
+ ctx.bezierCurveTo(cx + rx, cy + KAPPA * ry, cx + KAPPA * rx, cy + ry, cx, cy + ry);
+ ctx.bezierCurveTo(cx - KAPPA * rx, cy + ry, cx - rx, cy + KAPPA * ry, cx - rx, cy);
+ ctx.bezierCurveTo(cx - rx, cy - KAPPA * ry, cx - KAPPA * rx, cy - ry, cx, cy - ry);
+ ctx.closePath();
+ }
+
+ return new svg.BoundingBox(cx - rx, cy - ry, cx + rx, cy + ry);
+ }
+ }]);
+
+ return _class10;
+ }(svg.Element.PathElementBase); // line element
+
+
+ svg.Element.line = /*#__PURE__*/function (_svg$Element$PathElem4) {
+ _inherits(_class11, _svg$Element$PathElem4);
+
+ var _super10 = _createSuper(_class11);
+
+ function _class11() {
+ _classCallCheck(this, _class11);
+
+ return _super10.apply(this, arguments);
+ }
+
+ _createClass(_class11, [{
+ key: "getPoints",
+ value: function getPoints() {
+ return [new svg.Point(this.attribute('x1').toPixels('x'), this.attribute('y1').toPixels('y')), new svg.Point(this.attribute('x2').toPixels('x'), this.attribute('y2').toPixels('y'))];
+ }
+ }, {
+ key: "path",
+ value: function path(ctx) {
+ var points = this.getPoints();
+
+ if (!isNullish(ctx)) {
+ ctx.beginPath();
+ ctx.moveTo(points[0].x, points[0].y);
+ ctx.lineTo(points[1].x, points[1].y);
+ }
+
+ return new svg.BoundingBox(points[0].x, points[0].y, points[1].x, points[1].y);
+ }
+ }, {
+ key: "getMarkers",
+ value: function getMarkers() {
+ var points = this.getPoints();
+ var a = points[0].angleTo(points[1]);
+ return [[points[0], a], [points[1], a]];
+ }
+ }]);
+
+ return _class11;
+ }(svg.Element.PathElementBase); // polyline element
+
+
+ svg.Element.polyline = /*#__PURE__*/function (_svg$Element$PathElem5) {
+ _inherits(_class12, _svg$Element$PathElem5);
+
+ var _super11 = _createSuper(_class12);
+
+ function _class12(node) {
+ var _this8;
+
+ _classCallCheck(this, _class12);
+
+ _this8 = _super11.call(this, node);
+ _this8.points = svg.CreatePath(_this8.attribute('points').value);
+ return _this8;
+ }
+
+ _createClass(_class12, [{
+ key: "path",
+ value: function path(ctx) {
+ var _this$points$ = this.points[0],
+ x = _this$points$.x,
+ y = _this$points$.y;
+ var bb = new svg.BoundingBox(x, y);
+
+ if (!isNullish(ctx)) {
ctx.beginPath();
ctx.moveTo(x, y);
- ctx.lineTo(width, y);
- ctx.lineTo(width, height);
- ctx.lineTo(x, height);
- ctx.closePath();
- ctx.clip();
}
+
+ for (var i = 1; i < this.points.length; i++) {
+ var _this$points$i = this.points[i],
+ _x = _this$points$i.x,
+ _y = _this$points$i.y;
+ bb.addPoint(_x, _y);
+ if (!isNullish(ctx)) ctx.lineTo(_x, _y);
+ }
+
+ return bb;
}
+ }, {
+ key: "getMarkers",
+ value: function getMarkers() {
+ var markers = [];
- svg.ViewPort.SetCurrent(width, height); // viewbox
+ for (var i = 0; i < this.points.length - 1; i++) {
+ markers.push([this.points[i], this.points[i].angleTo(this.points[i + 1])]);
+ }
- if (this.attribute('viewBox').hasValue()) {
- const viewBox = svg.ToNumberArray(this.attribute('viewBox').value);
- const minX = viewBox[0];
- const minY = viewBox[1];
- width = viewBox[2];
- height = viewBox[3];
- svg.AspectRatio(ctx, this.attribute('preserveAspectRatio').value, svg.ViewPort.width(), width, svg.ViewPort.height(), height, minX, minY, this.attribute('refX').value, this.attribute('refY').value);
- svg.ViewPort.RemoveCurrent();
- svg.ViewPort.SetCurrent(viewBox[2], viewBox[3]);
+ markers.push([this.points[this.points.length - 1], markers[markers.length - 1][1]]);
+ return markers;
}
+ }]);
+
+ return _class12;
+ }(svg.Element.PathElementBase); // polygon element
+
+
+ svg.Element.polygon = /*#__PURE__*/function (_svg$Element$polyline) {
+ _inherits(_class13, _svg$Element$polyline);
+
+ var _super12 = _createSuper(_class13);
+
+ function _class13() {
+ _classCallCheck(this, _class13);
+
+ return _super12.apply(this, arguments);
}
- }; // rect element
+ _createClass(_class13, [{
+ key: "path",
+ value: function path(ctx) {
+ var bb = _get(_getPrototypeOf(_class13.prototype), "path", this).call(this, ctx);
- svg.Element.rect = class extends svg.Element.PathElementBase {
- path(ctx) {
- const x = this.attribute('x').toPixels('x');
- const y = this.attribute('y').toPixels('y');
- const width = this.attribute('width').toPixels('x');
- const height = this.attribute('height').toPixels('y');
- let rx = this.attribute('rx').toPixels('x');
- let ry = this.attribute('ry').toPixels('y');
- if (this.attribute('rx').hasValue() && !this.attribute('ry').hasValue()) ry = rx;
- if (this.attribute('ry').hasValue() && !this.attribute('rx').hasValue()) rx = ry;
- rx = Math.min(rx, width / 2.0);
- ry = Math.min(ry, height / 2.0);
+ if (!isNullish(ctx)) {
+ ctx.lineTo(this.points[0].x, this.points[0].y);
+ ctx.closePath();
+ }
- if (!isNullish(ctx)) {
- ctx.beginPath();
- ctx.moveTo(x + rx, y);
- ctx.lineTo(x + width - rx, y);
- ctx.quadraticCurveTo(x + width, y, x + width, y + ry);
- ctx.lineTo(x + width, y + height - ry);
- ctx.quadraticCurveTo(x + width, y + height, x + width - rx, y + height);
- ctx.lineTo(x + rx, y + height);
- ctx.quadraticCurveTo(x, y + height, x, y + height - ry);
- ctx.lineTo(x, y + ry);
- ctx.quadraticCurveTo(x, y, x + rx, y);
- ctx.closePath();
+ return bb;
}
+ }]);
- return new svg.BoundingBox(x, y, x + width, y + height);
- }
+ return _class13;
+ }(svg.Element.polyline); // path element
- }; // circle element
- svg.Element.circle = class extends svg.Element.PathElementBase {
- path(ctx) {
- const cx = this.attribute('cx').toPixels('x');
- const cy = this.attribute('cy').toPixels('y');
- const r = this.attribute('r').toPixels();
+ svg.Element.path = /*#__PURE__*/function (_svg$Element$PathElem6) {
+ _inherits(_class14, _svg$Element$PathElem6);
- if (!isNullish(ctx)) {
- ctx.beginPath();
- ctx.arc(cx, cy, r, 0, Math.PI * 2, true);
- ctx.closePath();
- }
+ var _super13 = _createSuper(_class14);
- return new svg.BoundingBox(cx - r, cy - r, cx + r, cy + r);
- }
+ function _class14(node) {
+ var _this9;
- }; // ellipse element
+ _classCallCheck(this, _class14);
- const KAPPA = 4 * ((Math.sqrt(2) - 1) / 3);
- svg.Element.ellipse = class extends svg.Element.PathElementBase {
- path(ctx) {
- const rx = this.attribute('rx').toPixels('x');
- const ry = this.attribute('ry').toPixels('y');
- const cx = this.attribute('cx').toPixels('x');
- const cy = this.attribute('cy').toPixels('y');
+ _this9 = _super13.call(this, node);
- if (!isNullish(ctx)) {
- ctx.beginPath();
- ctx.moveTo(cx, cy - ry);
- ctx.bezierCurveTo(cx + KAPPA * rx, cy - ry, cx + rx, cy - KAPPA * ry, cx + rx, cy);
- ctx.bezierCurveTo(cx + rx, cy + KAPPA * ry, cx + KAPPA * rx, cy + ry, cx, cy + ry);
- ctx.bezierCurveTo(cx - KAPPA * rx, cy + ry, cx - rx, cy + KAPPA * ry, cx - rx, cy);
- ctx.bezierCurveTo(cx - rx, cy - KAPPA * ry, cx - KAPPA * rx, cy - ry, cx, cy - ry);
- ctx.closePath();
- }
-
- return new svg.BoundingBox(cx - rx, cy - ry, cx + rx, cy + ry);
- }
-
- }; // line element
-
- svg.Element.line = class extends svg.Element.PathElementBase {
- getPoints() {
- return [new svg.Point(this.attribute('x1').toPixels('x'), this.attribute('y1').toPixels('y')), new svg.Point(this.attribute('x2').toPixels('x'), this.attribute('y2').toPixels('y'))];
- }
-
- path(ctx) {
- const points = this.getPoints();
-
- if (!isNullish(ctx)) {
- ctx.beginPath();
- ctx.moveTo(points[0].x, points[0].y);
- ctx.lineTo(points[1].x, points[1].y);
- }
-
- return new svg.BoundingBox(points[0].x, points[0].y, points[1].x, points[1].y);
- }
-
- getMarkers() {
- const points = this.getPoints();
- const a = points[0].angleTo(points[1]);
- return [[points[0], a], [points[1], a]];
- }
-
- }; // polyline element
-
- svg.Element.polyline = class extends svg.Element.PathElementBase {
- constructor(node) {
- super(node);
- this.points = svg.CreatePath(this.attribute('points').value);
- }
-
- path(ctx) {
- const {
- x,
- y
- } = this.points[0];
- const bb = new svg.BoundingBox(x, y);
-
- if (!isNullish(ctx)) {
- ctx.beginPath();
- ctx.moveTo(x, y);
- }
-
- for (let i = 1; i < this.points.length; i++) {
- const {
- x: _x,
- y: _y
- } = this.points[i];
- bb.addPoint(_x, _y);
- if (!isNullish(ctx)) ctx.lineTo(_x, _y);
- }
-
- return bb;
- }
-
- getMarkers() {
- const markers = [];
-
- for (let i = 0; i < this.points.length - 1; i++) {
- markers.push([this.points[i], this.points[i].angleTo(this.points[i + 1])]);
- }
-
- markers.push([this.points[this.points.length - 1], markers[markers.length - 1][1]]);
- return markers;
- }
-
- }; // polygon element
-
- svg.Element.polygon = class extends svg.Element.polyline {
- path(ctx) {
- const bb = super.path(ctx);
-
- if (!isNullish(ctx)) {
- ctx.lineTo(this.points[0].x, this.points[0].y);
- ctx.closePath();
- }
-
- return bb;
- }
-
- }; // path element
-
- svg.Element.path = class extends svg.Element.PathElementBase {
- constructor(node) {
- super(node);
- let d = this.attribute('d').value // TODO: convert to real lexer based on https://www.w3.org/TR/SVG11/paths.html#PathDataBNF
+ var d = _this9.attribute('d').value // TODO: convert to real lexer based on https://www.w3.org/TR/SVG11/paths.html#PathDataBNF
.replace(/,/gm, ' ') // get rid of all commas
.replace(/([MmZzLlHhVvCcSsQqTtAa])([MmZzLlHhVvCcSsQqTtAa])/gm, '$1 $2') // separate commands from commands
.replace(/([MmZzLlHhVvCcSsQqTtAa])([MmZzLlHhVvCcSsQqTtAa])/gm, '$1 $2') // separate commands from commands
@@ -2033,13 +2583,13 @@ var svgEditorExtension_server_opensave = (function () {
.replace(/(\.\d*)(\.)/gm, '$1 $2') // separate digits when no comma
.replace(/([Aa](\s+\d+)(\s+\d+)(\s+\d+))\s+([01])\s*([01])/gm, '$1 $5 $6 '); // shorthand elliptical arc path syntax
+
d = svg.compressSpaces(d); // compress multiple spaces
d = svg.trim(d);
- this.PathParser = {
+ _this9.PathParser = {
tokens: d.split(' '),
-
- reset() {
+ reset: function reset() {
this.i = -1;
this.command = '';
this.previousCommand = '';
@@ -2049,17 +2599,14 @@ var svgEditorExtension_server_opensave = (function () {
this.points = [];
this.angles = [];
},
-
- isEnd() {
+ isEnd: function isEnd() {
return this.i >= this.tokens.length - 1;
},
-
- isCommandOrEnd() {
+ isCommandOrEnd: function isCommandOrEnd() {
if (this.isEnd()) return true;
return !isNullish(this.tokens[this.i + 1].match(/^[A-Za-z]$/));
},
-
- isRelativeCommand() {
+ isRelativeCommand: function isRelativeCommand() {
switch (this.command) {
case 'm':
case 'l':
@@ -2076,49 +2623,41 @@ var svgEditorExtension_server_opensave = (function () {
return false;
},
-
- getToken() {
+ getToken: function getToken() {
this.i++;
return this.tokens[this.i];
},
-
- getScalar() {
+ getScalar: function getScalar() {
return Number.parseFloat(this.getToken());
},
-
- nextCommand() {
+ nextCommand: function nextCommand() {
this.previousCommand = this.command;
this.command = this.getToken();
},
-
- getPoint() {
- const p = new svg.Point(this.getScalar(), this.getScalar());
+ getPoint: function getPoint() {
+ var p = new svg.Point(this.getScalar(), this.getScalar());
return this.makeAbsolute(p);
},
-
- getAsControlPoint() {
- const p = this.getPoint();
+ getAsControlPoint: function getAsControlPoint() {
+ var p = this.getPoint();
this.control = p;
return p;
},
-
- getAsCurrentPoint() {
- const p = this.getPoint();
+ getAsCurrentPoint: function getAsCurrentPoint() {
+ var p = this.getPoint();
this.current = p;
return p;
},
-
- getReflectedControlPoint() {
+ getReflectedControlPoint: function getReflectedControlPoint() {
if (this.previousCommand.toLowerCase() !== 'c' && this.previousCommand.toLowerCase() !== 's' && this.previousCommand.toLowerCase() !== 'q' && this.previousCommand.toLowerCase() !== 't') {
return this.current;
} // reflect point
- const p = new svg.Point(2 * this.current.x - this.control.x, 2 * this.current.y - this.control.y);
+ var p = new svg.Point(2 * this.current.x - this.control.x, 2 * this.current.y - this.control.y);
return p;
},
-
- makeAbsolute(p) {
+ makeAbsolute: function makeAbsolute(p) {
if (this.isRelativeCommand()) {
p.x += this.current.x;
p.y += this.current.y;
@@ -2126,8 +2665,7 @@ var svgEditorExtension_server_opensave = (function () {
return p;
},
-
- addMarker(p, from, priorTo) {
+ addMarker: function addMarker(p, from, priorTo) {
// if the last angle isn't filled in because we didn't have this point yet ...
if (!isNullish(priorTo) && this.angles.length > 0 && isNullish(this.angles[this.angles.length - 1])) {
this.angles[this.angles.length - 1] = this.points[this.points.length - 1].angleTo(priorTo);
@@ -2135,20 +2673,17 @@ var svgEditorExtension_server_opensave = (function () {
this.addMarkerAngle(p, isNullish(from) ? null : from.angleTo(p));
},
-
- addMarkerAngle(p, a) {
+ addMarkerAngle: function addMarkerAngle(p, a) {
this.points.push(p);
this.angles.push(a);
},
-
- getMarkerPoints() {
+ getMarkerPoints: function getMarkerPoints() {
return this.points;
},
-
- getMarkerAngles() {
- for (let i = 0; i < this.angles.length; i++) {
+ getMarkerAngles: function getMarkerAngles() {
+ for (var i = 0; i < this.angles.length; i++) {
if (isNullish(this.angles[i])) {
- for (let j = i + 1; j < this.angles.length; j++) {
+ for (var j = i + 1; j < this.angles.length; j++) {
if (!isNullish(this.angles[j])) {
this.angles[i] = this.angles[j];
break;
@@ -2159,1002 +2694,1386 @@ var svgEditorExtension_server_opensave = (function () {
return this.angles;
}
-
};
+ return _this9;
}
- path(ctx) {
- const pp = this.PathParser;
- pp.reset();
- const bb = new svg.BoundingBox();
- if (!isNullish(ctx)) ctx.beginPath();
+ _createClass(_class14, [{
+ key: "path",
+ value: function path(ctx) {
+ var pp = this.PathParser;
+ pp.reset();
+ var bb = new svg.BoundingBox();
+ if (!isNullish(ctx)) ctx.beginPath();
- while (!pp.isEnd()) {
- pp.nextCommand();
+ while (!pp.isEnd()) {
+ pp.nextCommand();
- switch (pp.command) {
- case 'M':
- case 'm':
- {
- const p = pp.getAsCurrentPoint();
- pp.addMarker(p);
- bb.addPoint(p.x, p.y);
- if (!isNullish(ctx)) ctx.moveTo(p.x, p.y);
- pp.start = pp.current;
+ switch (pp.command) {
+ case 'M':
+ case 'm':
+ {
+ var p = pp.getAsCurrentPoint();
+ pp.addMarker(p);
+ bb.addPoint(p.x, p.y);
+ if (!isNullish(ctx)) ctx.moveTo(p.x, p.y);
+ pp.start = pp.current;
+ while (!pp.isCommandOrEnd()) {
+ var _p = pp.getAsCurrentPoint();
+
+ pp.addMarker(_p, pp.start);
+ bb.addPoint(_p.x, _p.y);
+ if (!isNullish(ctx)) ctx.lineTo(_p.x, _p.y);
+ }
+
+ break;
+ }
+
+ case 'L':
+ case 'l':
while (!pp.isCommandOrEnd()) {
- const _p = pp.getAsCurrentPoint();
+ var c = pp.current;
- pp.addMarker(_p, pp.start);
- bb.addPoint(_p.x, _p.y);
- if (!isNullish(ctx)) ctx.lineTo(_p.x, _p.y);
+ var _p2 = pp.getAsCurrentPoint();
+
+ pp.addMarker(_p2, c);
+ bb.addPoint(_p2.x, _p2.y);
+ if (!isNullish(ctx)) ctx.lineTo(_p2.x, _p2.y);
}
break;
- }
- case 'L':
- case 'l':
- while (!pp.isCommandOrEnd()) {
- const c = pp.current;
- const p = pp.getAsCurrentPoint();
- pp.addMarker(p, c);
- bb.addPoint(p.x, p.y);
- if (!isNullish(ctx)) ctx.lineTo(p.x, p.y);
- }
-
- break;
-
- case 'H':
- case 'h':
- while (!pp.isCommandOrEnd()) {
- const newP = new svg.Point((pp.isRelativeCommand() ? pp.current.x : 0) + pp.getScalar(), pp.current.y);
- pp.addMarker(newP, pp.current);
- pp.current = newP;
- bb.addPoint(pp.current.x, pp.current.y);
- if (!isNullish(ctx)) ctx.lineTo(pp.current.x, pp.current.y);
- }
-
- break;
-
- case 'V':
- case 'v':
- while (!pp.isCommandOrEnd()) {
- const newP = new svg.Point(pp.current.x, (pp.isRelativeCommand() ? pp.current.y : 0) + pp.getScalar());
- pp.addMarker(newP, pp.current);
- pp.current = newP;
- bb.addPoint(pp.current.x, pp.current.y);
- if (!isNullish(ctx)) ctx.lineTo(pp.current.x, pp.current.y);
- }
-
- break;
-
- case 'C':
- case 'c':
- while (!pp.isCommandOrEnd()) {
- const curr = pp.current;
- const p1 = pp.getPoint();
- const cntrl = pp.getAsControlPoint();
- const cp = pp.getAsCurrentPoint();
- pp.addMarker(cp, cntrl, p1);
- bb.addBezierCurve(curr.x, curr.y, p1.x, p1.y, cntrl.x, cntrl.y, cp.x, cp.y);
- if (!isNullish(ctx)) ctx.bezierCurveTo(p1.x, p1.y, cntrl.x, cntrl.y, cp.x, cp.y);
- }
-
- break;
-
- case 'S':
- case 's':
- while (!pp.isCommandOrEnd()) {
- const curr = pp.current;
- const p1 = pp.getReflectedControlPoint();
- const cntrl = pp.getAsControlPoint();
- const cp = pp.getAsCurrentPoint();
- pp.addMarker(cp, cntrl, p1);
- bb.addBezierCurve(curr.x, curr.y, p1.x, p1.y, cntrl.x, cntrl.y, cp.x, cp.y);
- if (!isNullish(ctx)) ctx.bezierCurveTo(p1.x, p1.y, cntrl.x, cntrl.y, cp.x, cp.y);
- }
-
- break;
-
- case 'Q':
- case 'q':
- while (!pp.isCommandOrEnd()) {
- const curr = pp.current;
- const cntrl = pp.getAsControlPoint();
- const cp = pp.getAsCurrentPoint();
- pp.addMarker(cp, cntrl, cntrl);
- bb.addQuadraticCurve(curr.x, curr.y, cntrl.x, cntrl.y, cp.x, cp.y);
- if (!isNullish(ctx)) ctx.quadraticCurveTo(cntrl.x, cntrl.y, cp.x, cp.y);
- }
-
- break;
-
- case 'T':
- case 't':
- while (!pp.isCommandOrEnd()) {
- const curr = pp.current;
- const cntrl = pp.getReflectedControlPoint();
- pp.control = cntrl;
- const cp = pp.getAsCurrentPoint();
- pp.addMarker(cp, cntrl, cntrl);
- bb.addQuadraticCurve(curr.x, curr.y, cntrl.x, cntrl.y, cp.x, cp.y);
- if (!isNullish(ctx)) ctx.quadraticCurveTo(cntrl.x, cntrl.y, cp.x, cp.y);
- }
-
- break;
-
- case 'A':
- case 'a':
- while (!pp.isCommandOrEnd()) {
- const curr = pp.current;
- let rx = pp.getScalar();
- let ry = pp.getScalar();
- const xAxisRotation = pp.getScalar() * (Math.PI / 180.0);
- const largeArcFlag = pp.getScalar();
- const sweepFlag = pp.getScalar();
- const cp = pp.getAsCurrentPoint(); // Conversion from endpoint to center parameterization
- // https://www.w3.org/TR/SVG11/implnote.html#ArcConversionEndpointToCenter
- // x1', y1'
-
- const currp = new svg.Point(Math.cos(xAxisRotation) * (curr.x - cp.x) / 2.0 + Math.sin(xAxisRotation) * (curr.y - cp.y) / 2.0, -Math.sin(xAxisRotation) * (curr.x - cp.x) / 2.0 + Math.cos(xAxisRotation) * (curr.y - cp.y) / 2.0); // adjust radii
-
- const l = currp.x ** 2 / rx ** 2 + currp.y ** 2 / ry ** 2;
-
- if (l > 1) {
- rx *= Math.sqrt(l);
- ry *= Math.sqrt(l);
- } // cx', cy'
-
-
- let s = (largeArcFlag === sweepFlag ? -1 : 1) * Math.sqrt((rx ** 2 * ry ** 2 - rx ** 2 * currp.y ** 2 - ry ** 2 * currp.x ** 2) / (rx ** 2 * currp.y ** 2 + ry ** 2 * currp.x ** 2));
- if (isNaN(s)) s = 0;
- const cpp = new svg.Point(s * rx * currp.y / ry, s * -ry * currp.x / rx); // cx, cy
-
- const centp = new svg.Point((curr.x + cp.x) / 2.0 + Math.cos(xAxisRotation) * cpp.x - Math.sin(xAxisRotation) * cpp.y, (curr.y + cp.y) / 2.0 + Math.sin(xAxisRotation) * cpp.x + Math.cos(xAxisRotation) * cpp.y); // vector magnitude
-
- const m = function (v) {
- return Math.sqrt(v[0] ** 2 + v[1] ** 2);
- }; // ratio between two vectors
-
-
- const r = function (u, v) {
- return (u[0] * v[0] + u[1] * v[1]) / (m(u) * m(v));
- }; // angle between two vectors
-
-
- const a = function (u, v) {
- return (u[0] * v[1] < u[1] * v[0] ? -1 : 1) * Math.acos(r(u, v));
- }; // initial angle
-
-
- const a1 = a([1, 0], [(currp.x - cpp.x) / rx, (currp.y - cpp.y) / ry]); // angle delta
-
- const u = [(currp.x - cpp.x) / rx, (currp.y - cpp.y) / ry];
- const v = [(-currp.x - cpp.x) / rx, (-currp.y - cpp.y) / ry];
- let ad = a(u, v);
- if (r(u, v) <= -1) ad = Math.PI;
- if (r(u, v) >= 1) ad = 0; // for markers
-
- const dir = 1 - sweepFlag ? 1.0 : -1.0;
- const ah = a1 + dir * (ad / 2.0);
- const halfWay = new svg.Point(centp.x + rx * Math.cos(ah), centp.y + ry * Math.sin(ah));
- pp.addMarkerAngle(halfWay, ah - dir * Math.PI / 2);
- pp.addMarkerAngle(cp, ah - dir * Math.PI);
- bb.addPoint(cp.x, cp.y); // TODO: this is too naive, make it better
-
- if (!isNullish(ctx)) {
- const _r = rx > ry ? rx : ry;
-
- const sx = rx > ry ? 1 : rx / ry;
- const sy = rx > ry ? ry / rx : 1;
- ctx.translate(centp.x, centp.y);
- ctx.rotate(xAxisRotation);
- ctx.scale(sx, sy);
- ctx.arc(0, 0, _r, a1, a1 + ad, 1 - sweepFlag);
- ctx.scale(1 / sx, 1 / sy);
- ctx.rotate(-xAxisRotation);
- ctx.translate(-centp.x, -centp.y);
+ case 'H':
+ case 'h':
+ while (!pp.isCommandOrEnd()) {
+ var newP = new svg.Point((pp.isRelativeCommand() ? pp.current.x : 0) + pp.getScalar(), pp.current.y);
+ pp.addMarker(newP, pp.current);
+ pp.current = newP;
+ bb.addPoint(pp.current.x, pp.current.y);
+ if (!isNullish(ctx)) ctx.lineTo(pp.current.x, pp.current.y);
}
- }
- break;
+ break;
- case 'Z':
- case 'z':
- if (!isNullish(ctx)) ctx.closePath();
- pp.current = pp.start;
+ case 'V':
+ case 'v':
+ while (!pp.isCommandOrEnd()) {
+ var _newP = new svg.Point(pp.current.x, (pp.isRelativeCommand() ? pp.current.y : 0) + pp.getScalar());
+
+ pp.addMarker(_newP, pp.current);
+ pp.current = _newP;
+ bb.addPoint(pp.current.x, pp.current.y);
+ if (!isNullish(ctx)) ctx.lineTo(pp.current.x, pp.current.y);
+ }
+
+ break;
+
+ case 'C':
+ case 'c':
+ while (!pp.isCommandOrEnd()) {
+ var curr = pp.current;
+ var p1 = pp.getPoint();
+ var cntrl = pp.getAsControlPoint();
+ var cp = pp.getAsCurrentPoint();
+ pp.addMarker(cp, cntrl, p1);
+ bb.addBezierCurve(curr.x, curr.y, p1.x, p1.y, cntrl.x, cntrl.y, cp.x, cp.y);
+ if (!isNullish(ctx)) ctx.bezierCurveTo(p1.x, p1.y, cntrl.x, cntrl.y, cp.x, cp.y);
+ }
+
+ break;
+
+ case 'S':
+ case 's':
+ while (!pp.isCommandOrEnd()) {
+ var _curr = pp.current;
+
+ var _p3 = pp.getReflectedControlPoint();
+
+ var _cntrl = pp.getAsControlPoint();
+
+ var _cp = pp.getAsCurrentPoint();
+
+ pp.addMarker(_cp, _cntrl, _p3);
+ bb.addBezierCurve(_curr.x, _curr.y, _p3.x, _p3.y, _cntrl.x, _cntrl.y, _cp.x, _cp.y);
+ if (!isNullish(ctx)) ctx.bezierCurveTo(_p3.x, _p3.y, _cntrl.x, _cntrl.y, _cp.x, _cp.y);
+ }
+
+ break;
+
+ case 'Q':
+ case 'q':
+ while (!pp.isCommandOrEnd()) {
+ var _curr2 = pp.current;
+
+ var _cntrl2 = pp.getAsControlPoint();
+
+ var _cp2 = pp.getAsCurrentPoint();
+
+ pp.addMarker(_cp2, _cntrl2, _cntrl2);
+ bb.addQuadraticCurve(_curr2.x, _curr2.y, _cntrl2.x, _cntrl2.y, _cp2.x, _cp2.y);
+ if (!isNullish(ctx)) ctx.quadraticCurveTo(_cntrl2.x, _cntrl2.y, _cp2.x, _cp2.y);
+ }
+
+ break;
+
+ case 'T':
+ case 't':
+ while (!pp.isCommandOrEnd()) {
+ var _curr3 = pp.current;
+
+ var _cntrl3 = pp.getReflectedControlPoint();
+
+ pp.control = _cntrl3;
+
+ var _cp3 = pp.getAsCurrentPoint();
+
+ pp.addMarker(_cp3, _cntrl3, _cntrl3);
+ bb.addQuadraticCurve(_curr3.x, _curr3.y, _cntrl3.x, _cntrl3.y, _cp3.x, _cp3.y);
+ if (!isNullish(ctx)) ctx.quadraticCurveTo(_cntrl3.x, _cntrl3.y, _cp3.x, _cp3.y);
+ }
+
+ break;
+
+ case 'A':
+ case 'a':
+ var _loop2 = function _loop2() {
+ var curr = pp.current;
+ var rx = pp.getScalar();
+ var ry = pp.getScalar();
+ var xAxisRotation = pp.getScalar() * (Math.PI / 180.0);
+ var largeArcFlag = pp.getScalar();
+ var sweepFlag = pp.getScalar();
+ var cp = pp.getAsCurrentPoint(); // Conversion from endpoint to center parameterization
+ // https://www.w3.org/TR/SVG11/implnote.html#ArcConversionEndpointToCenter
+ // x1', y1'
+
+ var currp = new svg.Point(Math.cos(xAxisRotation) * (curr.x - cp.x) / 2.0 + Math.sin(xAxisRotation) * (curr.y - cp.y) / 2.0, -Math.sin(xAxisRotation) * (curr.x - cp.x) / 2.0 + Math.cos(xAxisRotation) * (curr.y - cp.y) / 2.0); // adjust radii
+
+ var l = Math.pow(currp.x, 2) / Math.pow(rx, 2) + Math.pow(currp.y, 2) / Math.pow(ry, 2);
+
+ if (l > 1) {
+ rx *= Math.sqrt(l);
+ ry *= Math.sqrt(l);
+ } // cx', cy'
+
+
+ var s = (largeArcFlag === sweepFlag ? -1 : 1) * Math.sqrt((Math.pow(rx, 2) * Math.pow(ry, 2) - Math.pow(rx, 2) * Math.pow(currp.y, 2) - Math.pow(ry, 2) * Math.pow(currp.x, 2)) / (Math.pow(rx, 2) * Math.pow(currp.y, 2) + Math.pow(ry, 2) * Math.pow(currp.x, 2)));
+ if (isNaN(s)) s = 0;
+ var cpp = new svg.Point(s * rx * currp.y / ry, s * -ry * currp.x / rx); // cx, cy
+
+ var centp = new svg.Point((curr.x + cp.x) / 2.0 + Math.cos(xAxisRotation) * cpp.x - Math.sin(xAxisRotation) * cpp.y, (curr.y + cp.y) / 2.0 + Math.sin(xAxisRotation) * cpp.x + Math.cos(xAxisRotation) * cpp.y); // vector magnitude
+
+ var m = function m(v) {
+ return Math.sqrt(Math.pow(v[0], 2) + Math.pow(v[1], 2));
+ }; // ratio between two vectors
+
+
+ var r = function r(u, v) {
+ return (u[0] * v[0] + u[1] * v[1]) / (m(u) * m(v));
+ }; // angle between two vectors
+
+
+ var a = function a(u, v) {
+ return (u[0] * v[1] < u[1] * v[0] ? -1 : 1) * Math.acos(r(u, v));
+ }; // initial angle
+
+
+ var a1 = a([1, 0], [(currp.x - cpp.x) / rx, (currp.y - cpp.y) / ry]); // angle delta
+
+ var u = [(currp.x - cpp.x) / rx, (currp.y - cpp.y) / ry];
+ var v = [(-currp.x - cpp.x) / rx, (-currp.y - cpp.y) / ry];
+ var ad = a(u, v);
+ if (r(u, v) <= -1) ad = Math.PI;
+ if (r(u, v) >= 1) ad = 0; // for markers
+
+ var dir = 1 - sweepFlag ? 1.0 : -1.0;
+ var ah = a1 + dir * (ad / 2.0);
+ var halfWay = new svg.Point(centp.x + rx * Math.cos(ah), centp.y + ry * Math.sin(ah));
+ pp.addMarkerAngle(halfWay, ah - dir * Math.PI / 2);
+ pp.addMarkerAngle(cp, ah - dir * Math.PI);
+ bb.addPoint(cp.x, cp.y); // TODO: this is too naive, make it better
+
+ if (!isNullish(ctx)) {
+ var _r = rx > ry ? rx : ry;
+
+ var sx = rx > ry ? 1 : rx / ry;
+ var sy = rx > ry ? ry / rx : 1;
+ ctx.translate(centp.x, centp.y);
+ ctx.rotate(xAxisRotation);
+ ctx.scale(sx, sy);
+ ctx.arc(0, 0, _r, a1, a1 + ad, 1 - sweepFlag);
+ ctx.scale(1 / sx, 1 / sy);
+ ctx.rotate(-xAxisRotation);
+ ctx.translate(-centp.x, -centp.y);
+ }
+ };
+
+ while (!pp.isCommandOrEnd()) {
+ _loop2();
+ }
+
+ break;
+
+ case 'Z':
+ case 'z':
+ if (!isNullish(ctx)) ctx.closePath();
+ pp.current = pp.start;
+ }
}
+
+ return bb;
}
+ }, {
+ key: "getMarkers",
+ value: function getMarkers() {
+ var points = this.PathParser.getMarkerPoints();
+ var angles = this.PathParser.getMarkerAngles();
+ var markers = points.map(function (point, i) {
+ return [point, angles[i]];
+ });
+ return markers;
+ }
+ }]);
- return bb;
+ return _class14;
+ }(svg.Element.PathElementBase); // pattern element
+
+
+ svg.Element.pattern = /*#__PURE__*/function (_svg$Element$ElementB2) {
+ _inherits(_class15, _svg$Element$ElementB2);
+
+ var _super14 = _createSuper(_class15);
+
+ function _class15() {
+ _classCallCheck(this, _class15);
+
+ return _super14.apply(this, arguments);
}
- getMarkers() {
- const points = this.PathParser.getMarkerPoints();
- const angles = this.PathParser.getMarkerAngles();
- const markers = points.map((point, i) => {
- return [point, angles[i]];
- });
- return markers;
- }
+ _createClass(_class15, [{
+ key: "createPattern",
+ value: function createPattern(ctx, element) {
+ var width = this.attribute('width').toPixels('x', true);
+ var height = this.attribute('height').toPixels('y', true); // render me using a temporary svg element
- }; // pattern element
+ var tempSvg = new svg.Element.svg();
+ tempSvg.attributes.viewBox = new svg.Property('viewBox', this.attribute('viewBox').value);
+ tempSvg.attributes.width = new svg.Property('width', width + 'px');
+ tempSvg.attributes.height = new svg.Property('height', height + 'px');
+ tempSvg.attributes.transform = new svg.Property('transform', this.attribute('patternTransform').value);
+ tempSvg.children = this.children;
+ var c = document.createElement('canvas');
+ c.width = width;
+ c.height = height;
+ var cctx = c.getContext('2d');
- svg.Element.pattern = class extends svg.Element.ElementBase {
- createPattern(ctx, element) {
- const width = this.attribute('width').toPixels('x', true);
- const height = this.attribute('height').toPixels('y', true); // render me using a temporary svg element
-
- const tempSvg = new svg.Element.svg();
- tempSvg.attributes.viewBox = new svg.Property('viewBox', this.attribute('viewBox').value);
- tempSvg.attributes.width = new svg.Property('width', width + 'px');
- tempSvg.attributes.height = new svg.Property('height', height + 'px');
- tempSvg.attributes.transform = new svg.Property('transform', this.attribute('patternTransform').value);
- tempSvg.children = this.children;
- const c = document.createElement('canvas');
- c.width = width;
- c.height = height;
- const cctx = c.getContext('2d');
-
- if (this.attribute('x').hasValue() && this.attribute('y').hasValue()) {
- cctx.translate(this.attribute('x').toPixels('x', true), this.attribute('y').toPixels('y', true));
- } // render 3x3 grid so when we transform there's no white space on edges
+ if (this.attribute('x').hasValue() && this.attribute('y').hasValue()) {
+ cctx.translate(this.attribute('x').toPixels('x', true), this.attribute('y').toPixels('y', true));
+ } // render 3x3 grid so when we transform there's no white space on edges
- for (let x = -1; x <= 1; x++) {
- for (let y = -1; y <= 1; y++) {
- cctx.save();
- cctx.translate(x * c.width, y * c.height);
- tempSvg.render(cctx);
- cctx.restore();
+ for (var x = -1; x <= 1; x++) {
+ for (var y = -1; y <= 1; y++) {
+ cctx.save();
+ cctx.translate(x * c.width, y * c.height);
+ tempSvg.render(cctx);
+ cctx.restore();
+ }
}
+
+ var pattern = ctx.createPattern(c, 'repeat');
+ return pattern;
}
+ }]);
- const pattern = ctx.createPattern(c, 'repeat');
- return pattern;
+ return _class15;
+ }(svg.Element.ElementBase); // marker element
+
+
+ svg.Element.marker = /*#__PURE__*/function (_svg$Element$ElementB3) {
+ _inherits(_class16, _svg$Element$ElementB3);
+
+ var _super15 = _createSuper(_class16);
+
+ function _class16() {
+ _classCallCheck(this, _class16);
+
+ return _super15.apply(this, arguments);
}
- }; // marker element
+ _createClass(_class16, [{
+ key: "render",
+ value: function render(ctx, point, angle) {
+ ctx.translate(point.x, point.y);
+ if (this.attribute('orient').valueOrDefault('auto') === 'auto') ctx.rotate(angle);
+ if (this.attribute('markerUnits').valueOrDefault('strokeWidth') === 'strokeWidth') ctx.scale(ctx.lineWidth, ctx.lineWidth);
+ ctx.save(); // render me using a temporary svg element
- svg.Element.marker = class extends svg.Element.ElementBase {
- render(ctx, point, angle) {
- ctx.translate(point.x, point.y);
- if (this.attribute('orient').valueOrDefault('auto') === 'auto') ctx.rotate(angle);
- if (this.attribute('markerUnits').valueOrDefault('strokeWidth') === 'strokeWidth') ctx.scale(ctx.lineWidth, ctx.lineWidth);
- ctx.save(); // render me using a temporary svg element
+ var tempSvg = new svg.Element.svg();
+ tempSvg.attributes.viewBox = new svg.Property('viewBox', this.attribute('viewBox').value);
+ tempSvg.attributes.refX = new svg.Property('refX', this.attribute('refX').value);
+ tempSvg.attributes.refY = new svg.Property('refY', this.attribute('refY').value);
+ tempSvg.attributes.width = new svg.Property('width', this.attribute('markerWidth').value);
+ tempSvg.attributes.height = new svg.Property('height', this.attribute('markerHeight').value);
+ tempSvg.attributes.fill = new svg.Property('fill', this.attribute('fill').valueOrDefault('black'));
+ tempSvg.attributes.stroke = new svg.Property('stroke', this.attribute('stroke').valueOrDefault('none'));
+ tempSvg.children = this.children;
+ tempSvg.render(ctx);
+ ctx.restore();
+ if (this.attribute('markerUnits').valueOrDefault('strokeWidth') === 'strokeWidth') ctx.scale(1 / ctx.lineWidth, 1 / ctx.lineWidth);
+ if (this.attribute('orient').valueOrDefault('auto') === 'auto') ctx.rotate(-angle);
+ ctx.translate(-point.x, -point.y);
+ }
+ }]);
- const tempSvg = new svg.Element.svg();
- tempSvg.attributes.viewBox = new svg.Property('viewBox', this.attribute('viewBox').value);
- tempSvg.attributes.refX = new svg.Property('refX', this.attribute('refX').value);
- tempSvg.attributes.refY = new svg.Property('refY', this.attribute('refY').value);
- tempSvg.attributes.width = new svg.Property('width', this.attribute('markerWidth').value);
- tempSvg.attributes.height = new svg.Property('height', this.attribute('markerHeight').value);
- tempSvg.attributes.fill = new svg.Property('fill', this.attribute('fill').valueOrDefault('black'));
- tempSvg.attributes.stroke = new svg.Property('stroke', this.attribute('stroke').valueOrDefault('none'));
- tempSvg.children = this.children;
- tempSvg.render(ctx);
- ctx.restore();
- if (this.attribute('markerUnits').valueOrDefault('strokeWidth') === 'strokeWidth') ctx.scale(1 / ctx.lineWidth, 1 / ctx.lineWidth);
- if (this.attribute('orient').valueOrDefault('auto') === 'auto') ctx.rotate(-angle);
- ctx.translate(-point.x, -point.y);
+ return _class16;
+ }(svg.Element.ElementBase); // definitions element
+
+
+ svg.Element.defs = /*#__PURE__*/function (_svg$Element$ElementB4) {
+ _inherits(_class17, _svg$Element$ElementB4);
+
+ var _super16 = _createSuper(_class17);
+
+ function _class17() {
+ _classCallCheck(this, _class17);
+
+ return _super16.apply(this, arguments);
}
- }; // definitions element
+ _createClass(_class17, [{
+ key: "render",
+ value: function render(ctx) {// NOOP
+ }
+ }]);
- svg.Element.defs = class extends svg.Element.ElementBase {
- render(ctx) {// NOOP
- }
+ return _class17;
+ }(svg.Element.ElementBase); // base for gradients
- }; // base for gradients
- svg.Element.GradientBase = class extends svg.Element.ElementBase {
- constructor(node) {
- super(node);
- this.gradientUnits = this.attribute('gradientUnits').valueOrDefault('objectBoundingBox');
- this.stops = [];
- this.children.forEach(child => {
+ svg.Element.GradientBase = /*#__PURE__*/function (_svg$Element$ElementB5) {
+ _inherits(_class18, _svg$Element$ElementB5);
+
+ var _super17 = _createSuper(_class18);
+
+ function _class18(node) {
+ var _this10;
+
+ _classCallCheck(this, _class18);
+
+ _this10 = _super17.call(this, node);
+ _this10.gradientUnits = _this10.attribute('gradientUnits').valueOrDefault('objectBoundingBox');
+ _this10.stops = [];
+
+ _this10.children.forEach(function (child) {
if (child.type === 'stop') {
- this.stops.push(child);
+ _this10.stops.push(child);
}
});
+
+ return _this10;
}
- getGradient() {// OVERRIDE ME!
- }
+ _createClass(_class18, [{
+ key: "getGradient",
+ value: function getGradient() {// OVERRIDE ME!
+ }
+ }, {
+ key: "createGradient",
+ value: function createGradient(ctx, element, parentOpacityProp) {
+ var stopsContainer = this.getHrefAttribute().hasValue() ? this.getHrefAttribute().getDefinition() : this;
- createGradient(ctx, element, parentOpacityProp) {
- const stopsContainer = this.getHrefAttribute().hasValue() ? this.getHrefAttribute().getDefinition() : this;
+ var addParentOpacity = function addParentOpacity(color) {
+ if (parentOpacityProp.hasValue()) {
+ var p = new svg.Property('color', color);
+ return p.addOpacity(parentOpacityProp).value;
+ }
- const addParentOpacity = function (color) {
- if (parentOpacityProp.hasValue()) {
- const p = new svg.Property('color', color);
- return p.addOpacity(parentOpacityProp).value;
+ return color;
+ };
+
+ var g = this.getGradient(ctx, element);
+ if (isNullish(g)) return addParentOpacity(stopsContainer.stops[stopsContainer.stops.length - 1].color);
+ stopsContainer.stops.forEach(function (_ref10) {
+ var offset = _ref10.offset,
+ color = _ref10.color;
+ g.addColorStop(offset, addParentOpacity(color));
+ });
+
+ if (this.attribute('gradientTransform').hasValue()) {
+ // render as transformed pattern on temporary canvas
+ var rootView = svg.ViewPort.viewPorts[0];
+ var rect = new svg.Element.rect();
+ rect.attributes.x = new svg.Property('x', -svg.MAX_VIRTUAL_PIXELS / 3.0);
+ rect.attributes.y = new svg.Property('y', -svg.MAX_VIRTUAL_PIXELS / 3.0);
+ rect.attributes.width = new svg.Property('width', svg.MAX_VIRTUAL_PIXELS);
+ rect.attributes.height = new svg.Property('height', svg.MAX_VIRTUAL_PIXELS);
+ var group = new svg.Element.g();
+ group.attributes.transform = new svg.Property('transform', this.attribute('gradientTransform').value);
+ group.children = [rect];
+ var tempSvg = new svg.Element.svg();
+ tempSvg.attributes.x = new svg.Property('x', 0);
+ tempSvg.attributes.y = new svg.Property('y', 0);
+ tempSvg.attributes.width = new svg.Property('width', rootView.width);
+ tempSvg.attributes.height = new svg.Property('height', rootView.height);
+ tempSvg.children = [group];
+ var c = document.createElement('canvas');
+ c.width = rootView.width;
+ c.height = rootView.height;
+ var tempCtx = c.getContext('2d');
+ tempCtx.fillStyle = g;
+ tempSvg.render(tempCtx);
+ return tempCtx.createPattern(c, 'no-repeat');
}
- return color;
- };
-
- const g = this.getGradient(ctx, element);
- if (isNullish(g)) return addParentOpacity(stopsContainer.stops[stopsContainer.stops.length - 1].color);
- stopsContainer.stops.forEach(({
- offset,
- color
- }) => {
- g.addColorStop(offset, addParentOpacity(color));
- });
-
- if (this.attribute('gradientTransform').hasValue()) {
- // render as transformed pattern on temporary canvas
- const rootView = svg.ViewPort.viewPorts[0];
- const rect = new svg.Element.rect();
- rect.attributes.x = new svg.Property('x', -svg.MAX_VIRTUAL_PIXELS / 3.0);
- rect.attributes.y = new svg.Property('y', -svg.MAX_VIRTUAL_PIXELS / 3.0);
- rect.attributes.width = new svg.Property('width', svg.MAX_VIRTUAL_PIXELS);
- rect.attributes.height = new svg.Property('height', svg.MAX_VIRTUAL_PIXELS);
- const group = new svg.Element.g();
- group.attributes.transform = new svg.Property('transform', this.attribute('gradientTransform').value);
- group.children = [rect];
- const tempSvg = new svg.Element.svg();
- tempSvg.attributes.x = new svg.Property('x', 0);
- tempSvg.attributes.y = new svg.Property('y', 0);
- tempSvg.attributes.width = new svg.Property('width', rootView.width);
- tempSvg.attributes.height = new svg.Property('height', rootView.height);
- tempSvg.children = [group];
- const c = document.createElement('canvas');
- c.width = rootView.width;
- c.height = rootView.height;
- const tempCtx = c.getContext('2d');
- tempCtx.fillStyle = g;
- tempSvg.render(tempCtx);
- return tempCtx.createPattern(c, 'no-repeat');
+ return g;
}
+ }]);
- return g;
+ return _class18;
+ }(svg.Element.ElementBase); // linear gradient element
+
+
+ svg.Element.linearGradient = /*#__PURE__*/function (_svg$Element$Gradient) {
+ _inherits(_class19, _svg$Element$Gradient);
+
+ var _super18 = _createSuper(_class19);
+
+ function _class19() {
+ _classCallCheck(this, _class19);
+
+ return _super18.apply(this, arguments);
}
- }; // linear gradient element
+ _createClass(_class19, [{
+ key: "getGradient",
+ value: function getGradient(ctx, element) {
+ var useBB = this.gradientUnits === 'objectBoundingBox' && element.getBoundingBox;
+ var bb = useBB ? element.getBoundingBox() : null;
- svg.Element.linearGradient = class extends svg.Element.GradientBase {
- getGradient(ctx, element) {
- const useBB = this.gradientUnits === 'objectBoundingBox' && element.getBoundingBox;
- const bb = useBB ? element.getBoundingBox() : null;
-
- if (!this.attribute('x1').hasValue() && !this.attribute('y1').hasValue() && !this.attribute('x2').hasValue() && !this.attribute('y2').hasValue()) {
- this.attribute('x1', true).value = 0;
- this.attribute('y1', true).value = 0;
- this.attribute('x2', true).value = 1;
- this.attribute('y2', true).value = 0;
- }
-
- const x1 = useBB ? bb.x() + bb.width() * this.attribute('x1').numValue() : this.attribute('x1').toPixels('x');
- const y1 = useBB ? bb.y() + bb.height() * this.attribute('y1').numValue() : this.attribute('y1').toPixels('y');
- const x2 = useBB ? bb.x() + bb.width() * this.attribute('x2').numValue() : this.attribute('x2').toPixels('x');
- const y2 = useBB ? bb.y() + bb.height() * this.attribute('y2').numValue() : this.attribute('y2').toPixels('y');
- if (x1 === x2 && y1 === y2) return null;
- return ctx.createLinearGradient(x1, y1, x2, y2);
- }
-
- }; // radial gradient element
-
- svg.Element.radialGradient = class extends svg.Element.GradientBase {
- getGradient(ctx, element) {
- const useBB = this.gradientUnits === 'objectBoundingBox' && element.getBoundingBox;
- const bb = useBB ? element.getBoundingBox() : null;
- if (!this.attribute('cx').hasValue()) this.attribute('cx', true).value = '50%';
- if (!this.attribute('cy').hasValue()) this.attribute('cy', true).value = '50%';
- if (!this.attribute('r').hasValue()) this.attribute('r', true).value = '50%';
- const cx = useBB ? bb.x() + bb.width() * this.attribute('cx').numValue() : this.attribute('cx').toPixels('x');
- const cy = useBB ? bb.y() + bb.height() * this.attribute('cy').numValue() : this.attribute('cy').toPixels('y');
- let fx = cx;
- let fy = cy;
-
- if (this.attribute('fx').hasValue()) {
- fx = useBB ? bb.x() + bb.width() * this.attribute('fx').numValue() : this.attribute('fx').toPixels('x');
- }
-
- if (this.attribute('fy').hasValue()) {
- fy = useBB ? bb.y() + bb.height() * this.attribute('fy').numValue() : this.attribute('fy').toPixels('y');
- }
-
- const r = useBB ? (bb.width() + bb.height()) / 2.0 * this.attribute('r').numValue() : this.attribute('r').toPixels();
- return ctx.createRadialGradient(fx, fy, 0, cx, cy, r);
- }
-
- }; // gradient stop element
-
- svg.Element.stop = class extends svg.Element.ElementBase {
- constructor(node) {
- super(node);
- this.offset = this.attribute('offset').numValue();
- if (this.offset < 0) this.offset = 0;
- if (this.offset > 1) this.offset = 1;
- let stopColor = this.style('stop-color');
-
- if (this.style('stop-opacity').hasValue()) {
- stopColor = stopColor.addOpacity(this.style('stop-opacity'));
- }
-
- this.color = stopColor.value;
- }
-
- }; // animation base element
-
- svg.Element.AnimateBase = class extends svg.Element.ElementBase {
- constructor(node) {
- super(node);
- svg.Animations.push(this);
- this.duration = 0.0;
- this.begin = this.attribute('begin').toMilliseconds();
- this.maxDuration = this.begin + this.attribute('dur').toMilliseconds();
- this.initialValue = null;
- this.initialUnits = '';
- this.removed = false;
- this.from = this.attribute('from');
- this.to = this.attribute('to');
- this.values = this.attribute('values');
- if (this.values.hasValue()) this.values.value = this.values.value.split(';');
- }
-
- getProperty() {
- const attributeType = this.attribute('attributeType').value;
- const attributeName = this.attribute('attributeName').value;
-
- if (attributeType === 'CSS') {
- return this.parent.style(attributeName, true);
- }
-
- return this.parent.attribute(attributeName, true);
- }
-
- calcValue() {
- // OVERRIDE ME!
- return '';
- }
-
- update(delta) {
- // set initial value
- if (isNullish(this.initialValue)) {
- this.initialValue = this.getProperty().value;
- this.initialUnits = this.getProperty().getUnits();
- } // if we're past the end time
-
-
- if (this.duration > this.maxDuration) {
- // loop for indefinitely repeating animations
- if (this.attribute('repeatCount').value === 'indefinite' || this.attribute('repeatDur').value === 'indefinite') {
- this.duration = 0.0;
- } else if (this.attribute('fill').valueOrDefault('remove') === 'freeze' && !this.frozen) {
- this.frozen = true;
- this.parent.animationFrozen = true;
- this.parent.animationFrozenValue = this.getProperty().value;
- } else if (this.attribute('fill').valueOrDefault('remove') === 'remove' && !this.removed) {
- this.removed = true;
- this.getProperty().value = this.parent.animationFrozen ? this.parent.animationFrozenValue : this.initialValue;
- return true;
+ if (!this.attribute('x1').hasValue() && !this.attribute('y1').hasValue() && !this.attribute('x2').hasValue() && !this.attribute('y2').hasValue()) {
+ this.attribute('x1', true).value = 0;
+ this.attribute('y1', true).value = 0;
+ this.attribute('x2', true).value = 1;
+ this.attribute('y2', true).value = 0;
}
- return false;
+ var x1 = useBB ? bb.x() + bb.width() * this.attribute('x1').numValue() : this.attribute('x1').toPixels('x');
+ var y1 = useBB ? bb.y() + bb.height() * this.attribute('y1').numValue() : this.attribute('y1').toPixels('y');
+ var x2 = useBB ? bb.x() + bb.width() * this.attribute('x2').numValue() : this.attribute('x2').toPixels('x');
+ var y2 = useBB ? bb.y() + bb.height() * this.attribute('y2').numValue() : this.attribute('y2').toPixels('y');
+ if (x1 === x2 && y1 === y2) return null;
+ return ctx.createLinearGradient(x1, y1, x2, y2);
}
+ }]);
- this.duration += delta; // if we're past the begin time
+ return _class19;
+ }(svg.Element.GradientBase); // radial gradient element
- let updated = false;
- if (this.begin < this.duration) {
- let newValue = this.calcValue(); // tween
+ svg.Element.radialGradient = /*#__PURE__*/function (_svg$Element$Gradient2) {
+ _inherits(_class20, _svg$Element$Gradient2);
- if (this.attribute('type').hasValue()) {
- // for transform, etc.
- const type = this.attribute('type').value;
- newValue = type + '(' + newValue + ')';
+ var _super19 = _createSuper(_class20);
+
+ function _class20() {
+ _classCallCheck(this, _class20);
+
+ return _super19.apply(this, arguments);
+ }
+
+ _createClass(_class20, [{
+ key: "getGradient",
+ value: function getGradient(ctx, element) {
+ var useBB = this.gradientUnits === 'objectBoundingBox' && element.getBoundingBox;
+ var bb = useBB ? element.getBoundingBox() : null;
+ if (!this.attribute('cx').hasValue()) this.attribute('cx', true).value = '50%';
+ if (!this.attribute('cy').hasValue()) this.attribute('cy', true).value = '50%';
+ if (!this.attribute('r').hasValue()) this.attribute('r', true).value = '50%';
+ var cx = useBB ? bb.x() + bb.width() * this.attribute('cx').numValue() : this.attribute('cx').toPixels('x');
+ var cy = useBB ? bb.y() + bb.height() * this.attribute('cy').numValue() : this.attribute('cy').toPixels('y');
+ var fx = cx;
+ var fy = cy;
+
+ if (this.attribute('fx').hasValue()) {
+ fx = useBB ? bb.x() + bb.width() * this.attribute('fx').numValue() : this.attribute('fx').toPixels('x');
}
- this.getProperty().value = newValue;
- updated = true;
+ if (this.attribute('fy').hasValue()) {
+ fy = useBB ? bb.y() + bb.height() * this.attribute('fy').numValue() : this.attribute('fy').toPixels('y');
+ }
+
+ var r = useBB ? (bb.width() + bb.height()) / 2.0 * this.attribute('r').numValue() : this.attribute('r').toPixels();
+ return ctx.createRadialGradient(fx, fy, 0, cx, cy, r);
+ }
+ }]);
+
+ return _class20;
+ }(svg.Element.GradientBase); // gradient stop element
+
+
+ svg.Element.stop = /*#__PURE__*/function (_svg$Element$ElementB6) {
+ _inherits(_class21, _svg$Element$ElementB6);
+
+ var _super20 = _createSuper(_class21);
+
+ function _class21(node) {
+ var _this11;
+
+ _classCallCheck(this, _class21);
+
+ _this11 = _super20.call(this, node);
+ _this11.offset = _this11.attribute('offset').numValue();
+ if (_this11.offset < 0) _this11.offset = 0;
+ if (_this11.offset > 1) _this11.offset = 1;
+
+ var stopColor = _this11.style('stop-color');
+
+ if (_this11.style('stop-opacity').hasValue()) {
+ stopColor = stopColor.addOpacity(_this11.style('stop-opacity'));
}
- return updated;
- } // fraction of duration we've covered
+ _this11.color = stopColor.value;
+ return _this11;
+ }
+
+ return _class21;
+ }(svg.Element.ElementBase); // animation base element
- progress() {
- const ret = {
- progress: (this.duration - this.begin) / (this.maxDuration - this.begin)
- };
+ svg.Element.AnimateBase = /*#__PURE__*/function (_svg$Element$ElementB7) {
+ _inherits(_class22, _svg$Element$ElementB7);
- if (this.values.hasValue()) {
- const p = ret.progress * (this.values.value.length - 1);
- const lb = Math.floor(p),
+ var _super21 = _createSuper(_class22);
+
+ function _class22(node) {
+ var _this12;
+
+ _classCallCheck(this, _class22);
+
+ _this12 = _super21.call(this, node);
+ svg.Animations.push(_assertThisInitialized(_this12));
+ _this12.duration = 0.0;
+ _this12.begin = _this12.attribute('begin').toMilliseconds();
+ _this12.maxDuration = _this12.begin + _this12.attribute('dur').toMilliseconds();
+ _this12.initialValue = null;
+ _this12.initialUnits = '';
+ _this12.removed = false;
+ _this12.from = _this12.attribute('from');
+ _this12.to = _this12.attribute('to');
+ _this12.values = _this12.attribute('values');
+ if (_this12.values.hasValue()) _this12.values.value = _this12.values.value.split(';');
+ return _this12;
+ }
+
+ _createClass(_class22, [{
+ key: "getProperty",
+ value: function getProperty() {
+ var attributeType = this.attribute('attributeType').value;
+ var attributeName = this.attribute('attributeName').value;
+
+ if (attributeType === 'CSS') {
+ return this.parent.style(attributeName, true);
+ }
+
+ return this.parent.attribute(attributeName, true);
+ }
+ }, {
+ key: "calcValue",
+ value: function calcValue() {
+ // OVERRIDE ME!
+ return '';
+ }
+ }, {
+ key: "update",
+ value: function update(delta) {
+ // set initial value
+ if (isNullish(this.initialValue)) {
+ this.initialValue = this.getProperty().value;
+ this.initialUnits = this.getProperty().getUnits();
+ } // if we're past the end time
+
+
+ if (this.duration > this.maxDuration) {
+ // loop for indefinitely repeating animations
+ if (this.attribute('repeatCount').value === 'indefinite' || this.attribute('repeatDur').value === 'indefinite') {
+ this.duration = 0.0;
+ } else if (this.attribute('fill').valueOrDefault('remove') === 'freeze' && !this.frozen) {
+ this.frozen = true;
+ this.parent.animationFrozen = true;
+ this.parent.animationFrozenValue = this.getProperty().value;
+ } else if (this.attribute('fill').valueOrDefault('remove') === 'remove' && !this.removed) {
+ this.removed = true;
+ this.getProperty().value = this.parent.animationFrozen ? this.parent.animationFrozenValue : this.initialValue;
+ return true;
+ }
+
+ return false;
+ }
+
+ this.duration += delta; // if we're past the begin time
+
+ var updated = false;
+
+ if (this.begin < this.duration) {
+ var newValue = this.calcValue(); // tween
+
+ if (this.attribute('type').hasValue()) {
+ // for transform, etc.
+ var type = this.attribute('type').value;
+ newValue = type + '(' + newValue + ')';
+ }
+
+ this.getProperty().value = newValue;
+ updated = true;
+ }
+
+ return updated;
+ } // fraction of duration we've covered
+
+ }, {
+ key: "progress",
+ value: function progress() {
+ var ret = {
+ progress: (this.duration - this.begin) / (this.maxDuration - this.begin)
+ };
+
+ if (this.values.hasValue()) {
+ var p = ret.progress * (this.values.value.length - 1);
+ var lb = Math.floor(p),
ub = Math.ceil(p);
- ret.from = new svg.Property('from', Number.parseFloat(this.values.value[lb]));
- ret.to = new svg.Property('to', Number.parseFloat(this.values.value[ub]));
- ret.progress = (p - lb) / (ub - lb);
- } else {
- ret.from = this.from;
- ret.to = this.to;
+ ret.from = new svg.Property('from', Number.parseFloat(this.values.value[lb]));
+ ret.to = new svg.Property('to', Number.parseFloat(this.values.value[ub]));
+ ret.progress = (p - lb) / (ub - lb);
+ } else {
+ ret.from = this.from;
+ ret.to = this.to;
+ }
+
+ return ret;
}
+ }]);
- return ret;
+ return _class22;
+ }(svg.Element.ElementBase); // animate element
+
+
+ svg.Element.animate = /*#__PURE__*/function (_svg$Element$AnimateB) {
+ _inherits(_class23, _svg$Element$AnimateB);
+
+ var _super22 = _createSuper(_class23);
+
+ function _class23() {
+ _classCallCheck(this, _class23);
+
+ return _super22.apply(this, arguments);
}
- }; // animate element
+ _createClass(_class23, [{
+ key: "calcValue",
+ value: function calcValue() {
+ var p = this.progress(); // tween value linearly
- svg.Element.animate = class extends svg.Element.AnimateBase {
- calcValue() {
- const p = this.progress(); // tween value linearly
-
- const newValue = p.from.numValue() + (p.to.numValue() - p.from.numValue()) * p.progress;
- return newValue + this.initialUnits;
- }
-
- }; // animate color element
-
- svg.Element.animateColor = class extends svg.Element.AnimateBase {
- calcValue() {
- const p = this.progress();
- const from = new RGBColor(p.from.value);
- const to = new RGBColor(p.to.value);
-
- if (from.ok && to.ok) {
- // tween color linearly
- const r = from.r + (to.r - from.r) * p.progress;
- const g = from.g + (to.g - from.g) * p.progress;
- const b = from.b + (to.b - from.b) * p.progress;
- return 'rgb(' + Number.parseInt(r) + ',' + Number.parseInt(g) + ',' + Number.parseInt(b) + ')';
+ var newValue = p.from.numValue() + (p.to.numValue() - p.from.numValue()) * p.progress;
+ return newValue + this.initialUnits;
}
+ }]);
- return this.attribute('from').value;
+ return _class23;
+ }(svg.Element.AnimateBase); // animate color element
+
+
+ svg.Element.animateColor = /*#__PURE__*/function (_svg$Element$AnimateB2) {
+ _inherits(_class24, _svg$Element$AnimateB2);
+
+ var _super23 = _createSuper(_class24);
+
+ function _class24() {
+ _classCallCheck(this, _class24);
+
+ return _super23.apply(this, arguments);
}
- }; // animate transform element
+ _createClass(_class24, [{
+ key: "calcValue",
+ value: function calcValue() {
+ var p = this.progress();
+ var from = new RGBColor(p.from.value);
+ var to = new RGBColor(p.to.value);
- svg.Element.animateTransform = class extends svg.Element.animate {
- calcValue() {
- const p = this.progress(); // tween value linearly
+ if (from.ok && to.ok) {
+ // tween color linearly
+ var r = from.r + (to.r - from.r) * p.progress;
+ var g = from.g + (to.g - from.g) * p.progress;
+ var b = from.b + (to.b - from.b) * p.progress;
+ return 'rgb(' + Number.parseInt(r) + ',' + Number.parseInt(g) + ',' + Number.parseInt(b) + ')';
+ }
- const from = svg.ToNumberArray(p.from.value);
- const to = svg.ToNumberArray(p.to.value);
- let newValue = '';
- from.forEach((fr, i) => {
- newValue += fr + (to[i] - fr) * p.progress + ' ';
- });
- return newValue;
+ return this.attribute('from').value;
+ }
+ }]);
+
+ return _class24;
+ }(svg.Element.AnimateBase); // animate transform element
+
+
+ svg.Element.animateTransform = /*#__PURE__*/function (_svg$Element$animate) {
+ _inherits(_class25, _svg$Element$animate);
+
+ var _super24 = _createSuper(_class25);
+
+ function _class25() {
+ _classCallCheck(this, _class25);
+
+ return _super24.apply(this, arguments);
}
- }; // font element
+ _createClass(_class25, [{
+ key: "calcValue",
+ value: function calcValue() {
+ var p = this.progress(); // tween value linearly
- svg.Element.font = class extends svg.Element.ElementBase {
- constructor(node) {
- super(node);
- this.horizAdvX = this.attribute('horiz-adv-x').numValue();
- this.isRTL = false;
- this.isArabic = false;
- this.fontFace = null;
- this.missingGlyph = null;
- this.glyphs = [];
- this.children.forEach(child => {
+ var from = svg.ToNumberArray(p.from.value);
+ var to = svg.ToNumberArray(p.to.value);
+ var newValue = '';
+ from.forEach(function (fr, i) {
+ newValue += fr + (to[i] - fr) * p.progress + ' ';
+ });
+ return newValue;
+ }
+ }]);
+
+ return _class25;
+ }(svg.Element.animate); // font element
+
+
+ svg.Element.font = /*#__PURE__*/function (_svg$Element$ElementB8) {
+ _inherits(_class26, _svg$Element$ElementB8);
+
+ var _super25 = _createSuper(_class26);
+
+ function _class26(node) {
+ var _this13;
+
+ _classCallCheck(this, _class26);
+
+ _this13 = _super25.call(this, node);
+ _this13.horizAdvX = _this13.attribute('horiz-adv-x').numValue();
+ _this13.isRTL = false;
+ _this13.isArabic = false;
+ _this13.fontFace = null;
+ _this13.missingGlyph = null;
+ _this13.glyphs = [];
+
+ _this13.children.forEach(function (child) {
if (child.type === 'font-face') {
- this.fontFace = child;
+ _this13.fontFace = child;
if (child.style('font-family').hasValue()) {
- svg.Definitions[child.style('font-family').value] = this;
+ svg.Definitions[child.style('font-family').value] = _assertThisInitialized(_this13);
}
} else if (child.type === 'missing-glyph') {
- this.missingGlyph = child;
+ _this13.missingGlyph = child;
} else if (child.type === 'glyph') {
if (child.arabicForm !== '') {
- this.isRTL = true;
- this.isArabic = true;
+ _this13.isRTL = true;
+ _this13.isArabic = true;
- if (typeof this.glyphs[child.unicode] === 'undefined') {
- this.glyphs[child.unicode] = [];
+ if (typeof _this13.glyphs[child.unicode] === 'undefined') {
+ _this13.glyphs[child.unicode] = [];
}
- this.glyphs[child.unicode][child.arabicForm] = child;
+ _this13.glyphs[child.unicode][child.arabicForm] = child;
} else {
- this.glyphs[child.unicode] = child;
+ _this13.glyphs[child.unicode] = child;
}
}
});
+
+ return _this13;
}
- }; // font-face element
+ return _class26;
+ }(svg.Element.ElementBase); // font-face element
- svg.Element.fontface = class extends svg.Element.ElementBase {
- constructor(node) {
- super(node);
- this.ascent = this.attribute('ascent').value;
- this.descent = this.attribute('descent').value;
- this.unitsPerEm = this.attribute('units-per-em').numValue();
+
+ svg.Element.fontface = /*#__PURE__*/function (_svg$Element$ElementB9) {
+ _inherits(_class27, _svg$Element$ElementB9);
+
+ var _super26 = _createSuper(_class27);
+
+ function _class27(node) {
+ var _this14;
+
+ _classCallCheck(this, _class27);
+
+ _this14 = _super26.call(this, node);
+ _this14.ascent = _this14.attribute('ascent').value;
+ _this14.descent = _this14.attribute('descent').value;
+ _this14.unitsPerEm = _this14.attribute('units-per-em').numValue();
+ return _this14;
}
- }; // missing-glyph element
+ return _class27;
+ }(svg.Element.ElementBase); // missing-glyph element
- svg.Element.missingglyph = class extends svg.Element.path {
- constructor(node) {
- super(node);
- this.horizAdvX = 0;
+
+ svg.Element.missingglyph = /*#__PURE__*/function (_svg$Element$path) {
+ _inherits(_class28, _svg$Element$path);
+
+ var _super27 = _createSuper(_class28);
+
+ function _class28(node) {
+ var _this15;
+
+ _classCallCheck(this, _class28);
+
+ _this15 = _super27.call(this, node);
+ _this15.horizAdvX = 0;
+ return _this15;
}
- }; // glyph element
+ return _class28;
+ }(svg.Element.path); // glyph element
- svg.Element.glyph = class extends svg.Element.path {
- constructor(node) {
- super(node);
- this.horizAdvX = this.attribute('horiz-adv-x').numValue();
- this.unicode = this.attribute('unicode').value;
- this.arabicForm = this.attribute('arabic-form').value;
+
+ svg.Element.glyph = /*#__PURE__*/function (_svg$Element$path2) {
+ _inherits(_class29, _svg$Element$path2);
+
+ var _super28 = _createSuper(_class29);
+
+ function _class29(node) {
+ var _this16;
+
+ _classCallCheck(this, _class29);
+
+ _this16 = _super28.call(this, node);
+ _this16.horizAdvX = _this16.attribute('horiz-adv-x').numValue();
+ _this16.unicode = _this16.attribute('unicode').value;
+ _this16.arabicForm = _this16.attribute('arabic-form').value;
+ return _this16;
}
- }; // text element
+ return _class29;
+ }(svg.Element.path); // text element
- svg.Element.text = class extends svg.Element.RenderedElementBase {
- constructor(node) {
- super(node, true);
+
+ svg.Element.text = /*#__PURE__*/function (_svg$Element$Rendered3) {
+ _inherits(_class30, _svg$Element$Rendered3);
+
+ var _super29 = _createSuper(_class30);
+
+ function _class30(node) {
+ _classCallCheck(this, _class30);
+
+ return _super29.call(this, node, true);
}
- setContext(ctx) {
- super.setContext(ctx);
- let textBaseline = this.style('dominant-baseline').toTextBaseline();
- if (isNullish(textBaseline)) textBaseline = this.style('alignment-baseline').toTextBaseline();
- if (!isNullish(textBaseline)) ctx.textBaseline = textBaseline;
+ _createClass(_class30, [{
+ key: "setContext",
+ value: function setContext(ctx) {
+ _get(_getPrototypeOf(_class30.prototype), "setContext", this).call(this, ctx);
+
+ var textBaseline = this.style('dominant-baseline').toTextBaseline();
+ if (isNullish(textBaseline)) textBaseline = this.style('alignment-baseline').toTextBaseline();
+ if (!isNullish(textBaseline)) ctx.textBaseline = textBaseline;
+ }
+ }, {
+ key: "getBoundingBox",
+ value: function getBoundingBox() {
+ var x = this.attribute('x').toPixels('x');
+ var y = this.attribute('y').toPixels('y');
+ var fontSize = this.parent.style('font-size').numValueOrDefault(svg.Font.Parse(svg.ctx.font).fontSize);
+ return new svg.BoundingBox(x, y - fontSize, x + Math.floor(fontSize * 2.0 / 3.0) * this.children[0].getText().length, y);
+ }
+ }, {
+ key: "renderChildren",
+ value: function renderChildren(ctx) {
+ var _this17 = this;
+
+ this.x = this.attribute('x').toPixels('x');
+ this.y = this.attribute('y').toPixels('y');
+ this.x += this.getAnchorDelta(ctx, this, 0);
+ this.children.forEach(function (child, i) {
+ _this17.renderChild(ctx, _this17, i);
+ });
+ }
+ }, {
+ key: "getAnchorDelta",
+ value: function getAnchorDelta(ctx, parent, startI) {
+ var textAnchor = this.style('text-anchor').valueOrDefault('start');
+
+ if (textAnchor !== 'start') {
+ var width = 0;
+
+ for (var i = startI; i < parent.children.length; i++) {
+ var child = parent.children[i];
+ if (i > startI && child.attribute('x').hasValue()) break; // new group
+
+ width += child.measureTextRecursive(ctx);
+ }
+
+ return -1 * (textAnchor === 'end' ? width : width / 2.0);
+ }
+
+ return 0;
+ }
+ }, {
+ key: "renderChild",
+ value: function renderChild(ctx, parent, i) {
+ var child = parent.children[i];
+
+ if (child.attribute('x').hasValue()) {
+ child.x = child.attribute('x').toPixels('x') + this.getAnchorDelta(ctx, parent, i);
+ if (child.attribute('dx').hasValue()) child.x += child.attribute('dx').toPixels('x');
+ } else {
+ if (this.attribute('dx').hasValue()) this.x += this.attribute('dx').toPixels('x');
+ if (child.attribute('dx').hasValue()) this.x += child.attribute('dx').toPixels('x');
+ child.x = this.x;
+ }
+
+ this.x = child.x + child.measureText(ctx);
+
+ if (child.attribute('y').hasValue()) {
+ child.y = child.attribute('y').toPixels('y');
+ if (child.attribute('dy').hasValue()) child.y += child.attribute('dy').toPixels('y');
+ } else {
+ if (this.attribute('dy').hasValue()) this.y += this.attribute('dy').toPixels('y');
+ if (child.attribute('dy').hasValue()) this.y += child.attribute('dy').toPixels('y');
+ child.y = this.y;
+ }
+
+ this.y = child.y;
+ child.render(ctx);
+
+ for (var j = 0; j < child.children.length; j++) {
+ this.renderChild(ctx, child, j);
+ }
+ }
+ }]);
+
+ return _class30;
+ }(svg.Element.RenderedElementBase); // text base
+
+
+ svg.Element.TextElementBase = /*#__PURE__*/function (_svg$Element$Rendered4) {
+ _inherits(_class31, _svg$Element$Rendered4);
+
+ var _super30 = _createSuper(_class31);
+
+ function _class31() {
+ _classCallCheck(this, _class31);
+
+ return _super30.apply(this, arguments);
}
- getBoundingBox() {
- const x = this.attribute('x').toPixels('x');
- const y = this.attribute('y').toPixels('y');
- const fontSize = this.parent.style('font-size').numValueOrDefault(svg.Font.Parse(svg.ctx.font).fontSize);
- return new svg.BoundingBox(x, y - fontSize, x + Math.floor(fontSize * 2.0 / 3.0) * this.children[0].getText().length, y);
- }
+ _createClass(_class31, [{
+ key: "getGlyph",
+ value: function getGlyph(font, text, i) {
+ var c = text[i];
+ var glyph = null;
- renderChildren(ctx) {
- this.x = this.attribute('x').toPixels('x');
- this.y = this.attribute('y').toPixels('y');
- this.x += this.getAnchorDelta(ctx, this, 0);
- this.children.forEach((child, i) => {
- this.renderChild(ctx, this, i);
- });
- }
+ if (font.isArabic) {
+ var arabicForm = 'isolated';
+ if ((i === 0 || text[i - 1] === ' ') && i < text.length - 2 && text[i + 1] !== ' ') arabicForm = 'terminal';
+ if (i > 0 && text[i - 1] !== ' ' && i < text.length - 2 && text[i + 1] !== ' ') arabicForm = 'medial';
+ if (i > 0 && text[i - 1] !== ' ' && (i === text.length - 1 || text[i + 1] === ' ')) arabicForm = 'initial';
- getAnchorDelta(ctx, parent, startI) {
- const textAnchor = this.style('text-anchor').valueOrDefault('start');
+ if (typeof font.glyphs[c] !== 'undefined') {
+ glyph = font.glyphs[c][arabicForm];
+ if (isNullish(glyph) && font.glyphs[c].type === 'glyph') glyph = font.glyphs[c];
+ }
+ } else {
+ glyph = font.glyphs[c];
+ }
- if (textAnchor !== 'start') {
- let width = 0;
+ if (isNullish(glyph)) glyph = font.missingGlyph;
+ return glyph;
+ }
+ }, {
+ key: "renderChildren",
+ value: function renderChildren(ctx) {
+ var customFont = this.parent.style('font-family').getDefinition();
- for (let i = startI; i < parent.children.length; i++) {
- const child = parent.children[i];
- if (i > startI && child.attribute('x').hasValue()) break; // new group
+ if (!isNullish(customFont)) {
+ var fontSize = this.parent.style('font-size').numValueOrDefault(svg.Font.Parse(svg.ctx.font).fontSize);
+ var fontStyle = this.parent.style('font-style').valueOrDefault(svg.Font.Parse(svg.ctx.font).fontStyle);
+ var text = this.getText();
+ if (customFont.isRTL) text = text.split('').reverse().join('');
+ var dx = svg.ToNumberArray(this.parent.attribute('dx').value);
+ for (var i = 0; i < text.length; i++) {
+ var glyph = this.getGlyph(customFont, text, i);
+ var scale = fontSize / customFont.fontFace.unitsPerEm;
+ ctx.translate(this.x, this.y);
+ ctx.scale(scale, -scale);
+ var lw = ctx.lineWidth;
+ ctx.lineWidth = ctx.lineWidth * customFont.fontFace.unitsPerEm / fontSize;
+ if (fontStyle === 'italic') ctx.transform(1, 0, 0.4, 1, 0, 0);
+ glyph.render(ctx);
+ if (fontStyle === 'italic') ctx.transform(1, 0, -0.4, 1, 0, 0);
+ ctx.lineWidth = lw;
+ ctx.scale(1 / scale, -1 / scale);
+ ctx.translate(-this.x, -this.y);
+ this.x += fontSize * (glyph.horizAdvX || customFont.horizAdvX) / customFont.fontFace.unitsPerEm;
+
+ if (typeof dx[i] !== 'undefined' && !isNaN(dx[i])) {
+ this.x += dx[i];
+ }
+ }
+
+ return;
+ }
+
+ if (ctx.fillStyle !== '') ctx.fillText(svg.compressSpaces(this.getText()), this.x, this.y);
+ if (ctx.strokeStyle !== '') ctx.strokeText(svg.compressSpaces(this.getText()), this.x, this.y);
+ }
+ }, {
+ key: "getText",
+ value: function getText() {// OVERRIDE ME
+ }
+ }, {
+ key: "measureTextRecursive",
+ value: function measureTextRecursive(ctx) {
+ var width = this.measureText(ctx);
+ this.children.forEach(function (child) {
width += child.measureTextRecursive(ctx);
- }
-
- return -1 * (textAnchor === 'end' ? width : width / 2.0);
+ });
+ return width;
}
+ }, {
+ key: "measureText",
+ value: function measureText(ctx) {
+ var customFont = this.parent.style('font-family').getDefinition();
- return 0;
- }
+ if (!isNullish(customFont)) {
+ var fontSize = this.parent.style('font-size').numValueOrDefault(svg.Font.Parse(svg.ctx.font).fontSize);
+ var measure = 0;
+ var text = this.getText();
+ if (customFont.isRTL) text = text.split('').reverse().join('');
+ var dx = svg.ToNumberArray(this.parent.attribute('dx').value);
- renderChild(ctx, parent, i) {
- const child = parent.children[i];
+ for (var i = 0; i < text.length; i++) {
+ var glyph = this.getGlyph(customFont, text, i);
+ measure += (glyph.horizAdvX || customFont.horizAdvX) * fontSize / customFont.fontFace.unitsPerEm;
- if (child.attribute('x').hasValue()) {
- child.x = child.attribute('x').toPixels('x') + this.getAnchorDelta(ctx, parent, i);
- if (child.attribute('dx').hasValue()) child.x += child.attribute('dx').toPixels('x');
- } else {
- if (this.attribute('dx').hasValue()) this.x += this.attribute('dx').toPixels('x');
- if (child.attribute('dx').hasValue()) this.x += child.attribute('dx').toPixels('x');
- child.x = this.x;
- }
-
- this.x = child.x + child.measureText(ctx);
-
- if (child.attribute('y').hasValue()) {
- child.y = child.attribute('y').toPixels('y');
- if (child.attribute('dy').hasValue()) child.y += child.attribute('dy').toPixels('y');
- } else {
- if (this.attribute('dy').hasValue()) this.y += this.attribute('dy').toPixels('y');
- if (child.attribute('dy').hasValue()) this.y += child.attribute('dy').toPixels('y');
- child.y = this.y;
- }
-
- this.y = child.y;
- child.render(ctx);
-
- for (let j = 0; j < child.children.length; j++) {
- this.renderChild(ctx, child, j);
- }
- }
-
- }; // text base
-
- svg.Element.TextElementBase = class extends svg.Element.RenderedElementBase {
- getGlyph(font, text, i) {
- const c = text[i];
- let glyph = null;
-
- if (font.isArabic) {
- let arabicForm = 'isolated';
- if ((i === 0 || text[i - 1] === ' ') && i < text.length - 2 && text[i + 1] !== ' ') arabicForm = 'terminal';
- if (i > 0 && text[i - 1] !== ' ' && i < text.length - 2 && text[i + 1] !== ' ') arabicForm = 'medial';
- if (i > 0 && text[i - 1] !== ' ' && (i === text.length - 1 || text[i + 1] === ' ')) arabicForm = 'initial';
-
- if (typeof font.glyphs[c] !== 'undefined') {
- glyph = font.glyphs[c][arabicForm];
- if (isNullish(glyph) && font.glyphs[c].type === 'glyph') glyph = font.glyphs[c];
- }
- } else {
- glyph = font.glyphs[c];
- }
-
- if (isNullish(glyph)) glyph = font.missingGlyph;
- return glyph;
- }
-
- renderChildren(ctx) {
- const customFont = this.parent.style('font-family').getDefinition();
-
- if (!isNullish(customFont)) {
- const fontSize = this.parent.style('font-size').numValueOrDefault(svg.Font.Parse(svg.ctx.font).fontSize);
- const fontStyle = this.parent.style('font-style').valueOrDefault(svg.Font.Parse(svg.ctx.font).fontStyle);
- let text = this.getText();
- if (customFont.isRTL) text = text.split('').reverse().join('');
- const dx = svg.ToNumberArray(this.parent.attribute('dx').value);
-
- for (let i = 0; i < text.length; i++) {
- const glyph = this.getGlyph(customFont, text, i);
- const scale = fontSize / customFont.fontFace.unitsPerEm;
- ctx.translate(this.x, this.y);
- ctx.scale(scale, -scale);
- const lw = ctx.lineWidth;
- ctx.lineWidth = ctx.lineWidth * customFont.fontFace.unitsPerEm / fontSize;
- if (fontStyle === 'italic') ctx.transform(1, 0, 0.4, 1, 0, 0);
- glyph.render(ctx);
- if (fontStyle === 'italic') ctx.transform(1, 0, -0.4, 1, 0, 0);
- ctx.lineWidth = lw;
- ctx.scale(1 / scale, -1 / scale);
- ctx.translate(-this.x, -this.y);
- this.x += fontSize * (glyph.horizAdvX || customFont.horizAdvX) / customFont.fontFace.unitsPerEm;
-
- if (typeof dx[i] !== 'undefined' && !isNaN(dx[i])) {
- this.x += dx[i];
+ if (typeof dx[i] !== 'undefined' && !isNaN(dx[i])) {
+ measure += dx[i];
+ }
}
+
+ return measure;
}
- return;
+ var textToMeasure = svg.compressSpaces(this.getText());
+ if (!ctx.measureText) return textToMeasure.length * 10;
+ ctx.save();
+ this.setContext(ctx);
+
+ var _ctx$measureText = ctx.measureText(textToMeasure),
+ width = _ctx$measureText.width;
+
+ ctx.restore();
+ return width;
}
+ }]);
- if (ctx.fillStyle !== '') ctx.fillText(svg.compressSpaces(this.getText()), this.x, this.y);
- if (ctx.strokeStyle !== '') ctx.strokeText(svg.compressSpaces(this.getText()), this.x, this.y);
+ return _class31;
+ }(svg.Element.RenderedElementBase); // tspan
+
+
+ svg.Element.tspan = /*#__PURE__*/function (_svg$Element$TextElem) {
+ _inherits(_class32, _svg$Element$TextElem);
+
+ var _super31 = _createSuper(_class32);
+
+ function _class32(node) {
+ var _this18;
+
+ _classCallCheck(this, _class32);
+
+ _this18 = _super31.call(this, node, true);
+ _this18.text = node.nodeValue || node.text || '';
+ return _this18;
}
- getText() {// OVERRIDE ME
- }
-
- measureTextRecursive(ctx) {
- let width = this.measureText(ctx);
- this.children.forEach(child => {
- width += child.measureTextRecursive(ctx);
- });
- return width;
- }
-
- measureText(ctx) {
- const customFont = this.parent.style('font-family').getDefinition();
-
- if (!isNullish(customFont)) {
- const fontSize = this.parent.style('font-size').numValueOrDefault(svg.Font.Parse(svg.ctx.font).fontSize);
- let measure = 0;
- let text = this.getText();
- if (customFont.isRTL) text = text.split('').reverse().join('');
- const dx = svg.ToNumberArray(this.parent.attribute('dx').value);
-
- for (let i = 0; i < text.length; i++) {
- const glyph = this.getGlyph(customFont, text, i);
- measure += (glyph.horizAdvX || customFont.horizAdvX) * fontSize / customFont.fontFace.unitsPerEm;
-
- if (typeof dx[i] !== 'undefined' && !isNaN(dx[i])) {
- measure += dx[i];
- }
- }
-
- return measure;
+ _createClass(_class32, [{
+ key: "getText",
+ value: function getText() {
+ return this.text;
}
+ }]);
- const textToMeasure = svg.compressSpaces(this.getText());
- if (!ctx.measureText) return textToMeasure.length * 10;
- ctx.save();
- this.setContext(ctx);
- const {
- width
- } = ctx.measureText(textToMeasure);
- ctx.restore();
- return width;
+ return _class32;
+ }(svg.Element.TextElementBase); // tref
+
+
+ svg.Element.tref = /*#__PURE__*/function (_svg$Element$TextElem2) {
+ _inherits(_class33, _svg$Element$TextElem2);
+
+ var _super32 = _createSuper(_class33);
+
+ function _class33() {
+ _classCallCheck(this, _class33);
+
+ return _super32.apply(this, arguments);
}
- }; // tspan
+ _createClass(_class33, [{
+ key: "getText",
+ value: function getText() {
+ var element = this.getHrefAttribute().getDefinition();
+ if (!isNullish(element)) return element.children[0].getText();
+ return undefined;
+ }
+ }]);
- svg.Element.tspan = class extends svg.Element.TextElementBase {
- constructor(node) {
- super(node, true);
- this.text = node.nodeValue || node.text || '';
- }
+ return _class33;
+ }(svg.Element.TextElementBase); // a element
- getText() {
- return this.text;
- }
- }; // tref
+ svg.Element.a = /*#__PURE__*/function (_svg$Element$TextElem3) {
+ _inherits(_class34, _svg$Element$TextElem3);
- svg.Element.tref = class extends svg.Element.TextElementBase {
- getText() {
- const element = this.getHrefAttribute().getDefinition();
- if (!isNullish(element)) return element.children[0].getText();
- return undefined;
- }
+ var _super33 = _createSuper(_class34);
- }; // a element
+ function _class34(node) {
+ var _this19;
- svg.Element.a = class extends svg.Element.TextElementBase {
- constructor(node) {
- super(node);
- this.hasText = true;
- [...node.childNodes].forEach(childNode => {
+ _classCallCheck(this, _class34);
+
+ _this19 = _super33.call(this, node);
+ _this19.hasText = true;
+
+ _toConsumableArray(node.childNodes).forEach(function (childNode) {
if (childNode.nodeType !== 3) {
- this.hasText = false;
+ _this19.hasText = false;
}
}); // this might contain text
- this.text = this.hasText ? node.childNodes[0].nodeValue : '';
+
+ _this19.text = _this19.hasText ? node.childNodes[0].nodeValue : '';
+ return _this19;
}
- getText() {
- return this.text;
- }
-
- renderChildren(ctx) {
- if (this.hasText) {
- // render as text element
- super.renderChildren(ctx);
- const fontSize = new svg.Property('fontSize', svg.Font.Parse(svg.ctx.font).fontSize);
- svg.Mouse.checkBoundingBox(this, new svg.BoundingBox(this.x, this.y - fontSize.toPixels('y'), this.x + this.measureText(ctx), this.y));
- } else {
- // render as temporary group
- const g = new svg.Element.g();
- g.children = this.children;
- g.parent = this;
- g.render(ctx);
+ _createClass(_class34, [{
+ key: "getText",
+ value: function getText() {
+ return this.text;
}
- }
+ }, {
+ key: "renderChildren",
+ value: function renderChildren(ctx) {
+ if (this.hasText) {
+ // render as text element
+ _get(_getPrototypeOf(_class34.prototype), "renderChildren", this).call(this, ctx);
- onclick() {
- window.open(this.getHrefAttribute().value);
- }
+ var fontSize = new svg.Property('fontSize', svg.Font.Parse(svg.ctx.font).fontSize);
+ svg.Mouse.checkBoundingBox(this, new svg.BoundingBox(this.x, this.y - fontSize.toPixels('y'), this.x + this.measureText(ctx), this.y));
+ } else {
+ // render as temporary group
+ var g = new svg.Element.g();
+ g.children = this.children;
+ g.parent = this;
+ g.render(ctx);
+ }
+ }
+ }, {
+ key: "onclick",
+ value: function onclick() {
+ window.open(this.getHrefAttribute().value);
+ }
+ }, {
+ key: "onmousemove",
+ value: function onmousemove() {
+ svg.ctx.canvas.style.cursor = 'pointer';
+ }
+ }]);
- onmousemove() {
- svg.ctx.canvas.style.cursor = 'pointer';
- }
+ return _class34;
+ }(svg.Element.TextElementBase); // image element
- }; // image element
- svg.Element.image = class extends svg.Element.RenderedElementBase {
- constructor(node) {
- super(node);
- const href = this.getHrefAttribute().value;
+ svg.Element.image = /*#__PURE__*/function (_svg$Element$Rendered5) {
+ _inherits(_class35, _svg$Element$Rendered5);
+
+ var _super34 = _createSuper(_class35);
+
+ function _class35(node) {
+ var _this20;
+
+ _classCallCheck(this, _class35);
+
+ _this20 = _super34.call(this, node);
+
+ var href = _this20.getHrefAttribute().value;
if (href === '') {
- return;
+ return _possibleConstructorReturn(_this20);
}
- this._isSvg = href.match(/\.svg$/);
- svg.Images.push(this);
- this.loaded = false;
+ _this20._isSvg = href.match(/\.svg$/);
+ svg.Images.push(_assertThisInitialized(_this20));
+ _this20.loaded = false;
- if (!this._isSvg) {
- this.img = document.createElement('img');
+ if (!_this20._isSvg) {
+ _this20.img = document.createElement('img');
if (svg.opts.useCORS === true) {
- this.img.crossOrigin = 'Anonymous';
+ _this20.img.crossOrigin = 'Anonymous';
}
- this.img.addEventListener('load', () => {
- this.loaded = true;
+ _this20.img.addEventListener('load', function () {
+ _this20.loaded = true;
});
- this.img.addEventListener('error', () => {
+
+ _this20.img.addEventListener('error', function () {
svg.log('ERROR: image "' + href + '" not found');
- this.loaded = true;
+ _this20.loaded = true;
});
- this.img.src = href;
+
+ _this20.img.src = href;
} else {
- svg.ajax(href, true).then(img => {
+ svg.ajax(href, true).then(function (img) {
// eslint-disable-line promise/prefer-await-to-then, promise/always-return
- this.img = img;
- this.loaded = true;
- }).catch(err => {
+ _this20.img = img;
+ _this20.loaded = true;
+ })["catch"](function (err) {
// eslint-disable-line promise/prefer-await-to-callbacks
- this.erred = true;
+ _this20.erred = true;
console.error('Ajax error for canvg', err); // eslint-disable-line no-console
});
}
+
+ return _this20;
}
- renderChildren(ctx) {
- const x = this.attribute('x').toPixels('x');
- const y = this.attribute('y').toPixels('y');
- const width = this.attribute('width').toPixels('x');
- const height = this.attribute('height').toPixels('y');
- if (width === 0 || height === 0) return;
- ctx.save();
+ _createClass(_class35, [{
+ key: "renderChildren",
+ value: function renderChildren(ctx) {
+ var x = this.attribute('x').toPixels('x');
+ var y = this.attribute('y').toPixels('y');
+ var width = this.attribute('width').toPixels('x');
+ var height = this.attribute('height').toPixels('y');
+ if (width === 0 || height === 0) return;
+ ctx.save();
- if (this._isSvg) {
- ctx.drawSvg(this.img, x, y, width, height);
- } else {
- ctx.translate(x, y);
- svg.AspectRatio(ctx, this.attribute('preserveAspectRatio').value, width, this.img.width, height, this.img.height, 0, 0);
- ctx.drawImage(this.img, 0, 0);
+ if (this._isSvg) {
+ ctx.drawSvg(this.img, x, y, width, height);
+ } else {
+ ctx.translate(x, y);
+ svg.AspectRatio(ctx, this.attribute('preserveAspectRatio').value, width, this.img.width, height, this.img.height, 0, 0);
+ ctx.drawImage(this.img, 0, 0);
+ }
+
+ ctx.restore();
}
+ }, {
+ key: "getBoundingBox",
+ value: function getBoundingBox() {
+ var x = this.attribute('x').toPixels('x');
+ var y = this.attribute('y').toPixels('y');
+ var width = this.attribute('width').toPixels('x');
+ var height = this.attribute('height').toPixels('y');
+ return new svg.BoundingBox(x, y, x + width, y + height);
+ }
+ }]);
- ctx.restore();
+ return _class35;
+ }(svg.Element.RenderedElementBase); // group element
+
+
+ svg.Element.g = /*#__PURE__*/function (_svg$Element$Rendered6) {
+ _inherits(_class36, _svg$Element$Rendered6);
+
+ var _super35 = _createSuper(_class36);
+
+ function _class36() {
+ _classCallCheck(this, _class36);
+
+ return _super35.apply(this, arguments);
}
- getBoundingBox() {
- const x = this.attribute('x').toPixels('x');
- const y = this.attribute('y').toPixels('y');
- const width = this.attribute('width').toPixels('x');
- const height = this.attribute('height').toPixels('y');
- return new svg.BoundingBox(x, y, x + width, y + height);
+ _createClass(_class36, [{
+ key: "getBoundingBox",
+ value: function getBoundingBox() {
+ var bb = new svg.BoundingBox();
+ this.children.forEach(function (child) {
+ bb.addBoundingBox(child.getBoundingBox());
+ });
+ return bb;
+ }
+ }]);
+
+ return _class36;
+ }(svg.Element.RenderedElementBase); // symbol element
+
+
+ svg.Element.symbol = /*#__PURE__*/function (_svg$Element$Rendered7) {
+ _inherits(_class37, _svg$Element$Rendered7);
+
+ var _super36 = _createSuper(_class37);
+
+ function _class37() {
+ _classCallCheck(this, _class37);
+
+ return _super36.apply(this, arguments);
}
- }; // group element
+ _createClass(_class37, [{
+ key: "render",
+ value: function render(ctx) {// NO RENDER
+ }
+ }]);
- svg.Element.g = class extends svg.Element.RenderedElementBase {
- getBoundingBox() {
- const bb = new svg.BoundingBox();
- this.children.forEach(child => {
- bb.addBoundingBox(child.getBoundingBox());
- });
- return bb;
- }
+ return _class37;
+ }(svg.Element.RenderedElementBase); // style element
- }; // symbol element
- svg.Element.symbol = class extends svg.Element.RenderedElementBase {
- render(ctx) {// NO RENDER
- }
+ svg.Element.style = /*#__PURE__*/function (_svg$Element$ElementB10) {
+ _inherits(_class38, _svg$Element$ElementB10);
- }; // style element
+ var _super37 = _createSuper(_class38);
- svg.Element.style = class extends svg.Element.ElementBase {
- constructor(node) {
- super(node); // text, or spaces then CDATA
+ function _class38(node) {
+ var _this21;
- let css = '';
- [...node.childNodes].forEach(({
- nodeValue
- }) => {
+ _classCallCheck(this, _class38);
+
+ _this21 = _super37.call(this, node); // text, or spaces then CDATA
+
+ var css = '';
+
+ _toConsumableArray(node.childNodes).forEach(function (_ref11) {
+ var nodeValue = _ref11.nodeValue;
css += nodeValue;
}); // remove comments
+
css = css.replace(/(\/\*([^*]|[\r\n]|(\*+([^*/]|[\r\n])))*\*+\/)|(^\s*\/\/.*)/gm, ''); // eslint-disable-line unicorn/no-unsafe-regex
// replace whitespace
css = svg.compressSpaces(css);
- const cssDefs = css.split('}');
- cssDefs.forEach(cssDef => {
+ var cssDefs = css.split('}');
+ cssDefs.forEach(function (cssDef) {
if (svg.trim(cssDef) !== '') {
- let [cssClasses, cssProps] = cssDef.split('{');
+ var _cssDef$split = cssDef.split('{'),
+ _cssDef$split2 = _slicedToArray(_cssDef$split, 2),
+ cssClasses = _cssDef$split2[0],
+ cssProps = _cssDef$split2[1];
+
cssClasses = cssClasses.split(',');
cssProps = cssProps.split(';');
- cssClasses.forEach(cssClass => {
+ cssClasses.forEach(function (cssClass) {
cssClass = svg.trim(cssClass);
if (cssClass !== '') {
- const props = {};
- cssProps.forEach(cssProp => {
- const prop = cssProp.indexOf(':');
- const name = cssProp.substr(0, prop);
- const value = cssProp.substr(prop + 1, cssProp.length - prop);
+ var props = {};
+ cssProps.forEach(function (cssProp) {
+ var prop = cssProp.indexOf(':');
+ var name = cssProp.substr(0, prop);
+ var value = cssProp.substr(prop + 1, cssProp.length - prop);
if (!isNullish(name) && !isNullish(value)) {
props[svg.trim(name)] = new svg.Property(svg.trim(name), svg.trim(value));
@@ -3163,17 +4082,18 @@ var svgEditorExtension_server_opensave = (function () {
svg.Styles[cssClass] = props;
if (cssClass === '@font-face') {
- const fontFamily = props['font-family'].value.replace(/"/g, '');
- const srcs = props.src.value.split(',');
- srcs.forEach(src => {
+ var fontFamily = props['font-family'].value.replace(/"/g, '');
+ var srcs = props.src.value.split(',');
+ srcs.forEach(function (src) {
if (src.includes('format("svg")')) {
- const urlStart = src.indexOf('url');
- const urlEnd = src.indexOf(')', urlStart);
- const url = src.substr(urlStart + 5, urlEnd - urlStart - 6); // Can this ajax safely be converted to async?
+ var urlStart = src.indexOf('url');
+ var urlEnd = src.indexOf(')', urlStart);
+ var url = src.substr(urlStart + 5, urlEnd - urlStart - 6); // Can this ajax safely be converted to async?
- const doc = svg.parseXml(svg.ajax(url));
- const fonts = doc.getElementsByTagName('font');
- [...fonts].forEach(font => {
+ var doc = svg.parseXml(svg.ajax(url));
+ var fonts = doc.getElementsByTagName('font');
+
+ _toConsumableArray(fonts).forEach(function (font) {
font = svg.CreateElement(font);
svg.Definitions[fontFamily] = font;
});
@@ -3184,190 +4104,282 @@ var svgEditorExtension_server_opensave = (function () {
});
}
});
+ return _this21;
}
- }; // use element
+ return _class38;
+ }(svg.Element.ElementBase); // use element
- svg.Element.use = class extends svg.Element.RenderedElementBase {
- constructor(node) {
- super(node);
- this._el = this.getHrefAttribute().getDefinition();
+
+ svg.Element.use = /*#__PURE__*/function (_svg$Element$Rendered8) {
+ _inherits(_class39, _svg$Element$Rendered8);
+
+ var _super38 = _createSuper(_class39);
+
+ function _class39(node) {
+ var _this22;
+
+ _classCallCheck(this, _class39);
+
+ _this22 = _super38.call(this, node);
+ _this22._el = _this22.getHrefAttribute().getDefinition();
+ return _this22;
}
- setContext(ctx) {
- super.setContext(ctx);
- if (this.attribute('x').hasValue()) ctx.translate(this.attribute('x').toPixels('x'), 0);
- if (this.attribute('y').hasValue()) ctx.translate(0, this.attribute('y').toPixels('y'));
- }
+ _createClass(_class39, [{
+ key: "setContext",
+ value: function setContext(ctx) {
+ _get(_getPrototypeOf(_class39.prototype), "setContext", this).call(this, ctx);
- path(ctx) {
- const {
- _el: element
- } = this;
- if (!isNullish(element)) element.path(ctx);
- }
-
- getBoundingBox() {
- const {
- _el: element
- } = this;
- if (!isNullish(element)) return element.getBoundingBox();
- return undefined;
- }
-
- renderChildren(ctx) {
- const {
- _el: element
- } = this;
-
- if (!isNullish(element)) {
- let tempSvg = element;
-
- if (element.type === 'symbol') {
- // render me using a temporary svg element in symbol cases (https://www.w3.org/TR/SVG/struct.html#UseElement)
- tempSvg = new svg.Element.svg();
- tempSvg.type = 'svg';
- tempSvg.attributes.viewBox = new svg.Property('viewBox', element.attribute('viewBox').value);
- tempSvg.attributes.preserveAspectRatio = new svg.Property('preserveAspectRatio', element.attribute('preserveAspectRatio').value);
- tempSvg.attributes.overflow = new svg.Property('overflow', element.attribute('overflow').value);
- tempSvg.children = element.children;
- }
-
- if (tempSvg.type === 'svg') {
- // if symbol or svg, inherit width/height from me
- if (this.attribute('width').hasValue()) tempSvg.attributes.width = new svg.Property('width', this.attribute('width').value);
- if (this.attribute('height').hasValue()) tempSvg.attributes.height = new svg.Property('height', this.attribute('height').value);
- }
-
- const oldParent = tempSvg.parent;
- tempSvg.parent = null;
- tempSvg.render(ctx);
- tempSvg.parent = oldParent;
+ if (this.attribute('x').hasValue()) ctx.translate(this.attribute('x').toPixels('x'), 0);
+ if (this.attribute('y').hasValue()) ctx.translate(0, this.attribute('y').toPixels('y'));
}
- }
+ }, {
+ key: "path",
+ value: function path(ctx) {
+ var element = this._el;
+ if (!isNullish(element)) element.path(ctx);
+ }
+ }, {
+ key: "getBoundingBox",
+ value: function getBoundingBox() {
+ var element = this._el;
+ if (!isNullish(element)) return element.getBoundingBox();
+ return undefined;
+ }
+ }, {
+ key: "renderChildren",
+ value: function renderChildren(ctx) {
+ var element = this._el;
- }; // mask element
+ if (!isNullish(element)) {
+ var tempSvg = element;
- svg.Element.mask = class extends svg.Element.ElementBase {
- apply(ctx, element) {
- // render as temp svg
- let x = this.attribute('x').toPixels('x');
- let y = this.attribute('y').toPixels('y');
- let width = this.attribute('width').toPixels('x');
- let height = this.attribute('height').toPixels('y');
-
- if (width === 0 && height === 0) {
- const bb = new svg.BoundingBox();
- this.children.forEach(child => {
- bb.addBoundingBox(child.getBoundingBox());
- });
- x = Math.floor(bb.x1);
- y = Math.floor(bb.y1);
- width = Math.floor(bb.width());
- height = Math.floor(bb.height());
- } // temporarily remove mask to avoid recursion
-
-
- const mask = element.attribute('mask').value;
- element.attribute('mask').value = '';
- const cMask = document.createElement('canvas');
- cMask.width = x + width;
- cMask.height = y + height;
- const maskCtx = cMask.getContext('2d');
- this.renderChildren(maskCtx);
- const c = document.createElement('canvas');
- c.width = x + width;
- c.height = y + height;
- const tempCtx = c.getContext('2d');
- element.render(tempCtx);
- tempCtx.globalCompositeOperation = 'destination-in';
- tempCtx.fillStyle = maskCtx.createPattern(cMask, 'no-repeat');
- tempCtx.fillRect(0, 0, x + width, y + height);
- ctx.fillStyle = tempCtx.createPattern(c, 'no-repeat');
- ctx.fillRect(0, 0, x + width, y + height); // reassign mask
-
- element.attribute('mask').value = mask;
- }
-
- render(ctx) {// NO RENDER
- }
-
- }; // clip element
-
- svg.Element.clipPath = class extends svg.Element.ElementBase {
- apply(ctx) {
- this.children.forEach(child => {
- if (typeof child.path !== 'undefined') {
- let transform = null;
-
- if (child.attribute('transform').hasValue()) {
- transform = new svg.Transform(child.attribute('transform').value);
- transform.apply(ctx);
+ if (element.type === 'symbol') {
+ // render me using a temporary svg element in symbol cases (https://www.w3.org/TR/SVG/struct.html#UseElement)
+ tempSvg = new svg.Element.svg();
+ tempSvg.type = 'svg';
+ tempSvg.attributes.viewBox = new svg.Property('viewBox', element.attribute('viewBox').value);
+ tempSvg.attributes.preserveAspectRatio = new svg.Property('preserveAspectRatio', element.attribute('preserveAspectRatio').value);
+ tempSvg.attributes.overflow = new svg.Property('overflow', element.attribute('overflow').value);
+ tempSvg.children = element.children;
}
- child.path(ctx);
- ctx.clip();
-
- if (transform) {
- transform.unapply(ctx);
+ if (tempSvg.type === 'svg') {
+ // if symbol or svg, inherit width/height from me
+ if (this.attribute('width').hasValue()) tempSvg.attributes.width = new svg.Property('width', this.attribute('width').value);
+ if (this.attribute('height').hasValue()) tempSvg.attributes.height = new svg.Property('height', this.attribute('height').value);
}
+
+ var oldParent = tempSvg.parent;
+ tempSvg.parent = null;
+ tempSvg.render(ctx);
+ tempSvg.parent = oldParent;
}
- });
+ }
+ }]);
+
+ return _class39;
+ }(svg.Element.RenderedElementBase); // mask element
+
+
+ svg.Element.mask = /*#__PURE__*/function (_svg$Element$ElementB11) {
+ _inherits(_class40, _svg$Element$ElementB11);
+
+ var _super39 = _createSuper(_class40);
+
+ function _class40() {
+ _classCallCheck(this, _class40);
+
+ return _super39.apply(this, arguments);
}
- render(ctx) {// NO RENDER
+ _createClass(_class40, [{
+ key: "apply",
+ value: function apply(ctx, element) {
+ // render as temp svg
+ var x = this.attribute('x').toPixels('x');
+ var y = this.attribute('y').toPixels('y');
+ var width = this.attribute('width').toPixels('x');
+ var height = this.attribute('height').toPixels('y');
+
+ if (width === 0 && height === 0) {
+ var bb = new svg.BoundingBox();
+ this.children.forEach(function (child) {
+ bb.addBoundingBox(child.getBoundingBox());
+ });
+ x = Math.floor(bb.x1);
+ y = Math.floor(bb.y1);
+ width = Math.floor(bb.width());
+ height = Math.floor(bb.height());
+ } // temporarily remove mask to avoid recursion
+
+
+ var mask = element.attribute('mask').value;
+ element.attribute('mask').value = '';
+ var cMask = document.createElement('canvas');
+ cMask.width = x + width;
+ cMask.height = y + height;
+ var maskCtx = cMask.getContext('2d');
+ this.renderChildren(maskCtx);
+ var c = document.createElement('canvas');
+ c.width = x + width;
+ c.height = y + height;
+ var tempCtx = c.getContext('2d');
+ element.render(tempCtx);
+ tempCtx.globalCompositeOperation = 'destination-in';
+ tempCtx.fillStyle = maskCtx.createPattern(cMask, 'no-repeat');
+ tempCtx.fillRect(0, 0, x + width, y + height);
+ ctx.fillStyle = tempCtx.createPattern(c, 'no-repeat');
+ ctx.fillRect(0, 0, x + width, y + height); // reassign mask
+
+ element.attribute('mask').value = mask;
+ }
+ }, {
+ key: "render",
+ value: function render(ctx) {// NO RENDER
+ }
+ }]);
+
+ return _class40;
+ }(svg.Element.ElementBase); // clip element
+
+
+ svg.Element.clipPath = /*#__PURE__*/function (_svg$Element$ElementB12) {
+ _inherits(_class41, _svg$Element$ElementB12);
+
+ var _super40 = _createSuper(_class41);
+
+ function _class41() {
+ _classCallCheck(this, _class41);
+
+ return _super40.apply(this, arguments);
}
- }; // filters
+ _createClass(_class41, [{
+ key: "apply",
+ value: function apply(ctx) {
+ this.children.forEach(function (child) {
+ if (typeof child.path !== 'undefined') {
+ var transform = null;
- svg.Element.filter = class extends svg.Element.ElementBase {
- apply(ctx, element) {
- // render as temp svg
- const bb = element.getBoundingBox();
- const x = Math.floor(bb.x1);
- const y = Math.floor(bb.y1);
- const width = Math.floor(bb.width());
- const height = Math.floor(bb.height()); // temporarily remove filter to avoid recursion
+ if (child.attribute('transform').hasValue()) {
+ transform = new svg.Transform(child.attribute('transform').value);
+ transform.apply(ctx);
+ }
- const filter = element.style('filter').value;
- element.style('filter').value = '';
- let px = 0,
- py = 0;
- this.children.forEach(child => {
- const efd = child.extraFilterDistance || 0;
- px = Math.max(px, efd);
- py = Math.max(py, efd);
- });
- const c = document.createElement('canvas');
- c.width = width + 2 * px;
- c.height = height + 2 * py;
- const tempCtx = c.getContext('2d');
- tempCtx.translate(-x + px, -y + py);
- element.render(tempCtx); // apply filters
+ child.path(ctx);
+ ctx.clip();
- this.children.forEach(child => {
- child.apply(tempCtx, 0, 0, width + 2 * px, height + 2 * py);
- }); // render on me
+ if (transform) {
+ transform.unapply(ctx);
+ }
+ }
+ });
+ }
+ }, {
+ key: "render",
+ value: function render(ctx) {// NO RENDER
+ }
+ }]);
- ctx.drawImage(c, 0, 0, width + 2 * px, height + 2 * py, x - px, y - py, width + 2 * px, height + 2 * py); // reassign filter
+ return _class41;
+ }(svg.Element.ElementBase); // filters
- element.style('filter', true).value = filter;
+
+ svg.Element.filter = /*#__PURE__*/function (_svg$Element$ElementB13) {
+ _inherits(_class42, _svg$Element$ElementB13);
+
+ var _super41 = _createSuper(_class42);
+
+ function _class42() {
+ _classCallCheck(this, _class42);
+
+ return _super41.apply(this, arguments);
}
- render(ctx) {// NO RENDER
+ _createClass(_class42, [{
+ key: "apply",
+ value: function apply(ctx, element) {
+ // render as temp svg
+ var bb = element.getBoundingBox();
+ var x = Math.floor(bb.x1);
+ var y = Math.floor(bb.y1);
+ var width = Math.floor(bb.width());
+ var height = Math.floor(bb.height()); // temporarily remove filter to avoid recursion
+
+ var filter = element.style('filter').value;
+ element.style('filter').value = '';
+ var px = 0,
+ py = 0;
+ this.children.forEach(function (child) {
+ var efd = child.extraFilterDistance || 0;
+ px = Math.max(px, efd);
+ py = Math.max(py, efd);
+ });
+ var c = document.createElement('canvas');
+ c.width = width + 2 * px;
+ c.height = height + 2 * py;
+ var tempCtx = c.getContext('2d');
+ tempCtx.translate(-x + px, -y + py);
+ element.render(tempCtx); // apply filters
+
+ this.children.forEach(function (child) {
+ child.apply(tempCtx, 0, 0, width + 2 * px, height + 2 * py);
+ }); // render on me
+
+ ctx.drawImage(c, 0, 0, width + 2 * px, height + 2 * py, x - px, y - py, width + 2 * px, height + 2 * py); // reassign filter
+
+ element.style('filter', true).value = filter;
+ }
+ }, {
+ key: "render",
+ value: function render(ctx) {// NO RENDER
+ }
+ }]);
+
+ return _class42;
+ }(svg.Element.ElementBase);
+
+ svg.Element.feMorphology = /*#__PURE__*/function (_svg$Element$ElementB14) {
+ _inherits(_class43, _svg$Element$ElementB14);
+
+ var _super42 = _createSuper(_class43);
+
+ function _class43() {
+ _classCallCheck(this, _class43);
+
+ return _super42.apply(this, arguments);
}
- };
- svg.Element.feMorphology = class extends svg.Element.ElementBase {
- apply(ctx, x, y, width, height) {// TODO: implement
+ _createClass(_class43, [{
+ key: "apply",
+ value: function apply(ctx, x, y, width, height) {// TODO: implement
+ }
+ }]);
+
+ return _class43;
+ }(svg.Element.ElementBase);
+
+ svg.Element.feComposite = /*#__PURE__*/function (_svg$Element$ElementB15) {
+ _inherits(_class44, _svg$Element$ElementB15);
+
+ var _super43 = _createSuper(_class44);
+
+ function _class44() {
+ _classCallCheck(this, _class44);
+
+ return _super43.apply(this, arguments);
}
- };
- svg.Element.feComposite = class extends svg.Element.ElementBase {
- apply(ctx, x, y, width, height) {// TODO: implement
- }
+ _createClass(_class44, [{
+ key: "apply",
+ value: function apply(ctx, x, y, width, height) {// TODO: implement
+ }
+ }]);
- };
+ return _class44;
+ }(svg.Element.ElementBase);
/**
* @param {Uint8ClampedArray} img
* @param {Integer} x
@@ -3378,6 +4390,7 @@ var svgEditorExtension_server_opensave = (function () {
* @returns {Integer}
*/
+
function imGet(img, x, y, width, height, rgba) {
return img[y * width * 4 + x * 4 + rgba];
}
@@ -3397,25 +4410,33 @@ var svgEditorExtension_server_opensave = (function () {
img[y * width * 4 + x * 4 + rgba] = val;
}
- svg.Element.feColorMatrix = class extends svg.Element.ElementBase {
- constructor(node) {
- super(node);
- let matrix = svg.ToNumberArray(this.attribute('values').value);
+ svg.Element.feColorMatrix = /*#__PURE__*/function (_svg$Element$ElementB16) {
+ _inherits(_class45, _svg$Element$ElementB16);
- switch (this.attribute('type').valueOrDefault('matrix')) {
+ var _super44 = _createSuper(_class45);
+
+ function _class45(node) {
+ var _this23;
+
+ _classCallCheck(this, _class45);
+
+ _this23 = _super44.call(this, node);
+ var matrix = svg.ToNumberArray(_this23.attribute('values').value);
+
+ switch (_this23.attribute('type').valueOrDefault('matrix')) {
// https://www.w3.org/TR/SVG/filters.html#feColorMatrixElement
case 'saturate':
{
- const s = matrix[0];
+ var s = matrix[0];
matrix = [0.213 + 0.787 * s, 0.715 - 0.715 * s, 0.072 - 0.072 * s, 0, 0, 0.213 - 0.213 * s, 0.715 + 0.285 * s, 0.072 - 0.072 * s, 0, 0, 0.213 - 0.213 * s, 0.715 - 0.715 * s, 0.072 + 0.928 * s, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1];
break;
}
case 'hueRotate':
{
- const a = matrix[0] * Math.PI / 180.0;
+ var a = matrix[0] * Math.PI / 180.0;
- const c = function (m1, m2, m3) {
+ var c = function c(m1, m2, m3) {
return m1 + Math.cos(a) * m2 + Math.sin(a) * m3;
};
@@ -3428,84 +4449,130 @@ var svgEditorExtension_server_opensave = (function () {
break;
}
- this.matrix = matrix;
+ _this23.matrix = matrix;
- this._m = (i, v) => {
- const mi = matrix[i];
+ _this23._m = function (i, v) {
+ var mi = matrix[i];
return mi * (mi < 0 ? v - 255 : v);
};
+
+ return _this23;
}
- apply(ctx, x, y, width, height) {
- const {
- _m: m
- } = this; // assuming x==0 && y==0 for now
+ _createClass(_class45, [{
+ key: "apply",
+ value: function apply(ctx, x, y, width, height) {
+ var m = this._m; // assuming x==0 && y==0 for now
- const srcData = ctx.getImageData(0, 0, width, height);
+ var srcData = ctx.getImageData(0, 0, width, height);
- for (let _y = 0; _y < height; _y++) {
- for (let _x = 0; _x < width; _x++) {
- const r = imGet(srcData.data, _x, _y, width, height, 0);
- const g = imGet(srcData.data, _x, _y, width, height, 1);
- const b = imGet(srcData.data, _x, _y, width, height, 2);
- const a = imGet(srcData.data, _x, _y, width, height, 3);
- imSet(srcData.data, _x, _y, width, height, 0, m(0, r) + m(1, g) + m(2, b) + m(3, a) + m(4, 1));
- imSet(srcData.data, _x, _y, width, height, 1, m(5, r) + m(6, g) + m(7, b) + m(8, a) + m(9, 1));
- imSet(srcData.data, _x, _y, width, height, 2, m(10, r) + m(11, g) + m(12, b) + m(13, a) + m(14, 1));
- imSet(srcData.data, _x, _y, width, height, 3, m(15, r) + m(16, g) + m(17, b) + m(18, a) + m(19, 1));
+ for (var _y = 0; _y < height; _y++) {
+ for (var _x = 0; _x < width; _x++) {
+ var r = imGet(srcData.data, _x, _y, width, height, 0);
+ var g = imGet(srcData.data, _x, _y, width, height, 1);
+ var b = imGet(srcData.data, _x, _y, width, height, 2);
+ var a = imGet(srcData.data, _x, _y, width, height, 3);
+ imSet(srcData.data, _x, _y, width, height, 0, m(0, r) + m(1, g) + m(2, b) + m(3, a) + m(4, 1));
+ imSet(srcData.data, _x, _y, width, height, 1, m(5, r) + m(6, g) + m(7, b) + m(8, a) + m(9, 1));
+ imSet(srcData.data, _x, _y, width, height, 2, m(10, r) + m(11, g) + m(12, b) + m(13, a) + m(14, 1));
+ imSet(srcData.data, _x, _y, width, height, 3, m(15, r) + m(16, g) + m(17, b) + m(18, a) + m(19, 1));
+ }
}
+
+ ctx.clearRect(0, 0, width, height);
+ ctx.putImageData(srcData, 0, 0);
}
+ }]);
- ctx.clearRect(0, 0, width, height);
- ctx.putImageData(srcData, 0, 0);
+ return _class45;
+ }(svg.Element.ElementBase);
+
+ svg.Element.feGaussianBlur = /*#__PURE__*/function (_svg$Element$ElementB17) {
+ _inherits(_class46, _svg$Element$ElementB17);
+
+ var _super45 = _createSuper(_class46);
+
+ function _class46(node) {
+ var _this24;
+
+ _classCallCheck(this, _class46);
+
+ _this24 = _super45.call(this, node);
+ _this24.blurRadius = Math.floor(_this24.attribute('stdDeviation').numValue());
+ _this24.extraFilterDistance = _this24.blurRadius;
+ return _this24;
}
- };
- svg.Element.feGaussianBlur = class extends svg.Element.ElementBase {
- constructor(node) {
- super(node);
- this.blurRadius = Math.floor(this.attribute('stdDeviation').numValue());
- this.extraFilterDistance = this.blurRadius;
+ _createClass(_class46, [{
+ key: "apply",
+ value: function apply(ctx, x, y, width, height) {
+ // Todo: This might not be a problem anymore with out `instanceof` fix
+ // StackBlur requires canvas be on document
+ ctx.canvas.id = svg.UniqueId();
+ ctx.canvas.style.display = 'none';
+ document.body.append(ctx.canvas);
+ processCanvasRGBA(ctx.canvas, x, y, width, height, this.blurRadius);
+ ctx.canvas.remove();
+ }
+ }]);
+
+ return _class46;
+ }(svg.Element.ElementBase); // title element, do nothing
+
+
+ svg.Element.title = /*#__PURE__*/function (_svg$Element$ElementB18) {
+ _inherits(_class47, _svg$Element$ElementB18);
+
+ var _super46 = _createSuper(_class47);
+
+ function _class47(node) {
+ _classCallCheck(this, _class47);
+
+ return _super46.call(this);
}
- apply(ctx, x, y, width, height) {
- // Todo: This might not be a problem anymore with out `instanceof` fix
- // StackBlur requires canvas be on document
- ctx.canvas.id = svg.UniqueId();
- ctx.canvas.style.display = 'none';
- document.body.append(ctx.canvas);
- processCanvasRGBA(ctx.canvas, x, y, width, height, this.blurRadius);
- ctx.canvas.remove();
+ return _class47;
+ }(svg.Element.ElementBase); // desc element, do nothing
+
+
+ svg.Element.desc = /*#__PURE__*/function (_svg$Element$ElementB19) {
+ _inherits(_class48, _svg$Element$ElementB19);
+
+ var _super47 = _createSuper(_class48);
+
+ function _class48(node) {
+ _classCallCheck(this, _class48);
+
+ return _super47.call(this);
}
- }; // title element, do nothing
+ return _class48;
+ }(svg.Element.ElementBase);
- svg.Element.title = class extends svg.Element.ElementBase {
- constructor(node) {
- super();
- }
+ svg.Element.MISSING = /*#__PURE__*/function (_svg$Element$ElementB20) {
+ _inherits(_class49, _svg$Element$ElementB20);
- }; // desc element, do nothing
+ var _super48 = _createSuper(_class49);
- svg.Element.desc = class extends svg.Element.ElementBase {
- constructor(node) {
- super();
- }
+ function _class49(node) {
+ var _this25;
- };
- svg.Element.MISSING = class extends svg.Element.ElementBase {
- constructor(node) {
- super();
+ _classCallCheck(this, _class49);
+
+ _this25 = _super48.call(this);
svg.log('ERROR: Element \'' + node.nodeName + '\' not yet implemented.');
+ return _this25;
}
- }; // element factory
+ return _class49;
+ }(svg.Element.ElementBase); // element factory
+
svg.CreateElement = function (node) {
- const className = node.nodeName.replace(/^[^:]+:/, '') // remove namespace
+ var className = node.nodeName.replace(/^[^:]+:/, '') // remove namespace
.replace(/-/g, ''); // remove dashes
- let e;
+ var e;
if (typeof svg.Element[className] !== 'undefined') {
e = new svg.Element[className](node);
@@ -3518,10 +4585,32 @@ var svgEditorExtension_server_opensave = (function () {
}; // load from url
- svg.load = async function (ctx, url) {
- const dom = await svg.ajax(url, true);
- return svg.loadXml(ctx, dom);
- }; // load from xml
+ svg.load = /*#__PURE__*/function () {
+ var _ref12 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(ctx, url) {
+ var dom;
+ return regeneratorRuntime.wrap(function _callee$(_context) {
+ while (1) {
+ switch (_context.prev = _context.next) {
+ case 0:
+ _context.next = 2;
+ return svg.ajax(url, true);
+
+ case 2:
+ dom = _context.sent;
+ return _context.abrupt("return", svg.loadXml(ctx, dom));
+
+ case 4:
+ case "end":
+ return _context.stop();
+ }
+ }
+ }, _callee);
+ }));
+
+ return function (_x2, _x3) {
+ return _ref12.apply(this, arguments);
+ };
+ }(); // load from xml
svg.loadXml = function (ctx, xml) {
@@ -3529,11 +4618,11 @@ var svgEditorExtension_server_opensave = (function () {
};
svg.loadXmlDoc = function (ctx, dom) {
- let res;
+ var res;
svg.init(ctx);
- const mapXY = function (p) {
- let e = ctx.canvas;
+ var mapXY = function mapXY(p) {
+ var e = ctx.canvas;
while (e) {
p.x -= e.offsetLeft;
@@ -3549,31 +4638,31 @@ var svgEditorExtension_server_opensave = (function () {
if (svg.opts.ignoreMouse !== true) {
ctx.canvas.addEventListener('click', function (e) {
- const args = !isNullish(e) ? [e.clientX, e.clientY] : [event.clientX, event.clientY]; // eslint-disable-line no-restricted-globals
+ var args = !isNullish(e) ? [e.clientX, e.clientY] : [event.clientX, event.clientY]; // eslint-disable-line no-restricted-globals
+
+ var _mapXY = mapXY(_construct(svg.Point, args)),
+ x = _mapXY.x,
+ y = _mapXY.y;
- const {
- x,
- y
- } = mapXY(new svg.Point(...args));
svg.Mouse.onclick(x, y);
});
ctx.canvas.addEventListener('mousemove', function (e) {
- const args = !isNullish(e) ? [e.clientX, e.clientY] : [event.clientX, event.clientY]; // eslint-disable-line no-restricted-globals
+ var args = !isNullish(e) ? [e.clientX, e.clientY] : [event.clientX, event.clientY]; // eslint-disable-line no-restricted-globals
+
+ var _mapXY2 = mapXY(_construct(svg.Point, args)),
+ x = _mapXY2.x,
+ y = _mapXY2.y;
- const {
- x,
- y
- } = mapXY(new svg.Point(...args));
svg.Mouse.onmousemove(x, y);
});
}
- const e = svg.CreateElement(dom.documentElement);
+ var e = svg.CreateElement(dom.documentElement);
e.root = true; // render loop
- let isFirstRender = true;
+ var isFirstRender = true;
- const draw = function (resolve) {
+ var draw = function draw(resolve) {
svg.ViewPort.Clear();
if (ctx.canvas.parentNode) {
@@ -3593,8 +4682,8 @@ var svgEditorExtension_server_opensave = (function () {
}
}
- let cWidth = ctx.canvas.clientWidth || ctx.canvas.width;
- let cHeight = ctx.canvas.clientHeight || ctx.canvas.height;
+ var cWidth = ctx.canvas.clientWidth || ctx.canvas.width;
+ var cHeight = ctx.canvas.clientHeight || ctx.canvas.height;
if (svg.opts.ignoreDimensions === true && e.style('width').hasValue() && e.style('height').hasValue()) {
cWidth = e.style('width').toPixels('x');
@@ -3612,8 +4701,8 @@ var svgEditorExtension_server_opensave = (function () {
}
if (!isNullish(svg.opts.scaleWidth) || !isNullish(svg.opts.scaleHeight)) {
- const viewBox = svg.ToNumberArray(e.attribute('viewBox').value);
- let xRatio = null,
+ var viewBox = svg.ToNumberArray(e.attribute('viewBox').value);
+ var xRatio = null,
yRatio = null;
if (!isNullish(svg.opts.scaleWidth)) {
@@ -3659,9 +4748,9 @@ var svgEditorExtension_server_opensave = (function () {
}
};
- let waitingForImages = true;
+ var waitingForImages = true;
svg.intervalID = setInterval(function () {
- let needUpdate = false;
+ var needUpdate = false;
if (waitingForImages && svg.ImagesLoaded()) {
waitingForImages = false;
@@ -3675,8 +4764,8 @@ var svgEditorExtension_server_opensave = (function () {
if (svg.opts.ignoreAnimation !== true) {
- svg.Animations.forEach(animation => {
- const needAnimationUpdate = animation.update(1000 / svg.FRAMERATE);
+ svg.Animations.forEach(function (animation) {
+ var needAnimationUpdate = animation.update(1000 / svg.FRAMERATE);
needUpdate = needUpdate || needAnimationUpdate;
});
} // need update from redraw?
@@ -3695,7 +4784,7 @@ var svgEditorExtension_server_opensave = (function () {
}
}, 1000 / svg.FRAMERATE); // Todo: Replace with an image loading Promise utility?
- return new Promise((resolve, reject) => {
+ return new Promise(function (resolve, reject) {
// eslint-disable-line promise/avoid-new
if (svg.ImagesLoaded()) {
waitingForImages = false;
@@ -3707,7 +4796,7 @@ var svgEditorExtension_server_opensave = (function () {
});
};
- svg.stop = () => {
+ svg.stop = function () {
if (svg.intervalID) {
clearInterval(svg.intervalID);
}
@@ -3715,65 +4804,60 @@ var svgEditorExtension_server_opensave = (function () {
svg.Mouse = {
events: [],
-
- hasEvents() {
+ hasEvents: function hasEvents() {
return this.events.length !== 0;
},
-
- onclick(x, y) {
+ onclick: function onclick(x, y) {
this.events.push({
type: 'onclick',
- x,
- y,
-
- run(e) {
+ x: x,
+ y: y,
+ run: function run(e) {
if (e.onclick) e.onclick();
}
-
});
},
-
- onmousemove(x, y) {
+ onmousemove: function onmousemove(x, y) {
this.events.push({
type: 'onmousemove',
- x,
- y,
-
- run(e) {
+ x: x,
+ y: y,
+ run: function run(e) {
if (e.onmousemove) e.onmousemove();
}
-
});
},
-
eventElements: [],
+ checkPath: function checkPath(element, ctx) {
+ var _this26 = this;
+
+ this.events.forEach(function (_ref13, i) {
+ var x = _ref13.x,
+ y = _ref13.y;
- checkPath(element, ctx) {
- this.events.forEach(({
- x,
- y
- }, i) => {
if (ctx.isPointInPath && ctx.isPointInPath(x, y)) {
- this.eventElements[i] = element;
+ _this26.eventElements[i] = element;
}
});
},
+ checkBoundingBox: function checkBoundingBox(element, bb) {
+ var _this27 = this;
+
+ this.events.forEach(function (_ref14, i) {
+ var x = _ref14.x,
+ y = _ref14.y;
- checkBoundingBox(element, bb) {
- this.events.forEach(({
- x,
- y
- }, i) => {
if (bb.isPointInBox(x, y)) {
- this.eventElements[i] = element;
+ _this27.eventElements[i] = element;
}
});
},
+ runEvents: function runEvents() {
+ var _this28 = this;
- runEvents() {
svg.ctx.canvas.style.cursor = '';
- this.events.forEach((e, i) => {
- let element = this.eventElements[i];
+ this.events.forEach(function (e, i) {
+ var element = _this28.eventElements[i];
while (element) {
e.run(element);
@@ -3784,7 +4868,6 @@ var svgEditorExtension_server_opensave = (function () {
this.events = [];
this.eventElements = [];
}
-
};
return svg;
}
@@ -3804,294 +4887,339 @@ var svgEditorExtension_server_opensave = (function () {
};
}
- /**
- * @file ext-server_opensave.js
- *
- * @license MIT
- *
- * @copyright 2010 Alexis Deveria
- *
- */
var extServer_opensave = {
name: 'server_opensave',
+ init: function init(_ref) {
+ var _this = this;
- async init({
- $,
- decode64,
- encode64,
- importLocale
- }) {
- const strings = await importLocale();
- const svgEditor = this;
- const {
- curConfig: {
- extPath,
- avoidClientSide,
- // Deprecated
- avoidClientSideDownload,
- avoidClientSideOpen
- },
- canvas: svgCanvas
- } = svgEditor;
- /**
- *
- * @returns {string}
- */
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee5() {
+ var $, decode64, encode64, importLocale, strings, svgEditor, _svgEditor$curConfig, extPath, avoidClientSide, avoidClientSideDownload, avoidClientSideOpen, svgCanvas, getFileNameFromTitle, xhtmlEscape, clientDownloadSupport, saveSvgAction, saveImgAction, cancelled, openSvgAction, importSvgAction, importImgAction, openSvgForm, importSvgForm, importImgForm, rebuildInput;
- function getFileNameFromTitle() {
- const title = svgCanvas.getDocumentTitle(); // We convert (to underscore) only those disallowed Win7 file name characters
+ return regeneratorRuntime.wrap(function _callee5$(_context5) {
+ while (1) {
+ switch (_context5.prev = _context5.next) {
+ case 0:
+ rebuildInput = function _rebuildInput(form) {
+ form.empty();
+ var inp = $('<input type="file" name="svg_file">').appendTo(form);
+ /**
+ * Submit the form, empty its contents for reuse and show
+ * uploading message.
+ * @returns {Promise<void>}
+ */
- return title.trim().replace(/[/\\:*?"<>|]/g, '_');
- }
- /**
- * Escapes XML predefined entities for quoted attributes.
- * @param {string} str
- * @returns {string}
- */
+ function submit() {
+ return _submit.apply(this, arguments);
+ }
+
+ function _submit() {
+ _submit = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee4() {
+ return regeneratorRuntime.wrap(function _callee4$(_context4) {
+ while (1) {
+ switch (_context4.prev = _context4.next) {
+ case 0:
+ // This submits the form, which returns the file data using `svgEditor.processFile()`
+ form.submit();
+ rebuildInput(form);
+ _context4.next = 4;
+ return $.process_cancel(strings.uploading);
+
+ case 4:
+ cancelled = true;
+ $('#dialog_box').hide();
+
+ case 6:
+ case "end":
+ return _context4.stop();
+ }
+ }
+ }, _callee4);
+ }));
+ return _submit.apply(this, arguments);
+ }
+
+ if (form[0] === openSvgForm[0]) {
+ inp.change( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
+ var ok;
+ return regeneratorRuntime.wrap(function _callee2$(_context2) {
+ while (1) {
+ switch (_context2.prev = _context2.next) {
+ case 0:
+ _context2.next = 2;
+ return svgEditor.openPrep();
+
+ case 2:
+ ok = _context2.sent;
+
+ if (ok) {
+ _context2.next = 6;
+ break;
+ }
+
+ rebuildInput(form);
+ return _context2.abrupt("return");
+
+ case 6:
+ _context2.next = 8;
+ return submit();
+
+ case 8:
+ case "end":
+ return _context2.stop();
+ }
+ }
+ }, _callee2);
+ })));
+ } else {
+ inp.change( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
+ return regeneratorRuntime.wrap(function _callee3$(_context3) {
+ while (1) {
+ switch (_context3.prev = _context3.next) {
+ case 0:
+ _context3.next = 2;
+ return submit();
+
+ case 2:
+ case "end":
+ return _context3.stop();
+ }
+ }
+ }, _callee3);
+ })));
+ }
+ };
+
+ clientDownloadSupport = function _clientDownloadSuppor(filename, suffix, uri) {
+ if (avoidClientSide || avoidClientSideDownload) {
+ return false;
+ }
+
+ var support = $('<a>')[0].download === '';
+ var a;
+
+ if (support) {
+ a = $('<a>hidden</a>').attr({
+ download: (filename || 'image') + suffix,
+ href: uri
+ }).css('display', 'none').appendTo('body');
+ a[0].click();
+ return true;
+ }
+
+ return false;
+ };
+
+ xhtmlEscape = function _xhtmlEscape(str) {
+ return str.replace(/&(?!amp;)/g, '&').replace(/"/g, '"').replace(/</g, '<'); // < is actually disallowed above anyways
+ };
+
+ getFileNameFromTitle = function _getFileNameFromTitle() {
+ var title = svgCanvas.getDocumentTitle(); // We convert (to underscore) only those disallowed Win7 file name characters
+
+ return title.trim().replace(/[/\\:*?"<>|]/g, '_');
+ };
+
+ $ = _ref.$, decode64 = _ref.decode64, encode64 = _ref.encode64, importLocale = _ref.importLocale;
+ _context5.next = 7;
+ return importLocale();
+
+ case 7:
+ strings = _context5.sent;
+ svgEditor = _this;
+ _svgEditor$curConfig = svgEditor.curConfig, extPath = _svgEditor$curConfig.extPath, avoidClientSide = _svgEditor$curConfig.avoidClientSide, avoidClientSideDownload = _svgEditor$curConfig.avoidClientSideDownload, avoidClientSideOpen = _svgEditor$curConfig.avoidClientSideOpen, svgCanvas = svgEditor.canvas;
+ /**
+ *
+ * @returns {string}
+ */
+
+ saveSvgAction = extPath + 'filesave.php', saveImgAction = extPath + 'filesave.php'; // Create upload target (hidden iframe)
+
+ cancelled = false; // Hiding by size instead of display to avoid FF console errors
+ // with `getBBox` in browser.js `supportsPathBBox_`)
+
+ $("<iframe name=\"output_frame\" title=\"".concat(strings.hiddenframe, "\"\n style=\"width: 0; height: 0;\" src=\"data:text/html;base64,PGh0bWw+\"/>")).appendTo('body');
+ svgEditor.setCustomHandlers({
+ save: function save(win, data) {
+ var svg = '<?xml version="1.0" encoding="UTF-8"?>\n' + data,
+ // Firefox doesn't seem to know it is UTF-8 (no matter whether we use or skip the clientDownload code) despite the Content-Disposition header containing UTF-8, but adding the encoding works
+ filename = getFileNameFromTitle();
+
+ if (clientDownloadSupport(filename, '.svg', 'data:image/svg+xml;charset=UTF-8;base64,' + encode64(svg))) {
+ return;
+ }
+
+ $('<form>').attr({
+ method: 'post',
+ action: saveSvgAction,
+ target: 'output_frame'
+ }).append("\n <input type=\"hidden\" name=\"output_svg\" value=\"".concat(xhtmlEscape(svg), "\">\n <input type=\"hidden\" name=\"filename\" value=\"").concat(xhtmlEscape(filename), "\">\n ")).appendTo('body').submit().remove();
+ },
+ exportPDF: function exportPDF(win, data) {
+ var filename = getFileNameFromTitle(),
+ datauri = data.output;
+
+ if (clientDownloadSupport(filename, '.pdf', datauri)) {
+ return;
+ }
+
+ $('<form>').attr({
+ method: 'post',
+ action: saveImgAction,
+ target: 'output_frame'
+ }).append("\n <input type=\"hidden\" name=\"output_img\" value=\"".concat(datauri, "\">\n <input type=\"hidden\" name=\"mime\" value=\"application/pdf\">\n <input type=\"hidden\" name=\"filename\" value=\"").concat(xhtmlEscape(filename), "\">\n ")).appendTo('body').submit().remove();
+ },
+ // Todo: Integrate this extension with a new built-in exportWindowType, "download"
+ exportImage: function exportImage(win, data) {
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+ var issues, mimeType, quality, c, datauri, pre, note, filename, suffix;
+ return regeneratorRuntime.wrap(function _callee$(_context) {
+ while (1) {
+ switch (_context.prev = _context.next) {
+ case 0:
+ issues = data.issues, mimeType = data.mimeType, quality = data.quality;
+
+ if (!$('#export_canvas').length) {
+ $('<canvas>', {
+ id: 'export_canvas'
+ }).hide().appendTo('body');
+ }
+
+ c = $('#export_canvas')[0];
+ c.width = svgCanvas.contentW;
+ c.height = svgCanvas.contentH;
+ _context.next = 7;
+ return canvg(c, data.svg);
+
+ case 7:
+ datauri = quality ? c.toDataURL(mimeType, quality) : c.toDataURL(mimeType); // {uiStrings} = svgEditor;
+ // Check if there are issues
+
+ note = '';
+
+ if (issues.length) {
+ pre = "\n \u2022 "; // Bullet
+
+ note += '\n\n' + pre + issues.join(pre);
+ }
+
+ if (!note.length) {
+ _context.next = 13;
+ break;
+ }
+
+ _context.next = 13;
+ return $.alert(note);
+
+ case 13:
+ filename = getFileNameFromTitle();
+ suffix = '.' + data.type.toLowerCase();
+
+ if (!clientDownloadSupport(filename, suffix, datauri)) {
+ _context.next = 17;
+ break;
+ }
+
+ return _context.abrupt("return");
+
+ case 17:
+ $('<form>').attr({
+ method: 'post',
+ action: saveImgAction,
+ target: 'output_frame'
+ }).append("\n <input type=\"hidden\" name=\"output_img\" value=\"".concat(datauri, "\">\n <input type=\"hidden\" name=\"mime\" value=\"").concat(mimeType, "\">\n <input type=\"hidden\" name=\"filename\" value=\"").concat(xhtmlEscape(filename), "\">\n ")).appendTo('body').submit().remove();
+
+ case 18:
+ case "end":
+ return _context.stop();
+ }
+ }
+ }, _callee);
+ }))();
+ }
+ }); // Do nothing if client support is found
+
+ if (!(window.FileReader && !avoidClientSideOpen)) {
+ _context5.next = 16;
+ break;
+ }
+
+ return _context5.abrupt("return");
+
+ case 16:
+ // Change these to appropriate script file
+ openSvgAction = extPath + 'fileopen.php?type=load_svg';
+ importSvgAction = extPath + 'fileopen.php?type=import_svg';
+ importImgAction = extPath + 'fileopen.php?type=import_img'; // Set up function for PHP uploader to use
+
+ svgEditor.processFile = function (str64, type) {
+ var xmlstr;
+
+ if (cancelled) {
+ cancelled = false;
+ return;
+ }
+
+ $('#dialog_box').hide();
+
+ if (type !== 'import_img') {
+ xmlstr = decode64(str64);
+ }
+
+ switch (type) {
+ case 'load_svg':
+ svgCanvas.clear();
+ svgCanvas.setSvgString(xmlstr);
+ svgEditor.updateCanvas();
+ break;
+
+ case 'import_svg':
+ svgCanvas.importSvgString(xmlstr);
+ svgEditor.updateCanvas();
+ break;
+
+ case 'import_img':
+ svgCanvas.setGoodImage(str64);
+ break;
+ }
+ }; // Create upload form
- function xhtmlEscape(str) {
- return str.replace(/&(?!amp;)/g, '&').replace(/"/g, '"').replace(/</g, '<'); // < is actually disallowed above anyways
- }
- /**
- *
- * @param {string} [filename='image']
- * @param {string} suffix To add to file name
- * @param {string} uri
- * @returns {boolean}
- */
+ openSvgForm = $('<form>');
+ openSvgForm.attr({
+ enctype: 'multipart/form-data',
+ method: 'post',
+ action: openSvgAction,
+ target: 'output_frame'
+ }); // Create import form
+ importSvgForm = openSvgForm.clone().attr('action', importSvgAction); // Create image form
- function clientDownloadSupport(filename, suffix, uri) {
- if (avoidClientSide || avoidClientSideDownload) {
- return false;
- }
+ importImgForm = openSvgForm.clone().attr('action', importImgAction); // It appears necessary to rebuild this input every time a file is
+ // selected so the same file can be picked and the change event can fire.
- const support = $('<a>')[0].download === '';
- let a;
+ /**
+ *
+ * @param {external:jQuery} form
+ * @returns {void}
+ */
- if (support) {
- a = $('<a>hidden</a>').attr({
- download: (filename || 'image') + suffix,
- href: uri
- }).css('display', 'none').appendTo('body');
- a[0].click();
- return true;
- }
+ // Create the input elements
+ rebuildInput(openSvgForm);
+ rebuildInput(importSvgForm);
+ rebuildInput(importImgForm); // Add forms to buttons
- return false;
- }
+ $('#tool_open').show().prepend(openSvgForm);
+ $('#tool_import').show().prepend(importSvgForm);
+ $('#tool_image').prepend(importImgForm);
- const saveSvgAction = extPath + 'filesave.php',
- saveImgAction = extPath + 'filesave.php'; // Create upload target (hidden iframe)
-
- let cancelled = false; // Hiding by size instead of display to avoid FF console errors
- // with `getBBox` in browser.js `supportsPathBBox_`)
-
- $(`<iframe name="output_frame" title="${strings.hiddenframe}"
- style="width: 0; height: 0;" src="data:text/html;base64,PGh0bWw+"/>`).appendTo('body');
- svgEditor.setCustomHandlers({
- save(win, data) {
- const svg = '<?xml version="1.0" encoding="UTF-8"?>\n' + data,
- // Firefox doesn't seem to know it is UTF-8 (no matter whether we use or skip the clientDownload code) despite the Content-Disposition header containing UTF-8, but adding the encoding works
- filename = getFileNameFromTitle();
-
- if (clientDownloadSupport(filename, '.svg', 'data:image/svg+xml;charset=UTF-8;base64,' + encode64(svg))) {
- return;
- }
-
- $('<form>').attr({
- method: 'post',
- action: saveSvgAction,
- target: 'output_frame'
- }).append(`
- <input type="hidden" name="output_svg" value="${xhtmlEscape(svg)}">
- <input type="hidden" name="filename" value="${xhtmlEscape(filename)}">
- `).appendTo('body').submit().remove();
- },
-
- exportPDF(win, data) {
- const filename = getFileNameFromTitle(),
- datauri = data.output;
-
- if (clientDownloadSupport(filename, '.pdf', datauri)) {
- return;
- }
-
- $('<form>').attr({
- method: 'post',
- action: saveImgAction,
- target: 'output_frame'
- }).append(`
- <input type="hidden" name="output_img" value="${datauri}">
- <input type="hidden" name="mime" value="application/pdf">
- <input type="hidden" name="filename" value="${xhtmlEscape(filename)}">
- `).appendTo('body').submit().remove();
- },
-
- // Todo: Integrate this extension with a new built-in exportWindowType, "download"
- async exportImage(win, data) {
- const {
- issues,
- mimeType,
- quality
- } = data;
-
- if (!$('#export_canvas').length) {
- $('<canvas>', {
- id: 'export_canvas'
- }).hide().appendTo('body');
- }
-
- const c = $('#export_canvas')[0];
- c.width = svgCanvas.contentW;
- c.height = svgCanvas.contentH;
- await canvg(c, data.svg);
- const datauri = quality ? c.toDataURL(mimeType, quality) : c.toDataURL(mimeType); // {uiStrings} = svgEditor;
- // Check if there are issues
-
- let pre,
- note = '';
-
- if (issues.length) {
- pre = '\n \u2022 '; // Bullet
-
- note += '\n\n' + pre + issues.join(pre);
- }
-
- if (note.length) {
- await $.alert(note);
- }
-
- const filename = getFileNameFromTitle();
- const suffix = '.' + data.type.toLowerCase();
-
- if (clientDownloadSupport(filename, suffix, datauri)) {
- return;
- }
-
- $('<form>').attr({
- method: 'post',
- action: saveImgAction,
- target: 'output_frame'
- }).append(`
- <input type="hidden" name="output_img" value="${datauri}">
- <input type="hidden" name="mime" value="${mimeType}">
- <input type="hidden" name="filename" value="${xhtmlEscape(filename)}">
- `).appendTo('body').submit().remove();
- }
-
- }); // Do nothing if client support is found
-
- if (window.FileReader && !avoidClientSideOpen) {
- return;
- } // Change these to appropriate script file
-
-
- const openSvgAction = extPath + 'fileopen.php?type=load_svg';
- const importSvgAction = extPath + 'fileopen.php?type=import_svg';
- const importImgAction = extPath + 'fileopen.php?type=import_img'; // Set up function for PHP uploader to use
-
- svgEditor.processFile = function (str64, type) {
- let xmlstr;
-
- if (cancelled) {
- cancelled = false;
- return;
- }
-
- $('#dialog_box').hide();
-
- if (type !== 'import_img') {
- xmlstr = decode64(str64);
- }
-
- switch (type) {
- case 'load_svg':
- svgCanvas.clear();
- svgCanvas.setSvgString(xmlstr);
- svgEditor.updateCanvas();
- break;
-
- case 'import_svg':
- svgCanvas.importSvgString(xmlstr);
- svgEditor.updateCanvas();
- break;
-
- case 'import_img':
- svgCanvas.setGoodImage(str64);
- break;
- }
- }; // Create upload form
-
-
- const openSvgForm = $('<form>');
- openSvgForm.attr({
- enctype: 'multipart/form-data',
- method: 'post',
- action: openSvgAction,
- target: 'output_frame'
- }); // Create import form
-
- const importSvgForm = openSvgForm.clone().attr('action', importSvgAction); // Create image form
-
- const importImgForm = openSvgForm.clone().attr('action', importImgAction); // It appears necessary to rebuild this input every time a file is
- // selected so the same file can be picked and the change event can fire.
-
- /**
- *
- * @param {external:jQuery} form
- * @returns {void}
- */
-
- function rebuildInput(form) {
- form.empty();
- const inp = $('<input type="file" name="svg_file">').appendTo(form);
- /**
- * Submit the form, empty its contents for reuse and show
- * uploading message.
- * @returns {Promise<void>}
- */
-
- async function submit() {
- // This submits the form, which returns the file data using `svgEditor.processFile()`
- form.submit();
- rebuildInput(form);
- await $.process_cancel(strings.uploading);
- cancelled = true;
- $('#dialog_box').hide();
- }
-
- if (form[0] === openSvgForm[0]) {
- inp.change(async function () {
- // This takes care of the "are you sure" dialog box
- const ok = await svgEditor.openPrep();
-
- if (!ok) {
- rebuildInput(form);
- return;
+ case 30:
+ case "end":
+ return _context5.stop();
}
-
- await submit();
- });
- } else {
- inp.change(async function () {
- // This submits the form, which returns the file data using svgEditor.processFile()
- await submit();
- });
- }
- } // Create the input elements
-
-
- rebuildInput(openSvgForm);
- rebuildInput(importSvgForm);
- rebuildInput(importImgForm); // Add forms to buttons
-
- $('#tool_open').show().prepend(openSvgForm);
- $('#tool_import').show().prepend(importSvgForm);
- $('#tool_image').prepend(importImgForm);
+ }
+ }, _callee5);
+ }))();
}
-
};
return extServer_opensave;
diff --git a/dist/extensions/ext-shapes.js b/dist/extensions/ext-shapes.js
index e9a08896..d77be0ed 100644
--- a/dist/extensions/ext-shapes.js
+++ b/dist/extensions/ext-shapes.js
@@ -1,6 +1,98 @@
var svgEditorExtension_shapes = (function () {
'use strict';
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+ try {
+ var info = gen[key](arg);
+ var value = info.value;
+ } catch (error) {
+ reject(error);
+ return;
+ }
+
+ if (info.done) {
+ resolve(value);
+ } else {
+ Promise.resolve(value).then(_next, _throw);
+ }
+ }
+
+ function _asyncToGenerator(fn) {
+ return function () {
+ var self = this,
+ args = arguments;
+ return new Promise(function (resolve, reject) {
+ var gen = fn.apply(self, args);
+
+ function _next(value) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+ }
+
+ function _throw(err) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+ }
+
+ _next(undefined);
+ });
+ };
+ }
+
+ function _slicedToArray(arr, i) {
+ return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+ }
+
+ function _arrayWithHoles(arr) {
+ if (Array.isArray(arr)) return arr;
+ }
+
+ function _iterableToArrayLimit(arr, i) {
+ if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
+ var _arr = [];
+ var _n = true;
+ var _d = false;
+ var _e = undefined;
+
+ try {
+ for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
+ _arr.push(_s.value);
+
+ if (i && _arr.length === i) break;
+ }
+ } catch (err) {
+ _d = true;
+ _e = err;
+ } finally {
+ try {
+ if (!_n && _i["return"] != null) _i["return"]();
+ } finally {
+ if (_d) throw _e;
+ }
+ }
+
+ return _arr;
+ }
+
+ function _unsupportedIterableToArray(o, minLen) {
+ if (!o) return;
+ if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+ var n = Object.prototype.toString.call(o).slice(8, -1);
+ if (n === "Object" && o.constructor) n = o.constructor.name;
+ if (n === "Map" || n === "Set") return Array.from(o);
+ if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+ }
+
+ function _arrayLikeToArray(arr, len) {
+ if (len == null || len > arr.length) len = arr.length;
+
+ for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+
+ return arr2;
+ }
+
+ function _nonIterableRest() {
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+ }
+
/**
* @file ext-shapes.js
*
@@ -11,365 +103,337 @@ var svgEditorExtension_shapes = (function () {
*/
var extShapes = {
name: 'shapes',
+ init: function init(_ref) {
+ var _this = this;
- async init({
- $,
- importLocale
- }) {
- const strings = await importLocale();
- const svgEditor = this;
- const canv = svgEditor.canvas;
- const svgroot = canv.getRootElem();
- let lastBBox = {}; // This populates the category list
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+ var $, importLocale, strings, svgEditor, canv, svgroot, lastBBox, categories, library, modeId, startClientPos, currentD, curShapeId, curShape, startX, startY, curLib, loadIcons, makeButtons, loadLibrary, buttons;
+ return regeneratorRuntime.wrap(function _callee$(_context) {
+ while (1) {
+ switch (_context.prev = _context.next) {
+ case 0:
+ loadLibrary = function _loadLibrary(catId) {
+ var lib = library[catId];
- const {
- categories
- } = strings;
- const library = {
- basic: {
- data: {
- heart: 'm150,73c61,-175 300,0 0,225c-300,-225 -61,-400 0,-225z',
- frame: 'm0,0l300,0l0,300l-300,0zm35,-265l0,230l230,0l0,-230z',
- donut: 'm1,150l0,0c0,-82.29042 66.70958,-149 149,-149l0,0c39.51724,0 77.41599,15.69816 105.35889,43.64108c27.94293,27.94293 43.64111,65.84165 43.64111,105.35892l0,0c0,82.29041 -66.70958,149 -149,149l0,0c-82.29041,0 -149,-66.70959 -149,-149zm74.5,0l0,0c0,41.1452 33.35481,74.5 74.5,74.5c41.14522,0 74.5,-33.3548 74.5,-74.5c0,-41.1452 -33.3548,-74.5 -74.5,-74.5l0,0c-41.14519,0 -74.5,33.35481 -74.5,74.5z',
- triangle: 'm1,280.375l149,-260.75l149,260.75z',
- right_triangle: 'm1,299l0,-298l298,298z',
- diamond: 'm1,150l149,-149l149,149l-149,149l-149,-149z',
- pentagon: 'm1.00035,116.97758l148.99963,-108.4053l148.99998,108.4053l-56.91267,175.4042l-184.1741,0l-56.91284,-175.4042z',
- hexagon: 'm1,149.99944l63.85715,-127.71428l170.28572,0l63.85713,127.71428l-63.85713,127.71428l-170.28572,0l-63.85715,-127.71428z',
- septagon1: 'm0.99917,191.06511l29.51249,-127.7108l119.48833,-56.83673l119.48836,56.83673l29.51303,127.7108l-82.69087,102.41679l-132.62103,0l-82.69031,-102.41679z',
- heptagon: 'm1,88.28171l87.28172,-87.28171l123.43653,0l87.28172,87.28171l0,123.43654l-87.28172,87.28172l-123.43653,0l-87.28172,-87.28172l0,-123.43654z',
- decagon: 'm1,150.00093l28.45646,-88.40318l74.49956,-54.63682l92.08794,0l74.50002,54.63682l28.45599,88.40318l-28.45599,88.40318l-74.50002,54.63681l-92.08794,0l-74.49956,-54.63681l-28.45646,-88.40318z',
- dodecagon: 'm1,110.07421l39.92579,-69.14842l69.14842,-39.92579l79.85159,0l69.14842,39.92579l39.92578,69.14842l0,79.85159l-39.92578,69.14842l-69.14842,39.92578l-79.85159,0l-69.14842,-39.92578l-39.92579,-69.14842l0,-79.85159z',
- star_points_5: 'm1,116.58409l113.82668,0l35.17332,-108.13487l35.17334,108.13487l113.82666,0l-92.08755,66.83026l35.17514,108.13487l-92.08759,-66.83208l-92.08757,66.83208l35.17515,-108.13487l-92.08758,-66.83026z',
- trapezoid: 'm1,299l55.875,-298l186.25001,0l55.87498,298z',
- arrow_up: 'm1.49805,149.64304l148.50121,-148.00241l148.50121,148.00241l-74.25061,0l0,148.71457l-148.5012,0l0,-148.71457z',
- vertical_scrool: 'm37.375,261.625l0,-242.9375l0,0c0,-10.32083 8.36669,-18.6875 18.6875,-18.6875l224.25,0c10.32083,0 18.6875,8.36667 18.6875,18.6875c0,10.32081 -8.36667,18.6875 -18.6875,18.6875l-18.6875,0l0,242.9375c0,10.32083 -8.36668,18.6875 -18.6875,18.6875l-224.25,0l0,0c-10.32083,0 -18.6875,-8.36667 -18.6875,-18.6875c0,-10.32083 8.36667,-18.6875 18.6875,-18.6875zm37.375,-261.625l0,0c10.32081,0 18.6875,8.36667 18.6875,18.6875c0,10.32081 -8.36669,18.6875 -18.6875,18.6875c-5.1604,0 -9.34375,-4.18335 -9.34375,-9.34375c0,-5.16041 4.18335,-9.34375 9.34375,-9.34375l18.6875,0m186.875,18.6875l-205.5625,0m-37.375,224.25l0,0c5.1604,0 9.34375,4.18335 9.34375,9.34375c0,5.1604 -4.18335,9.34375 -9.34375,9.34375l18.6875,0m-18.6875,18.6875l0,0c10.32081,0 18.6875,-8.36667 18.6875,-18.6875l0,-18.6875',
- smiley: 'm68.49886,214.78838q81.06408,55.67332 161.93891,0m-144.36983,-109.9558c0,-8.60432 6.97517,-15.57949 15.57948,-15.57949c8.60431,0 15.57948,6.97517 15.57948,15.57949c0,8.60431 -6.97517,15.57947 -15.57948,15.57947c-8.60431,0 -15.57948,-6.97516 -15.57948,-15.57947m95.83109,0c0,-8.60432 6.97517,-15.57949 15.57948,-15.57949c8.60431,0 15.57947,6.97517 15.57947,15.57949c0,8.60431 -6.97516,15.57947 -15.57947,15.57947c-8.60429,0 -15.57948,-6.97516 -15.57948,-15.57947m-181.89903,44.73038l0,0c0,-82.60133 66.96162,-149.56296 149.56296,-149.56296c82.60135,0 149.56296,66.96162 149.56296,149.56296c0,82.60135 -66.96161,149.56296 -149.56296,149.56296c-82.60133,0 -149.56296,-66.96161 -149.56296,-149.56296zm0,0l0,0c0,-82.60133 66.96162,-149.56296 149.56296,-149.56296c82.60135,0 149.56296,66.96162 149.56296,149.56296c0,82.60135 -66.96161,149.56296 -149.56296,149.56296c-82.60133,0 -149.56296,-66.96161 -149.56296,-149.56296z',
- left_braket: 'm174.24565,298.5c-13.39009,0 -24.24489,-1.80908 -24.24489,-4.04065l0,-140.4187c0,-2.23158 -10.85481,-4.04065 -24.2449,-4.04065l0,0c13.39009,0 24.2449,-1.80907 24.2449,-4.04065l0,-140.4187l0,0c0,-2.23159 10.8548,-4.04066 24.24489,-4.04066',
- uml_actor: 'm40.5,100l219,0m-108.99991,94.00006l107,105m-107.00009,-106.00006l-100,106m99.5,-231l0,125m33.24219,-158.75781c0,18.35916 -14.88303,33.24219 -33.24219,33.24219c-18.35916,0 -33.2422,-14.88303 -33.2422,-33.24219c0.00002,-18.35915 14.88304,-33.24219 33.2422,-33.24219c18.35916,0 33.24219,14.88304 33.24219,33.24219z',
- dialog_balloon_1: 'm0.99786,35.96579l0,0c0,-19.31077 15.28761,-34.96524 34.14583,-34.96524l15.52084,0l0,0l74.50001,0l139.68748,0c9.05606,0 17.74118,3.68382 24.14478,10.24108c6.40356,6.55726 10.00107,15.45081 10.00107,24.72416l0,87.41311l0,0l0,52.44785l0,0c0,19.31078 -15.2876,34.96524 -34.14584,34.96524l-139.68748,0l-97.32507,88.90848l22.82506,-88.90848l-15.52084,0c-18.85822,0 -34.14583,-15.65446 -34.14583,-34.96524l0,0l0,-52.44785l0,0z',
- cloud: 'm182.05086,34.31005c-0.64743,0.02048 -1.27309,0.07504 -1.92319,0.13979c-10.40161,1.03605 -19.58215,7.63722 -24.24597,17.4734l-2.47269,7.44367c0.53346,-2.57959 1.35258,-5.08134 2.47269,-7.44367c-8.31731,-8.61741 -19.99149,-12.59487 -31.52664,-10.72866c-11.53516,1.8662 -21.55294,9.3505 -27.02773,20.19925c-15.45544,-9.51897 -34.72095,-8.94245 -49.62526,1.50272c-14.90431,10.44516 -22.84828,28.93916 -20.43393,47.59753l1.57977,7.58346c-0.71388,-2.48442 -1.24701,-5.01186 -1.57977,-7.58346l-0.2404,0.69894c-12.95573,1.4119 -23.58103,11.46413 -26.34088,24.91708c-2.75985,13.45294 2.9789,27.25658 14.21789,34.21291l17.54914,4.26352c-6.1277,0.50439 -12.24542,-0.9808 -17.54914,-4.26352c-8.66903,9.71078 -10.6639,24.08736 -4.94535,35.96027c5.71854,11.87289 17.93128,18.70935 30.53069,17.15887l7.65843,-2.02692c-2.46413,1.0314 -5.02329,1.70264 -7.65843,2.02692c7.15259,13.16728 19.01251,22.77237 32.93468,26.5945c13.92217,3.82214 28.70987,1.56322 41.03957,-6.25546c10.05858,15.86252 27.91113,24.19412 45.81322,21.38742c17.90208,-2.8067 32.66954,-16.26563 37.91438,-34.52742l1.82016,-10.20447c-0.27254,3.46677 -0.86394,6.87508 -1.82016,10.20447c12.31329,8.07489 27.80199,8.52994 40.52443,1.18819c12.72244,-7.34175 20.6609,-21.34155 20.77736,-36.58929l-4.56108,-22.7823l-17.96776,-15.41455c13.89359,8.70317 22.6528,21.96329 22.52884,38.19685c16.5202,0.17313 30.55292,-13.98268 36.84976,-30.22897c6.29684,-16.24631 3.91486,-34.76801 -6.2504,-48.68089c4.21637,-10.35873 3.96622,-22.14172 -0.68683,-32.29084c-4.65308,-10.14912 -13.23602,-17.69244 -23.55914,-20.65356c-2.31018,-13.45141 -11.83276,-24.27162 -24.41768,-27.81765c-12.58492,-3.54603 -25.98557,0.82654 -34.41142,11.25287l-5.11707,8.63186c1.30753,-3.12148 3.01521,-6.03101 5.11707,-8.63186c-5.93959,-8.19432 -15.2556,-12.8181 -24.96718,-12.51096z',
- cylinder: 'm299.0007,83.77844c0,18.28676 -66.70958,33.11111 -149.00002,33.11111m149.00002,-33.11111l0,0c0,18.28676 -66.70958,33.11111 -149.00002,33.11111c-82.29041,0 -148.99997,-14.82432 -148.99997,-33.11111m0,0l0,0c0,-18.28674 66.70956,-33.1111 148.99997,-33.1111c82.29044,0 149.00002,14.82436 149.00002,33.1111l0,132.44449c0,18.28674 -66.70958,33.11105 -149.00002,33.11105c-82.29041,0 -148.99997,-14.82431 -148.99997,-33.11105z',
- arrow_u_turn: 'm1.00059,299.00055l0,-167.62497l0,0c0,-72.00411 58.37087,-130.37499 130.375,-130.37499l0,0l0,0c34.57759,0 67.73898,13.7359 92.18906,38.18595c24.45006,24.45005 38.18593,57.61144 38.18593,92.18904l0,18.625l37.24997,0l-74.49995,74.50002l-74.50002,-74.50002l37.25,0l0,-18.625c0,-30.8589 -25.0161,-55.87498 -55.87498,-55.87498l0,0l0,0c-30.85892,0 -55.875,25.01608 -55.875,55.87498l0,167.62497z',
- arrow_left_up: 'm0.99865,224.5l74.50004,-74.5l0,37.25l111.74991,0l0,-111.75l-37.25,0l74.5,-74.5l74.5,74.5l-37.25,0l0,186.25l-186.24989,0l0,37.25l-74.50005,-74.5z',
- maximize: 'm1.00037,150.34581l55.30305,-55.30267l0,27.65093l22.17356,0l0,-44.21833l44.21825,0l0,-22.17357l-27.65095,0l55.30267,-55.30292l55.3035,55.30292l-27.65175,0l0,22.17357l44.21835,0l0,44.21833l22.17357,0l0,-27.65093l55.30345,55.30267l-55.30345,55.3035l0,-27.65175l-22.17357,0l0,44.21834l-44.21835,0l0,22.17355l27.65175,0l-55.3035,55.30348l-55.30267,-55.30348l27.65095,0l0,-22.17355l-44.21825,0l0,-44.21834l-22.17356,0l0,27.65175l-55.30305,-55.3035z',
- cross: 'm0.99844,99.71339l98.71494,0l0,-98.71495l101.26279,0l0,98.71495l98.71495,0l0,101.2628l-98.71495,0l0,98.71494l-101.26279,0l0,-98.71494l-98.71494,0z',
- plaque: 'm-0.00197,49.94376l0,0c27.5829,0 49.94327,-22.36036 49.94327,-49.94327l199.76709,0l0,0c0,27.5829 22.36037,49.94327 49.94325,49.94327l0,199.7671l0,0c-27.58289,0 -49.94325,22.36034 -49.94325,49.94325l-199.76709,0c0,-27.58292 -22.36037,-49.94325 -49.94327,-49.94325z',
- page: 'm249.3298,298.99744l9.9335,-39.73413l39.73413,-9.93355l-49.66763,49.66768l-248.33237,0l0,-298.00001l298.00001,0l0,248.33234'
- },
- buttons: []
- }
- };
- const modeId = 'shapelib';
- const startClientPos = {};
- let currentD, curShapeId, curShape, startX, startY;
- let curLib = library.basic;
- /**
- *
- * @returns {void}
- */
+ if (!lib) {
+ $('#shape_buttons').html(strings.loading);
+ $.getJSON(svgEditor.curConfig.extIconsPath + 'shapelib/' + catId + '.json', function (result) {
+ curLib = library[catId] = {
+ data: result.data,
+ size: result.size,
+ fill: result.fill
+ };
+ makeButtons(catId, result);
+ loadIcons();
+ });
+ return;
+ }
- function loadIcons() {
- $('#shape_buttons').empty().append(curLib.buttons);
- }
- /**
- * @typedef {PlainObject} module:Extension.Shapes.Shapes
- * @property {PlainObject<string, string>} data
- * @property {Integer} [size]
- * @property {boolean} [fill]
- */
+ curLib = lib;
- /**
- * @param {string|"basic"} cat Category ID
- * @param {module:Extension.Shapes.Shapes} shapes
- * @returns {void}
- */
+ if (!lib.buttons.length) {
+ makeButtons(catId, lib);
+ }
+
+ loadIcons();
+ };
+
+ makeButtons = function _makeButtons(cat, shapes) {
+ var size = curLib.size || 300;
+ var fill = curLib.fill || false;
+ var off = size * 0.05;
+ var vb = [-off, -off, size + off * 2, size + off * 2].join(' ');
+ var stroke = fill ? 0 : size / 30;
+ var shapeIcon = new DOMParser().parseFromString('<svg xmlns="http://www.w3.org/2000/svg">' + '<svg viewBox="' + vb + '">' + '<path fill="' + (fill ? '#333' : 'none') + '" stroke="#000" stroke-width="' + stroke + '" /></svg></svg>', 'text/xml');
+ var width = 24;
+ var height = 24;
+ shapeIcon.documentElement.setAttribute('width', width);
+ shapeIcon.documentElement.setAttribute('height', height);
+ var svgElem = $(document.importNode(shapeIcon.documentElement, true));
+ var data = shapes.data;
+ curLib.buttons = Object.entries(data).map(function (_ref2) {
+ var _ref3 = _slicedToArray(_ref2, 2),
+ id = _ref3[0],
+ pathD = _ref3[1];
+
+ var icon = svgElem.clone();
+ icon.find('path').attr('d', pathD);
+ var iconBtn = icon.wrap('<div class="tool_button">').parent().attr({
+ id: modeId + '_' + id,
+ title: id
+ }); // Store for later use
+
+ return iconBtn[0];
+ });
+ };
+
+ loadIcons = function _loadIcons() {
+ $('#shape_buttons').empty().append(curLib.buttons);
+ };
+
+ $ = _ref.$, importLocale = _ref.importLocale;
+ _context.next = 6;
+ return importLocale();
+
+ case 6:
+ strings = _context.sent;
+ svgEditor = _this;
+ canv = svgEditor.canvas;
+ svgroot = canv.getRootElem();
+ lastBBox = {}; // This populates the category list
+
+ categories = strings.categories;
+ /* eslint-disable max-len */
+
+ library = {
+ basic: {
+ data: {
+ heart: 'm150,73c61,-175 300,0 0,225c-300,-225 -61,-400 0,-225z',
+ frame: 'm0,0l300,0l0,300l-300,0zm35,-265l0,230l230,0l0,-230z',
+ donut: 'm1,150l0,0c0,-82.29042 66.70958,-149 149,-149l0,0c39.51724,0 77.41599,15.69816 105.35889,43.64108c27.94293,27.94293 43.64111,65.84165 43.64111,105.35892l0,0c0,82.29041 -66.70958,149 -149,149l0,0c-82.29041,0 -149,-66.70959 -149,-149zm74.5,0l0,0c0,41.1452 33.35481,74.5 74.5,74.5c41.14522,0 74.5,-33.3548 74.5,-74.5c0,-41.1452 -33.3548,-74.5 -74.5,-74.5l0,0c-41.14519,0 -74.5,33.35481 -74.5,74.5z',
+ triangle: 'm1,280.375l149,-260.75l149,260.75z',
+ right_triangle: 'm1,299l0,-298l298,298z',
+ diamond: 'm1,150l149,-149l149,149l-149,149l-149,-149z',
+ pentagon: 'm1.00035,116.97758l148.99963,-108.4053l148.99998,108.4053l-56.91267,175.4042l-184.1741,0l-56.91284,-175.4042z',
+ hexagon: 'm1,149.99944l63.85715,-127.71428l170.28572,0l63.85713,127.71428l-63.85713,127.71428l-170.28572,0l-63.85715,-127.71428z',
+ septagon1: 'm0.99917,191.06511l29.51249,-127.7108l119.48833,-56.83673l119.48836,56.83673l29.51303,127.7108l-82.69087,102.41679l-132.62103,0l-82.69031,-102.41679z',
+ heptagon: 'm1,88.28171l87.28172,-87.28171l123.43653,0l87.28172,87.28171l0,123.43654l-87.28172,87.28172l-123.43653,0l-87.28172,-87.28172l0,-123.43654z',
+ decagon: 'm1,150.00093l28.45646,-88.40318l74.49956,-54.63682l92.08794,0l74.50002,54.63682l28.45599,88.40318l-28.45599,88.40318l-74.50002,54.63681l-92.08794,0l-74.49956,-54.63681l-28.45646,-88.40318z',
+ dodecagon: 'm1,110.07421l39.92579,-69.14842l69.14842,-39.92579l79.85159,0l69.14842,39.92579l39.92578,69.14842l0,79.85159l-39.92578,69.14842l-69.14842,39.92578l-79.85159,0l-69.14842,-39.92578l-39.92579,-69.14842l0,-79.85159z',
+ star_points_5: 'm1,116.58409l113.82668,0l35.17332,-108.13487l35.17334,108.13487l113.82666,0l-92.08755,66.83026l35.17514,108.13487l-92.08759,-66.83208l-92.08757,66.83208l35.17515,-108.13487l-92.08758,-66.83026z',
+ trapezoid: 'm1,299l55.875,-298l186.25001,0l55.87498,298z',
+ arrow_up: 'm1.49805,149.64304l148.50121,-148.00241l148.50121,148.00241l-74.25061,0l0,148.71457l-148.5012,0l0,-148.71457z',
+ vertical_scrool: 'm37.375,261.625l0,-242.9375l0,0c0,-10.32083 8.36669,-18.6875 18.6875,-18.6875l224.25,0c10.32083,0 18.6875,8.36667 18.6875,18.6875c0,10.32081 -8.36667,18.6875 -18.6875,18.6875l-18.6875,0l0,242.9375c0,10.32083 -8.36668,18.6875 -18.6875,18.6875l-224.25,0l0,0c-10.32083,0 -18.6875,-8.36667 -18.6875,-18.6875c0,-10.32083 8.36667,-18.6875 18.6875,-18.6875zm37.375,-261.625l0,0c10.32081,0 18.6875,8.36667 18.6875,18.6875c0,10.32081 -8.36669,18.6875 -18.6875,18.6875c-5.1604,0 -9.34375,-4.18335 -9.34375,-9.34375c0,-5.16041 4.18335,-9.34375 9.34375,-9.34375l18.6875,0m186.875,18.6875l-205.5625,0m-37.375,224.25l0,0c5.1604,0 9.34375,4.18335 9.34375,9.34375c0,5.1604 -4.18335,9.34375 -9.34375,9.34375l18.6875,0m-18.6875,18.6875l0,0c10.32081,0 18.6875,-8.36667 18.6875,-18.6875l0,-18.6875',
+ smiley: 'm68.49886,214.78838q81.06408,55.67332 161.93891,0m-144.36983,-109.9558c0,-8.60432 6.97517,-15.57949 15.57948,-15.57949c8.60431,0 15.57948,6.97517 15.57948,15.57949c0,8.60431 -6.97517,15.57947 -15.57948,15.57947c-8.60431,0 -15.57948,-6.97516 -15.57948,-15.57947m95.83109,0c0,-8.60432 6.97517,-15.57949 15.57948,-15.57949c8.60431,0 15.57947,6.97517 15.57947,15.57949c0,8.60431 -6.97516,15.57947 -15.57947,15.57947c-8.60429,0 -15.57948,-6.97516 -15.57948,-15.57947m-181.89903,44.73038l0,0c0,-82.60133 66.96162,-149.56296 149.56296,-149.56296c82.60135,0 149.56296,66.96162 149.56296,149.56296c0,82.60135 -66.96161,149.56296 -149.56296,149.56296c-82.60133,0 -149.56296,-66.96161 -149.56296,-149.56296zm0,0l0,0c0,-82.60133 66.96162,-149.56296 149.56296,-149.56296c82.60135,0 149.56296,66.96162 149.56296,149.56296c0,82.60135 -66.96161,149.56296 -149.56296,149.56296c-82.60133,0 -149.56296,-66.96161 -149.56296,-149.56296z',
+ left_braket: 'm174.24565,298.5c-13.39009,0 -24.24489,-1.80908 -24.24489,-4.04065l0,-140.4187c0,-2.23158 -10.85481,-4.04065 -24.2449,-4.04065l0,0c13.39009,0 24.2449,-1.80907 24.2449,-4.04065l0,-140.4187l0,0c0,-2.23159 10.8548,-4.04066 24.24489,-4.04066',
+ uml_actor: 'm40.5,100l219,0m-108.99991,94.00006l107,105m-107.00009,-106.00006l-100,106m99.5,-231l0,125m33.24219,-158.75781c0,18.35916 -14.88303,33.24219 -33.24219,33.24219c-18.35916,0 -33.2422,-14.88303 -33.2422,-33.24219c0.00002,-18.35915 14.88304,-33.24219 33.2422,-33.24219c18.35916,0 33.24219,14.88304 33.24219,33.24219z',
+ dialog_balloon_1: 'm0.99786,35.96579l0,0c0,-19.31077 15.28761,-34.96524 34.14583,-34.96524l15.52084,0l0,0l74.50001,0l139.68748,0c9.05606,0 17.74118,3.68382 24.14478,10.24108c6.40356,6.55726 10.00107,15.45081 10.00107,24.72416l0,87.41311l0,0l0,52.44785l0,0c0,19.31078 -15.2876,34.96524 -34.14584,34.96524l-139.68748,0l-97.32507,88.90848l22.82506,-88.90848l-15.52084,0c-18.85822,0 -34.14583,-15.65446 -34.14583,-34.96524l0,0l0,-52.44785l0,0z',
+ cloud: 'm182.05086,34.31005c-0.64743,0.02048 -1.27309,0.07504 -1.92319,0.13979c-10.40161,1.03605 -19.58215,7.63722 -24.24597,17.4734l-2.47269,7.44367c0.53346,-2.57959 1.35258,-5.08134 2.47269,-7.44367c-8.31731,-8.61741 -19.99149,-12.59487 -31.52664,-10.72866c-11.53516,1.8662 -21.55294,9.3505 -27.02773,20.19925c-15.45544,-9.51897 -34.72095,-8.94245 -49.62526,1.50272c-14.90431,10.44516 -22.84828,28.93916 -20.43393,47.59753l1.57977,7.58346c-0.71388,-2.48442 -1.24701,-5.01186 -1.57977,-7.58346l-0.2404,0.69894c-12.95573,1.4119 -23.58103,11.46413 -26.34088,24.91708c-2.75985,13.45294 2.9789,27.25658 14.21789,34.21291l17.54914,4.26352c-6.1277,0.50439 -12.24542,-0.9808 -17.54914,-4.26352c-8.66903,9.71078 -10.6639,24.08736 -4.94535,35.96027c5.71854,11.87289 17.93128,18.70935 30.53069,17.15887l7.65843,-2.02692c-2.46413,1.0314 -5.02329,1.70264 -7.65843,2.02692c7.15259,13.16728 19.01251,22.77237 32.93468,26.5945c13.92217,3.82214 28.70987,1.56322 41.03957,-6.25546c10.05858,15.86252 27.91113,24.19412 45.81322,21.38742c17.90208,-2.8067 32.66954,-16.26563 37.91438,-34.52742l1.82016,-10.20447c-0.27254,3.46677 -0.86394,6.87508 -1.82016,10.20447c12.31329,8.07489 27.80199,8.52994 40.52443,1.18819c12.72244,-7.34175 20.6609,-21.34155 20.77736,-36.58929l-4.56108,-22.7823l-17.96776,-15.41455c13.89359,8.70317 22.6528,21.96329 22.52884,38.19685c16.5202,0.17313 30.55292,-13.98268 36.84976,-30.22897c6.29684,-16.24631 3.91486,-34.76801 -6.2504,-48.68089c4.21637,-10.35873 3.96622,-22.14172 -0.68683,-32.29084c-4.65308,-10.14912 -13.23602,-17.69244 -23.55914,-20.65356c-2.31018,-13.45141 -11.83276,-24.27162 -24.41768,-27.81765c-12.58492,-3.54603 -25.98557,0.82654 -34.41142,11.25287l-5.11707,8.63186c1.30753,-3.12148 3.01521,-6.03101 5.11707,-8.63186c-5.93959,-8.19432 -15.2556,-12.8181 -24.96718,-12.51096z',
+ cylinder: 'm299.0007,83.77844c0,18.28676 -66.70958,33.11111 -149.00002,33.11111m149.00002,-33.11111l0,0c0,18.28676 -66.70958,33.11111 -149.00002,33.11111c-82.29041,0 -148.99997,-14.82432 -148.99997,-33.11111m0,0l0,0c0,-18.28674 66.70956,-33.1111 148.99997,-33.1111c82.29044,0 149.00002,14.82436 149.00002,33.1111l0,132.44449c0,18.28674 -66.70958,33.11105 -149.00002,33.11105c-82.29041,0 -148.99997,-14.82431 -148.99997,-33.11105z',
+ arrow_u_turn: 'm1.00059,299.00055l0,-167.62497l0,0c0,-72.00411 58.37087,-130.37499 130.375,-130.37499l0,0l0,0c34.57759,0 67.73898,13.7359 92.18906,38.18595c24.45006,24.45005 38.18593,57.61144 38.18593,92.18904l0,18.625l37.24997,0l-74.49995,74.50002l-74.50002,-74.50002l37.25,0l0,-18.625c0,-30.8589 -25.0161,-55.87498 -55.87498,-55.87498l0,0l0,0c-30.85892,0 -55.875,25.01608 -55.875,55.87498l0,167.62497z',
+ arrow_left_up: 'm0.99865,224.5l74.50004,-74.5l0,37.25l111.74991,0l0,-111.75l-37.25,0l74.5,-74.5l74.5,74.5l-37.25,0l0,186.25l-186.24989,0l0,37.25l-74.50005,-74.5z',
+ maximize: 'm1.00037,150.34581l55.30305,-55.30267l0,27.65093l22.17356,0l0,-44.21833l44.21825,0l0,-22.17357l-27.65095,0l55.30267,-55.30292l55.3035,55.30292l-27.65175,0l0,22.17357l44.21835,0l0,44.21833l22.17357,0l0,-27.65093l55.30345,55.30267l-55.30345,55.3035l0,-27.65175l-22.17357,0l0,44.21834l-44.21835,0l0,22.17355l27.65175,0l-55.3035,55.30348l-55.30267,-55.30348l27.65095,0l0,-22.17355l-44.21825,0l0,-44.21834l-22.17356,0l0,27.65175l-55.30305,-55.3035z',
+ cross: 'm0.99844,99.71339l98.71494,0l0,-98.71495l101.26279,0l0,98.71495l98.71495,0l0,101.2628l-98.71495,0l0,98.71494l-101.26279,0l0,-98.71494l-98.71494,0z',
+ plaque: 'm-0.00197,49.94376l0,0c27.5829,0 49.94327,-22.36036 49.94327,-49.94327l199.76709,0l0,0c0,27.5829 22.36037,49.94327 49.94325,49.94327l0,199.7671l0,0c-27.58289,0 -49.94325,22.36034 -49.94325,49.94325l-199.76709,0c0,-27.58292 -22.36037,-49.94325 -49.94327,-49.94325z',
+ page: 'm249.3298,298.99744l9.9335,-39.73413l39.73413,-9.93355l-49.66763,49.66768l-248.33237,0l0,-298.00001l298.00001,0l0,248.33234'
+ },
+ buttons: []
+ }
+ };
+ /* eslint-enable max-len */
+
+ modeId = 'shapelib';
+ startClientPos = {};
+ curLib = library.basic;
+ /**
+ *
+ * @returns {void}
+ */
+
+ buttons = [{
+ id: 'tool_shapelib',
+ icon: svgEditor.curConfig.extIconsPath + 'shapes.png',
+ type: 'mode_flyout',
+ // _flyout
+ position: 6,
+ events: {
+ click: function click() {
+ canv.setMode(modeId);
+ }
+ }
+ }];
+ return _context.abrupt("return", {
+ svgicons: svgEditor.curConfig.extIconsPath + 'ext-shapes.xml',
+ buttons: strings.buttons.map(function (button, i) {
+ return Object.assign(buttons[i], button);
+ }),
+ callback: function callback() {
+ $('<style>').text("\n #shape_buttons {\n overflow: auto;\n width: 180px;\n max-height: 300px;\n display: table-cell;\n vertical-align: middle;\n }\n #shape_cats {\n min-width: 110px;\n display: table-cell;\n vertical-align: middle;\n height: 300px;\n }\n #shape_cats > div {\n line-height: 1em;\n padding: .5em;\n border:1px solid #B0B0B0;\n background: #E8E8E8;\n margin-bottom: -1px;\n }\n #shape_cats div:hover {\n background: #FFFFCC;\n }\n #shape_cats div.current {\n font-weight: bold;\n }\n ").appendTo('head');
+ var btnDiv = $('<div id="shape_buttons">');
+ $('#tools_shapelib > *').wrapAll(btnDiv);
+ var shower = $('#tools_shapelib_show');
+ loadLibrary('basic'); // Do mouseup on parent element rather than each button
+
+ $('#shape_buttons').mouseup(function (evt) {
+ var btn = $(evt.target).closest('div.tool_button');
+
+ if (!btn.length) {
+ return;
+ }
+
+ var copy = btn.children().clone();
+ shower.children(':not(.flyout_arrow_horiz)').remove();
+ shower.append(copy).attr('data-curopt', '#' + btn[0].id) // This sets the current mode
+ .mouseup();
+ canv.setMode(modeId);
+ curShapeId = btn[0].id.substr((modeId + '_').length);
+ currentD = curLib.data[curShapeId];
+ $('.tools_flyout').fadeOut();
+ });
+ var shapeCats = $('<div id="shape_cats">');
+ var catStr = '';
+ $.each(categories, function (id, label) {
+ catStr += '<div data-cat=' + id + '>' + label + '</div>';
+ });
+ shapeCats.html(catStr).children().bind('mouseup', function () {
+ var catlink = $(this);
+ catlink.siblings().removeClass('current');
+ catlink.addClass('current');
+ loadLibrary(catlink.attr('data-cat')); // Get stuff
+
+ return false;
+ });
+ shapeCats.children().eq(0).addClass('current');
+ $('#tools_shapelib').append(shapeCats);
+ shower.mouseup(function () {
+ canv.setMode(currentD ? modeId : 'select');
+ });
+ $('#tool_shapelib').remove();
+ var h = $('#tools_shapelib').height();
+ $('#tools_shapelib').css({
+ 'margin-top': -(h / 2 - 15),
+ 'margin-left': 3
+ }); // Now add shape categories from locale
+
+ var cats = {};
+ Object.entries(categories).forEach(function (_ref4) {
+ var _ref5 = _slicedToArray(_ref4, 2),
+ o = _ref5[0],
+ categoryName = _ref5[1];
+
+ cats['#shape_cats [data-cat="' + o + '"]'] = categoryName;
+ });
+ this.setStrings('content', cats);
+ },
+ mouseDown: function mouseDown(opts) {
+ var mode = canv.getMode();
+
+ if (mode !== modeId) {
+ return undefined;
+ }
+
+ startX = opts.start_x;
+ var x = startX;
+ startY = opts.start_y;
+ var y = startY;
+ var curStyle = canv.getStyle();
+ startClientPos.x = opts.event.clientX;
+ startClientPos.y = opts.event.clientY;
+ curShape = canv.addSVGElementFromJson({
+ element: 'path',
+ curStyles: true,
+ attr: {
+ d: currentD,
+ id: canv.getNextId(),
+ opacity: curStyle.opacity / 2,
+ style: 'pointer-events:none'
+ }
+ }); // Make sure shape uses absolute values
+
+ if (/[a-z]/.test(currentD)) {
+ currentD = curLib.data[curShapeId] = canv.pathActions.convertPath(curShape);
+ curShape.setAttribute('d', currentD);
+ canv.pathActions.fixEnd(curShape);
+ }
+
+ curShape.setAttribute('transform', 'translate(' + x + ',' + y + ') scale(0.005) translate(' + -x + ',' + -y + ')');
+ canv.recalculateDimensions(curShape);
+ /* const tlist = */
+
+ canv.getTransformList(curShape);
+ lastBBox = curShape.getBBox();
+ return {
+ started: true
+ };
+ },
+ mouseMove: function mouseMove(opts) {
+ var mode = canv.getMode();
+
+ if (mode !== modeId) {
+ return;
+ }
+
+ var zoom = canv.getZoom();
+ var evt = opts.event;
+ var x = opts.mouse_x / zoom;
+ var y = opts.mouse_y / zoom;
+ var tlist = canv.getTransformList(curShape),
+ box = curShape.getBBox(),
+ left = box.x,
+ top = box.y; // {width, height} = box,
+ // const dx = (x - startX), dy = (y - startY);
+
+ var newbox = {
+ x: Math.min(startX, x),
+ y: Math.min(startY, y),
+ width: Math.abs(x - startX),
+ height: Math.abs(y - startY)
+ };
+ /*
+ // This is currently serving no purpose, so commenting out
+ let sy = height ? (height + dy) / height : 1,
+ sx = width ? (width + dx) / width : 1;
+ */
+
+ var sx = newbox.width / lastBBox.width || 1;
+ var sy = newbox.height / lastBBox.height || 1; // Not perfect, but mostly works...
+
+ var tx = 0;
+
+ if (x < startX) {
+ tx = lastBBox.width;
+ }
+
+ var ty = 0;
+
+ if (y < startY) {
+ ty = lastBBox.height;
+ } // update the transform list with translate,scale,translate
- function makeButtons(cat, shapes) {
- const size = curLib.size || 300;
- const fill = curLib.fill || false;
- const off = size * 0.05;
- const vb = [-off, -off, size + off * 2, size + off * 2].join(' ');
- const stroke = fill ? 0 : size / 30;
- const shapeIcon = new DOMParser().parseFromString('<svg xmlns="http://www.w3.org/2000/svg">' + '<svg viewBox="' + vb + '">' + '<path fill="' + (fill ? '#333' : 'none') + '" stroke="#000" stroke-width="' + stroke + '" /></svg></svg>', 'text/xml');
- const width = 24;
- const height = 24;
- shapeIcon.documentElement.setAttribute('width', width);
- shapeIcon.documentElement.setAttribute('height', height);
- const svgElem = $(document.importNode(shapeIcon.documentElement, true));
- const {
- data
- } = shapes;
- curLib.buttons = Object.entries(data).map(([id, pathD]) => {
- const icon = svgElem.clone();
- icon.find('path').attr('d', pathD);
- const iconBtn = icon.wrap('<div class="tool_button">').parent().attr({
- id: modeId + '_' + id,
- title: id
- }); // Store for later use
+ var translateOrigin = svgroot.createSVGTransform(),
+ scale = svgroot.createSVGTransform(),
+ translateBack = svgroot.createSVGTransform();
+ translateOrigin.setTranslate(-(left + tx), -(top + ty));
- return iconBtn[0];
- });
- }
- /**
- * @param {string|"basic"} catId
- * @returns {void}
- */
+ if (!evt.shiftKey) {
+ var max = Math.min(Math.abs(sx), Math.abs(sy));
+ sx = max * (sx < 0 ? -1 : 1);
+ sy = max * (sy < 0 ? -1 : 1);
+ }
+ scale.setScale(sx, sy);
+ translateBack.setTranslate(left + tx, top + ty);
+ tlist.appendItem(translateBack);
+ tlist.appendItem(scale);
+ tlist.appendItem(translateOrigin);
+ canv.recalculateDimensions(curShape);
+ lastBBox = curShape.getBBox();
+ },
+ mouseUp: function mouseUp(opts) {
+ var mode = canv.getMode();
- function loadLibrary(catId) {
- const lib = library[catId];
+ if (mode !== modeId) {
+ return undefined;
+ }
- if (!lib) {
- $('#shape_buttons').html(strings.loading);
- $.getJSON(svgEditor.curConfig.extIconsPath + 'shapelib/' + catId + '.json', function (result) {
- curLib = library[catId] = {
- data: result.data,
- size: result.size,
- fill: result.fill
- };
- makeButtons(catId, result);
- loadIcons();
- });
- return;
- }
+ var keepObject = opts.event.clientX !== startClientPos.x && opts.event.clientY !== startClientPos.y;
+ return {
+ keep: keepObject,
+ element: curShape,
+ started: false
+ };
+ }
+ });
- curLib = lib;
-
- if (!lib.buttons.length) {
- makeButtons(catId, lib);
- }
-
- loadIcons();
- }
-
- const buttons = [{
- id: 'tool_shapelib',
- icon: svgEditor.curConfig.extIconsPath + 'shapes.png',
- type: 'mode_flyout',
- // _flyout
- position: 6,
- events: {
- click() {
- canv.setMode(modeId);
- }
-
- }
- }];
- return {
- svgicons: svgEditor.curConfig.extIconsPath + 'ext-shapes.xml',
- buttons: strings.buttons.map((button, i) => {
- return Object.assign(buttons[i], button);
- }),
-
- callback() {
- $('<style>').text(`
- #shape_buttons {
- overflow: auto;
- width: 180px;
- max-height: 300px;
- display: table-cell;
- vertical-align: middle;
- }
- #shape_cats {
- min-width: 110px;
- display: table-cell;
- vertical-align: middle;
- height: 300px;
- }
- #shape_cats > div {
- line-height: 1em;
- padding: .5em;
- border:1px solid #B0B0B0;
- background: #E8E8E8;
- margin-bottom: -1px;
- }
- #shape_cats div:hover {
- background: #FFFFCC;
- }
- #shape_cats div.current {
- font-weight: bold;
- }
- `).appendTo('head');
- const btnDiv = $('<div id="shape_buttons">');
- $('#tools_shapelib > *').wrapAll(btnDiv);
- const shower = $('#tools_shapelib_show');
- loadLibrary('basic'); // Do mouseup on parent element rather than each button
-
- $('#shape_buttons').mouseup(function (evt) {
- const btn = $(evt.target).closest('div.tool_button');
-
- if (!btn.length) {
- return;
+ case 18:
+ case "end":
+ return _context.stop();
}
-
- const copy = btn.children().clone();
- shower.children(':not(.flyout_arrow_horiz)').remove();
- shower.append(copy).attr('data-curopt', '#' + btn[0].id) // This sets the current mode
- .mouseup();
- canv.setMode(modeId);
- curShapeId = btn[0].id.substr((modeId + '_').length);
- currentD = curLib.data[curShapeId];
- $('.tools_flyout').fadeOut();
- });
- const shapeCats = $('<div id="shape_cats">');
- let catStr = '';
- $.each(categories, function (id, label) {
- catStr += '<div data-cat=' + id + '>' + label + '</div>';
- });
- shapeCats.html(catStr).children().bind('mouseup', function () {
- const catlink = $(this);
- catlink.siblings().removeClass('current');
- catlink.addClass('current');
- loadLibrary(catlink.attr('data-cat')); // Get stuff
-
- return false;
- });
- shapeCats.children().eq(0).addClass('current');
- $('#tools_shapelib').append(shapeCats);
- shower.mouseup(function () {
- canv.setMode(currentD ? modeId : 'select');
- });
- $('#tool_shapelib').remove();
- const h = $('#tools_shapelib').height();
- $('#tools_shapelib').css({
- 'margin-top': -(h / 2 - 15),
- 'margin-left': 3
- }); // Now add shape categories from locale
-
- const cats = {};
- Object.entries(categories).forEach(([o, categoryName]) => {
- cats['#shape_cats [data-cat="' + o + '"]'] = categoryName;
- });
- this.setStrings('content', cats);
- },
-
- mouseDown(opts) {
- const mode = canv.getMode();
-
- if (mode !== modeId) {
- return undefined;
}
-
- startX = opts.start_x;
- const x = startX;
- startY = opts.start_y;
- const y = startY;
- const curStyle = canv.getStyle();
- startClientPos.x = opts.event.clientX;
- startClientPos.y = opts.event.clientY;
- curShape = canv.addSVGElementFromJson({
- element: 'path',
- curStyles: true,
- attr: {
- d: currentD,
- id: canv.getNextId(),
- opacity: curStyle.opacity / 2,
- style: 'pointer-events:none'
- }
- }); // Make sure shape uses absolute values
-
- if (/[a-z]/.test(currentD)) {
- currentD = curLib.data[curShapeId] = canv.pathActions.convertPath(curShape);
- curShape.setAttribute('d', currentD);
- canv.pathActions.fixEnd(curShape);
- }
-
- curShape.setAttribute('transform', 'translate(' + x + ',' + y + ') scale(0.005) translate(' + -x + ',' + -y + ')');
- canv.recalculateDimensions(curShape);
- /* const tlist = */
-
- canv.getTransformList(curShape);
- lastBBox = curShape.getBBox();
- return {
- started: true
- };
- },
-
- mouseMove(opts) {
- const mode = canv.getMode();
-
- if (mode !== modeId) {
- return;
- }
-
- const zoom = canv.getZoom();
- const evt = opts.event;
- const x = opts.mouse_x / zoom;
- const y = opts.mouse_y / zoom;
- const tlist = canv.getTransformList(curShape),
- box = curShape.getBBox(),
- left = box.x,
- top = box.y; // {width, height} = box,
- // const dx = (x - startX), dy = (y - startY);
-
- const newbox = {
- x: Math.min(startX, x),
- y: Math.min(startY, y),
- width: Math.abs(x - startX),
- height: Math.abs(y - startY)
- };
- /*
- // This is currently serving no purpose, so commenting out
- let sy = height ? (height + dy) / height : 1,
- sx = width ? (width + dx) / width : 1;
- */
-
- let sx = newbox.width / lastBBox.width || 1;
- let sy = newbox.height / lastBBox.height || 1; // Not perfect, but mostly works...
-
- let tx = 0;
-
- if (x < startX) {
- tx = lastBBox.width;
- }
-
- let ty = 0;
-
- if (y < startY) {
- ty = lastBBox.height;
- } // update the transform list with translate,scale,translate
-
-
- const translateOrigin = svgroot.createSVGTransform(),
- scale = svgroot.createSVGTransform(),
- translateBack = svgroot.createSVGTransform();
- translateOrigin.setTranslate(-(left + tx), -(top + ty));
-
- if (!evt.shiftKey) {
- const max = Math.min(Math.abs(sx), Math.abs(sy));
- sx = max * (sx < 0 ? -1 : 1);
- sy = max * (sy < 0 ? -1 : 1);
- }
-
- scale.setScale(sx, sy);
- translateBack.setTranslate(left + tx, top + ty);
- tlist.appendItem(translateBack);
- tlist.appendItem(scale);
- tlist.appendItem(translateOrigin);
- canv.recalculateDimensions(curShape);
- lastBBox = curShape.getBBox();
- },
-
- mouseUp(opts) {
- const mode = canv.getMode();
-
- if (mode !== modeId) {
- return undefined;
- }
-
- const keepObject = opts.event.clientX !== startClientPos.x && opts.event.clientY !== startClientPos.y;
- return {
- keep: keepObject,
- element: curShape,
- started: false
- };
- }
-
- };
+ }, _callee);
+ }))();
}
-
};
return extShapes;
diff --git a/dist/extensions/ext-star.js b/dist/extensions/ext-star.js
index 024cd427..e1472116 100644
--- a/dist/extensions/ext-star.js
+++ b/dist/extensions/ext-star.js
@@ -1,6 +1,42 @@
var svgEditorExtension_star = (function () {
'use strict';
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+ try {
+ var info = gen[key](arg);
+ var value = info.value;
+ } catch (error) {
+ reject(error);
+ return;
+ }
+
+ if (info.done) {
+ resolve(value);
+ } else {
+ Promise.resolve(value).then(_next, _throw);
+ }
+ }
+
+ function _asyncToGenerator(fn) {
+ return function () {
+ var self = this,
+ args = arguments;
+ return new Promise(function (resolve, reject) {
+ var gen = fn.apply(self, args);
+
+ function _next(value) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+ }
+
+ function _throw(err) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+ }
+
+ _next(undefined);
+ });
+ };
+ }
+
/**
* @file ext-star.js
*
@@ -10,270 +46,247 @@ var svgEditorExtension_star = (function () {
*/
var extStar = {
name: 'star',
+ init: function init(S) {
+ var _this = this;
- async init(S) {
- const svgEditor = this;
- const svgCanvas = svgEditor.canvas;
- const {
- $,
- importLocale
- } = S; // {svgcontent},
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+ var svgEditor, svgCanvas, $, importLocale, selElems, started, newFO, strings, showPanel, setAttr, buttons, contextTools;
+ return regeneratorRuntime.wrap(function _callee$(_context) {
+ while (1) {
+ switch (_context.prev = _context.next) {
+ case 0:
+ setAttr = function _setAttr(attr, val) {
+ svgCanvas.changeSelectedAttribute(attr, val);
+ svgCanvas.call('changed', selElems);
+ };
- let selElems, // editingitex = false,
- // svgdoc = S.svgroot.parentNode.ownerDocument,
- started, newFO; // edg = 0,
- // newFOG, newFOGParent, newDef, newImageName, newMaskID,
- // undoCommand = 'Not image',
- // modeChangeG, ccZoom, wEl, hEl, wOffset, hOffset, ccRgbEl, brushW, brushH;
+ showPanel = function _showPanel(on) {
+ var fcRules = $('#fc_rules');
- const strings = await importLocale();
- /**
- *
- * @param {boolean} on
- * @returns {void}
- */
+ if (!fcRules.length) {
+ fcRules = $('<style id="fc_rules"></style>').appendTo('head');
+ }
- function showPanel(on) {
- let fcRules = $('#fc_rules');
+ fcRules.text(!on ? '' : ' #tool_topath { display: none !important; }');
+ $('#star_panel').toggle(on);
+ };
- if (!fcRules.length) {
- fcRules = $('<style id="fc_rules"></style>').appendTo('head');
- }
+ svgEditor = _this;
+ svgCanvas = svgEditor.canvas;
+ $ = S.$, importLocale = S.importLocale; // {svgcontent},
- fcRules.text(!on ? '' : ' #tool_topath { display: none !important; }');
- $('#star_panel').toggle(on);
- }
- /*
- function toggleSourceButtons(on){
- $('#star_save, #star_cancel').toggle(on);
- }
- */
+ _context.next = 7;
+ return importLocale();
- /**
- *
- * @param {string} attr
- * @param {string|Float} val
- * @returns {void}
- */
+ case 7:
+ strings = _context.sent;
-
- function setAttr(attr, val) {
- svgCanvas.changeSelectedAttribute(attr, val);
- svgCanvas.call('changed', selElems);
- }
- /*
- function cot(n){
- return 1 / Math.tan(n);
- }
- function sec(n){
- return 1 / Math.cos(n);
- }
- */
-
-
- const buttons = [{
- id: 'tool_star',
- icon: svgEditor.curConfig.extIconsPath + 'star.png',
- type: 'mode',
- position: 12,
- events: {
- click() {
- showPanel(true);
- svgCanvas.setMode('star');
- }
-
- }
- }];
- const contextTools = [{
- type: 'input',
- panel: 'star_panel',
- id: 'starNumPoints',
- size: 3,
- defval: 5,
- events: {
- change() {
- setAttr('point', this.value);
- }
-
- }
- }, {
- type: 'input',
- panel: 'star_panel',
- id: 'starRadiusMulitplier',
- size: 3,
- defval: 2.5
- }, {
- type: 'input',
- panel: 'star_panel',
- id: 'radialShift',
- size: 3,
- defval: 0,
- events: {
- change() {
- setAttr('radialshift', this.value);
- }
-
- }
- }];
- return {
- name: strings.name,
- svgicons: svgEditor.curConfig.extIconsPath + 'star-icons.svg',
- buttons: strings.buttons.map((button, i) => {
- return Object.assign(buttons[i], button);
- }),
- context_tools: strings.contextTools.map((contextTool, i) => {
- return Object.assign(contextTools[i], contextTool);
- }),
-
- callback() {
- $('#star_panel').hide(); // const endChanges = function(){};
- },
-
- mouseDown(opts) {
- const rgb = svgCanvas.getColor('fill'); // const ccRgbEl = rgb.substring(1, rgb.length);
-
- const sRgb = svgCanvas.getColor('stroke'); // const ccSRgbEl = sRgb.substring(1, rgb.length);
-
- const sWidth = svgCanvas.getStrokeWidth();
-
- if (svgCanvas.getMode() === 'star') {
- started = true;
- newFO = svgCanvas.addSVGElementFromJson({
- element: 'polygon',
- attr: {
- cx: opts.start_x,
- cy: opts.start_y,
- id: svgCanvas.getNextId(),
- shape: 'star',
- point: document.getElementById('starNumPoints').value,
- r: 0,
- radialshift: document.getElementById('radialShift').value,
- r2: 0,
- orient: 'point',
- fill: rgb,
- strokecolor: sRgb,
- strokeWidth: sWidth
- }
- });
- return {
- started: true
- };
- }
-
- return undefined;
- },
-
- mouseMove(opts) {
- if (!started) {
- return undefined;
- }
-
- if (svgCanvas.getMode() === 'star') {
- const c = $(newFO).attr(['cx', 'cy', 'point', 'orient', 'fill', 'strokecolor', 'strokeWidth', 'radialshift']);
- let x = opts.mouse_x;
- let y = opts.mouse_y;
- const {
- cx,
- cy,
- fill,
- strokecolor,
- strokeWidth,
- radialshift,
- point,
- orient
- } = c,
- circumradius = Math.sqrt((x - cx) * (x - cx) + (y - cy) * (y - cy)) / 1.5,
- inradius = circumradius / document.getElementById('starRadiusMulitplier').value;
- newFO.setAttribute('r', circumradius);
- newFO.setAttribute('r2', inradius);
- let polyPoints = '';
-
- for (let s = 0; point >= s; s++) {
- let angle = 2.0 * Math.PI * (s / point);
-
- if (orient === 'point') {
- angle -= Math.PI / 2;
- } else if (orient === 'edge') {
- angle = angle + Math.PI / point - Math.PI / 2;
- }
-
- x = circumradius * Math.cos(angle) + cx;
- y = circumradius * Math.sin(angle) + cy;
- polyPoints += x + ',' + y + ' ';
-
- if (!isNaN(inradius)) {
- angle = 2.0 * Math.PI * (s / point) + Math.PI / point;
-
- if (orient === 'point') {
- angle -= Math.PI / 2;
- } else if (orient === 'edge') {
- angle = angle + Math.PI / point - Math.PI / 2;
+ /*
+ function cot(n){
+ return 1 / Math.tan(n);
}
+ function sec(n){
+ return 1 / Math.cos(n);
+ }
+ */
+ buttons = [{
+ id: 'tool_star',
+ icon: svgEditor.curConfig.extIconsPath + 'star.png',
+ type: 'mode',
+ position: 12,
+ events: {
+ click: function click() {
+ showPanel(true);
+ svgCanvas.setMode('star');
+ }
+ }
+ }];
+ contextTools = [{
+ type: 'input',
+ panel: 'star_panel',
+ id: 'starNumPoints',
+ size: 3,
+ defval: 5,
+ events: {
+ change: function change() {
+ setAttr('point', this.value);
+ }
+ }
+ }, {
+ type: 'input',
+ panel: 'star_panel',
+ id: 'starRadiusMulitplier',
+ size: 3,
+ defval: 2.5
+ }, {
+ type: 'input',
+ panel: 'star_panel',
+ id: 'radialShift',
+ size: 3,
+ defval: 0,
+ events: {
+ change: function change() {
+ setAttr('radialshift', this.value);
+ }
+ }
+ }];
+ return _context.abrupt("return", {
+ name: strings.name,
+ svgicons: svgEditor.curConfig.extIconsPath + 'star-icons.svg',
+ buttons: strings.buttons.map(function (button, i) {
+ return Object.assign(buttons[i], button);
+ }),
+ context_tools: strings.contextTools.map(function (contextTool, i) {
+ return Object.assign(contextTools[i], contextTool);
+ }),
+ callback: function callback() {
+ $('#star_panel').hide(); // const endChanges = function(){};
+ },
+ mouseDown: function mouseDown(opts) {
+ var rgb = svgCanvas.getColor('fill'); // const ccRgbEl = rgb.substring(1, rgb.length);
- angle += radialshift;
- x = inradius * Math.cos(angle) + cx;
- y = inradius * Math.sin(angle) + cy;
- polyPoints += x + ',' + y + ' ';
- }
- }
+ var sRgb = svgCanvas.getColor('stroke'); // const ccSRgbEl = sRgb.substring(1, rgb.length);
- newFO.setAttribute('points', polyPoints);
- newFO.setAttribute('fill', fill);
- newFO.setAttribute('stroke', strokecolor);
- newFO.setAttribute('stroke-width', strokeWidth);
- /* const shape = */
+ var sWidth = svgCanvas.getStrokeWidth();
- newFO.getAttribute('shape');
- return {
- started: true
- };
- }
+ if (svgCanvas.getMode() === 'star') {
+ started = true;
+ newFO = svgCanvas.addSVGElementFromJson({
+ element: 'polygon',
+ attr: {
+ cx: opts.start_x,
+ cy: opts.start_y,
+ id: svgCanvas.getNextId(),
+ shape: 'star',
+ point: document.getElementById('starNumPoints').value,
+ r: 0,
+ radialshift: document.getElementById('radialShift').value,
+ r2: 0,
+ orient: 'point',
+ fill: rgb,
+ strokecolor: sRgb,
+ strokeWidth: sWidth
+ }
+ });
+ return {
+ started: true
+ };
+ }
- return undefined;
- },
+ return undefined;
+ },
+ mouseMove: function mouseMove(opts) {
+ if (!started) {
+ return undefined;
+ }
- mouseUp() {
- if (svgCanvas.getMode() === 'star') {
- const attrs = $(newFO).attr(['r']); // svgCanvas.addToSelection([newFO], true);
+ if (svgCanvas.getMode() === 'star') {
+ var c = $(newFO).attr(['cx', 'cy', 'point', 'orient', 'fill', 'strokecolor', 'strokeWidth', 'radialshift']);
+ var x = opts.mouse_x;
+ var y = opts.mouse_y;
+ var cx = c.cx,
+ cy = c.cy,
+ fill = c.fill,
+ strokecolor = c.strokecolor,
+ strokeWidth = c.strokeWidth,
+ radialshift = c.radialshift,
+ point = c.point,
+ orient = c.orient,
+ circumradius = Math.sqrt((x - cx) * (x - cx) + (y - cy) * (y - cy)) / 1.5,
+ inradius = circumradius / document.getElementById('starRadiusMulitplier').value;
+ newFO.setAttribute('r', circumradius);
+ newFO.setAttribute('r2', inradius);
+ var polyPoints = '';
- return {
- keep: attrs.r !== '0',
- element: newFO
- };
- }
+ for (var s = 0; point >= s; s++) {
+ var angle = 2.0 * Math.PI * (s / point);
- return undefined;
- },
+ if (orient === 'point') {
+ angle -= Math.PI / 2;
+ } else if (orient === 'edge') {
+ angle = angle + Math.PI / point - Math.PI / 2;
+ }
- selectedChanged(opts) {
- // Use this to update the current selected elements
- selElems = opts.elems;
- let i = selElems.length;
+ x = circumradius * Math.cos(angle) + cx;
+ y = circumradius * Math.sin(angle) + cy;
+ polyPoints += x + ',' + y + ' ';
- while (i--) {
- const elem = selElems[i];
+ if (!isNaN(inradius)) {
+ angle = 2.0 * Math.PI * (s / point) + Math.PI / point;
- if (elem && elem.getAttribute('shape') === 'star') {
- if (opts.selectedElement && !opts.multiselected) {
- // $('#starRadiusMulitplier').val(elem.getAttribute('r2'));
- $('#starNumPoints').val(elem.getAttribute('point'));
- $('#radialShift').val(elem.getAttribute('radialshift'));
- showPanel(true);
- } else {
- showPanel(false);
- }
- } else {
- showPanel(false);
+ if (orient === 'point') {
+ angle -= Math.PI / 2;
+ } else if (orient === 'edge') {
+ angle = angle + Math.PI / point - Math.PI / 2;
+ }
+
+ angle += radialshift;
+ x = inradius * Math.cos(angle) + cx;
+ y = inradius * Math.sin(angle) + cy;
+ polyPoints += x + ',' + y + ' ';
+ }
+ }
+
+ newFO.setAttribute('points', polyPoints);
+ newFO.setAttribute('fill', fill);
+ newFO.setAttribute('stroke', strokecolor);
+ newFO.setAttribute('stroke-width', strokeWidth);
+ /* const shape = */
+
+ newFO.getAttribute('shape');
+ return {
+ started: true
+ };
+ }
+
+ return undefined;
+ },
+ mouseUp: function mouseUp() {
+ if (svgCanvas.getMode() === 'star') {
+ var attrs = $(newFO).attr(['r']); // svgCanvas.addToSelection([newFO], true);
+
+ return {
+ keep: attrs.r !== '0',
+ element: newFO
+ };
+ }
+
+ return undefined;
+ },
+ selectedChanged: function selectedChanged(opts) {
+ // Use this to update the current selected elements
+ selElems = opts.elems;
+ var i = selElems.length;
+
+ while (i--) {
+ var elem = selElems[i];
+
+ if (elem && elem.getAttribute('shape') === 'star') {
+ if (opts.selectedElement && !opts.multiselected) {
+ // $('#starRadiusMulitplier').val(elem.getAttribute('r2'));
+ $('#starNumPoints').val(elem.getAttribute('point'));
+ $('#radialShift').val(elem.getAttribute('radialshift'));
+ showPanel(true);
+ } else {
+ showPanel(false);
+ }
+ } else {
+ showPanel(false);
+ }
+ }
+ },
+ elementChanged: function elementChanged(opts) {// const elem = opts.elems[0];
+ }
+ });
+
+ case 11:
+ case "end":
+ return _context.stop();
}
}
- },
-
- elementChanged(opts) {// const elem = opts.elems[0];
- }
-
- };
+ }, _callee);
+ }))();
}
-
};
return extStar;
diff --git a/dist/extensions/ext-storage.js b/dist/extensions/ext-storage.js
index c3e7b702..50dfa718 100644
--- a/dist/extensions/ext-storage.js
+++ b/dist/extensions/ext-storage.js
@@ -1,6 +1,98 @@
var svgEditorExtension_storage = (function () {
'use strict';
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+ try {
+ var info = gen[key](arg);
+ var value = info.value;
+ } catch (error) {
+ reject(error);
+ return;
+ }
+
+ if (info.done) {
+ resolve(value);
+ } else {
+ Promise.resolve(value).then(_next, _throw);
+ }
+ }
+
+ function _asyncToGenerator(fn) {
+ return function () {
+ var self = this,
+ args = arguments;
+ return new Promise(function (resolve, reject) {
+ var gen = fn.apply(self, args);
+
+ function _next(value) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+ }
+
+ function _throw(err) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+ }
+
+ _next(undefined);
+ });
+ };
+ }
+
+ function _slicedToArray(arr, i) {
+ return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+ }
+
+ function _arrayWithHoles(arr) {
+ if (Array.isArray(arr)) return arr;
+ }
+
+ function _iterableToArrayLimit(arr, i) {
+ if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
+ var _arr = [];
+ var _n = true;
+ var _d = false;
+ var _e = undefined;
+
+ try {
+ for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
+ _arr.push(_s.value);
+
+ if (i && _arr.length === i) break;
+ }
+ } catch (err) {
+ _d = true;
+ _e = err;
+ } finally {
+ try {
+ if (!_n && _i["return"] != null) _i["return"]();
+ } finally {
+ if (_d) throw _e;
+ }
+ }
+
+ return _arr;
+ }
+
+ function _unsupportedIterableToArray(o, minLen) {
+ if (!o) return;
+ if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+ var n = Object.prototype.toString.call(o).slice(8, -1);
+ if (n === "Object" && o.constructor) n = o.constructor.name;
+ if (n === "Map" || n === "Set") return Array.from(o);
+ if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+ }
+
+ function _arrayLikeToArray(arr, len) {
+ if (len == null || len > arr.length) len = arr.length;
+
+ for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+
+ return arr2;
+ }
+
+ function _nonIterableRest() {
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+ }
+
/**
* @file ext-storage.js
*
@@ -23,35 +115,21 @@ var svgEditorExtension_storage = (function () {
*/
var extStorage = {
name: 'storage',
-
- init({
- $
- }) {
- const svgEditor = this;
- const svgCanvas = svgEditor.canvas; // We could empty any already-set data for users when they decline storage,
+ init: function init(_ref) {
+ var $ = _ref.$;
+ var svgEditor = this;
+ var svgCanvas = svgEditor.canvas; // We could empty any already-set data for users when they decline storage,
// but it would be a risk for users who wanted to store but accidentally
// said "no"; instead, we'll let those who already set it, delete it themselves;
// to change, set the "emptyStorageOnDecline" config setting to true
// in svgedit-config-iife.js/svgedit-config-es.js.
- const {
- emptyStorageOnDecline,
- // When the code in svg-editor.js prevents local storage on load per
- // user request, we also prevent storing on unload here so as to
- // avoid third-party sites making XSRF requests or providing links
- // which would cause the user's local storage not to load and then
- // upon page unload (such as the user closing the window), the storage
- // would thereby be set with an empty value, erasing any of the
- // user's prior work. To change this behavior so that no use of storage
- // or adding of new storage takes place regardless of settings, set
- // the "noStorageOnLoad" config setting to true in svgedit-config-*.js.
- noStorageOnLoad,
- forceStorage
- } = svgEditor.curConfig;
- const {
- storage,
- updateCanvas
- } = svgEditor;
+ var _svgEditor$curConfig = svgEditor.curConfig,
+ emptyStorageOnDecline = _svgEditor$curConfig.emptyStorageOnDecline,
+ noStorageOnLoad = _svgEditor$curConfig.noStorageOnLoad,
+ forceStorage = _svgEditor$curConfig.forceStorage;
+ var storage = svgEditor.storage,
+ updateCanvas = svgEditor.updateCanvas;
/**
* Replace `storagePrompt` parameter within URL.
* @param {string} val
@@ -61,7 +139,7 @@ var svgEditorExtension_storage = (function () {
function replaceStoragePrompt(val) {
val = val ? 'storagePrompt=' + val : '';
- const loc = top.location; // Allow this to work with the embedded editor as well
+ var loc = top.location; // Allow this to work with the embedded editor as well
if (loc.href.includes('storagePrompt=')) {
/*
@@ -86,7 +164,7 @@ var svgEditorExtension_storage = (function () {
function setSVGContentStorage(val) {
if (storage) {
- const name = 'svgedit-' + svgEditor.curConfig.canvasName;
+ var name = 'svgedit-' + svgEditor.curConfig.canvasName;
if (!val) {
storage.removeItem(name);
@@ -122,7 +200,7 @@ var svgEditorExtension_storage = (function () {
function emptyStorage() {
setSVGContentStorage('');
- Object.keys(svgEditor.curPrefs).forEach(name => {
+ Object.keys(svgEditor.curPrefs).forEach(function (name) {
name = 'svg-edit-' + name;
if (storage) {
@@ -160,11 +238,13 @@ var svgEditorExtension_storage = (function () {
}); // No need for explicit saving at all once storage is on
// svgEditor.showSaveWarning = false;
- const {
- curPrefs
- } = svgEditor;
- Object.entries(curPrefs).forEach(([key, val]) => {
- const store = val !== undefined;
+ var curPrefs = svgEditor.curPrefs;
+ Object.entries(curPrefs).forEach(function (_ref2) {
+ var _ref3 = _slicedToArray(_ref2, 2),
+ key = _ref3[0],
+ val = _ref3[1];
+
+ var store = val !== undefined;
key = 'svg-edit-' + key;
if (!store) {
@@ -183,147 +263,180 @@ var svgEditorExtension_storage = (function () {
});
}
- let loaded = false;
+ var loaded = false;
return {
name: 'storage',
+ langReady: function langReady(_ref4) {
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+ var importLocale, storagePrompt, confirmSetStorage, message, storagePrefsAndContent, storagePrefsOnly, storagePrefs, storageNoPrefsOrContent, storageNoPrefs, rememberLabel, rememberTooltip, options, oldContainerWidth, oldContainerMarginLeft, oldContentHeight, oldContainerHeight, _yield$$$select, pref, checked;
- async langReady({
- importLocale
- }) {
- const storagePrompt = new URL(top.location).searchParams.get('storagePrompt');
- const confirmSetStorage = await importLocale();
- const {
- message,
- storagePrefsAndContent,
- storagePrefsOnly,
- storagePrefs,
- storageNoPrefsOrContent,
- storageNoPrefs,
- rememberLabel,
- rememberTooltip
- } = confirmSetStorage; // No need to run this one-time dialog again just because the user
- // changes the language
+ return regeneratorRuntime.wrap(function _callee$(_context) {
+ while (1) {
+ switch (_context.prev = _context.next) {
+ case 0:
+ importLocale = _ref4.importLocale;
+ storagePrompt = new URL(top.location).searchParams.get('storagePrompt');
+ _context.next = 4;
+ return importLocale();
- if (loaded) {
- return;
- }
+ case 4:
+ confirmSetStorage = _context.sent;
+ message = confirmSetStorage.message, storagePrefsAndContent = confirmSetStorage.storagePrefsAndContent, storagePrefsOnly = confirmSetStorage.storagePrefsOnly, storagePrefs = confirmSetStorage.storagePrefs, storageNoPrefsOrContent = confirmSetStorage.storageNoPrefsOrContent, storageNoPrefs = confirmSetStorage.storageNoPrefs, rememberLabel = confirmSetStorage.rememberLabel, rememberTooltip = confirmSetStorage.rememberTooltip; // No need to run this one-time dialog again just because the user
+ // changes the language
- loaded = true; // Note that the following can load even if "noStorageOnLoad" is
- // set to false; to avoid any chance of storage, avoid this
- // extension! (and to avoid using any prior storage, set the
- // config option "noStorageOnLoad" to true).
+ if (!loaded) {
+ _context.next = 8;
+ break;
+ }
- if (!forceStorage && ( // If the URL has been explicitly set to always prompt the
- // user (e.g., so one can be pointed to a URL where one
- // can alter one's settings, say to prevent future storage)...
- storagePrompt === 'true' || // ...or...if the URL at least doesn't explicitly prevent a
- // storage prompt (as we use for users who
- // don't want to set cookies at all but who don't want
- // continual prompts about it)...
- storagePrompt !== 'false' && // ...and this user hasn't previously indicated a desire for storage
- !document.cookie.match(/(?:^|;\s*)svgeditstore=(?:prefsAndContent|prefsOnly)/) // ...then show the storage prompt.
- )) {
- const options = [];
+ return _context.abrupt("return");
- if (storage) {
- options.unshift({
- value: 'prefsAndContent',
- text: storagePrefsAndContent
- }, {
- value: 'prefsOnly',
- text: storagePrefsOnly
- }, {
- value: 'noPrefsOrContent',
- text: storageNoPrefsOrContent
- });
- } else {
- options.unshift({
- value: 'prefsOnly',
- text: storagePrefs
- }, {
- value: 'noPrefsOrContent',
- text: storageNoPrefs
- });
- } // Hack to temporarily provide a wide and high enough dialog
+ case 8:
+ loaded = true; // Note that the following can load even if "noStorageOnLoad" is
+ // set to false; to avoid any chance of storage, avoid this
+ // extension! (and to avoid using any prior storage, set the
+ // config option "noStorageOnLoad" to true).
+
+ if (!(!forceStorage && ( // If the URL has been explicitly set to always prompt the
+ // user (e.g., so one can be pointed to a URL where one
+ // can alter one's settings, say to prevent future storage)...
+ storagePrompt === 'true' || // ...or...if the URL at least doesn't explicitly prevent a
+ // storage prompt (as we use for users who
+ // don't want to set cookies at all but who don't want
+ // continual prompts about it)...
+ storagePrompt !== 'false' && // ...and this user hasn't previously indicated a desire for storage
+ !document.cookie.match(/(?:^|;\s*)svgeditstore=(?:prefsAndContent|prefsOnly)/) // ...then show the storage prompt.
+ ))) {
+ _context.next = 44;
+ break;
+ }
+
+ options = [];
+
+ if (storage) {
+ options.unshift({
+ value: 'prefsAndContent',
+ text: storagePrefsAndContent
+ }, {
+ value: 'prefsOnly',
+ text: storagePrefsOnly
+ }, {
+ value: 'noPrefsOrContent',
+ text: storageNoPrefsOrContent
+ });
+ } else {
+ options.unshift({
+ value: 'prefsOnly',
+ text: storagePrefs
+ }, {
+ value: 'noPrefsOrContent',
+ text: storageNoPrefs
+ });
+ } // Hack to temporarily provide a wide and high enough dialog
- const oldContainerWidth = $('#dialog_container')[0].style.width,
- oldContainerMarginLeft = $('#dialog_container')[0].style.marginLeft,
- oldContentHeight = $('#dialog_content')[0].style.height,
- oldContainerHeight = $('#dialog_container')[0].style.height;
- $('#dialog_content')[0].style.height = '120px';
- $('#dialog_container')[0].style.height = '170px';
- $('#dialog_container')[0].style.width = '800px';
- $('#dialog_container')[0].style.marginLeft = '-400px'; // Open select-with-checkbox dialog
- // From svg-editor.js
+ oldContainerWidth = $('#dialog_container')[0].style.width, oldContainerMarginLeft = $('#dialog_container')[0].style.marginLeft, oldContentHeight = $('#dialog_content')[0].style.height, oldContainerHeight = $('#dialog_container')[0].style.height;
+ $('#dialog_content')[0].style.height = '120px';
+ $('#dialog_container')[0].style.height = '170px';
+ $('#dialog_container')[0].style.width = '800px';
+ $('#dialog_container')[0].style.marginLeft = '-400px'; // Open select-with-checkbox dialog
+ // From svg-editor.js
- svgEditor.storagePromptState = 'waiting';
- const {
- response: pref,
- checked
- } = await $.select(message, options, null, null, {
- label: rememberLabel,
- checked: true,
- tooltip: rememberTooltip
- });
+ svgEditor.storagePromptState = 'waiting';
+ _context.next = 20;
+ return $.select(message, options, null, null, {
+ label: rememberLabel,
+ checked: true,
+ tooltip: rememberTooltip
+ });
- if (pref && pref !== 'noPrefsOrContent') {
- // Regardless of whether the user opted
- // to remember the choice (and move to a URL which won't
- // ask them again), we have to assume the user
- // doesn't even want to remember their not wanting
- // storage, so we don't set the cookie or continue on with
- // setting storage on beforeunload
- document.cookie = 'svgeditstore=' + encodeURIComponent(pref) + '; expires=Fri, 31 Dec 9999 23:59:59 GMT'; // 'prefsAndContent' | 'prefsOnly'
- // If the URL was configured to always insist on a prompt, if
- // the user does indicate a wish to store their info, we
- // don't want ask them again upon page refresh so move
- // them instead to a URL which does not always prompt
+ case 20:
+ _yield$$$select = _context.sent;
+ pref = _yield$$$select.response;
+ checked = _yield$$$select.checked;
- if (storagePrompt === 'true' && checked) {
- replaceStoragePrompt();
- return;
+ if (!(pref && pref !== 'noPrefsOrContent')) {
+ _context.next = 30;
+ break;
+ }
+
+ // Regardless of whether the user opted
+ // to remember the choice (and move to a URL which won't
+ // ask them again), we have to assume the user
+ // doesn't even want to remember their not wanting
+ // storage, so we don't set the cookie or continue on with
+ // setting storage on beforeunload
+ document.cookie = 'svgeditstore=' + encodeURIComponent(pref) + '; expires=Fri, 31 Dec 9999 23:59:59 GMT'; // 'prefsAndContent' | 'prefsOnly'
+ // If the URL was configured to always insist on a prompt, if
+ // the user does indicate a wish to store their info, we
+ // don't want ask them again upon page refresh so move
+ // them instead to a URL which does not always prompt
+
+ if (!(storagePrompt === 'true' && checked)) {
+ _context.next = 28;
+ break;
+ }
+
+ replaceStoragePrompt();
+ return _context.abrupt("return");
+
+ case 28:
+ _context.next = 35;
+ break;
+
+ case 30:
+ // The user does not wish storage (or cancelled, which we treat equivalently)
+ removeStoragePrefCookie();
+
+ if (pref && // If the user explicitly expresses wish for no storage
+ emptyStorageOnDecline) {
+ emptyStorage();
+ }
+
+ if (!(pref && checked)) {
+ _context.next = 35;
+ break;
+ }
+
+ // Open a URL which won't set storage and won't prompt user about storage
+ replaceStoragePrompt('false');
+ return _context.abrupt("return");
+
+ case 35:
+ // Reset width/height of dialog (e.g., for use by Export)
+ $('#dialog_container')[0].style.width = oldContainerWidth;
+ $('#dialog_container')[0].style.marginLeft = oldContainerMarginLeft;
+ $('#dialog_content')[0].style.height = oldContentHeight;
+ $('#dialog_container')[0].style.height = oldContainerHeight; // It should be enough to (conditionally) add to storage on
+ // beforeunload, but if we wished to update immediately,
+ // we might wish to try setting:
+ // svgEditor.setConfig({noStorageOnLoad: true});
+ // and then call:
+ // svgEditor.loadContentAndPrefs();
+ // We don't check for noStorageOnLoad here because
+ // the prompt gives the user the option to store data
+
+ setupBeforeUnloadListener();
+ svgEditor.storagePromptState = 'closed';
+ updateCanvas(true);
+ _context.next = 45;
+ break;
+
+ case 44:
+ if (!noStorageOnLoad || forceStorage) {
+ setupBeforeUnloadListener();
+ }
+
+ case 45:
+ case "end":
+ return _context.stop();
+ }
}
- } else {
- // The user does not wish storage (or cancelled, which we treat equivalently)
- removeStoragePrefCookie();
-
- if (pref && // If the user explicitly expresses wish for no storage
- emptyStorageOnDecline) {
- emptyStorage();
- }
-
- if (pref && checked) {
- // Open a URL which won't set storage and won't prompt user about storage
- replaceStoragePrompt('false');
- return;
- }
- } // Reset width/height of dialog (e.g., for use by Export)
-
-
- $('#dialog_container')[0].style.width = oldContainerWidth;
- $('#dialog_container')[0].style.marginLeft = oldContainerMarginLeft;
- $('#dialog_content')[0].style.height = oldContentHeight;
- $('#dialog_container')[0].style.height = oldContainerHeight; // It should be enough to (conditionally) add to storage on
- // beforeunload, but if we wished to update immediately,
- // we might wish to try setting:
- // svgEditor.setConfig({noStorageOnLoad: true});
- // and then call:
- // svgEditor.loadContentAndPrefs();
- // We don't check for noStorageOnLoad here because
- // the prompt gives the user the option to store data
-
- setupBeforeUnloadListener();
- svgEditor.storagePromptState = 'closed';
- updateCanvas(true);
- } else if (!noStorageOnLoad || forceStorage) {
- setupBeforeUnloadListener();
- }
+ }, _callee);
+ }))();
}
-
};
}
-
};
return extStorage;
diff --git a/dist/extensions/ext-webappfind.js b/dist/extensions/ext-webappfind.js
index ec92f019..728e0f3c 100644
--- a/dist/extensions/ext-webappfind.js
+++ b/dist/extensions/ext-webappfind.js
@@ -1,6 +1,42 @@
var svgEditorExtension_webappfind = (function () {
'use strict';
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+ try {
+ var info = gen[key](arg);
+ var value = info.value;
+ } catch (error) {
+ reject(error);
+ return;
+ }
+
+ if (info.done) {
+ resolve(value);
+ } else {
+ Promise.resolve(value).then(_next, _throw);
+ }
+ }
+
+ function _asyncToGenerator(fn) {
+ return function () {
+ var self = this,
+ args = arguments;
+ return new Promise(function (resolve, reject) {
+ var gen = fn.apply(self, args);
+
+ function _next(value) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+ }
+
+ function _throw(err) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+ }
+
+ _next(undefined);
+ });
+ };
+ }
+
/**
* Depends on Firefox add-on and executables from
* {@link https://github.com/brettz9/webappfind}.
@@ -10,118 +46,131 @@ var svgEditorExtension_webappfind = (function () {
*/
var extWebappfind = {
name: 'webappfind',
+ init: function init(_ref) {
+ var _this = this;
- async init({
- importLocale,
- $
- }) {
- const strings = await importLocale();
- const svgEditor = this;
- const saveMessage = 'save',
- readMessage = 'read',
- excludedMessages = [readMessage, saveMessage];
- let pathID;
- this.canvas.bind('message',
- /**
- * @param {external:Window} win
- * @param {PlainObject} info
- * @param {module:svgcanvas.SvgCanvas#event:message} info.data
- * @param {string} info.origin
- * @listens module:svgcanvas.SvgCanvas#event:message
- * @throws {Error} Unexpected event type
- * @returns {void}
- */
- (win, {
- data,
- origin
- }) => {
- // eslint-disable-line no-shadow
- // console.log('data, origin', data, origin);
- let type, content;
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+ var importLocale, $, strings, svgEditor, saveMessage, readMessage, excludedMessages, pathID, buttons;
+ return regeneratorRuntime.wrap(function _callee$(_context) {
+ while (1) {
+ switch (_context.prev = _context.next) {
+ case 0:
+ importLocale = _ref.importLocale, $ = _ref.$;
+ _context.next = 3;
+ return importLocale();
- try {
- ({
- type,
- pathID,
- content
- } = data.webappfind); // May throw if data is not an object
+ case 3:
+ strings = _context.sent;
+ svgEditor = _this;
+ saveMessage = 'save', readMessage = 'read', excludedMessages = [readMessage, saveMessage];
- if (origin !== location.origin || // We are only interested in a message sent as though within this URL by our browser add-on
- excludedMessages.includes(type) // Avoid our post below (other messages might be possible in the future which may also need to be excluded if your subsequent code makes assumptions on the type of message this is)
- ) {
- return;
+ _this.canvas.bind('message',
+ /**
+ * @param {external:Window} win
+ * @param {PlainObject} info
+ * @param {module:svgcanvas.SvgCanvas#event:message} info.data
+ * @param {string} info.origin
+ * @listens module:svgcanvas.SvgCanvas#event:message
+ * @throws {Error} Unexpected event type
+ * @returns {void}
+ */
+ function (win, _ref2) {
+ var data = _ref2.data,
+ origin = _ref2.origin;
+ // eslint-disable-line no-shadow
+ // console.log('data, origin', data, origin);
+ var type, content;
+
+ try {
+ var _data$webappfind = data.webappfind;
+ type = _data$webappfind.type;
+ pathID = _data$webappfind.pathID;
+ content = _data$webappfind.content;
+
+ // May throw if data is not an object
+ if (origin !== location.origin || // We are only interested in a message sent as though within this URL by our browser add-on
+ excludedMessages.includes(type) // Avoid our post below (other messages might be possible in the future which may also need to be excluded if your subsequent code makes assumptions on the type of message this is)
+ ) {
+ return;
+ }
+ } catch (err) {
+ return;
+ }
+
+ switch (type) {
+ case 'view':
+ // Populate the contents
+ svgEditor.loadFromString(content);
+ /* if ($('#tool_save_file')) {
+ $('#tool_save_file').disabled = false;
+ } */
+
+ break;
+
+ case 'save-end':
+ $.alert("save complete for pathID ".concat(pathID, "!"));
+ break;
+
+ default:
+ throw new Error('Unexpected WebAppFind event type');
+ }
+ });
+ /*
+ window.postMessage({
+ webappfind: {
+ type: readMessage
+ }
+ }, window.location.origin === 'null'
+ // Avoid "null" string error for `file:` protocol (even though
+ // file protocol not currently supported by Firefox)
+ ? '*'
+ : window.location.origin
+ );
+ */
+
+
+ buttons = [{
+ id: 'webappfind_save',
+ //
+ icon: svgEditor.curConfig.extIconsPath + 'webappfind.png',
+ type: 'app_menu',
+ position: 4,
+ // Before 0-based index position 4 (after the regular "Save Image (S)")
+ events: {
+ click: function click() {
+ if (!pathID) {
+ // Not ready yet as haven't received first payload
+ return;
+ }
+
+ window.postMessage({
+ webappfind: {
+ type: saveMessage,
+ pathID: pathID,
+ content: svgEditor.canvas.getSvgString()
+ }
+ }, window.location.origin === 'null' // Avoid "null" string error for `file:` protocol (even
+ // though file protocol not currently supported by add-on)
+ ? '*' : window.location.origin);
+ }
+ }
+ }];
+ return _context.abrupt("return", {
+ name: strings.name,
+ svgicons: svgEditor.curConfig.extIconsPath + 'webappfind-icon.svg',
+ buttons: strings.buttons.map(function (button, i) {
+ return Object.assign(buttons[i], button);
+ })
+ });
+
+ case 9:
+ case "end":
+ return _context.stop();
}
- } catch (err) {
- return;
- }
-
- switch (type) {
- case 'view':
- // Populate the contents
- svgEditor.loadFromString(content);
- /* if ($('#tool_save_file')) {
- $('#tool_save_file').disabled = false;
- } */
-
- break;
-
- case 'save-end':
- $.alert(`save complete for pathID ${pathID}!`);
- break;
-
- default:
- throw new Error('Unexpected WebAppFind event type');
- }
- });
- /*
- window.postMessage({
- webappfind: {
- type: readMessage
- }
- }, window.location.origin === 'null'
- // Avoid "null" string error for `file:` protocol (even though
- // file protocol not currently supported by Firefox)
- ? '*'
- : window.location.origin
- );
- */
-
- const buttons = [{
- id: 'webappfind_save',
- //
- icon: svgEditor.curConfig.extIconsPath + 'webappfind.png',
- type: 'app_menu',
- position: 4,
- // Before 0-based index position 4 (after the regular "Save Image (S)")
- events: {
- click() {
- if (!pathID) {
- // Not ready yet as haven't received first payload
- return;
- }
-
- window.postMessage({
- webappfind: {
- type: saveMessage,
- pathID,
- content: svgEditor.canvas.getSvgString()
- }
- }, window.location.origin === 'null' // Avoid "null" string error for `file:` protocol (even
- // though file protocol not currently supported by add-on)
- ? '*' : window.location.origin);
}
-
- }
- }];
- return {
- name: strings.name,
- svgicons: svgEditor.curConfig.extIconsPath + 'webappfind-icon.svg',
- buttons: strings.buttons.map((button, i) => {
- return Object.assign(buttons[i], button);
- })
- };
+ }, _callee);
+ }))();
}
-
};
return extWebappfind;
diff --git a/dist/extensions/ext-xdomain-messaging.js b/dist/extensions/ext-xdomain-messaging.js
index fad3d73c..caca2fa1 100644
--- a/dist/extensions/ext-xdomain-messaging.js
+++ b/dist/extensions/ext-xdomain-messaging.js
@@ -1,6 +1,55 @@
var svgEditorExtension_xdomain_messaging = (function () {
'use strict';
+ function _typeof(obj) {
+ "@babel/helpers - typeof";
+
+ if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
+ _typeof = function (obj) {
+ return typeof obj;
+ };
+ } else {
+ _typeof = function (obj) {
+ return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+ };
+ }
+
+ return _typeof(obj);
+ }
+
+ function _toConsumableArray(arr) {
+ return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
+ }
+
+ function _arrayWithoutHoles(arr) {
+ if (Array.isArray(arr)) return _arrayLikeToArray(arr);
+ }
+
+ function _iterableToArray(iter) {
+ if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter);
+ }
+
+ function _unsupportedIterableToArray(o, minLen) {
+ if (!o) return;
+ if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+ var n = Object.prototype.toString.call(o).slice(8, -1);
+ if (n === "Object" && o.constructor) n = o.constructor.name;
+ if (n === "Map" || n === "Set") return Array.from(o);
+ if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+ }
+
+ function _arrayLikeToArray(arr, len) {
+ if (len == null || len > arr.length) len = arr.length;
+
+ for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+
+ return arr2;
+ }
+
+ function _nonIterableSpread() {
+ throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+ }
+
/**
* Should not be needed for same domain control (just call via child frame),
* but an API common for cross-domain and same domain use can be found
@@ -8,43 +57,38 @@ var svgEditorExtension_xdomain_messaging = (function () {
*/
var extXdomainMessaging = {
name: 'xdomain-messaging',
-
- init() {
- const svgEditor = this;
- const svgCanvas = svgEditor.canvas;
+ init: function init() {
+ var svgEditor = this;
+ var svgCanvas = svgEditor.canvas;
try {
window.addEventListener('message', function (e) {
// We accept and post strings for the sake of IE9 support
- if (!e.data || !['string', 'object'].includes(typeof e.data) || e.data.charAt() === '|') {
+ if (!e.data || !['string', 'object'].includes(_typeof(e.data)) || e.data.charAt() === '|') {
return;
}
- const data = typeof e.data === 'object' ? e.data : JSON.parse(e.data);
+ var data = _typeof(e.data) === 'object' ? e.data : JSON.parse(e.data);
- if (!data || typeof data !== 'object' || data.namespace !== 'svgCanvas') {
+ if (!data || _typeof(data) !== 'object' || data.namespace !== 'svgCanvas') {
return;
} // The default is not to allow any origins, including even the same domain or
// if run on a `file:///` URL. See `svgedit-config-es.js` for an example of how
// to configure
- const {
- allowedOrigins
- } = svgEditor.curConfig;
+ var allowedOrigins = svgEditor.curConfig.allowedOrigins;
if (!allowedOrigins.includes('*') && !allowedOrigins.includes(e.origin)) {
- console.log(`Origin ${e.origin} not whitelisted for posting to ${window.origin}`); // eslint-disable-line no-console
+ console.log("Origin ".concat(e.origin, " not whitelisted for posting to ").concat(window.origin)); // eslint-disable-line no-console
return;
}
- const cbid = data.id;
- const {
- name,
- args
- } = data;
- const message = {
+ var cbid = data.id;
+ var name = data.name,
+ args = data.args;
+ var message = {
namespace: 'svg-edit',
id: cbid
};
@@ -52,7 +96,7 @@ var svgEditorExtension_xdomain_messaging = (function () {
try {
// Now that we know the origin is trusted, we perform otherwise
// unsafe arbitrary canvas method execution
- message.result = svgCanvas[name](...args); // lgtm [js/remote-property-injection]
+ message.result = svgCanvas[name].apply(svgCanvas, _toConsumableArray(args)); // lgtm [js/remote-property-injection]
} catch (err) {
message.error = err.message;
}
@@ -63,7 +107,6 @@ var svgEditorExtension_xdomain_messaging = (function () {
console.log('Error with xdomain message listener: ' + err); // eslint-disable-line no-console
}
}
-
};
return extXdomainMessaging;
diff --git a/dist/extensions/imagelib/index.js b/dist/extensions/imagelib/index.js
index e15ba398..47afc0f6 100644
--- a/dist/extensions/imagelib/index.js
+++ b/dist/extensions/imagelib/index.js
@@ -20,14 +20,12 @@
}
/* globals jQuery */
- const $ = jQuery;
+ var $ = jQuery;
$('a').click(function () {
- const {
- href
- } = this;
- const target = window.parent;
+ var href = this.href;
+ var target = window.parent;
- const post = message => {
+ var post = function post(message) {
// Todo: Make origin customizable as set by opening window
// Todo: If dropping IE9, avoid stringifying
target.postMessage(JSON.stringify(_extends({
@@ -44,15 +42,15 @@
});
if (!href.includes('.svg')) {
- const img = new Image();
+ var img = new Image();
img.addEventListener('load', function () {
- const canvas = document.createElement('canvas');
+ var canvas = document.createElement('canvas');
canvas.width = this.width;
canvas.height = this.height; // load the raster image into the canvas
canvas.getContext('2d').drawImage(this, 0, 0); // retrieve the data: URL
- let data;
+ var data;
try {
data = canvas.toDataURL();
@@ -65,8 +63,8 @@
}
post({
- href,
- data
+ href: href,
+ data: data
});
});
img.src = href;
@@ -74,8 +72,8 @@
// Do ajax request for image's href value
$.get(href, function (data) {
post({
- href,
- data
+ href: href,
+ data: data
});
}, 'html'); // 'html' is necessary to keep returned data as a string
}
diff --git a/dist/extensions/imagelib/openclipart.js b/dist/extensions/imagelib/openclipart.js
index b4d038b8..56e2c7b8 100644
--- a/dist/extensions/imagelib/openclipart.js
+++ b/dist/extensions/imagelib/openclipart.js
@@ -1,6 +1,80 @@
(function () {
'use strict';
+ function _typeof(obj) {
+ "@babel/helpers - typeof";
+
+ if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
+ _typeof = function (obj) {
+ return typeof obj;
+ };
+ } else {
+ _typeof = function (obj) {
+ return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+ };
+ }
+
+ return _typeof(obj);
+ }
+
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+ try {
+ var info = gen[key](arg);
+ var value = info.value;
+ } catch (error) {
+ reject(error);
+ return;
+ }
+
+ if (info.done) {
+ resolve(value);
+ } else {
+ Promise.resolve(value).then(_next, _throw);
+ }
+ }
+
+ function _asyncToGenerator(fn) {
+ return function () {
+ var self = this,
+ args = arguments;
+ return new Promise(function (resolve, reject) {
+ var gen = fn.apply(self, args);
+
+ function _next(value) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+ }
+
+ function _throw(err) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+ }
+
+ _next(undefined);
+ });
+ };
+ }
+
+ function _classCallCheck(instance, Constructor) {
+ if (!(instance instanceof Constructor)) {
+ throw new TypeError("Cannot call a class as a function");
+ }
+ }
+
+ function _defineProperties(target, props) {
+ for (var i = 0; i < props.length; i++) {
+ var descriptor = props[i];
+ descriptor.enumerable = descriptor.enumerable || false;
+ descriptor.configurable = true;
+ if ("value" in descriptor) descriptor.writable = true;
+ Object.defineProperty(target, descriptor.key, descriptor);
+ }
+ }
+
+ function _createClass(Constructor, protoProps, staticProps) {
+ if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+ if (staticProps) _defineProperties(Constructor, staticProps);
+ return Constructor;
+ }
+
function _extends() {
_extends = Object.assign || function (target) {
for (var i = 1; i < arguments.length; i++) {
@@ -19,2074 +93,168 @@
return _extends.apply(this, arguments);
}
- /*
- Possible todos:
- 0. Add XSLT to JML-string stylesheet (or even vice versa)
- 0. IE problem: Add JsonML code to handle name attribute (during element creation)
- 0. Element-specific: IE object-param handling
-
- Todos inspired by JsonML: https://github.com/mckamey/jsonml/blob/master/jsonml-html.js
-
- 0. duplicate attributes?
- 0. expand ATTR_MAP
- 0. equivalent of markup, to allow strings to be embedded within an object (e.g., {$value: '<div>id</div>'}); advantage over innerHTML in that it wouldn't need to work as the entire contents (nor destroy any existing content or handlers)
- 0. More validation?
- 0. JsonML DOM Level 0 listener
- 0. Whitespace trimming?
-
- JsonML element-specific:
- 0. table appending
- 0. canHaveChildren necessary? (attempts to append to script and img)
-
- Other Todos:
- 0. Note to self: Integrate research from other jml notes
- 0. Allow Jamilih to be seeded with an existing element, so as to be able to add/modify attributes and children
- 0. Allow array as single first argument
- 0. Settle on whether need to use null as last argument to return array (or fragment) or other way to allow appending? Options object at end instead to indicate whether returning array, fragment, first element, etc.?
- 0. Allow building of generic XML (pass configuration object)
- 0. Allow building content internally as a string (though allowing DOM methods, etc.?)
- 0. Support JsonML empty string element name to represent fragments?
- 0. Redo browser testing of jml (including ensuring IE7 can work even if test framework can't work)
- */
- // istanbul ignore next
- let win = typeof window !== 'undefined' && window; // istanbul ignore next
-
- let doc = typeof document !== 'undefined' && document || win && win.document; // STATIC PROPERTIES
-
- const possibleOptions = ['$plugins', // '$mode', // Todo (SVG/XML)
- // '$state', // Used internally
- '$map' // Add any other options here
- ];
- const NS_HTML = 'http://www.w3.org/1999/xhtml',
- hyphenForCamelCase = /-([a-z])/gu;
- const ATTR_MAP = {
- maxlength: 'maxLength',
- minlength: 'minLength',
- readonly: 'readOnly'
- }; // We define separately from ATTR_DOM for clarity (and parity with JsonML) but no current need
- // We don't set attribute esp. for boolean atts as we want to allow setting of `undefined`
- // (e.g., from an empty variable) on templates to have no effect
-
- const BOOL_ATTS = ['checked', 'defaultChecked', 'defaultSelected', 'disabled', 'indeterminate', 'open', // Dialog elements
- 'readOnly', 'selected']; // From JsonML
-
- const ATTR_DOM = BOOL_ATTS.concat(['accessKey', // HTMLElement
- 'async', 'autocapitalize', // HTMLElement
- 'autofocus', 'contentEditable', // HTMLElement through ElementContentEditable
- 'defaultValue', 'defer', 'draggable', // HTMLElement
- 'formnovalidate', 'hidden', // HTMLElement
- 'innerText', // HTMLElement
- 'inputMode', // HTMLElement through ElementContentEditable
- 'ismap', 'multiple', 'novalidate', 'pattern', 'required', 'spellcheck', // HTMLElement
- 'translate', // HTMLElement
- 'value', 'willvalidate']); // Todo: Add more to this as useful for templating
- // to avoid setting through nullish value
-
- const NULLABLES = ['autocomplete', 'dir', // HTMLElement
- 'integrity', // script, link
- 'lang', // HTMLElement
- 'max', 'min', 'minLength', 'maxLength', 'title' // HTMLElement
- ];
-
- const $ = sel => doc.querySelector(sel);
- /**
- * Retrieve the (lower-cased) HTML name of a node.
- * @static
- * @param {Node} node The HTML node
- * @returns {string} The lower-cased node name
- */
-
-
- function _getHTMLNodeName(node) {
- return node.nodeName && node.nodeName.toLowerCase();
- }
- /**
- * Apply styles if this is a style tag.
- * @static
- * @param {Node} node The element to check whether it is a style tag
- * @returns {void}
- */
-
-
- function _applyAnyStylesheet(node) {
- // Only used in IE
- // istanbul ignore else
- if (!doc.createStyleSheet) {
- return;
- } // istanbul ignore next
-
-
- if (_getHTMLNodeName(node) === 'style') {
- // IE
- const ss = doc.createStyleSheet(); // Create a stylesheet to actually do something useful
-
- ss.cssText = node.cssText; // We continue to add the style tag, however
+ function _inherits(subClass, superClass) {
+ if (typeof superClass !== "function" && superClass !== null) {
+ throw new TypeError("Super expression must either be null or a function");
}
- }
- /**
- * Need this function for IE since options weren't otherwise getting added.
- * @private
- * @static
- * @param {Element} parent The parent to which to append the element
- * @param {Node} child The element or other node to append to the parent
- * @returns {void}
- */
-
- function _appendNode(parent, child) {
- const parentName = _getHTMLNodeName(parent); // IE only
- // istanbul ignore if
-
-
- if (doc.createStyleSheet) {
- if (parentName === 'script') {
- parent.text = child.nodeValue;
- return;
+ subClass.prototype = Object.create(superClass && superClass.prototype, {
+ constructor: {
+ value: subClass,
+ writable: true,
+ configurable: true
}
+ });
+ if (superClass) _setPrototypeOf(subClass, superClass);
+ }
- if (parentName === 'style') {
- parent.cssText = child.nodeValue; // This will not apply it--just make it available within the DOM cotents
+ function _getPrototypeOf(o) {
+ _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
+ return o.__proto__ || Object.getPrototypeOf(o);
+ };
+ return _getPrototypeOf(o);
+ }
- return;
- }
- }
+ function _setPrototypeOf(o, p) {
+ _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
+ o.__proto__ = p;
+ return o;
+ };
- if (parentName === 'template') {
- parent.content.append(child);
- return;
- }
+ return _setPrototypeOf(o, p);
+ }
+
+ function _isNativeReflectConstruct() {
+ if (typeof Reflect === "undefined" || !Reflect.construct) return false;
+ if (Reflect.construct.sham) return false;
+ if (typeof Proxy === "function") return true;
try {
- parent.append(child); // IE9 is now ok with this
+ Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
+ return true;
} catch (e) {
- // istanbul ignore next
- const childName = _getHTMLNodeName(child); // istanbul ignore next
-
-
- if (parentName === 'select' && childName === 'option') {
- try {
- // Since this is now DOM Level 4 standard behavior (and what IE7+ can handle), we try it first
- parent.add(child);
- } catch (err) {
- // DOM Level 2 did require a second argument, so we try it too just in case the user is using an older version of Firefox, etc.
- parent.add(child, null); // IE7 has a problem with this, but IE8+ is ok
- }
-
- return;
- } // istanbul ignore next
-
-
- throw e;
+ return false;
}
}
- /**
- * Attach event in a cross-browser fashion.
- * @static
- * @param {Element} el DOM element to which to attach the event
- * @param {string} type The DOM event (without 'on') to attach to the element
- * @param {EventListener} handler The event handler to attach to the element
- * @param {boolean} [capturing] Whether or not the event should be
- * capturing (W3C-browsers only); default is false; NOT IN USE
- * @returns {void}
- */
-
- function _addEvent(el, type, handler, capturing) {
- el.addEventListener(type, handler, Boolean(capturing));
- }
- /**
- * Creates a text node of the result of resolving an entity or character reference.
- * @param {'entity'|'decimal'|'hexadecimal'} type Type of reference
- * @param {string} prefix Text to prefix immediately after the "&"
- * @param {string} arg The body of the reference
- * @returns {Text} The text node of the resolved reference
- */
-
-
- function _createSafeReference(type, prefix, arg) {
- // For security reasons related to innerHTML, we ensure this string only
- // contains potential entity characters
- if (!arg.match(/^\w+$/u)) {
- throw new TypeError(`Bad ${type} reference; with prefix "${prefix}" and arg "${arg}"`);
- }
-
- const elContainer = doc.createElement('div'); // Todo: No workaround for XML?
- // eslint-disable-next-line no-unsanitized/property
-
- elContainer.innerHTML = '&' + prefix + arg + ';';
- return doc.createTextNode(elContainer.innerHTML);
- }
- /**
- * @param {string} n0 Whole expression match (including "-")
- * @param {string} n1 Lower-case letter match
- * @returns {string} Uppercased letter
- */
-
-
- function _upperCase(n0, n1) {
- return n1.toUpperCase();
- } // Todo: Make as public utility
-
- /**
- * @param {any} o
- * @returns {boolean}
- */
-
-
- function _isNullish(o) {
- return o === null || o === undefined;
- } // Todo: Make as public utility, but also return types for undefined, boolean, number, document, etc.
-
- /**
- * @private
- * @static
- * @param {string|JamilihAttributes|JamilihArray|Element|DocumentFragment} item
- * @returns {"string"|"null"|"array"|"element"|"fragment"|"object"|"symbol"|"function"|"number"|"boolean"}
- */
-
-
- function _getType(item) {
- const type = typeof item;
-
- switch (type) {
- case 'object':
- if (item === null) {
- return 'null';
- }
-
- if (Array.isArray(item)) {
- return 'array';
- }
-
- if ('nodeType' in item) {
- switch (item.nodeType) {
- case 1:
- return 'element';
-
- case 9:
- return 'document';
-
- case 11:
- return 'fragment';
-
- default:
- return 'non-container node';
- }
- }
-
- // Fallthrough
-
- default:
- return type;
- }
- }
- /**
- * @private
- * @static
- * @param {DocumentFragment} frag
- * @param {Node} node
- * @returns {DocumentFragment}
- */
-
-
- function _fragReducer(frag, node) {
- frag.append(node);
- return frag;
- }
- /**
- * @private
- * @static
- * @param {Object<{string:string}>} xmlnsObj
- * @returns {string}
- */
-
-
- function _replaceDefiner(xmlnsObj) {
- return function (n0) {
- let retStr = xmlnsObj[''] ? ' xmlns="' + xmlnsObj[''] + '"' : n0; // Preserve XHTML
-
- for (const [ns, xmlnsVal] of Object.entries(xmlnsObj)) {
- if (ns !== '') {
- retStr += ' xmlns:' + ns + '="' + xmlnsVal + '"';
- }
- }
-
- return retStr;
- };
- }
- /**
- * @typedef {JamilihAttributes} AttributeArray
- * @property {string} 0 The key
- * @property {string} 1 The value
- */
-
- /**
- * @callback ChildrenToJMLCallback
- * @param {JamilihArray|Jamilih} childNodeJML
- * @param {Integer} i
- * @returns {void}
- */
-
- /**
- * @private
- * @static
- * @param {Node} node
- * @returns {ChildrenToJMLCallback}
- */
-
-
- function _childrenToJML(node) {
- return function (childNodeJML, i) {
- const cn = node.childNodes[i];
- const j = Array.isArray(childNodeJML) ? jml(...childNodeJML) : jml(childNodeJML);
- cn.replaceWith(j);
- };
- }
- /**
- * @callback JamilihAppender
- * @param {JamilihArray} childJML
- * @returns {void}
- */
-
- /**
- * @private
- * @static
- * @param {Node} node
- * @returns {JamilihAppender}
- */
-
-
- function _appendJML(node) {
- return function (childJML) {
- if (Array.isArray(childJML)) {
- node.append(jml(...childJML));
- } else {
- node.append(jml(childJML));
- }
- };
- }
- /**
- * @callback appender
- * @param {string|JamilihArray} childJML
- * @returns {void}
- */
-
- /**
- * @private
- * @static
- * @param {Node} node
- * @returns {appender}
- */
-
-
- function _appendJMLOrText(node) {
- return function (childJML) {
- if (typeof childJML === 'string') {
- node.append(childJML);
- } else if (Array.isArray(childJML)) {
- node.append(jml(...childJML));
- } else {
- node.append(jml(childJML));
- }
- };
- }
- /**
- * @private
- * @static
- */
-
- /*
- function _DOMfromJMLOrString (childNodeJML) {
- if (typeof childNodeJML === 'string') {
- return doc.createTextNode(childNodeJML);
- }
- return jml(...childNodeJML);
- }
- */
-
- /**
- * @typedef {Element|DocumentFragment} JamilihReturn
- */
-
- /**
- * @typedef {PlainObject<string, string>} JamilihAttributes
- */
-
- /**
- * @typedef {GenericArray} JamilihArray
- * @property {string} 0 The element to create (by lower-case name)
- * @property {JamilihAttributes} [1] Attributes to add with the key as the
- * attribute name and value as the attribute value; important for IE where
- * the input element's type cannot be added later after already added to the page
- * @param {Element[]} [children] The optional children of this element
- * (but raw DOM elements required to be specified within arrays since
- * could not otherwise be distinguished from siblings being added)
- * @param {Element} [parent] The optional parent to which to attach the element
- * (always the last unless followed by null, in which case it is the
- * second-to-last)
- * @param {null} [returning] Can use null to indicate an array of elements
- * should be returned
- */
-
- /**
- * @typedef {PlainObject} JamilihOptions
- * @property {"root"|"attributeValue"|"fragment"|"children"|"fragmentChildren"} $state
- */
-
- /**
- * @param {Element} elem
- * @param {string} att
- * @param {string} attVal
- * @param {JamilihOptions} opts
- * @returns {void}
- */
-
-
- function checkPluginValue(elem, att, attVal, opts) {
- opts.$state = 'attributeValue';
-
- if (attVal && typeof attVal === 'object') {
- const matchingPlugin = getMatchingPlugin(opts, Object.keys(attVal)[0]);
-
- if (matchingPlugin) {
- return matchingPlugin.set({
- opts,
- element: elem,
- attribute: {
- name: att,
- value: attVal
- }
- });
- }
- }
-
- return attVal;
- }
- /**
- * @param {JamilihOptions} opts
- * @param {string} item
- * @returns {JamilihPlugin}
- */
-
-
- function getMatchingPlugin(opts, item) {
- return opts.$plugins && opts.$plugins.find(p => {
- return p.name === item;
- });
- }
- /**
- * Creates an XHTML or HTML element (XHTML is preferred, but only in browsers
- * that support); any element after element can be omitted, and any subsequent
- * type or types added afterwards.
- * @param {...JamilihArray} args
- * @returns {JamilihReturn} The newly created (and possibly already appended)
- * element or array of elements
- */
-
-
- const jml = function jml(...args) {
- let elem = doc.createDocumentFragment();
- /**
- *
- * @param {Object<{string: string}>} atts
- * @returns {void}
- */
-
- function _checkAtts(atts) {
- for (let [att, attVal] of Object.entries(atts)) {
- att = att in ATTR_MAP ? ATTR_MAP[att] : att;
-
- if (NULLABLES.includes(att)) {
- attVal = checkPluginValue(elem, att, attVal, opts);
-
- if (!_isNullish(attVal)) {
- elem[att] = attVal;
- }
-
- continue;
- } else if (ATTR_DOM.includes(att)) {
- attVal = checkPluginValue(elem, att, attVal, opts);
- elem[att] = attVal;
- continue;
- }
-
- switch (att) {
- /*
- Todos:
- 0. JSON mode to prevent event addition
- 0. {$xmlDocument: []} // doc.implementation.createDocument
- 0. Accept array for any attribute with first item as prefix and second as value?
- 0. {$: ['xhtml', 'div']} for prefixed elements
- case '$': // Element with prefix?
- nodes[nodes.length] = elem = doc.createElementNS(attVal[0], attVal[1]);
- break;
- */
- case '#':
- {
- // Document fragment
- opts.$state = 'fragmentChilden';
- nodes[nodes.length] = jml(opts, attVal);
- break;
- }
-
- case '$shadow':
- {
- const {
- open,
- closed
- } = attVal;
- let {
- content,
- template
- } = attVal;
- const shadowRoot = elem.attachShadow({
- mode: closed || open === false ? 'closed' : 'open'
- });
-
- if (template) {
- if (Array.isArray(template)) {
- if (_getType(template[0]) === 'object') {
- // Has attributes
- template = jml('template', ...template, doc.body);
- } else {
- // Array is for the children
- template = jml('template', template, doc.body);
- }
- } else if (typeof template === 'string') {
- template = $(template);
- }
-
- jml(template.content.cloneNode(true), shadowRoot);
- } else {
- if (!content) {
- content = open || closed;
- }
-
- if (content && typeof content !== 'boolean') {
- if (Array.isArray(content)) {
- jml({
- '#': content
- }, shadowRoot);
- } else {
- jml(content, shadowRoot);
- }
- }
- }
-
- break;
- }
-
- case '$state':
- {
- // Handled internally
- break;
- }
-
- case 'is':
- {
- // Currently only in Chrome
- // Handled during element creation
- break;
- }
-
- case '$custom':
- {
- Object.assign(elem, attVal);
- break;
- }
-
- /* istanbul ignore next */
-
- case '$define':
- {
- const localName = elem.localName.toLowerCase(); // Note: customized built-ins sadly not working yet
-
- const customizedBuiltIn = !localName.includes('-'); // We check attribute in case this is a preexisting DOM element
- // const {is} = atts;
-
- let is;
-
- if (customizedBuiltIn) {
- is = elem.getAttribute('is');
-
- if (!is) {
- if (!{}.hasOwnProperty.call(atts, 'is')) {
- throw new TypeError(`Expected \`is\` with \`$define\` on built-in; args: ${JSON.stringify(args)}`);
- }
-
- atts.is = checkPluginValue(elem, 'is', atts.is, opts);
- elem.setAttribute('is', atts.is);
- ({
- is
- } = atts);
- }
- }
-
- const def = customizedBuiltIn ? is : localName;
-
- if (window.customElements.get(def)) {
- break;
- }
-
- const getConstructor = cnstrct => {
- const baseClass = options && options.extends ? doc.createElement(options.extends).constructor : customizedBuiltIn ? doc.createElement(localName).constructor : window.HTMLElement;
- /**
- * Class wrapping base class.
- */
-
- return cnstrct ? class extends baseClass {
- /**
- * Calls user constructor.
- */
- constructor() {
- super();
- cnstrct.call(this);
- }
-
- } : class extends baseClass {};
- };
-
- let cnstrctr, options, mixin;
-
- if (Array.isArray(attVal)) {
- if (attVal.length <= 2) {
- [cnstrctr, options] = attVal;
-
- if (typeof options === 'string') {
- // Todo: Allow creating a definition without using it;
- // that may be the only reason to have a string here which
- // differs from the `localName` anyways
- options = {
- extends: options
- };
- } else if (options && !{}.hasOwnProperty.call(options, 'extends')) {
- mixin = options;
- }
-
- if (typeof cnstrctr === 'object') {
- mixin = cnstrctr;
- cnstrctr = getConstructor();
- }
- } else {
- [cnstrctr, mixin, options] = attVal;
-
- if (typeof options === 'string') {
- options = {
- extends: options
- };
- }
- }
- } else if (typeof attVal === 'function') {
- cnstrctr = attVal;
- } else {
- mixin = attVal;
- cnstrctr = getConstructor();
- }
-
- if (!cnstrctr.toString().startsWith('class')) {
- cnstrctr = getConstructor(cnstrctr);
- }
-
- if (!options && customizedBuiltIn) {
- options = {
- extends: localName
- };
- }
-
- if (mixin) {
- Object.entries(mixin).forEach(([methodName, method]) => {
- cnstrctr.prototype[methodName] = method;
- });
- } // console.log('def', def, '::', typeof options === 'object' ? options : undefined);
-
-
- window.customElements.define(def, cnstrctr, typeof options === 'object' ? options : undefined);
- break;
- }
-
- case '$symbol':
- {
- const [symbol, func] = attVal;
-
- if (typeof func === 'function') {
- const funcBound = func.bind(elem);
-
- if (typeof symbol === 'string') {
- elem[Symbol.for(symbol)] = funcBound;
- } else {
- elem[symbol] = funcBound;
- }
- } else {
- const obj = func;
- obj.elem = elem;
-
- if (typeof symbol === 'string') {
- elem[Symbol.for(symbol)] = obj;
- } else {
- elem[symbol] = obj;
- }
- }
-
- break;
- }
-
- case '$data':
- {
- setMap(attVal);
- break;
- }
-
- case '$attribute':
- {
- // Attribute node
- const node = attVal.length === 3 ? doc.createAttributeNS(attVal[0], attVal[1]) : doc.createAttribute(attVal[0]);
- node.value = attVal[attVal.length - 1];
- nodes[nodes.length] = node;
- break;
- }
-
- case '$text':
- {
- // Todo: Also allow as jml(['a text node']) (or should that become a fragment)?
- const node = doc.createTextNode(attVal);
- nodes[nodes.length] = node;
- break;
- }
-
- case '$document':
- {
- // Todo: Conditionally create XML document
- const node = doc.implementation.createHTMLDocument();
-
- if (attVal.childNodes) {
- // Remove any extra nodes created by createHTMLDocument().
- const j = attVal.childNodes.length;
-
- while (node.childNodes[j]) {
- const cn = node.childNodes[j];
- cn.remove(); // `j` should stay the same as removing will cause node to be present
- }
-
- attVal.childNodes.forEach(_childrenToJML(node));
- } else {
- if (attVal.$DOCTYPE) {
- const dt = {
- $DOCTYPE: attVal.$DOCTYPE
- };
- const doctype = jml(dt);
- node.firstChild.replaceWith(doctype);
- }
-
- const html = node.childNodes[1];
- const head = html.childNodes[0];
- const body = html.childNodes[1];
-
- if (attVal.title || attVal.head) {
- const meta = doc.createElement('meta');
- meta.setAttribute('charset', 'utf-8');
- head.append(meta);
-
- if (attVal.title) {
- node.title = attVal.title; // Appends after meta
- }
-
- if (attVal.head) {
- attVal.head.forEach(_appendJML(head));
- }
- }
-
- if (attVal.body) {
- attVal.body.forEach(_appendJMLOrText(body));
- }
- }
-
- nodes[nodes.length] = node;
- break;
- }
-
- case '$DOCTYPE':
- {
- const node = doc.implementation.createDocumentType(attVal.name, attVal.publicId || '', attVal.systemId || '');
- nodes[nodes.length] = node;
- break;
- }
-
- case '$on':
- {
- // Events
- // Allow for no-op by defaulting to `{}`
- for (let [p2, val] of Object.entries(attVal || {})) {
- if (typeof val === 'function') {
- val = [val, false];
- }
-
- if (typeof val[0] !== 'function') {
- throw new TypeError(`Expect a function for \`$on\`; args: ${JSON.stringify(args)}`);
- }
-
- _addEvent(elem, p2, val[0], val[1]); // element, event name, handler, capturing
-
- }
-
- break;
- }
-
- case 'className':
- case 'class':
- attVal = checkPluginValue(elem, att, attVal, opts);
-
- if (!_isNullish(attVal)) {
- elem.className = attVal;
- }
-
- break;
-
- case 'dataset':
- {
- // Map can be keyed with hyphenated or camel-cased properties
- const recurse = (atVal, startProp) => {
- let prop = '';
- const pastInitialProp = startProp !== '';
- Object.keys(atVal).forEach(key => {
- const value = atVal[key];
-
- if (pastInitialProp) {
- prop = startProp + key.replace(hyphenForCamelCase, _upperCase).replace(/^([a-z])/u, _upperCase);
- } else {
- prop = startProp + key.replace(hyphenForCamelCase, _upperCase);
- }
-
- if (value === null || typeof value !== 'object') {
- if (!_isNullish(value)) {
- elem.dataset[prop] = value;
- }
-
- prop = startProp;
- return;
- }
-
- recurse(value, prop);
- });
- };
-
- recurse(attVal, '');
- break; // Todo: Disable this by default unless configuration explicitly allows (for security)
- }
- // #if IS_REMOVE
- // Don't remove this `if` block (for sake of no-innerHTML build)
-
- case 'innerHTML':
- if (!_isNullish(attVal)) {
- // eslint-disable-next-line no-unsanitized/property
- elem.innerHTML = attVal;
- }
-
- break;
- // #endif
-
- case 'htmlFor':
- case 'for':
- if (elStr === 'label') {
- attVal = checkPluginValue(elem, att, attVal, opts);
-
- if (!_isNullish(attVal)) {
- elem.htmlFor = attVal;
- }
-
- break;
- }
-
- attVal = checkPluginValue(elem, att, attVal, opts);
- elem.setAttribute(att, attVal);
- break;
-
- case 'xmlns':
- // Already handled
- break;
-
- default:
- {
- if (att.startsWith('on')) {
- attVal = checkPluginValue(elem, att, attVal, opts);
- elem[att] = attVal; // _addEvent(elem, att.slice(2), attVal, false); // This worked, but perhaps the user wishes only one event
-
- break;
- }
-
- if (att === 'style') {
- attVal = checkPluginValue(elem, att, attVal, opts);
-
- if (_isNullish(attVal)) {
- break;
- }
-
- if (typeof attVal === 'object') {
- for (const [p2, styleVal] of Object.entries(attVal)) {
- if (!_isNullish(styleVal)) {
- // Todo: Handle aggregate properties like "border"
- if (p2 === 'float') {
- elem.style.cssFloat = styleVal;
- elem.style.styleFloat = styleVal; // Harmless though we could make conditional on older IE instead
- } else {
- elem.style[p2.replace(hyphenForCamelCase, _upperCase)] = styleVal;
- }
- }
- }
-
- break;
- } // setAttribute unfortunately erases any existing styles
-
-
- elem.setAttribute(att, attVal);
- /*
- // The following reorders which is troublesome for serialization, e.g., as used in our testing
- if (elem.style.cssText !== undefined) {
- elem.style.cssText += attVal;
- } else { // Opera
- elem.style += attVal;
- }
- */
-
- break;
- }
-
- const matchingPlugin = getMatchingPlugin(opts, att);
-
- if (matchingPlugin) {
- matchingPlugin.set({
- opts,
- element: elem,
- attribute: {
- name: att,
- value: attVal
- }
- });
- break;
- }
-
- attVal = checkPluginValue(elem, att, attVal, opts);
- elem.setAttribute(att, attVal);
- break;
- }
- }
- }
- }
-
- const nodes = [];
- let elStr;
- let opts;
- let isRoot = false;
-
- if (_getType(args[0]) === 'object' && Object.keys(args[0]).some(key => possibleOptions.includes(key))) {
- opts = args[0];
-
- if (opts.$state === undefined) {
- isRoot = true;
- opts.$state = 'root';
- }
-
- if (opts.$map && !opts.$map.root && opts.$map.root !== false) {
- opts.$map = {
- root: opts.$map
- };
- }
-
- if ('$plugins' in opts) {
- if (!Array.isArray(opts.$plugins)) {
- throw new TypeError(`\`$plugins\` must be an array; args: ${JSON.stringify(args)}`);
- }
-
- opts.$plugins.forEach(pluginObj => {
- if (!pluginObj || typeof pluginObj !== 'object') {
- throw new TypeError(`Plugin must be an object; args: ${JSON.stringify(args)}`);
- }
-
- if (!pluginObj.name || !pluginObj.name.startsWith('$_')) {
- throw new TypeError(`Plugin object name must be present and begin with \`$_\`; args: ${JSON.stringify(args)}`);
- }
-
- if (typeof pluginObj.set !== 'function') {
- throw new TypeError(`Plugin object must have a \`set\` method; args: ${JSON.stringify(args)}`);
- }
- });
- }
-
- args = args.slice(1);
+ function _construct(Parent, args, Class) {
+ if (_isNativeReflectConstruct()) {
+ _construct = Reflect.construct;
} else {
- opts = {
- $state: undefined
+ _construct = function _construct(Parent, args, Class) {
+ var a = [null];
+ a.push.apply(a, args);
+ var Constructor = Function.bind.apply(Parent, a);
+ var instance = new Constructor();
+ if (Class) _setPrototypeOf(instance, Class.prototype);
+ return instance;
};
}
- const argc = args.length;
- const defaultMap = opts.$map && opts.$map.root;
+ return _construct.apply(null, arguments);
+ }
- const setMap = dataVal => {
- let map, obj; // Boolean indicating use of default map and object
+ function _isNativeFunction(fn) {
+ return Function.toString.call(fn).indexOf("[native code]") !== -1;
+ }
- if (dataVal === true) {
- [map, obj] = defaultMap;
- } else if (Array.isArray(dataVal)) {
- // Array of strings mapping to default
- if (typeof dataVal[0] === 'string') {
- dataVal.forEach(dVal => {
- setMap(opts.$map[dVal]);
- });
- return; // Array of Map and non-map data object
- }
+ function _wrapNativeSuper(Class) {
+ var _cache = typeof Map === "function" ? new Map() : undefined;
- map = dataVal[0] || defaultMap[0];
- obj = dataVal[1] || defaultMap[1]; // Map
- } else if (/^\[object (?:Weak)?Map\]$/u.test([].toString.call(dataVal))) {
- map = dataVal;
- obj = defaultMap[1]; // Non-map data object
- } else {
- map = defaultMap[0];
- obj = dataVal;
+ _wrapNativeSuper = function _wrapNativeSuper(Class) {
+ if (Class === null || !_isNativeFunction(Class)) return Class;
+
+ if (typeof Class !== "function") {
+ throw new TypeError("Super expression must either be null or a function");
}
- map.set(elem, obj);
+ if (typeof _cache !== "undefined") {
+ if (_cache.has(Class)) return _cache.get(Class);
+
+ _cache.set(Class, Wrapper);
+ }
+
+ function Wrapper() {
+ return _construct(Class, arguments, _getPrototypeOf(this).constructor);
+ }
+
+ Wrapper.prototype = Object.create(Class.prototype, {
+ constructor: {
+ value: Wrapper,
+ enumerable: false,
+ writable: true,
+ configurable: true
+ }
+ });
+ return _setPrototypeOf(Wrapper, Class);
};
- for (let i = 0; i < argc; i++) {
- let arg = args[i];
+ return _wrapNativeSuper(Class);
+ }
- const type = _getType(arg);
+ function _assertThisInitialized(self) {
+ if (self === void 0) {
+ throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+ }
- switch (type) {
- default:
- throw new TypeError(`Unexpected type: ${type}; arg: ${arg}; index ${i} on args: ${JSON.stringify(args)}`);
+ return self;
+ }
- case 'null':
- // null always indicates a place-holder (only needed for last argument if want array returned)
- if (i === argc - 1) {
- _applyAnyStylesheet(nodes[0]); // We have to execute any stylesheets even if not appending or otherwise IE will never apply them
- // Todo: Fix to allow application of stylesheets of style tags within fragments?
+ function _possibleConstructorReturn(self, call) {
+ if (call && (typeof call === "object" || typeof call === "function")) {
+ return call;
+ }
+ return _assertThisInitialized(self);
+ }
- return nodes.length <= 1 ? nodes[0] // eslint-disable-next-line
- : nodes.reduce(_fragReducer, doc.createDocumentFragment()); // nodes;
- }
+ function _createSuper(Derived) {
+ var hasNativeReflectConstruct = _isNativeReflectConstruct();
- throw new TypeError(`\`null\` values not allowed except as final Jamilih argument; index ${i} on args: ${JSON.stringify(args)}`);
+ return function _createSuperInternal() {
+ var Super = _getPrototypeOf(Derived),
+ result;
- case 'string':
- // Strings normally indicate elements
- switch (arg) {
- case '!':
- nodes[nodes.length] = doc.createComment(args[++i]);
- break;
+ if (hasNativeReflectConstruct) {
+ var NewTarget = _getPrototypeOf(this).constructor;
- case '?':
- {
- arg = args[++i];
- let procValue = args[++i];
- const val = procValue;
-
- if (val && typeof val === 'object') {
- procValue = [];
-
- for (const [p, procInstVal] of Object.entries(val)) {
- procValue.push(p + '=' + '"' + // https://www.w3.org/TR/xml-stylesheet/#NT-PseudoAttValue
- procInstVal.replace(/"/gu, '"') + '"');
- }
-
- procValue = procValue.join(' ');
- } // Firefox allows instructions with ">" in this method, but not if placed directly!
-
-
- try {
- nodes[nodes.length] = doc.createProcessingInstruction(arg, procValue);
- } catch (e) {
- // Getting NotSupportedError in IE, so we try to imitate a processing instruction with a comment
- // innerHTML didn't work
- // var elContainer = doc.createElement('div');
- // elContainer.innerHTML = '<?' + doc.createTextNode(arg + ' ' + procValue).nodeValue + '?>';
- // nodes[nodes.length] = elContainer.innerHTML;
- // Todo: any other way to resolve? Just use XML?
- nodes[nodes.length] = doc.createComment('?' + arg + ' ' + procValue + '?');
- }
-
- break; // Browsers don't support doc.createEntityReference, so we just use this as a convenience
- }
-
- case '&':
- nodes[nodes.length] = _createSafeReference('entity', '', args[++i]);
- break;
-
- case '#':
- // // Decimal character reference - ['#', '01234'] // Ӓ // probably easier to use JavaScript Unicode escapes
- nodes[nodes.length] = _createSafeReference('decimal', arg, String(args[++i]));
- break;
-
- case '#x':
- // Hex character reference - ['#x', '123a'] // ሺ // probably easier to use JavaScript Unicode escapes
- nodes[nodes.length] = _createSafeReference('hexadecimal', arg, args[++i]);
- break;
-
- case '![':
- // '![', ['escaped <&> text'] // <![CDATA[escaped <&> text]]>
- // CDATA valid in XML only, so we'll just treat as text for mutual compatibility
- // Todo: config (or detection via some kind of doc.documentType property?) of whether in XML
- try {
- nodes[nodes.length] = doc.createCDATASection(args[++i]);
- } catch (e2) {
- nodes[nodes.length] = doc.createTextNode(args[i]); // i already incremented
- }
-
- break;
-
- case '':
- nodes[nodes.length] = elem = doc.createDocumentFragment(); // Todo: Report to plugins
-
- opts.$state = 'fragment';
- break;
-
- default:
- {
- // An element
- elStr = arg;
- const atts = args[i + 1];
-
- if (_getType(atts) === 'object' && atts.is) {
- const {
- is
- } = atts; // istanbul ignore else
-
- if (doc.createElementNS) {
- elem = doc.createElementNS(NS_HTML, elStr, {
- is
- });
- } else {
- elem = doc.createElement(elStr, {
- is
- });
- }
- } else
- /* istanbul ignore else */
- if (doc.createElementNS) {
- elem = doc.createElementNS(NS_HTML, elStr);
- } else {
- elem = doc.createElement(elStr);
- } // Todo: Report to plugins
-
-
- opts.$state = 'element';
- nodes[nodes.length] = elem; // Add to parent
-
- break;
- }
- }
-
- break;
-
- case 'object':
- {
- // Non-DOM-element objects indicate attribute-value pairs
- const atts = arg;
-
- if (atts.xmlns !== undefined) {
- // We handle this here, as otherwise may lose events, etc.
- // As namespace of element already set as XHTML, we need to change the namespace
- // elem.setAttribute('xmlns', atts.xmlns); // Doesn't work
- // Can't set namespaceURI dynamically, renameNode() is not supported, and setAttribute() doesn't work to change the namespace, so we resort to this hack
- let replacer;
-
- if (typeof atts.xmlns === 'object') {
- replacer = _replaceDefiner(atts.xmlns);
- } else {
- replacer = ' xmlns="' + atts.xmlns + '"';
- } // try {
- // Also fix DOMParser to work with text/html
-
-
- elem = nodes[nodes.length - 1] = new win.DOMParser().parseFromString(new win.XMLSerializer().serializeToString(elem) // Mozilla adds XHTML namespace
- .replace(' xmlns="' + NS_HTML + '"', replacer), 'application/xml').documentElement; // Todo: Report to plugins
-
- opts.$state = 'element'; // }catch(e) {alert(elem.outerHTML);throw e;}
- }
-
- _checkAtts(atts);
-
- break;
- }
-
- case 'document':
- case 'fragment':
- case 'element':
- /*
- 1) Last element always the parent (put null if don't want parent and want to return array) unless only atts and children (no other elements)
- 2) Individual elements (DOM elements or sequences of string[/object/array]) get added to parent first-in, first-added
- */
- if (i === 0) {
- // Allow wrapping of element, fragment, or document
- elem = arg; // Todo: Report to plugins
-
- opts.$state = 'element';
- }
-
- if (i === argc - 1 || i === argc - 2 && args[i + 1] === null) {
- // parent
- const elsl = nodes.length;
-
- for (let k = 0; k < elsl; k++) {
- _appendNode(arg, nodes[k]);
- } // Todo: Apply stylesheets if any style tags were added elsewhere besides the first element?
-
-
- _applyAnyStylesheet(nodes[0]); // We have to execute any stylesheets even if not appending or otherwise IE will never apply them
-
- } else {
- nodes[nodes.length] = arg;
- }
-
- break;
-
- case 'array':
- {
- // Arrays or arrays of arrays indicate child nodes
- const child = arg;
- const cl = child.length;
-
- for (let j = 0; j < cl; j++) {
- // Go through children array container to handle elements
- const childContent = child[j];
- const childContentType = typeof childContent;
-
- if (_isNullish(childContent)) {
- throw new TypeError(`Bad children (parent array: ${JSON.stringify(args)}; index ${j} of child: ${JSON.stringify(child)})`);
- }
-
- switch (childContentType) {
- // Todo: determine whether null or function should have special handling or be converted to text
- case 'string':
- case 'number':
- case 'boolean':
- _appendNode(elem, doc.createTextNode(childContent));
-
- break;
-
- default:
- if (Array.isArray(childContent)) {
- // Arrays representing child elements
- opts.$state = 'children';
-
- _appendNode(elem, jml(opts, ...childContent));
- } else if (childContent['#']) {
- // Fragment
- opts.$state = 'fragmentChildren';
-
- _appendNode(elem, jml(opts, childContent['#']));
- } else {
- // Single DOM element children
- const newChildContent = checkPluginValue(elem, null, childContent, opts);
-
- _appendNode(elem, newChildContent);
- }
-
- break;
- }
- }
-
- break;
- }
+ result = Reflect.construct(Super, arguments, NewTarget);
+ } else {
+ result = Super.apply(this, arguments);
}
+
+ return _possibleConstructorReturn(this, result);
+ };
+ }
+
+ function _superPropBase(object, property) {
+ while (!Object.prototype.hasOwnProperty.call(object, property)) {
+ object = _getPrototypeOf(object);
+ if (object === null) break;
}
- const ret = nodes[0] || elem;
+ return object;
+ }
- if (isRoot && opts.$map && opts.$map.root) {
- setMap(true);
- }
+ function _get(target, property, receiver) {
+ if (typeof Reflect !== "undefined" && Reflect.get) {
+ _get = Reflect.get;
+ } else {
+ _get = function _get(target, property, receiver) {
+ var base = _superPropBase(target, property);
- return ret;
- };
- /**
- * Converts a DOM object or a string of HTML into a Jamilih object (or string).
- * @param {string|HTMLElement} dom If a string, will parse as document
- * @param {PlainObject} [config] Configuration object
- * @param {boolean} [config.stringOutput=false] Whether to output the Jamilih object as a string.
- * @param {boolean} [config.reportInvalidState=true] If true (the default), will report invalid state errors
- * @param {boolean} [config.stripWhitespace=false] Strip whitespace for text nodes
- * @returns {JamilihArray|string} Array containing the elements which represent
- * a Jamilih object, or, if `stringOutput` is true, it will be the stringified
- * version of such an object
- */
+ if (!base) return;
+ var desc = Object.getOwnPropertyDescriptor(base, property);
-
- jml.toJML = function (dom, {
- stringOutput = false,
- reportInvalidState = true,
- stripWhitespace = false
- } = {}) {
- if (typeof dom === 'string') {
- dom = new win.DOMParser().parseFromString(dom, 'text/html'); // todo: Give option for XML once implemented and change JSDoc to allow for Element
- }
-
- const ret = [];
- let parent = ret;
- let parentIdx = 0;
- /**
- * @param {string} msg
- * @throws {DOMException}
- * @returns {void}
- */
-
- function invalidStateError(msg) {
- // These are probably only necessary if working with text/html
-
- /* eslint-disable no-shadow, unicorn/custom-error-definition */
-
- /**
- * Polyfill for `DOMException`.
- */
- class DOMException extends Error {
- /* eslint-enable no-shadow, unicorn/custom-error-definition */
-
- /**
- * @param {string} message
- * @param {string} name
- */
- constructor(message, name) {
- super(message); // eslint-disable-next-line unicorn/custom-error-definition
-
- this.name = name;
+ if (desc.get) {
+ return desc.get.call(receiver);
}
- }
-
- if (reportInvalidState) {
- // INVALID_STATE_ERR per section 9.3 XHTML 5: http://www.w3.org/TR/html5/the-xhtml-syntax.html
- const e = new DOMException(msg, 'INVALID_STATE_ERR');
- e.code = 11;
- throw e;
- }
- }
- /**
- *
- * @param {DocumentType|Entity} obj
- * @param {Node} node
- * @returns {void}
- */
-
-
- function addExternalID(obj, node) {
- if (node.systemId.includes('"') && node.systemId.includes("'")) {
- invalidStateError('systemId cannot have both single and double quotes.');
- }
-
- const {
- publicId,
- systemId
- } = node;
-
- if (systemId) {
- obj.systemId = systemId;
- }
-
- if (publicId) {
- obj.publicId = publicId;
- }
- }
- /**
- *
- * @param {any} val
- * @returns {void}
- */
-
-
- function set(val) {
- parent[parentIdx] = val;
- parentIdx++;
- }
- /**
- * @returns {void}
- */
-
-
- function setChildren() {
- set([]);
- parent = parent[parentIdx - 1];
- parentIdx = 0;
- }
- /**
- *
- * @param {string} prop1
- * @param {string} prop2
- * @returns {void}
- */
-
-
- function setObj(prop1, prop2) {
- parent = parent[parentIdx - 1][prop1];
- parentIdx = 0;
-
- if (prop2) {
- parent = parent[prop2];
- }
- }
- /**
- *
- * @param {Node} node
- * @param {object<{string: string}>} namespaces
- * @returns {void}
- */
-
-
- function parseDOM(node, namespaces) {
- // namespaces = clone(namespaces) || {}; // Ensure we're working with a copy, so different levels in the hierarchy can treat it differently
-
- /*
- if ((node.prefix && node.prefix.includes(':')) || (node.localName && node.localName.includes(':'))) {
- invalidStateError('Prefix cannot have a colon');
- }
- */
- const type = 'nodeType' in node ? node.nodeType : null;
- namespaces = _extends({}, namespaces);
- const xmlChars = /^([\u0009\u000A\u000D\u0020-\uD7FF\uE000-\uFFFD]|[\uD800-\uDBFF][\uDC00-\uDFFF])*$/u; // eslint-disable-line no-control-regex
-
- if ([2, 3, 4, 7, 8].includes(type) && !xmlChars.test(node.nodeValue)) {
- invalidStateError('Node has bad XML character value');
- }
-
- let tmpParent, tmpParentIdx;
- /**
- * @returns {void}
- */
-
- function setTemp() {
- tmpParent = parent;
- tmpParentIdx = parentIdx;
- }
- /**
- * @returns {void}
- */
-
-
- function resetTemp() {
- parent = tmpParent;
- parentIdx = tmpParentIdx;
- parentIdx++; // Increment index in parent container of this element
- }
-
- switch (type) {
- case 1:
- {
- // ELEMENT
- setTemp();
- const nodeName = node.nodeName.toLowerCase(); // Todo: for XML, should not lower-case
-
- setChildren(); // Build child array since elements are, except at the top level, encapsulated in arrays
-
- set(nodeName);
- const start = {};
- let hasNamespaceDeclaration = false;
-
- if (namespaces[node.prefix || ''] !== node.namespaceURI) {
- namespaces[node.prefix || ''] = node.namespaceURI;
-
- if (node.prefix) {
- start['xmlns:' + node.prefix] = node.namespaceURI;
- } else if (node.namespaceURI) {
- start.xmlns = node.namespaceURI;
- } else {
- start.xmlns = null;
- }
-
- hasNamespaceDeclaration = true;
- }
-
- if (node.attributes.length) {
- set([...node.attributes].reduce(function (obj, att) {
- obj[att.name] = att.value; // Attr.nodeName and Attr.nodeValue are deprecated as of DOM4 as Attr no longer inherits from Node, so we can safely use name and value
-
- return obj;
- }, start));
- } else if (hasNamespaceDeclaration) {
- set(start);
- }
-
- const {
- childNodes
- } = node;
-
- if (childNodes.length) {
- setChildren(); // Element children array container
-
- [...childNodes].forEach(function (childNode) {
- parseDOM(childNode, namespaces);
- });
- }
-
- resetTemp();
- break;
- }
-
- case undefined: // Treat as attribute node until this is fixed: https://github.com/jsdom/jsdom/issues/1641 / https://github.com/jsdom/jsdom/pull/1822
-
- case 2:
- // ATTRIBUTE (should only get here if passing in an attribute node)
- set({
- $attribute: [node.namespaceURI, node.name, node.value]
- });
- break;
-
- case 3:
- // TEXT
- if (stripWhitespace && /^\s+$/u.test(node.nodeValue)) {
- set('');
- return;
- }
-
- set(node.nodeValue);
- break;
-
- case 4:
- // CDATA
- if (node.nodeValue.includes(']]' + '>')) {
- invalidStateError('CDATA cannot end with closing ]]>');
- }
-
- set(['![', node.nodeValue]);
- break;
-
- case 5:
- // ENTITY REFERENCE (though not in browsers (was already resolved
- // anyways), ok to keep for parity with our "entity" shorthand)
- set(['&', node.nodeName]);
- break;
-
- case 7:
- // PROCESSING INSTRUCTION
- if (/^xml$/iu.test(node.target)) {
- invalidStateError('Processing instructions cannot be "xml".');
- }
-
- if (node.target.includes('?>')) {
- invalidStateError('Processing instruction targets cannot include ?>');
- }
-
- if (node.target.includes(':')) {
- invalidStateError('The processing instruction target cannot include ":"');
- }
-
- if (node.data.includes('?>')) {
- invalidStateError('Processing instruction data cannot include ?>');
- }
-
- set(['?', node.target, node.data]); // Todo: Could give option to attempt to convert value back into object if has pseudo-attributes
-
- break;
-
- case 8:
- // COMMENT
- if (node.nodeValue.includes('--') || node.nodeValue.length && node.nodeValue.lastIndexOf('-') === node.nodeValue.length - 1) {
- invalidStateError('Comments cannot include --');
- }
-
- set(['!', node.nodeValue]);
- break;
-
- case 9:
- {
- // DOCUMENT
- setTemp();
- const docObj = {
- $document: {
- childNodes: []
- }
- };
- set(docObj); // doc.implementation.createHTMLDocument
- // Set position to fragment's array children
-
- setObj('$document', 'childNodes');
- const {
- childNodes
- } = node;
-
- if (!childNodes.length) {
- invalidStateError('Documents must have a child node');
- } // set({$xmlDocument: []}); // doc.implementation.createDocument // Todo: use this conditionally
-
-
- [...childNodes].forEach(function (childNode) {
- // Can't just do documentElement as there may be doctype, comments, etc.
- // No need for setChildren, as we have already built the container array
- parseDOM(childNode, namespaces);
- });
- resetTemp();
- break;
- }
-
- case 10:
- {
- // DOCUMENT TYPE
- setTemp(); // Can create directly by doc.implementation.createDocumentType
-
- const start = {
- $DOCTYPE: {
- name: node.name
- }
- };
- const pubIdChar = /^(\u0020|\u000D|\u000A|[a-zA-Z0-9]|[-'()+,./:=?;!*#@$_%])*$/u; // eslint-disable-line no-control-regex
-
- if (!pubIdChar.test(node.publicId)) {
- invalidStateError('A publicId must have valid characters.');
- }
-
- addExternalID(start.$DOCTYPE, node); // Fit in internal subset along with entities?: probably don't need as these would only differ if from DTD, and we're not rebuilding the DTD
-
- set(start); // Auto-generate the internalSubset instead?
-
- resetTemp();
- break;
- }
-
- case 11:
- {
- // DOCUMENT FRAGMENT
- setTemp();
- set({
- '#': []
- }); // Set position to fragment's array children
-
- setObj('#');
- const {
- childNodes
- } = node;
- [...childNodes].forEach(function (childNode) {
- // No need for setChildren, as we have already built the container array
- parseDOM(childNode, namespaces);
- });
- resetTemp();
- break;
- }
-
- default:
- throw new TypeError('Not an XML type');
- }
- }
-
- parseDOM(dom, {});
-
- if (stringOutput) {
- return JSON.stringify(ret[0]);
- }
-
- return ret[0];
- };
-
- jml.toJMLString = function (dom, config) {
- return jml.toJML(dom, Object.assign(config || {}, {
- stringOutput: true
- }));
- };
- /**
- *
- * @param {...JamilihArray} args
- * @returns {JamilihReturn}
- */
-
-
- jml.toDOM = function (...args) {
- // Alias for jml()
- return jml(...args);
- };
- /**
- *
- * @param {...JamilihArray} args
- * @returns {string}
- */
-
-
- jml.toHTML = function (...args) {
- // Todo: Replace this with version of jml() that directly builds a string
- const ret = jml(...args); // Todo: deal with serialization of properties like 'selected',
- // 'checked', 'value', 'defaultValue', 'for', 'dataset', 'on*',
- // 'style'! (i.e., need to build a string ourselves)
-
- return ret.outerHTML;
- };
- /**
- *
- * @param {...JamilihArray} args
- * @returns {string}
- */
-
-
- jml.toDOMString = function (...args) {
- // Alias for jml.toHTML for parity with jml.toJMLString
- return jml.toHTML(...args);
- };
- /**
- *
- * @param {...JamilihArray} args
- * @returns {string}
- */
-
-
- jml.toXML = function (...args) {
- const ret = jml(...args);
- return new win.XMLSerializer().serializeToString(ret);
- };
- /**
- *
- * @param {...JamilihArray} args
- * @returns {string}
- */
-
-
- jml.toXMLDOMString = function (...args) {
- // Alias for jml.toXML for parity with jml.toJMLString
- return jml.toXML(...args);
- };
- /**
- * Element-aware wrapper for `Map`.
- */
-
-
- class JamilihMap extends Map {
- /**
- * @param {string|Element} elem
- * @returns {any}
- */
- get(elem) {
- elem = typeof elem === 'string' ? $(elem) : elem;
- return super.get.call(this, elem);
- }
- /**
- * @param {string|Element} elem
- * @param {any} value
- * @returns {any}
- */
-
-
- set(elem, value) {
- elem = typeof elem === 'string' ? $(elem) : elem;
- return super.set.call(this, elem, value);
- }
- /**
- * @param {string|Element} elem
- * @param {string} methodName
- * @param {...any} args
- * @returns {any}
- */
-
-
- invoke(elem, methodName, ...args) {
- elem = typeof elem === 'string' ? $(elem) : elem;
- return this.get(elem)[methodName](elem, ...args);
- }
-
- }
- /**
- * Element-aware wrapper for `WeakMap`.
- */
-
-
- class JamilihWeakMap extends WeakMap {
- /**
- * @param {string|Element} elem
- * @returns {any}
- */
- get(elem) {
- elem = typeof elem === 'string' ? $(elem) : elem;
- return super.get.call(this, elem);
- }
- /**
- * @param {string|Element} elem
- * @param {any} value
- * @returns {any}
- */
-
-
- set(elem, value) {
- elem = typeof elem === 'string' ? $(elem) : elem;
- return super.set.call(this, elem, value);
- }
- /**
- * @param {string|Element} elem
- * @param {string} methodName
- * @param {...any} args
- * @returns {any}
- */
-
-
- invoke(elem, methodName, ...args) {
- elem = typeof elem === 'string' ? $(elem) : elem;
- return this.get(elem)[methodName](elem, ...args);
- }
-
- }
-
- jml.Map = JamilihMap;
- jml.WeakMap = JamilihWeakMap;
- /**
- * @typedef {GenericArray} MapAndElementArray
- * @property {JamilihWeakMap|JamilihMap} 0
- * @property {Element} 1
- */
-
- /**
- * @param {GenericObject} obj
- * @param {...JamilihArray} args
- * @returns {MapAndElementArray}
- */
-
- jml.weak = function (obj, ...args) {
- const map = new JamilihWeakMap();
- const elem = jml({
- $map: [map, obj]
- }, ...args);
- return [map, elem];
- };
- /**
- * @param {any} obj
- * @param {...JamilihArray} args
- * @returns {MapAndElementArray}
- */
-
-
- jml.strong = function (obj, ...args) {
- const map = new JamilihMap();
- const elem = jml({
- $map: [map, obj]
- }, ...args);
- return [map, elem];
- };
- /**
- * @param {string|Element} elem If a string, will be interpreted as a selector
- * @param {symbol|string} sym If a string, will be used with `Symbol.for`
- * @returns {any} The value associated with the symbol
- */
-
-
- jml.symbol = jml.sym = jml.for = function (elem, sym) {
- elem = typeof elem === 'string' ? $(elem) : elem;
- return elem[typeof sym === 'symbol' ? sym : Symbol.for(sym)];
- };
- /**
- * @param {string|Element} elem If a string, will be interpreted as a selector
- * @param {symbol|string|Map|WeakMap} symOrMap If a string, will be used with `Symbol.for`
- * @param {string|any} methodName Can be `any` if the symbol or map directly
- * points to a function (it is then used as the first argument).
- * @param {any[]} args
- * @returns {any}
- */
-
-
- jml.command = function (elem, symOrMap, methodName, ...args) {
- elem = typeof elem === 'string' ? $(elem) : elem;
- let func;
-
- if (['symbol', 'string'].includes(typeof symOrMap)) {
- func = jml.sym(elem, symOrMap);
-
- if (typeof func === 'function') {
- return func(methodName, ...args); // Already has `this` bound to `elem`
- }
-
- return func[methodName](...args);
- }
-
- func = symOrMap.get(elem);
-
- if (typeof func === 'function') {
- return func.call(elem, methodName, ...args);
- }
-
- return func[methodName](elem, ...args); // return func[methodName].call(elem, ...args);
- };
- /**
- * Expects properties `document`, `XMLSerializer`, and `DOMParser`.
- * Also updates `body` with `document.body`.
- * @param {Window} wind
- * @returns {void}
- */
-
-
- jml.setWindow = wind => {
- win = wind;
- doc = win.document;
-
- if (doc && doc.body) {
- ({
- body
- } = doc);
- }
- };
- /**
- * @returns {Window}
- */
-
-
- jml.getWindow = () => {
- return win;
- };
-
-
- let body = doc && doc.body; // eslint-disable-line import/no-mutable-exports
-
- const nbsp = '\u00A0'; // Very commonly needed in templates
-
- /**
- * ISC License
- *
- * Copyright (c) 2018, Andrea Giammarchi, @WebReflection
- *
- * Permission to use, copy, modify, and/or distribute this software for any
- * purpose with or without fee is hereby granted, provided that the above
- * copyright notice and this permission notice appear in all copies.
- *
- * THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
- * REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
- * AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
- * INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
- * LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE
- * OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
- * PERFORMANCE OF THIS SOFTWARE.
- */
- class QueryResult extends Array {}
-
- const {
- create,
- defineProperty
- } = Object;
- const AP = Array.prototype;
- const DOM_CONTENT_LOADED = 'DOMContentLoaded';
- const LOAD = 'load';
- const NO_TRANSPILER_ISSUES = new QueryResult() instanceof QueryResult;
- const QRP = QueryResult.prototype; // fixes methods returning non QueryResult
-
- /* istanbul ignore if */
-
- if (!NO_TRANSPILER_ISSUES) Object.getOwnPropertyNames(AP).forEach(name => {
- const desc = Object.getOwnPropertyDescriptor(AP, name);
-
- if (typeof desc.value === 'function') {
- const fn = desc.value;
-
- desc.value = function () {
- const result = fn.apply(this, arguments);
- return result instanceof Array ? patch(result) : result;
+ return desc.value;
};
}
- defineProperty(QRP, name, desc);
- }); // fixes badly transpiled classes
-
- const patch = NO_TRANSPILER_ISSUES ? qr => qr :
- /* istanbul ignore next */
- qr => {
- const nqr = create(QRP);
- push.apply(nqr, slice(qr));
- return nqr;
- };
- const push = AP.push;
-
- const search = (list, el) => {
- const nodes = [];
- const length = list.length;
-
- for (let i = 0; i < length; i++) {
- const css = list[i].trim();
-
- if (css.slice(-6) === ':first') {
- const node = el.querySelector(css.slice(0, -6));
- if (node) push.call(nodes, node);
- } else push.apply(nodes, slice(el.querySelectorAll(css)));
- }
-
- return new QueryResult(...nodes);
- };
-
- const slice = NO_TRANSPILER_ISSUES ? patch :
- /* istanbul ignore next */
- all => {
- // do not use slice.call(...) due old IE gotcha
- const nodes = [];
- const length = all.length;
-
- for (let i = 0; i < length; i++) nodes[i] = all[i];
-
- return nodes;
- }; // use function to avoid usage of Symbol.hasInstance
- // (broken in older browsers anyway)
-
- const $$1 = function $(CSS, parent = document) {
- switch (typeof CSS) {
- case 'string':
- return patch(search(CSS.split(','), parent));
-
- case 'object':
- // needed to avoid iterator dance (breaks in older IEs)
- const nodes = [];
- const all = 'nodeType' in CSS || 'postMessage' in CSS ? [CSS] : CSS;
- push.apply(nodes, slice(all));
- return patch(new QueryResult(...nodes));
-
- case 'function':
- const $parent = $(parent);
- const $window = $(parent.defaultView);
- const handler = {
- handleEvent(event) {
- $parent.off(DOM_CONTENT_LOADED, handler);
- $window.off(LOAD, handler);
- CSS(event);
- }
-
- };
- $parent.on(DOM_CONTENT_LOADED, handler);
- $window.on(LOAD, handler);
- const rs = parent.readyState;
- if (rs == 'complete' || rs != 'loading' && !parent.documentElement.doScroll) setTimeout(() => $parent.dispatch(DOM_CONTENT_LOADED));
- return $;
- }
- };
-
- $$1.prototype = QRP;
-
- $$1.extend = (key, value) => (defineProperty(QRP, key, {
- configurable: true,
- value
- }), $$1); // dropped usage of for-of to avoid broken iteration dance in older IEs
-
-
- $$1.extend('dispatch', function dispatch(type, init = {}) {
- const event = new CustomEvent(type, init);
- const length = this.length;
-
- for (let i = 0; i < length; i++) this[i].dispatchEvent(event);
-
- return this;
- }).extend('off', function off(type, handler, options = false) {
- const length = this.length;
-
- for (let i = 0; i < length; i++) this[i].removeEventListener(type, handler, options);
-
- return this;
- }).extend('on', function on(type, handler, options = false) {
- const length = this.length;
-
- for (let i = 0; i < length; i++) this[i].addEventListener(type, handler, options);
-
- return this;
- });
-
- function _typeof(obj) {
- "@babel/helpers - typeof";
-
- if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
- _typeof = function (obj) {
- return typeof obj;
- };
- } else {
- _typeof = function (obj) {
- return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
- };
- }
-
- return _typeof(obj);
+ return _get(target, property, receiver || target);
}
function _slicedToArray(arr, i) {
@@ -2161,8 +329,2335 @@
throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
+ /*
+ Possible todos:
+ 0. Add XSLT to JML-string stylesheet (or even vice versa)
+ 0. IE problem: Add JsonML code to handle name attribute (during element creation)
+ 0. Element-specific: IE object-param handling
+
+ Todos inspired by JsonML: https://github.com/mckamey/jsonml/blob/master/jsonml-html.js
+
+ 0. duplicate attributes?
+ 0. expand ATTR_MAP
+ 0. equivalent of markup, to allow strings to be embedded within an object (e.g., {$value: '<div>id</div>'}); advantage over innerHTML in that it wouldn't need to work as the entire contents (nor destroy any existing content or handlers)
+ 0. More validation?
+ 0. JsonML DOM Level 0 listener
+ 0. Whitespace trimming?
+
+ JsonML element-specific:
+ 0. table appending
+ 0. canHaveChildren necessary? (attempts to append to script and img)
+
+ Other Todos:
+ 0. Note to self: Integrate research from other jml notes
+ 0. Allow Jamilih to be seeded with an existing element, so as to be able to add/modify attributes and children
+ 0. Allow array as single first argument
+ 0. Settle on whether need to use null as last argument to return array (or fragment) or other way to allow appending? Options object at end instead to indicate whether returning array, fragment, first element, etc.?
+ 0. Allow building of generic XML (pass configuration object)
+ 0. Allow building content internally as a string (though allowing DOM methods, etc.?)
+ 0. Support JsonML empty string element name to represent fragments?
+ 0. Redo browser testing of jml (including ensuring IE7 can work even if test framework can't work)
+ */
+ // istanbul ignore next
+ var win = typeof window !== 'undefined' && window; // istanbul ignore next
+
+ var doc = typeof document !== 'undefined' && document || win && win.document; // STATIC PROPERTIES
+
+ var possibleOptions = ['$plugins', // '$mode', // Todo (SVG/XML)
+ // '$state', // Used internally
+ '$map' // Add any other options here
+ ];
+ var NS_HTML = 'http://www.w3.org/1999/xhtml',
+ hyphenForCamelCase = /\x2D([a-z])/g;
+ var ATTR_MAP = {
+ maxlength: 'maxLength',
+ minlength: 'minLength',
+ readonly: 'readOnly'
+ }; // We define separately from ATTR_DOM for clarity (and parity with JsonML) but no current need
+ // We don't set attribute esp. for boolean atts as we want to allow setting of `undefined`
+ // (e.g., from an empty variable) on templates to have no effect
+
+ var BOOL_ATTS = ['checked', 'defaultChecked', 'defaultSelected', 'disabled', 'indeterminate', 'open', // Dialog elements
+ 'readOnly', 'selected']; // From JsonML
+
+ var ATTR_DOM = BOOL_ATTS.concat(['accessKey', // HTMLElement
+ 'async', 'autocapitalize', // HTMLElement
+ 'autofocus', 'contentEditable', // HTMLElement through ElementContentEditable
+ 'defaultValue', 'defer', 'draggable', // HTMLElement
+ 'formnovalidate', 'hidden', // HTMLElement
+ 'innerText', // HTMLElement
+ 'inputMode', // HTMLElement through ElementContentEditable
+ 'ismap', 'multiple', 'novalidate', 'pattern', 'required', 'spellcheck', // HTMLElement
+ 'translate', // HTMLElement
+ 'value', 'willvalidate']); // Todo: Add more to this as useful for templating
+ // to avoid setting through nullish value
+
+ var NULLABLES = ['autocomplete', 'dir', // HTMLElement
+ 'integrity', // script, link
+ 'lang', // HTMLElement
+ 'max', 'min', 'minLength', 'maxLength', 'title' // HTMLElement
+ ];
+
+ var $ = function $(sel) {
+ return doc.querySelector(sel);
+ };
+ /**
+ * Retrieve the (lower-cased) HTML name of a node.
+ * @static
+ * @param {Node} node The HTML node
+ * @returns {string} The lower-cased node name
+ */
+
+
+ function _getHTMLNodeName(node) {
+ return node.nodeName && node.nodeName.toLowerCase();
+ }
+ /**
+ * Apply styles if this is a style tag.
+ * @static
+ * @param {Node} node The element to check whether it is a style tag
+ * @returns {void}
+ */
+
+
+ function _applyAnyStylesheet(node) {
+ // Only used in IE
+ // istanbul ignore else
+ if (!doc.createStyleSheet) {
+ return;
+ } // istanbul ignore next
+
+
+ if (_getHTMLNodeName(node) === 'style') {
+ // IE
+ var ss = doc.createStyleSheet(); // Create a stylesheet to actually do something useful
+
+ ss.cssText = node.cssText; // We continue to add the style tag, however
+ }
+ }
+ /**
+ * Need this function for IE since options weren't otherwise getting added.
+ * @private
+ * @static
+ * @param {Element} parent The parent to which to append the element
+ * @param {Node} child The element or other node to append to the parent
+ * @returns {void}
+ */
+
+
+ function _appendNode(parent, child) {
+ var parentName = _getHTMLNodeName(parent); // IE only
+ // istanbul ignore if
+
+
+ if (doc.createStyleSheet) {
+ if (parentName === 'script') {
+ parent.text = child.nodeValue;
+ return;
+ }
+
+ if (parentName === 'style') {
+ parent.cssText = child.nodeValue; // This will not apply it--just make it available within the DOM cotents
+
+ return;
+ }
+ }
+
+ if (parentName === 'template') {
+ parent.content.append(child);
+ return;
+ }
+
+ try {
+ parent.append(child); // IE9 is now ok with this
+ } catch (e) {
+ // istanbul ignore next
+ var childName = _getHTMLNodeName(child); // istanbul ignore next
+
+
+ if (parentName === 'select' && childName === 'option') {
+ try {
+ // Since this is now DOM Level 4 standard behavior (and what IE7+ can handle), we try it first
+ parent.add(child);
+ } catch (err) {
+ // DOM Level 2 did require a second argument, so we try it too just in case the user is using an older version of Firefox, etc.
+ parent.add(child, null); // IE7 has a problem with this, but IE8+ is ok
+ }
+
+ return;
+ } // istanbul ignore next
+
+
+ throw e;
+ }
+ }
+ /**
+ * Attach event in a cross-browser fashion.
+ * @static
+ * @param {Element} el DOM element to which to attach the event
+ * @param {string} type The DOM event (without 'on') to attach to the element
+ * @param {EventListener} handler The event handler to attach to the element
+ * @param {boolean} [capturing] Whether or not the event should be
+ * capturing (W3C-browsers only); default is false; NOT IN USE
+ * @returns {void}
+ */
+
+
+ function _addEvent(el, type, handler, capturing) {
+ el.addEventListener(type, handler, Boolean(capturing));
+ }
+ /**
+ * Creates a text node of the result of resolving an entity or character reference.
+ * @param {'entity'|'decimal'|'hexadecimal'} type Type of reference
+ * @param {string} prefix Text to prefix immediately after the "&"
+ * @param {string} arg The body of the reference
+ * @returns {Text} The text node of the resolved reference
+ */
+
+
+ function _createSafeReference(type, prefix, arg) {
+ // For security reasons related to innerHTML, we ensure this string only
+ // contains potential entity characters
+ if (!arg.match(/^[0-9A-Z_a-z]+$/)) {
+ throw new TypeError("Bad ".concat(type, " reference; with prefix \"").concat(prefix, "\" and arg \"").concat(arg, "\""));
+ }
+
+ var elContainer = doc.createElement('div'); // Todo: No workaround for XML?
+ // eslint-disable-next-line no-unsanitized/property
+
+ elContainer.innerHTML = '&' + prefix + arg + ';';
+ return doc.createTextNode(elContainer.innerHTML);
+ }
+ /**
+ * @param {string} n0 Whole expression match (including "-")
+ * @param {string} n1 Lower-case letter match
+ * @returns {string} Uppercased letter
+ */
+
+
+ function _upperCase(n0, n1) {
+ return n1.toUpperCase();
+ } // Todo: Make as public utility
+
+ /**
+ * @param {any} o
+ * @returns {boolean}
+ */
+
+
+ function _isNullish(o) {
+ return o === null || o === undefined;
+ } // Todo: Make as public utility, but also return types for undefined, boolean, number, document, etc.
+
+ /**
+ * @private
+ * @static
+ * @param {string|JamilihAttributes|JamilihArray|Element|DocumentFragment} item
+ * @returns {"string"|"null"|"array"|"element"|"fragment"|"object"|"symbol"|"function"|"number"|"boolean"}
+ */
+
+
+ function _getType(item) {
+ var type = _typeof(item);
+
+ switch (type) {
+ case 'object':
+ if (item === null) {
+ return 'null';
+ }
+
+ if (Array.isArray(item)) {
+ return 'array';
+ }
+
+ if ('nodeType' in item) {
+ switch (item.nodeType) {
+ case 1:
+ return 'element';
+
+ case 9:
+ return 'document';
+
+ case 11:
+ return 'fragment';
+
+ default:
+ return 'non-container node';
+ }
+ }
+
+ // Fallthrough
+
+ default:
+ return type;
+ }
+ }
+ /**
+ * @private
+ * @static
+ * @param {DocumentFragment} frag
+ * @param {Node} node
+ * @returns {DocumentFragment}
+ */
+
+
+ function _fragReducer(frag, node) {
+ frag.append(node);
+ return frag;
+ }
+ /**
+ * @private
+ * @static
+ * @param {Object<{string:string}>} xmlnsObj
+ * @returns {string}
+ */
+
+
+ function _replaceDefiner(xmlnsObj) {
+ return function (n0) {
+ var retStr = xmlnsObj[''] ? ' xmlns="' + xmlnsObj[''] + '"' : n0; // Preserve XHTML
+
+ for (var _i = 0, _Object$entries = Object.entries(xmlnsObj); _i < _Object$entries.length; _i++) {
+ var _Object$entries$_i = _slicedToArray(_Object$entries[_i], 2),
+ ns = _Object$entries$_i[0],
+ xmlnsVal = _Object$entries$_i[1];
+
+ if (ns !== '') {
+ retStr += ' xmlns:' + ns + '="' + xmlnsVal + '"';
+ }
+ }
+
+ return retStr;
+ };
+ }
+ /**
+ * @typedef {JamilihAttributes} AttributeArray
+ * @property {string} 0 The key
+ * @property {string} 1 The value
+ */
+
+ /**
+ * @callback ChildrenToJMLCallback
+ * @param {JamilihArray|Jamilih} childNodeJML
+ * @param {Integer} i
+ * @returns {void}
+ */
+
+ /**
+ * @private
+ * @static
+ * @param {Node} node
+ * @returns {ChildrenToJMLCallback}
+ */
+
+
+ function _childrenToJML(node) {
+ return function (childNodeJML, i) {
+ var cn = node.childNodes[i];
+ var j = Array.isArray(childNodeJML) ? jml.apply(void 0, _toConsumableArray(childNodeJML)) : jml(childNodeJML);
+ cn.replaceWith(j);
+ };
+ }
+ /**
+ * @callback JamilihAppender
+ * @param {JamilihArray} childJML
+ * @returns {void}
+ */
+
+ /**
+ * @private
+ * @static
+ * @param {Node} node
+ * @returns {JamilihAppender}
+ */
+
+
+ function _appendJML(node) {
+ return function (childJML) {
+ if (Array.isArray(childJML)) {
+ node.append(jml.apply(void 0, _toConsumableArray(childJML)));
+ } else {
+ node.append(jml(childJML));
+ }
+ };
+ }
+ /**
+ * @callback appender
+ * @param {string|JamilihArray} childJML
+ * @returns {void}
+ */
+
+ /**
+ * @private
+ * @static
+ * @param {Node} node
+ * @returns {appender}
+ */
+
+
+ function _appendJMLOrText(node) {
+ return function (childJML) {
+ if (typeof childJML === 'string') {
+ node.append(childJML);
+ } else if (Array.isArray(childJML)) {
+ node.append(jml.apply(void 0, _toConsumableArray(childJML)));
+ } else {
+ node.append(jml(childJML));
+ }
+ };
+ }
+ /**
+ * @private
+ * @static
+ */
+
+ /*
+ function _DOMfromJMLOrString (childNodeJML) {
+ if (typeof childNodeJML === 'string') {
+ return doc.createTextNode(childNodeJML);
+ }
+ return jml(...childNodeJML);
+ }
+ */
+
+ /**
+ * @typedef {Element|DocumentFragment} JamilihReturn
+ */
+
+ /**
+ * @typedef {PlainObject<string, string>} JamilihAttributes
+ */
+
+ /**
+ * @typedef {GenericArray} JamilihArray
+ * @property {string} 0 The element to create (by lower-case name)
+ * @property {JamilihAttributes} [1] Attributes to add with the key as the
+ * attribute name and value as the attribute value; important for IE where
+ * the input element's type cannot be added later after already added to the page
+ * @param {Element[]} [children] The optional children of this element
+ * (but raw DOM elements required to be specified within arrays since
+ * could not otherwise be distinguished from siblings being added)
+ * @param {Element} [parent] The optional parent to which to attach the element
+ * (always the last unless followed by null, in which case it is the
+ * second-to-last)
+ * @param {null} [returning] Can use null to indicate an array of elements
+ * should be returned
+ */
+
+ /**
+ * @typedef {PlainObject} JamilihOptions
+ * @property {"root"|"attributeValue"|"fragment"|"children"|"fragmentChildren"} $state
+ */
+
+ /**
+ * @param {Element} elem
+ * @param {string} att
+ * @param {string} attVal
+ * @param {JamilihOptions} opts
+ * @returns {void}
+ */
+
+
+ function checkPluginValue(elem, att, attVal, opts) {
+ opts.$state = 'attributeValue';
+
+ if (attVal && _typeof(attVal) === 'object') {
+ var matchingPlugin = getMatchingPlugin(opts, Object.keys(attVal)[0]);
+
+ if (matchingPlugin) {
+ return matchingPlugin.set({
+ opts: opts,
+ element: elem,
+ attribute: {
+ name: att,
+ value: attVal
+ }
+ });
+ }
+ }
+
+ return attVal;
+ }
+ /**
+ * @param {JamilihOptions} opts
+ * @param {string} item
+ * @returns {JamilihPlugin}
+ */
+
+
+ function getMatchingPlugin(opts, item) {
+ return opts.$plugins && opts.$plugins.find(function (p) {
+ return p.name === item;
+ });
+ }
+ /**
+ * Creates an XHTML or HTML element (XHTML is preferred, but only in browsers
+ * that support); any element after element can be omitted, and any subsequent
+ * type or types added afterwards.
+ * @param {...JamilihArray} args
+ * @returns {JamilihReturn} The newly created (and possibly already appended)
+ * element or array of elements
+ */
+
+
+ var jml = function jml() {
+ for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+ args[_key] = arguments[_key];
+ }
+
+ var elem = doc.createDocumentFragment();
+ /**
+ *
+ * @param {Object<{string: string}>} atts
+ * @returns {void}
+ */
+
+ function _checkAtts(atts) {
+ for (var _i2 = 0, _Object$entries2 = Object.entries(atts); _i2 < _Object$entries2.length; _i2++) {
+ var _Object$entries2$_i = _slicedToArray(_Object$entries2[_i2], 2),
+ att = _Object$entries2$_i[0],
+ attVal = _Object$entries2$_i[1];
+
+ att = att in ATTR_MAP ? ATTR_MAP[att] : att;
+
+ if (NULLABLES.includes(att)) {
+ attVal = checkPluginValue(elem, att, attVal, opts);
+
+ if (!_isNullish(attVal)) {
+ elem[att] = attVal;
+ }
+
+ continue;
+ } else if (ATTR_DOM.includes(att)) {
+ attVal = checkPluginValue(elem, att, attVal, opts);
+ elem[att] = attVal;
+ continue;
+ }
+
+ switch (att) {
+ /*
+ Todos:
+ 0. JSON mode to prevent event addition
+ 0. {$xmlDocument: []} // doc.implementation.createDocument
+ 0. Accept array for any attribute with first item as prefix and second as value?
+ 0. {$: ['xhtml', 'div']} for prefixed elements
+ case '$': // Element with prefix?
+ nodes[nodes.length] = elem = doc.createElementNS(attVal[0], attVal[1]);
+ break;
+ */
+ case '#':
+ {
+ // Document fragment
+ opts.$state = 'fragmentChilden';
+ nodes[nodes.length] = jml(opts, attVal);
+ break;
+ }
+
+ case '$shadow':
+ {
+ var _attVal = attVal,
+ open = _attVal.open,
+ closed = _attVal.closed;
+ var _attVal2 = attVal,
+ content = _attVal2.content,
+ template = _attVal2.template;
+ var shadowRoot = elem.attachShadow({
+ mode: closed || open === false ? 'closed' : 'open'
+ });
+
+ if (template) {
+ if (Array.isArray(template)) {
+ if (_getType(template[0]) === 'object') {
+ // Has attributes
+ template = jml.apply(void 0, ['template'].concat(_toConsumableArray(template), [doc.body]));
+ } else {
+ // Array is for the children
+ template = jml('template', template, doc.body);
+ }
+ } else if (typeof template === 'string') {
+ template = $(template);
+ }
+
+ jml(template.content.cloneNode(true), shadowRoot);
+ } else {
+ if (!content) {
+ content = open || closed;
+ }
+
+ if (content && typeof content !== 'boolean') {
+ if (Array.isArray(content)) {
+ jml({
+ '#': content
+ }, shadowRoot);
+ } else {
+ jml(content, shadowRoot);
+ }
+ }
+ }
+
+ break;
+ }
+
+ case '$state':
+ {
+ // Handled internally
+ break;
+ }
+
+ case 'is':
+ {
+ // Currently only in Chrome
+ // Handled during element creation
+ break;
+ }
+
+ case '$custom':
+ {
+ Object.assign(elem, attVal);
+ break;
+ }
+
+ /* istanbul ignore next */
+
+ case '$define':
+ {
+ var _ret = function () {
+ var localName = elem.localName.toLowerCase(); // Note: customized built-ins sadly not working yet
+
+ var customizedBuiltIn = !localName.includes('-'); // We check attribute in case this is a preexisting DOM element
+ // const {is} = atts;
+
+ var is = void 0;
+
+ if (customizedBuiltIn) {
+ is = elem.getAttribute('is');
+
+ if (!is) {
+ if (!{}.hasOwnProperty.call(atts, 'is')) {
+ throw new TypeError("Expected `is` with `$define` on built-in; args: ".concat(JSON.stringify(args)));
+ }
+
+ atts.is = checkPluginValue(elem, 'is', atts.is, opts);
+ elem.setAttribute('is', atts.is);
+ is = atts.is;
+ }
+ }
+
+ var def = customizedBuiltIn ? is : localName;
+
+ if (window.customElements.get(def)) {
+ return "break";
+ }
+
+ var getConstructor = function getConstructor(cnstrct) {
+ var baseClass = options && options["extends"] ? doc.createElement(options["extends"]).constructor : customizedBuiltIn ? doc.createElement(localName).constructor : window.HTMLElement;
+ /**
+ * Class wrapping base class.
+ */
+
+ return cnstrct ? /*#__PURE__*/function (_baseClass) {
+ _inherits(_class, _baseClass);
+
+ var _super = _createSuper(_class);
+
+ /**
+ * Calls user constructor.
+ */
+ function _class() {
+ var _this;
+
+ _classCallCheck(this, _class);
+
+ _this = _super.call(this);
+ cnstrct.call(_assertThisInitialized(_this));
+ return _this;
+ }
+
+ return _class;
+ }(baseClass) : /*#__PURE__*/function (_baseClass2) {
+ _inherits(_class2, _baseClass2);
+
+ var _super2 = _createSuper(_class2);
+
+ function _class2() {
+ _classCallCheck(this, _class2);
+
+ return _super2.apply(this, arguments);
+ }
+
+ return _class2;
+ }(baseClass);
+ };
+
+ var cnstrctr = void 0,
+ options = void 0,
+ mixin = void 0;
+
+ if (Array.isArray(attVal)) {
+ if (attVal.length <= 2) {
+ var _attVal3 = attVal;
+
+ var _attVal4 = _slicedToArray(_attVal3, 2);
+
+ cnstrctr = _attVal4[0];
+ options = _attVal4[1];
+
+ if (typeof options === 'string') {
+ // Todo: Allow creating a definition without using it;
+ // that may be the only reason to have a string here which
+ // differs from the `localName` anyways
+ options = {
+ "extends": options
+ };
+ } else if (options && !{}.hasOwnProperty.call(options, 'extends')) {
+ mixin = options;
+ }
+
+ if (_typeof(cnstrctr) === 'object') {
+ mixin = cnstrctr;
+ cnstrctr = getConstructor();
+ }
+ } else {
+ var _attVal5 = attVal;
+
+ var _attVal6 = _slicedToArray(_attVal5, 3);
+
+ cnstrctr = _attVal6[0];
+ mixin = _attVal6[1];
+ options = _attVal6[2];
+
+ if (typeof options === 'string') {
+ options = {
+ "extends": options
+ };
+ }
+ }
+ } else if (typeof attVal === 'function') {
+ cnstrctr = attVal;
+ } else {
+ mixin = attVal;
+ cnstrctr = getConstructor();
+ }
+
+ if (!cnstrctr.toString().startsWith('class')) {
+ cnstrctr = getConstructor(cnstrctr);
+ }
+
+ if (!options && customizedBuiltIn) {
+ options = {
+ "extends": localName
+ };
+ }
+
+ if (mixin) {
+ Object.entries(mixin).forEach(function (_ref) {
+ var _ref2 = _slicedToArray(_ref, 2),
+ methodName = _ref2[0],
+ method = _ref2[1];
+
+ cnstrctr.prototype[methodName] = method;
+ });
+ } // console.log('def', def, '::', typeof options === 'object' ? options : undefined);
+
+
+ window.customElements.define(def, cnstrctr, _typeof(options) === 'object' ? options : undefined);
+ return "break";
+ }();
+
+ if (_ret === "break") break;
+ }
+
+ case '$symbol':
+ {
+ var _attVal7 = attVal,
+ _attVal8 = _slicedToArray(_attVal7, 2),
+ symbol = _attVal8[0],
+ func = _attVal8[1];
+
+ if (typeof func === 'function') {
+ var funcBound = func.bind(elem);
+
+ if (typeof symbol === 'string') {
+ elem[Symbol["for"](symbol)] = funcBound;
+ } else {
+ elem[symbol] = funcBound;
+ }
+ } else {
+ var obj = func;
+ obj.elem = elem;
+
+ if (typeof symbol === 'string') {
+ elem[Symbol["for"](symbol)] = obj;
+ } else {
+ elem[symbol] = obj;
+ }
+ }
+
+ break;
+ }
+
+ case '$data':
+ {
+ setMap(attVal);
+ break;
+ }
+
+ case '$attribute':
+ {
+ // Attribute node
+ var node = attVal.length === 3 ? doc.createAttributeNS(attVal[0], attVal[1]) : doc.createAttribute(attVal[0]);
+ node.value = attVal[attVal.length - 1];
+ nodes[nodes.length] = node;
+ break;
+ }
+
+ case '$text':
+ {
+ // Todo: Also allow as jml(['a text node']) (or should that become a fragment)?
+ var _node = doc.createTextNode(attVal);
+
+ nodes[nodes.length] = _node;
+ break;
+ }
+
+ case '$document':
+ {
+ // Todo: Conditionally create XML document
+ var _node2 = doc.implementation.createHTMLDocument();
+
+ if (attVal.childNodes) {
+ // Remove any extra nodes created by createHTMLDocument().
+ var j = attVal.childNodes.length;
+
+ while (_node2.childNodes[j]) {
+ var cn = _node2.childNodes[j];
+ cn.remove(); // `j` should stay the same as removing will cause node to be present
+ }
+
+ attVal.childNodes.forEach(_childrenToJML(_node2));
+ } else {
+ if (attVal.$DOCTYPE) {
+ var dt = {
+ $DOCTYPE: attVal.$DOCTYPE
+ };
+ var doctype = jml(dt);
+
+ _node2.firstChild.replaceWith(doctype);
+ }
+
+ var html = _node2.childNodes[1];
+ var head = html.childNodes[0];
+ var _body = html.childNodes[1];
+
+ if (attVal.title || attVal.head) {
+ var meta = doc.createElement('meta');
+ meta.setAttribute('charset', 'utf-8');
+ head.append(meta);
+
+ if (attVal.title) {
+ _node2.title = attVal.title; // Appends after meta
+ }
+
+ if (attVal.head) {
+ attVal.head.forEach(_appendJML(head));
+ }
+ }
+
+ if (attVal.body) {
+ attVal.body.forEach(_appendJMLOrText(_body));
+ }
+ }
+
+ nodes[nodes.length] = _node2;
+ break;
+ }
+
+ case '$DOCTYPE':
+ {
+ var _node3 = doc.implementation.createDocumentType(attVal.name, attVal.publicId || '', attVal.systemId || '');
+
+ nodes[nodes.length] = _node3;
+ break;
+ }
+
+ case '$on':
+ {
+ // Events
+ // Allow for no-op by defaulting to `{}`
+ for (var _i3 = 0, _Object$entries3 = Object.entries(attVal || {}); _i3 < _Object$entries3.length; _i3++) {
+ var _Object$entries3$_i = _slicedToArray(_Object$entries3[_i3], 2),
+ p2 = _Object$entries3$_i[0],
+ val = _Object$entries3$_i[1];
+
+ if (typeof val === 'function') {
+ val = [val, false];
+ }
+
+ if (typeof val[0] !== 'function') {
+ throw new TypeError("Expect a function for `$on`; args: ".concat(JSON.stringify(args)));
+ }
+
+ _addEvent(elem, p2, val[0], val[1]); // element, event name, handler, capturing
+
+ }
+
+ break;
+ }
+
+ case 'className':
+ case 'class':
+ attVal = checkPluginValue(elem, att, attVal, opts);
+
+ if (!_isNullish(attVal)) {
+ elem.className = attVal;
+ }
+
+ break;
+
+ case 'dataset':
+ {
+ var _ret2 = function () {
+ // Map can be keyed with hyphenated or camel-cased properties
+ var recurse = function recurse(atVal, startProp) {
+ var prop = '';
+ var pastInitialProp = startProp !== '';
+ Object.keys(atVal).forEach(function (key) {
+ var value = atVal[key];
+
+ if (pastInitialProp) {
+ prop = startProp + key.replace(hyphenForCamelCase, _upperCase).replace(/^([a-z])/, _upperCase);
+ } else {
+ prop = startProp + key.replace(hyphenForCamelCase, _upperCase);
+ }
+
+ if (value === null || _typeof(value) !== 'object') {
+ if (!_isNullish(value)) {
+ elem.dataset[prop] = value;
+ }
+
+ prop = startProp;
+ return;
+ }
+
+ recurse(value, prop);
+ });
+ };
+
+ recurse(attVal, '');
+ return "break"; // Todo: Disable this by default unless configuration explicitly allows (for security)
+ }();
+
+ if (_ret2 === "break") break;
+ }
+ // #if IS_REMOVE
+ // Don't remove this `if` block (for sake of no-innerHTML build)
+
+ case 'innerHTML':
+ if (!_isNullish(attVal)) {
+ // eslint-disable-next-line no-unsanitized/property
+ elem.innerHTML = attVal;
+ }
+
+ break;
+ // #endif
+
+ case 'htmlFor':
+ case 'for':
+ if (elStr === 'label') {
+ attVal = checkPluginValue(elem, att, attVal, opts);
+
+ if (!_isNullish(attVal)) {
+ elem.htmlFor = attVal;
+ }
+
+ break;
+ }
+
+ attVal = checkPluginValue(elem, att, attVal, opts);
+ elem.setAttribute(att, attVal);
+ break;
+
+ case 'xmlns':
+ // Already handled
+ break;
+
+ default:
+ {
+ if (att.startsWith('on')) {
+ attVal = checkPluginValue(elem, att, attVal, opts);
+ elem[att] = attVal; // _addEvent(elem, att.slice(2), attVal, false); // This worked, but perhaps the user wishes only one event
+
+ break;
+ }
+
+ if (att === 'style') {
+ attVal = checkPluginValue(elem, att, attVal, opts);
+
+ if (_isNullish(attVal)) {
+ break;
+ }
+
+ if (_typeof(attVal) === 'object') {
+ for (var _i4 = 0, _Object$entries4 = Object.entries(attVal); _i4 < _Object$entries4.length; _i4++) {
+ var _Object$entries4$_i = _slicedToArray(_Object$entries4[_i4], 2),
+ _p = _Object$entries4$_i[0],
+ styleVal = _Object$entries4$_i[1];
+
+ if (!_isNullish(styleVal)) {
+ // Todo: Handle aggregate properties like "border"
+ if (_p === 'float') {
+ elem.style.cssFloat = styleVal;
+ elem.style.styleFloat = styleVal; // Harmless though we could make conditional on older IE instead
+ } else {
+ elem.style[_p.replace(hyphenForCamelCase, _upperCase)] = styleVal;
+ }
+ }
+ }
+
+ break;
+ } // setAttribute unfortunately erases any existing styles
+
+
+ elem.setAttribute(att, attVal);
+ /*
+ // The following reorders which is troublesome for serialization, e.g., as used in our testing
+ if (elem.style.cssText !== undefined) {
+ elem.style.cssText += attVal;
+ } else { // Opera
+ elem.style += attVal;
+ }
+ */
+
+ break;
+ }
+
+ var matchingPlugin = getMatchingPlugin(opts, att);
+
+ if (matchingPlugin) {
+ matchingPlugin.set({
+ opts: opts,
+ element: elem,
+ attribute: {
+ name: att,
+ value: attVal
+ }
+ });
+ break;
+ }
+
+ attVal = checkPluginValue(elem, att, attVal, opts);
+ elem.setAttribute(att, attVal);
+ break;
+ }
+ }
+ }
+ }
+
+ var nodes = [];
+ var elStr;
+ var opts;
+ var isRoot = false;
+
+ if (_getType(args[0]) === 'object' && Object.keys(args[0]).some(function (key) {
+ return possibleOptions.includes(key);
+ })) {
+ opts = args[0];
+
+ if (opts.$state === undefined) {
+ isRoot = true;
+ opts.$state = 'root';
+ }
+
+ if (opts.$map && !opts.$map.root && opts.$map.root !== false) {
+ opts.$map = {
+ root: opts.$map
+ };
+ }
+
+ if ('$plugins' in opts) {
+ if (!Array.isArray(opts.$plugins)) {
+ throw new TypeError("`$plugins` must be an array; args: ".concat(JSON.stringify(args)));
+ }
+
+ opts.$plugins.forEach(function (pluginObj) {
+ if (!pluginObj || _typeof(pluginObj) !== 'object') {
+ throw new TypeError("Plugin must be an object; args: ".concat(JSON.stringify(args)));
+ }
+
+ if (!pluginObj.name || !pluginObj.name.startsWith('$_')) {
+ throw new TypeError("Plugin object name must be present and begin with `$_`; args: ".concat(JSON.stringify(args)));
+ }
+
+ if (typeof pluginObj.set !== 'function') {
+ throw new TypeError("Plugin object must have a `set` method; args: ".concat(JSON.stringify(args)));
+ }
+ });
+ }
+
+ args = args.slice(1);
+ } else {
+ opts = {
+ $state: undefined
+ };
+ }
+
+ var argc = args.length;
+ var defaultMap = opts.$map && opts.$map.root;
+
+ var setMap = function setMap(dataVal) {
+ var map, obj; // Boolean indicating use of default map and object
+
+ if (dataVal === true) {
+ var _defaultMap = _slicedToArray(defaultMap, 2);
+
+ map = _defaultMap[0];
+ obj = _defaultMap[1];
+ } else if (Array.isArray(dataVal)) {
+ // Array of strings mapping to default
+ if (typeof dataVal[0] === 'string') {
+ dataVal.forEach(function (dVal) {
+ setMap(opts.$map[dVal]);
+ });
+ return; // Array of Map and non-map data object
+ }
+
+ map = dataVal[0] || defaultMap[0];
+ obj = dataVal[1] || defaultMap[1]; // Map
+ } else if (/^\[object (?:Weak)?Map\]$/.test([].toString.call(dataVal))) {
+ map = dataVal;
+ obj = defaultMap[1]; // Non-map data object
+ } else {
+ map = defaultMap[0];
+ obj = dataVal;
+ }
+
+ map.set(elem, obj);
+ };
+
+ for (var i = 0; i < argc; i++) {
+ var arg = args[i];
+
+ var type = _getType(arg);
+
+ switch (type) {
+ default:
+ throw new TypeError("Unexpected type: ".concat(type, "; arg: ").concat(arg, "; index ").concat(i, " on args: ").concat(JSON.stringify(args)));
+
+ case 'null':
+ // null always indicates a place-holder (only needed for last argument if want array returned)
+ if (i === argc - 1) {
+ _applyAnyStylesheet(nodes[0]); // We have to execute any stylesheets even if not appending or otherwise IE will never apply them
+ // Todo: Fix to allow application of stylesheets of style tags within fragments?
+
+
+ return nodes.length <= 1 ? nodes[0] // eslint-disable-next-line
+ : nodes.reduce(_fragReducer, doc.createDocumentFragment()); // nodes;
+ }
+
+ throw new TypeError("`null` values not allowed except as final Jamilih argument; index ".concat(i, " on args: ").concat(JSON.stringify(args)));
+
+ case 'string':
+ // Strings normally indicate elements
+ switch (arg) {
+ case '!':
+ nodes[nodes.length] = doc.createComment(args[++i]);
+ break;
+
+ case '?':
+ {
+ arg = args[++i];
+ var procValue = args[++i];
+ var val = procValue;
+
+ if (val && _typeof(val) === 'object') {
+ procValue = [];
+
+ for (var _i5 = 0, _Object$entries5 = Object.entries(val); _i5 < _Object$entries5.length; _i5++) {
+ var _Object$entries5$_i = _slicedToArray(_Object$entries5[_i5], 2),
+ p = _Object$entries5$_i[0],
+ procInstVal = _Object$entries5$_i[1];
+
+ procValue.push(p + '=' + '"' + // https://www.w3.org/TR/xml-stylesheet/#NT-PseudoAttValue
+ procInstVal.replace(/"/g, '"') + '"');
+ }
+
+ procValue = procValue.join(' ');
+ } // Firefox allows instructions with ">" in this method, but not if placed directly!
+
+
+ try {
+ nodes[nodes.length] = doc.createProcessingInstruction(arg, procValue);
+ } catch (e) {
+ // Getting NotSupportedError in IE, so we try to imitate a processing instruction with a comment
+ // innerHTML didn't work
+ // var elContainer = doc.createElement('div');
+ // elContainer.innerHTML = '<?' + doc.createTextNode(arg + ' ' + procValue).nodeValue + '?>';
+ // nodes[nodes.length] = elContainer.innerHTML;
+ // Todo: any other way to resolve? Just use XML?
+ nodes[nodes.length] = doc.createComment('?' + arg + ' ' + procValue + '?');
+ }
+
+ break; // Browsers don't support doc.createEntityReference, so we just use this as a convenience
+ }
+
+ case '&':
+ nodes[nodes.length] = _createSafeReference('entity', '', args[++i]);
+ break;
+
+ case '#':
+ // // Decimal character reference - ['#', '01234'] // Ӓ // probably easier to use JavaScript Unicode escapes
+ nodes[nodes.length] = _createSafeReference('decimal', arg, String(args[++i]));
+ break;
+
+ case '#x':
+ // Hex character reference - ['#x', '123a'] // ሺ // probably easier to use JavaScript Unicode escapes
+ nodes[nodes.length] = _createSafeReference('hexadecimal', arg, args[++i]);
+ break;
+
+ case '![':
+ // '![', ['escaped <&> text'] // <![CDATA[escaped <&> text]]>
+ // CDATA valid in XML only, so we'll just treat as text for mutual compatibility
+ // Todo: config (or detection via some kind of doc.documentType property?) of whether in XML
+ try {
+ nodes[nodes.length] = doc.createCDATASection(args[++i]);
+ } catch (e2) {
+ nodes[nodes.length] = doc.createTextNode(args[i]); // i already incremented
+ }
+
+ break;
+
+ case '':
+ nodes[nodes.length] = elem = doc.createDocumentFragment(); // Todo: Report to plugins
+
+ opts.$state = 'fragment';
+ break;
+
+ default:
+ {
+ // An element
+ elStr = arg;
+ var atts = args[i + 1];
+
+ if (_getType(atts) === 'object' && atts.is) {
+ var is = atts.is; // istanbul ignore else
+
+ if (doc.createElementNS) {
+ elem = doc.createElementNS(NS_HTML, elStr, {
+ is: is
+ });
+ } else {
+ elem = doc.createElement(elStr, {
+ is: is
+ });
+ }
+ } else
+ /* istanbul ignore else */
+ if (doc.createElementNS) {
+ elem = doc.createElementNS(NS_HTML, elStr);
+ } else {
+ elem = doc.createElement(elStr);
+ } // Todo: Report to plugins
+
+
+ opts.$state = 'element';
+ nodes[nodes.length] = elem; // Add to parent
+
+ break;
+ }
+ }
+
+ break;
+
+ case 'object':
+ {
+ // Non-DOM-element objects indicate attribute-value pairs
+ var _atts = arg;
+
+ if (_atts.xmlns !== undefined) {
+ // We handle this here, as otherwise may lose events, etc.
+ // As namespace of element already set as XHTML, we need to change the namespace
+ // elem.setAttribute('xmlns', atts.xmlns); // Doesn't work
+ // Can't set namespaceURI dynamically, renameNode() is not supported, and setAttribute() doesn't work to change the namespace, so we resort to this hack
+ var replacer = void 0;
+
+ if (_typeof(_atts.xmlns) === 'object') {
+ replacer = _replaceDefiner(_atts.xmlns);
+ } else {
+ replacer = ' xmlns="' + _atts.xmlns + '"';
+ } // try {
+ // Also fix DOMParser to work with text/html
+
+
+ elem = nodes[nodes.length - 1] = new win.DOMParser().parseFromString(new win.XMLSerializer().serializeToString(elem) // Mozilla adds XHTML namespace
+ .replace(' xmlns="' + NS_HTML + '"', replacer), 'application/xml').documentElement; // Todo: Report to plugins
+
+ opts.$state = 'element'; // }catch(e) {alert(elem.outerHTML);throw e;}
+ }
+
+ _checkAtts(_atts);
+
+ break;
+ }
+
+ case 'document':
+ case 'fragment':
+ case 'element':
+ /*
+ 1) Last element always the parent (put null if don't want parent and want to return array) unless only atts and children (no other elements)
+ 2) Individual elements (DOM elements or sequences of string[/object/array]) get added to parent first-in, first-added
+ */
+ if (i === 0) {
+ // Allow wrapping of element, fragment, or document
+ elem = arg; // Todo: Report to plugins
+
+ opts.$state = 'element';
+ }
+
+ if (i === argc - 1 || i === argc - 2 && args[i + 1] === null) {
+ // parent
+ var elsl = nodes.length;
+
+ for (var k = 0; k < elsl; k++) {
+ _appendNode(arg, nodes[k]);
+ } // Todo: Apply stylesheets if any style tags were added elsewhere besides the first element?
+
+
+ _applyAnyStylesheet(nodes[0]); // We have to execute any stylesheets even if not appending or otherwise IE will never apply them
+
+ } else {
+ nodes[nodes.length] = arg;
+ }
+
+ break;
+
+ case 'array':
+ {
+ // Arrays or arrays of arrays indicate child nodes
+ var child = arg;
+ var cl = child.length;
+
+ for (var j = 0; j < cl; j++) {
+ // Go through children array container to handle elements
+ var childContent = child[j];
+
+ var childContentType = _typeof(childContent);
+
+ if (_isNullish(childContent)) {
+ throw new TypeError("Bad children (parent array: ".concat(JSON.stringify(args), "; index ").concat(j, " of child: ").concat(JSON.stringify(child), ")"));
+ }
+
+ switch (childContentType) {
+ // Todo: determine whether null or function should have special handling or be converted to text
+ case 'string':
+ case 'number':
+ case 'boolean':
+ _appendNode(elem, doc.createTextNode(childContent));
+
+ break;
+
+ default:
+ if (Array.isArray(childContent)) {
+ // Arrays representing child elements
+ opts.$state = 'children';
+
+ _appendNode(elem, jml.apply(void 0, [opts].concat(_toConsumableArray(childContent))));
+ } else if (childContent['#']) {
+ // Fragment
+ opts.$state = 'fragmentChildren';
+
+ _appendNode(elem, jml(opts, childContent['#']));
+ } else {
+ // Single DOM element children
+ var newChildContent = checkPluginValue(elem, null, childContent, opts);
+
+ _appendNode(elem, newChildContent);
+ }
+
+ break;
+ }
+ }
+
+ break;
+ }
+ }
+ }
+
+ var ret = nodes[0] || elem;
+
+ if (isRoot && opts.$map && opts.$map.root) {
+ setMap(true);
+ }
+
+ return ret;
+ };
+ /**
+ * Converts a DOM object or a string of HTML into a Jamilih object (or string).
+ * @param {string|HTMLElement} dom If a string, will parse as document
+ * @param {PlainObject} [config] Configuration object
+ * @param {boolean} [config.stringOutput=false] Whether to output the Jamilih object as a string.
+ * @param {boolean} [config.reportInvalidState=true] If true (the default), will report invalid state errors
+ * @param {boolean} [config.stripWhitespace=false] Strip whitespace for text nodes
+ * @returns {JamilihArray|string} Array containing the elements which represent
+ * a Jamilih object, or, if `stringOutput` is true, it will be the stringified
+ * version of such an object
+ */
+
+
+ jml.toJML = function (dom) {
+ var _ref3 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+ _ref3$stringOutput = _ref3.stringOutput,
+ stringOutput = _ref3$stringOutput === void 0 ? false : _ref3$stringOutput,
+ _ref3$reportInvalidSt = _ref3.reportInvalidState,
+ reportInvalidState = _ref3$reportInvalidSt === void 0 ? true : _ref3$reportInvalidSt,
+ _ref3$stripWhitespace = _ref3.stripWhitespace,
+ stripWhitespace = _ref3$stripWhitespace === void 0 ? false : _ref3$stripWhitespace;
+
+ if (typeof dom === 'string') {
+ dom = new win.DOMParser().parseFromString(dom, 'text/html'); // todo: Give option for XML once implemented and change JSDoc to allow for Element
+ }
+
+ var ret = [];
+ var parent = ret;
+ var parentIdx = 0;
+ /**
+ * @param {string} msg
+ * @throws {DOMException}
+ * @returns {void}
+ */
+
+ function invalidStateError(msg) {
+ // These are probably only necessary if working with text/html
+
+ /* eslint-disable no-shadow, unicorn/custom-error-definition */
+
+ /**
+ * Polyfill for `DOMException`.
+ */
+ var DOMException = /*#__PURE__*/function (_Error) {
+ _inherits(DOMException, _Error);
+
+ var _super3 = _createSuper(DOMException);
+
+ /* eslint-enable no-shadow, unicorn/custom-error-definition */
+
+ /**
+ * @param {string} message
+ * @param {string} name
+ */
+ function DOMException(message, name) {
+ var _this2;
+
+ _classCallCheck(this, DOMException);
+
+ _this2 = _super3.call(this, message); // eslint-disable-next-line unicorn/custom-error-definition
+
+ _this2.name = name;
+ return _this2;
+ }
+
+ return DOMException;
+ }( /*#__PURE__*/_wrapNativeSuper(Error));
+
+ if (reportInvalidState) {
+ // INVALID_STATE_ERR per section 9.3 XHTML 5: http://www.w3.org/TR/html5/the-xhtml-syntax.html
+ var e = new DOMException(msg, 'INVALID_STATE_ERR');
+ e.code = 11;
+ throw e;
+ }
+ }
+ /**
+ *
+ * @param {DocumentType|Entity} obj
+ * @param {Node} node
+ * @returns {void}
+ */
+
+
+ function addExternalID(obj, node) {
+ if (node.systemId.includes('"') && node.systemId.includes("'")) {
+ invalidStateError('systemId cannot have both single and double quotes.');
+ }
+
+ var publicId = node.publicId,
+ systemId = node.systemId;
+
+ if (systemId) {
+ obj.systemId = systemId;
+ }
+
+ if (publicId) {
+ obj.publicId = publicId;
+ }
+ }
+ /**
+ *
+ * @param {any} val
+ * @returns {void}
+ */
+
+
+ function set(val) {
+ parent[parentIdx] = val;
+ parentIdx++;
+ }
+ /**
+ * @returns {void}
+ */
+
+
+ function setChildren() {
+ set([]);
+ parent = parent[parentIdx - 1];
+ parentIdx = 0;
+ }
+ /**
+ *
+ * @param {string} prop1
+ * @param {string} prop2
+ * @returns {void}
+ */
+
+
+ function setObj(prop1, prop2) {
+ parent = parent[parentIdx - 1][prop1];
+ parentIdx = 0;
+
+ if (prop2) {
+ parent = parent[prop2];
+ }
+ }
+ /**
+ *
+ * @param {Node} node
+ * @param {object<{string: string}>} namespaces
+ * @returns {void}
+ */
+
+
+ function parseDOM(node, namespaces) {
+ // namespaces = clone(namespaces) || {}; // Ensure we're working with a copy, so different levels in the hierarchy can treat it differently
+
+ /*
+ if ((node.prefix && node.prefix.includes(':')) || (node.localName && node.localName.includes(':'))) {
+ invalidStateError('Prefix cannot have a colon');
+ }
+ */
+ var type = 'nodeType' in node ? node.nodeType : null;
+ namespaces = _extends({}, namespaces);
+ var xmlChars = /^([\t\n\r -\uD7FF\uE000-\uFFFD]|(?:[\uD800-\uDBFF](?![\uDC00-\uDFFF]))(?:(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF]))*$/; // eslint-disable-line no-control-regex
+
+ if ([2, 3, 4, 7, 8].includes(type) && !xmlChars.test(node.nodeValue)) {
+ invalidStateError('Node has bad XML character value');
+ }
+
+ var tmpParent, tmpParentIdx;
+ /**
+ * @returns {void}
+ */
+
+ function setTemp() {
+ tmpParent = parent;
+ tmpParentIdx = parentIdx;
+ }
+ /**
+ * @returns {void}
+ */
+
+
+ function resetTemp() {
+ parent = tmpParent;
+ parentIdx = tmpParentIdx;
+ parentIdx++; // Increment index in parent container of this element
+ }
+
+ switch (type) {
+ case 1:
+ {
+ // ELEMENT
+ setTemp();
+ var nodeName = node.nodeName.toLowerCase(); // Todo: for XML, should not lower-case
+
+ setChildren(); // Build child array since elements are, except at the top level, encapsulated in arrays
+
+ set(nodeName);
+ var start = {};
+ var hasNamespaceDeclaration = false;
+
+ if (namespaces[node.prefix || ''] !== node.namespaceURI) {
+ namespaces[node.prefix || ''] = node.namespaceURI;
+
+ if (node.prefix) {
+ start['xmlns:' + node.prefix] = node.namespaceURI;
+ } else if (node.namespaceURI) {
+ start.xmlns = node.namespaceURI;
+ } else {
+ start.xmlns = null;
+ }
+
+ hasNamespaceDeclaration = true;
+ }
+
+ if (node.attributes.length) {
+ set(_toConsumableArray(node.attributes).reduce(function (obj, att) {
+ obj[att.name] = att.value; // Attr.nodeName and Attr.nodeValue are deprecated as of DOM4 as Attr no longer inherits from Node, so we can safely use name and value
+
+ return obj;
+ }, start));
+ } else if (hasNamespaceDeclaration) {
+ set(start);
+ }
+
+ var childNodes = node.childNodes;
+
+ if (childNodes.length) {
+ setChildren(); // Element children array container
+
+ _toConsumableArray(childNodes).forEach(function (childNode) {
+ parseDOM(childNode, namespaces);
+ });
+ }
+
+ resetTemp();
+ break;
+ }
+
+ case undefined: // Treat as attribute node until this is fixed: https://github.com/jsdom/jsdom/issues/1641 / https://github.com/jsdom/jsdom/pull/1822
+
+ case 2:
+ // ATTRIBUTE (should only get here if passing in an attribute node)
+ set({
+ $attribute: [node.namespaceURI, node.name, node.value]
+ });
+ break;
+
+ case 3:
+ // TEXT
+ if (stripWhitespace && /^[\t-\r \xA0\u1680\u2000-\u200A\u2028\u2029\u202F\u205F\u3000\uFEFF]+$/.test(node.nodeValue)) {
+ set('');
+ return;
+ }
+
+ set(node.nodeValue);
+ break;
+
+ case 4:
+ // CDATA
+ if (node.nodeValue.includes(']]' + '>')) {
+ invalidStateError('CDATA cannot end with closing ]]>');
+ }
+
+ set(['![', node.nodeValue]);
+ break;
+
+ case 5:
+ // ENTITY REFERENCE (though not in browsers (was already resolved
+ // anyways), ok to keep for parity with our "entity" shorthand)
+ set(['&', node.nodeName]);
+ break;
+
+ case 7:
+ // PROCESSING INSTRUCTION
+ if (/^xml$/i.test(node.target)) {
+ invalidStateError('Processing instructions cannot be "xml".');
+ }
+
+ if (node.target.includes('?>')) {
+ invalidStateError('Processing instruction targets cannot include ?>');
+ }
+
+ if (node.target.includes(':')) {
+ invalidStateError('The processing instruction target cannot include ":"');
+ }
+
+ if (node.data.includes('?>')) {
+ invalidStateError('Processing instruction data cannot include ?>');
+ }
+
+ set(['?', node.target, node.data]); // Todo: Could give option to attempt to convert value back into object if has pseudo-attributes
+
+ break;
+
+ case 8:
+ // COMMENT
+ if (node.nodeValue.includes('--') || node.nodeValue.length && node.nodeValue.lastIndexOf('-') === node.nodeValue.length - 1) {
+ invalidStateError('Comments cannot include --');
+ }
+
+ set(['!', node.nodeValue]);
+ break;
+
+ case 9:
+ {
+ // DOCUMENT
+ setTemp();
+ var docObj = {
+ $document: {
+ childNodes: []
+ }
+ };
+ set(docObj); // doc.implementation.createHTMLDocument
+ // Set position to fragment's array children
+
+ setObj('$document', 'childNodes');
+ var _childNodes = node.childNodes;
+
+ if (!_childNodes.length) {
+ invalidStateError('Documents must have a child node');
+ } // set({$xmlDocument: []}); // doc.implementation.createDocument // Todo: use this conditionally
+
+
+ _toConsumableArray(_childNodes).forEach(function (childNode) {
+ // Can't just do documentElement as there may be doctype, comments, etc.
+ // No need for setChildren, as we have already built the container array
+ parseDOM(childNode, namespaces);
+ });
+
+ resetTemp();
+ break;
+ }
+
+ case 10:
+ {
+ // DOCUMENT TYPE
+ setTemp(); // Can create directly by doc.implementation.createDocumentType
+
+ var _start = {
+ $DOCTYPE: {
+ name: node.name
+ }
+ };
+ var pubIdChar = /^( |\r|\n|[0-9A-Za-z]|[!#-%'-\/:;=\?@_])*$/; // eslint-disable-line no-control-regex
+
+ if (!pubIdChar.test(node.publicId)) {
+ invalidStateError('A publicId must have valid characters.');
+ }
+
+ addExternalID(_start.$DOCTYPE, node); // Fit in internal subset along with entities?: probably don't need as these would only differ if from DTD, and we're not rebuilding the DTD
+
+ set(_start); // Auto-generate the internalSubset instead?
+
+ resetTemp();
+ break;
+ }
+
+ case 11:
+ {
+ // DOCUMENT FRAGMENT
+ setTemp();
+ set({
+ '#': []
+ }); // Set position to fragment's array children
+
+ setObj('#');
+ var _childNodes2 = node.childNodes;
+
+ _toConsumableArray(_childNodes2).forEach(function (childNode) {
+ // No need for setChildren, as we have already built the container array
+ parseDOM(childNode, namespaces);
+ });
+
+ resetTemp();
+ break;
+ }
+
+ default:
+ throw new TypeError('Not an XML type');
+ }
+ }
+
+ parseDOM(dom, {});
+
+ if (stringOutput) {
+ return JSON.stringify(ret[0]);
+ }
+
+ return ret[0];
+ };
+
+ jml.toJMLString = function (dom, config) {
+ return jml.toJML(dom, Object.assign(config || {}, {
+ stringOutput: true
+ }));
+ };
+ /**
+ *
+ * @param {...JamilihArray} args
+ * @returns {JamilihReturn}
+ */
+
+
+ jml.toDOM = function () {
+ // Alias for jml()
+ return jml.apply(void 0, arguments);
+ };
+ /**
+ *
+ * @param {...JamilihArray} args
+ * @returns {string}
+ */
+
+
+ jml.toHTML = function () {
+ // Todo: Replace this with version of jml() that directly builds a string
+ var ret = jml.apply(void 0, arguments); // Todo: deal with serialization of properties like 'selected',
+ // 'checked', 'value', 'defaultValue', 'for', 'dataset', 'on*',
+ // 'style'! (i.e., need to build a string ourselves)
+
+ return ret.outerHTML;
+ };
+ /**
+ *
+ * @param {...JamilihArray} args
+ * @returns {string}
+ */
+
+
+ jml.toDOMString = function () {
+ // Alias for jml.toHTML for parity with jml.toJMLString
+ return jml.toHTML.apply(jml, arguments);
+ };
+ /**
+ *
+ * @param {...JamilihArray} args
+ * @returns {string}
+ */
+
+
+ jml.toXML = function () {
+ var ret = jml.apply(void 0, arguments);
+ return new win.XMLSerializer().serializeToString(ret);
+ };
+ /**
+ *
+ * @param {...JamilihArray} args
+ * @returns {string}
+ */
+
+
+ jml.toXMLDOMString = function () {
+ // Alias for jml.toXML for parity with jml.toJMLString
+ return jml.toXML.apply(jml, arguments);
+ };
+ /**
+ * Element-aware wrapper for `Map`.
+ */
+
+
+ var JamilihMap = /*#__PURE__*/function (_Map) {
+ _inherits(JamilihMap, _Map);
+
+ var _super4 = _createSuper(JamilihMap);
+
+ function JamilihMap() {
+ _classCallCheck(this, JamilihMap);
+
+ return _super4.apply(this, arguments);
+ }
+
+ _createClass(JamilihMap, [{
+ key: "get",
+
+ /**
+ * @param {string|Element} elem
+ * @returns {any}
+ */
+ value: function get(elem) {
+ elem = typeof elem === 'string' ? $(elem) : elem;
+ return _get(_getPrototypeOf(JamilihMap.prototype), "get", this).call(this, elem);
+ }
+ /**
+ * @param {string|Element} elem
+ * @param {any} value
+ * @returns {any}
+ */
+
+ }, {
+ key: "set",
+ value: function set(elem, value) {
+ elem = typeof elem === 'string' ? $(elem) : elem;
+ return _get(_getPrototypeOf(JamilihMap.prototype), "set", this).call(this, elem, value);
+ }
+ /**
+ * @param {string|Element} elem
+ * @param {string} methodName
+ * @param {...any} args
+ * @returns {any}
+ */
+
+ }, {
+ key: "invoke",
+ value: function invoke(elem, methodName) {
+ var _this$get;
+
+ elem = typeof elem === 'string' ? $(elem) : elem;
+
+ for (var _len2 = arguments.length, args = new Array(_len2 > 2 ? _len2 - 2 : 0), _key2 = 2; _key2 < _len2; _key2++) {
+ args[_key2 - 2] = arguments[_key2];
+ }
+
+ return (_this$get = this.get(elem))[methodName].apply(_this$get, [elem].concat(args));
+ }
+ }]);
+
+ return JamilihMap;
+ }( /*#__PURE__*/_wrapNativeSuper(Map));
+ /**
+ * Element-aware wrapper for `WeakMap`.
+ */
+
+
+ var JamilihWeakMap = /*#__PURE__*/function (_WeakMap) {
+ _inherits(JamilihWeakMap, _WeakMap);
+
+ var _super5 = _createSuper(JamilihWeakMap);
+
+ function JamilihWeakMap() {
+ _classCallCheck(this, JamilihWeakMap);
+
+ return _super5.apply(this, arguments);
+ }
+
+ _createClass(JamilihWeakMap, [{
+ key: "get",
+
+ /**
+ * @param {string|Element} elem
+ * @returns {any}
+ */
+ value: function get(elem) {
+ elem = typeof elem === 'string' ? $(elem) : elem;
+ return _get(_getPrototypeOf(JamilihWeakMap.prototype), "get", this).call(this, elem);
+ }
+ /**
+ * @param {string|Element} elem
+ * @param {any} value
+ * @returns {any}
+ */
+
+ }, {
+ key: "set",
+ value: function set(elem, value) {
+ elem = typeof elem === 'string' ? $(elem) : elem;
+ return _get(_getPrototypeOf(JamilihWeakMap.prototype), "set", this).call(this, elem, value);
+ }
+ /**
+ * @param {string|Element} elem
+ * @param {string} methodName
+ * @param {...any} args
+ * @returns {any}
+ */
+
+ }, {
+ key: "invoke",
+ value: function invoke(elem, methodName) {
+ var _this$get2;
+
+ elem = typeof elem === 'string' ? $(elem) : elem;
+
+ for (var _len3 = arguments.length, args = new Array(_len3 > 2 ? _len3 - 2 : 0), _key3 = 2; _key3 < _len3; _key3++) {
+ args[_key3 - 2] = arguments[_key3];
+ }
+
+ return (_this$get2 = this.get(elem))[methodName].apply(_this$get2, [elem].concat(args));
+ }
+ }]);
+
+ return JamilihWeakMap;
+ }( /*#__PURE__*/_wrapNativeSuper(WeakMap));
+
+ jml.Map = JamilihMap;
+ jml.WeakMap = JamilihWeakMap;
+ /**
+ * @typedef {GenericArray} MapAndElementArray
+ * @property {JamilihWeakMap|JamilihMap} 0
+ * @property {Element} 1
+ */
+
+ /**
+ * @param {GenericObject} obj
+ * @param {...JamilihArray} args
+ * @returns {MapAndElementArray}
+ */
+
+ jml.weak = function (obj) {
+ var map = new JamilihWeakMap();
+
+ for (var _len4 = arguments.length, args = new Array(_len4 > 1 ? _len4 - 1 : 0), _key4 = 1; _key4 < _len4; _key4++) {
+ args[_key4 - 1] = arguments[_key4];
+ }
+
+ var elem = jml.apply(void 0, [{
+ $map: [map, obj]
+ }].concat(args));
+ return [map, elem];
+ };
+ /**
+ * @param {any} obj
+ * @param {...JamilihArray} args
+ * @returns {MapAndElementArray}
+ */
+
+
+ jml.strong = function (obj) {
+ var map = new JamilihMap();
+
+ for (var _len5 = arguments.length, args = new Array(_len5 > 1 ? _len5 - 1 : 0), _key5 = 1; _key5 < _len5; _key5++) {
+ args[_key5 - 1] = arguments[_key5];
+ }
+
+ var elem = jml.apply(void 0, [{
+ $map: [map, obj]
+ }].concat(args));
+ return [map, elem];
+ };
+ /**
+ * @param {string|Element} elem If a string, will be interpreted as a selector
+ * @param {symbol|string} sym If a string, will be used with `Symbol.for`
+ * @returns {any} The value associated with the symbol
+ */
+
+
+ jml.symbol = jml.sym = jml["for"] = function (elem, sym) {
+ elem = typeof elem === 'string' ? $(elem) : elem;
+ return elem[_typeof(sym) === 'symbol' ? sym : Symbol["for"](sym)];
+ };
+ /**
+ * @param {string|Element} elem If a string, will be interpreted as a selector
+ * @param {symbol|string|Map|WeakMap} symOrMap If a string, will be used with `Symbol.for`
+ * @param {string|any} methodName Can be `any` if the symbol or map directly
+ * points to a function (it is then used as the first argument).
+ * @param {any[]} args
+ * @returns {any}
+ */
+
+
+ jml.command = function (elem, symOrMap, methodName) {
+ var _func3;
+
+ elem = typeof elem === 'string' ? $(elem) : elem;
+ var func;
+
+ for (var _len6 = arguments.length, args = new Array(_len6 > 3 ? _len6 - 3 : 0), _key6 = 3; _key6 < _len6; _key6++) {
+ args[_key6 - 3] = arguments[_key6];
+ }
+
+ if (['symbol', 'string'].includes(_typeof(symOrMap))) {
+ var _func;
+
+ func = jml.sym(elem, symOrMap);
+
+ if (typeof func === 'function') {
+ return func.apply(void 0, [methodName].concat(args)); // Already has `this` bound to `elem`
+ }
+
+ return (_func = func)[methodName].apply(_func, args);
+ }
+
+ func = symOrMap.get(elem);
+
+ if (typeof func === 'function') {
+ var _func2;
+
+ return (_func2 = func).call.apply(_func2, [elem, methodName].concat(args));
+ }
+
+ return (_func3 = func)[methodName].apply(_func3, [elem].concat(args)); // return func[methodName].call(elem, ...args);
+ };
+ /**
+ * Expects properties `document`, `XMLSerializer`, and `DOMParser`.
+ * Also updates `body` with `document.body`.
+ * @param {Window} wind
+ * @returns {void}
+ */
+
+
+ jml.setWindow = function (wind) {
+ win = wind;
+ doc = win.document;
+
+ if (doc && doc.body) {
+ var _doc = doc;
+ body = _doc.body;
+ }
+ };
+ /**
+ * @returns {Window}
+ */
+
+
+ jml.getWindow = function () {
+ return win;
+ };
+
+
+ var body = doc && doc.body; // eslint-disable-line import/no-mutable-exports
+
+ var nbsp = "\xA0"; // Very commonly needed in templates
+
+ /**
+ * ISC License
+ *
+ * Copyright (c) 2018, Andrea Giammarchi, @WebReflection
+ *
+ * Permission to use, copy, modify, and/or distribute this software for any
+ * purpose with or without fee is hereby granted, provided that the above
+ * copyright notice and this permission notice appear in all copies.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+ * REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+ * AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+ * INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+ * LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE
+ * OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+ * PERFORMANCE OF THIS SOFTWARE.
+ */
+ var QueryResult = /*#__PURE__*/function (_Array) {
+ _inherits(QueryResult, _Array);
+
+ var _super = _createSuper(QueryResult);
+
+ function QueryResult() {
+ _classCallCheck(this, QueryResult);
+
+ return _super.apply(this, arguments);
+ }
+
+ return QueryResult;
+ }( /*#__PURE__*/_wrapNativeSuper(Array));
+
+ var create = Object.create,
+ defineProperty = Object.defineProperty;
+ var AP = Array.prototype;
+ var DOM_CONTENT_LOADED = 'DOMContentLoaded';
+ var LOAD = 'load';
+ var NO_TRANSPILER_ISSUES = new QueryResult() instanceof QueryResult;
+ var QRP = QueryResult.prototype; // fixes methods returning non QueryResult
+
+ /* istanbul ignore if */
+
+ if (!NO_TRANSPILER_ISSUES) Object.getOwnPropertyNames(AP).forEach(function (name) {
+ var desc = Object.getOwnPropertyDescriptor(AP, name);
+
+ if (typeof desc.value === 'function') {
+ var fn = desc.value;
+
+ desc.value = function () {
+ var result = fn.apply(this, arguments);
+ return result instanceof Array ? patch(result) : result;
+ };
+ }
+
+ defineProperty(QRP, name, desc);
+ }); // fixes badly transpiled classes
+
+ var patch = NO_TRANSPILER_ISSUES ? function (qr) {
+ return qr;
+ } :
+ /* istanbul ignore next */
+ function (qr) {
+ var nqr = create(QRP);
+ push.apply(nqr, slice(qr));
+ return nqr;
+ };
+ var push = AP.push;
+
+ var search = function search(list, el) {
+ var nodes = [];
+ var length = list.length;
+
+ for (var i = 0; i < length; i++) {
+ var css = list[i].trim();
+
+ if (css.slice(-6) === ':first') {
+ var node = el.querySelector(css.slice(0, -6));
+ if (node) push.call(nodes, node);
+ } else push.apply(nodes, slice(el.querySelectorAll(css)));
+ }
+
+ return _construct(QueryResult, nodes);
+ };
+
+ var slice = NO_TRANSPILER_ISSUES ? patch :
+ /* istanbul ignore next */
+ function (all) {
+ // do not use slice.call(...) due old IE gotcha
+ var nodes = [];
+ var length = all.length;
+
+ for (var i = 0; i < length; i++) {
+ nodes[i] = all[i];
+ }
+
+ return nodes;
+ }; // use function to avoid usage of Symbol.hasInstance
+ // (broken in older browsers anyway)
+
+ var $$1 = function $(CSS) {
+ var parent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : document;
+
+ switch (_typeof(CSS)) {
+ case 'string':
+ return patch(search(CSS.split(','), parent));
+
+ case 'object':
+ // needed to avoid iterator dance (breaks in older IEs)
+ var nodes = [];
+ var all = 'nodeType' in CSS || 'postMessage' in CSS ? [CSS] : CSS;
+ push.apply(nodes, slice(all));
+ return patch(_construct(QueryResult, nodes));
+
+ case 'function':
+ var $parent = $(parent);
+ var $window = $(parent.defaultView);
+ var handler = {
+ handleEvent: function handleEvent(event) {
+ $parent.off(DOM_CONTENT_LOADED, handler);
+ $window.off(LOAD, handler);
+ CSS(event);
+ }
+ };
+ $parent.on(DOM_CONTENT_LOADED, handler);
+ $window.on(LOAD, handler);
+ var rs = parent.readyState;
+ if (rs == 'complete' || rs != 'loading' && !parent.documentElement.doScroll) setTimeout(function () {
+ return $parent.dispatch(DOM_CONTENT_LOADED);
+ });
+ return $;
+ }
+ };
+
+ $$1.prototype = QRP;
+
+ $$1.extend = function (key, value) {
+ return defineProperty(QRP, key, {
+ configurable: true,
+ value: value
+ }), $$1;
+ }; // dropped usage of for-of to avoid broken iteration dance in older IEs
+
+
+ $$1.extend('dispatch', function dispatch(type) {
+ var init = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+ var event = new CustomEvent(type, init);
+ var length = this.length;
+
+ for (var i = 0; i < length; i++) {
+ this[i].dispatchEvent(event);
+ }
+
+ return this;
+ }).extend('off', function off(type, handler) {
+ var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+ var length = this.length;
+
+ for (var i = 0; i < length; i++) {
+ this[i].removeEventListener(type, handler, options);
+ }
+
+ return this;
+ }).extend('on', function on(type, handler) {
+ var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+ var length = this.length;
+
+ for (var i = 0; i < length; i++) {
+ this[i].addEventListener(type, handler, options);
+ }
+
+ return this;
+ });
+
+ function _typeof$1(obj) {
+ "@babel/helpers - typeof";
+
+ if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
+ _typeof$1 = function _typeof(obj) {
+ return typeof obj;
+ };
+ } else {
+ _typeof$1 = function _typeof(obj) {
+ return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+ };
+ }
+
+ return _typeof$1(obj);
+ }
+
+ function _slicedToArray$1(arr, i) {
+ return _arrayWithHoles$1(arr) || _iterableToArrayLimit$1(arr, i) || _unsupportedIterableToArray$1(arr, i) || _nonIterableRest$1();
+ }
+
+ function _toConsumableArray$1(arr) {
+ return _arrayWithoutHoles$1(arr) || _iterableToArray$1(arr) || _unsupportedIterableToArray$1(arr) || _nonIterableSpread$1();
+ }
+
+ function _arrayWithoutHoles$1(arr) {
+ if (Array.isArray(arr)) return _arrayLikeToArray$1(arr);
+ }
+
+ function _arrayWithHoles$1(arr) {
+ if (Array.isArray(arr)) return arr;
+ }
+
+ function _iterableToArray$1(iter) {
+ if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter);
+ }
+
+ function _iterableToArrayLimit$1(arr, i) {
+ if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
+ var _arr = [];
+ var _n = true;
+ var _d = false;
+ var _e = undefined;
+
+ try {
+ for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
+ _arr.push(_s.value);
+
+ if (i && _arr.length === i) break;
+ }
+ } catch (err) {
+ _d = true;
+ _e = err;
+ } finally {
+ try {
+ if (!_n && _i["return"] != null) _i["return"]();
+ } finally {
+ if (_d) throw _e;
+ }
+ }
+
+ return _arr;
+ }
+
+ function _unsupportedIterableToArray$1(o, minLen) {
+ if (!o) return;
+ if (typeof o === "string") return _arrayLikeToArray$1(o, minLen);
+ var n = Object.prototype.toString.call(o).slice(8, -1);
+ if (n === "Object" && o.constructor) n = o.constructor.name;
+ if (n === "Map" || n === "Set") return Array.from(o);
+ if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$1(o, minLen);
+ }
+
+ function _arrayLikeToArray$1(arr, len) {
+ if (len == null || len > arr.length) len = arr.length;
+
+ for (var i = 0, arr2 = new Array(len); i < len; i++) {
+ arr2[i] = arr[i];
+ }
+
+ return arr2;
+ }
+
+ function _nonIterableSpread$1() {
+ throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+ }
+
+ function _nonIterableRest$1() {
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+ }
+
function convertToString(content, type) {
- switch (_typeof(content)) {
+ switch (_typeof$1(content)) {
case 'object':
{
if (!content) {
@@ -2185,7 +2680,7 @@
case 11:
{
// DOCUMENT_FRAGMENT_NODE
- return _toConsumableArray(content.childNodes).reduce(function (s, node) {
+ return _toConsumableArray$1(content.childNodes).reduce(function (s, node) {
return s + convertToString(node, type);
}, '');
}
@@ -2211,12 +2706,12 @@
}
default:
- throw new TypeError('Bad content for ' + type + '; type: ' + _typeof(content));
+ throw new TypeError('Bad content for ' + type + '; type: ' + _typeof$1(content));
}
}
function convertToDOM(content, type, avoidClone) {
- switch (_typeof(content)) {
+ switch (_typeof$1(content)) {
case 'object':
{
if (!content) {
@@ -2254,7 +2749,7 @@
}
default:
- throw new TypeError('Bad content for ' + type + '; type: ' + _typeof(content));
+ throw new TypeError('Bad content for ' + type + '; type: ' + _typeof$1(content));
}
}
@@ -2268,7 +2763,7 @@
var cbOrContent = args[0];
- switch (_typeof(cbOrContent)) {
+ switch (_typeof$1(cbOrContent)) {
case 'function':
{
this.forEach(function (node, i) {
@@ -2281,7 +2776,7 @@
default:
{
this.forEach(function (node, i, arr) {
- node[type].apply(node, _toConsumableArray(args.flatMap(function (content) {
+ node[type].apply(node, _toConsumableArray$1(args.flatMap(function (content) {
return convertToDOM(content, type, i === arr.length - 1);
})));
});
@@ -2297,7 +2792,7 @@
return function (cbOrContent) {
var _this2 = this;
- switch (_typeof(cbOrContent)) {
+ switch (_typeof$1(cbOrContent)) {
case 'function':
{
this.forEach(function (node, i) {
@@ -2342,7 +2837,7 @@
var insertTo = function insertTo(method) {
var $ = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function (sel) {
- return _toConsumableArray(document.querySelectorAll(sel));
+ return _toConsumableArray$1(document.querySelectorAll(sel));
};
var type = {
appendTo: 'append',
@@ -2358,7 +2853,7 @@
}
target = Array.isArray(target) ? target : [target];
- node[type].apply(node, _toConsumableArray(target.flatMap(function (content) {
+ node[type].apply(node, _toConsumableArray$1(target.flatMap(function (content) {
return convertToDOM(content, toType, i === arr.length - 1);
})));
});
@@ -2409,7 +2904,7 @@
var _this3 = this;
if (valueOrCb === undefined) {
- switch (_typeof(attributeNameOrAtts)) {
+ switch (_typeof$1(attributeNameOrAtts)) {
case 'string':
{
return this[0].hasAttribute(attributeNameOrAtts) ? this[0].getAttribute(attributeNameOrAtts) : undefined;
@@ -2420,7 +2915,7 @@
if (attributeNameOrAtts) {
this.forEach(function (node, i) {
Object.entries(attributeNameOrAtts).forEach(function (_ref) {
- var _ref2 = _slicedToArray(_ref, 2),
+ var _ref2 = _slicedToArray$1(_ref, 2),
att = _ref2[0],
val = _ref2[1];
@@ -2434,12 +2929,12 @@
default:
{
- throw new TypeError('Unexpected type for attribute name: ' + _typeof(attributeNameOrAtts));
+ throw new TypeError('Unexpected type for attribute name: ' + _typeof$1(attributeNameOrAtts));
}
}
}
- switch (_typeof(valueOrCb)) {
+ switch (_typeof$1(valueOrCb)) {
case 'function':
{
this.forEach(function (node, i) {
@@ -2473,7 +2968,7 @@
default:
{
- throw new TypeError('Unexpected type for attribute name: ' + _typeof(attributeNameOrAtts));
+ throw new TypeError('Unexpected type for attribute name: ' + _typeof$1(attributeNameOrAtts));
}
}
@@ -2482,7 +2977,7 @@
var removeAttr = function removeAttr(attributeName) {
if (typeof attributeName !== 'string') {
- throw new TypeError('Unexpected type for attribute name: ' + _typeof(attributeName));
+ throw new TypeError('Unexpected type for attribute name: ' + _typeof$1(attributeName));
}
this.forEach(function (node) {
@@ -2494,7 +2989,7 @@
return function (cbOrContent) {
var _this4 = this;
- switch (_typeof(cbOrContent)) {
+ switch (_typeof$1(cbOrContent)) {
case 'function':
{
this.forEach(function (node, i) {
@@ -2502,7 +2997,7 @@
var ret = cbOrContent.call(_this4, i, node.className);
- (_node$classList = node.classList)[type].apply(_node$classList, _toConsumableArray(ret.split(' ')));
+ (_node$classList = node.classList)[type].apply(_node$classList, _toConsumableArray$1(ret.split(' ')));
});
break;
}
@@ -2519,7 +3014,7 @@
this.forEach(function (node) {
var _node$classList2;
- (_node$classList2 = node.classList)[type].apply(_node$classList2, _toConsumableArray(cbOrContent.split(' ')));
+ (_node$classList2 = node.classList)[type].apply(_node$classList2, _toConsumableArray$1(cbOrContent.split(' ')));
});
break;
}
@@ -2541,7 +3036,7 @@
var toggleClass = function toggleClass(classNameOrCb, state) {
var _this5 = this;
- switch (typeof cbOrContent === "undefined" ? "undefined" : _typeof(cbOrContent)) {
+ switch (typeof cbOrContent === "undefined" ? "undefined" : _typeof$1(cbOrContent)) {
case 'function':
{
if (typeof state === 'boolean') {
@@ -2550,7 +3045,7 @@
var ret = classNameOrCb.call(_this5, i, node.className, state);
- (_node$classList3 = node.classList).toggle.apply(_node$classList3, _toConsumableArray(ret.split(' ')).concat([state]));
+ (_node$classList3 = node.classList).toggle.apply(_node$classList3, _toConsumableArray$1(ret.split(' ')).concat([state]));
});
} else {
this.forEach(function (node, i) {
@@ -2558,7 +3053,7 @@
var ret = classNameOrCb.call(_this5, i, node.className, state);
- (_node$classList4 = node.classList).toggle.apply(_node$classList4, _toConsumableArray(ret.split(' ')));
+ (_node$classList4 = node.classList).toggle.apply(_node$classList4, _toConsumableArray$1(ret.split(' ')));
});
}
@@ -2571,13 +3066,13 @@
this.forEach(function (node) {
var _node$classList5;
- (_node$classList5 = node.classList).toggle.apply(_node$classList5, _toConsumableArray(classNameOrCb.split(' ')).concat([state]));
+ (_node$classList5 = node.classList).toggle.apply(_node$classList5, _toConsumableArray$1(classNameOrCb.split(' ')).concat([state]));
});
} else {
this.forEach(function (node) {
var _node$classList6;
- (_node$classList6 = node.classList).toggle.apply(_node$classList6, _toConsumableArray(classNameOrCb.split(' ')));
+ (_node$classList6 = node.classList).toggle.apply(_node$classList6, _toConsumableArray$1(classNameOrCb.split(' ')));
});
}
@@ -2637,8 +3132,8 @@
};
manipulation($$1, jml);
- const baseAPIURL = 'https://openclipart.org/search/json/';
- const jsVoid = 'javascript: void(0);'; // eslint-disable-line no-script-url
+ var baseAPIURL = 'https://openclipart.org/search/json/';
+ var jsVoid = 'javascript: void(0);'; // eslint-disable-line no-script-url
/**
* Shows results after query submission.
@@ -2646,259 +3141,298 @@
* @returns {Promise<void>}
*/
- async function processResults(url) {
- /**
- * @param {string} query
- * @returns {external:JamilihArray}
- */
- function queryLink(query) {
- return ['a', {
- href: jsVoid,
- dataset: {
- value: query
- },
- $on: {
- click(e) {
- e.preventDefault();
- const {
- value
- } = this.dataset;
- $$1('#query')[0].$set(value);
- $$1('#openclipart')[0].$submit();
- }
-
- }
- }, [query]];
- }
-
- const r = await fetch(url);
- const json = await r.json(); // console.log('json', json);
-
- if (!json || json.msg !== 'success') {
- // Todo: This could use a generic alert library instead
- alert('There was a problem downloading the results'); // eslint-disable-line no-alert
-
- return;
- }
-
- const {
- payload,
- info: {
- results: numResults,
- pages,
- current_page: currentPage
- }
- } = json; // $('#page')[0].value = currentPage;
- // $('#page')[0].max = pages;
- // Unused properties:
- // - `svg_filesize` always 0?
- // - `dimensions: {
- // png_thumb: {width, height},
- // png_full_lossy: {width, height}
- // }` object of relevance?
- // - No need for `tags` with `tags_array`
- // - `svg`'s: `png_thumb`, `png_full_lossy`, `png_2400px`
-
- const semiColonSep = '; ' + nbsp;
- $$1('#results').jml('div', [['span', ['Number of results: ', numResults]], semiColonSep, ['span', ['page ', currentPage, ' out of ', pages]], ...payload.map(({
- title,
- description,
- id,
- uploader,
- created,
- svg: {
- url: svgURL
- },
- detail_link: detailLink,
- tags_array: tagsArray,
- downloaded_by: downloadedBy,
- total_favorites: totalFavorites
- }) => {
- const imgHW = '100px';
- const colonSep = ': ' + nbsp;
- return ['div', [['button', {
- style: 'margin-right: 8px; border: 2px solid black;',
- dataset: {
- id,
- value: svgURL
- },
- $on: {
- async click(e) {
- e.preventDefault();
- const {
- value: svgurl
- } = this.dataset; // console.log('this', id, svgurl);
-
- const post = message => {
- // Todo: Make origin customizable as set by opening window
- // Todo: If dropping IE9, avoid stringifying
- window.parent.postMessage(JSON.stringify(_extends({
- namespace: 'imagelib'
- }, message)), '*');
- }; // Send metadata (also indicates file is about to be sent)
-
-
- post({
- name: title,
- id: svgurl
- });
- const result = await fetch(svgurl);
- const svg = await result.text(); // console.log('url and svg', svgurl, svg);
-
- post({
- href: svgurl,
- data: svg
- });
- }
-
- }
- }, [// If we wanted interactive versions despite security risk:
- // ['object', {data: svgURL, type: 'image/svg+xml'}]
- ['img', {
- src: svgURL,
- style: `width: ${imgHW}; height: ${imgHW};`
- }]]], ['b', [title]], ' ', ['i', [description]], ' ', ['span', ['(ID: ', ['a', {
- href: jsVoid,
- dataset: {
- value: id
- },
- $on: {
- click(e) {
- e.preventDefault();
- const {
- value
- } = this.dataset;
- $$1('#byids')[0].$set(value);
- $$1('#openclipart')[0].$submit();
- }
-
- }
- }, [id]], ')']], ' ', ['i', [['a', {
- href: detailLink,
- target: '_blank'
- }, ['Details']]]], ['br'], ['span', [['u', ['Uploaded by']], colonSep, queryLink(uploader), semiColonSep]], ['span', [['u', ['Download count']], colonSep, downloadedBy, semiColonSep]], ['span', [['u', ['Times used as favorite']], colonSep, totalFavorites, semiColonSep]], ['span', [['u', ['Created date']], colonSep, created]], ['br'], ['u', ['Tags']], colonSep, ...tagsArray.map(tag => {
- return ['span', [' ', queryLink(tag)]];
- })]];
- }), ['br'], ['br'], currentPage === 1 || pages <= 2 ? '' : ['span', [['a', {
- href: jsVoid,
- $on: {
- click(e) {
- e.preventDefault();
- $$1('#page')[0].value = 1;
- $$1('#openclipart')[0].$submit();
- }
-
- }
- }, ['First']], ' ']], currentPage === 1 ? '' : ['span', [['a', {
- href: jsVoid,
- $on: {
- click(e) {
- e.preventDefault();
- $$1('#page')[0].value = currentPage - 1;
- $$1('#openclipart')[0].$submit();
- }
-
- }
- }, ['Prev']], ' ']], currentPage === pages ? '' : ['span', [['a', {
- href: jsVoid,
- $on: {
- click(e) {
- e.preventDefault();
- $$1('#page')[0].value = currentPage + 1;
- $$1('#openclipart')[0].$submit();
- }
-
- }
- }, ['Next']], ' ']], currentPage === pages || pages <= 2 ? '' : ['span', [['a', {
- href: jsVoid,
- $on: {
- click(e) {
- e.preventDefault();
- $$1('#page')[0].value = pages;
- $$1('#openclipart')[0].$submit();
- }
-
- }
- }, ['Last']], ' ']]]);
+ function processResults(_x) {
+ return _processResults.apply(this, arguments);
}
- jml('div', [['style', [`.control {
- padding-top: 10px;
- }`]], ['form', {
+ function _processResults() {
+ _processResults = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3(url) {
+ var queryLink, r, json, payload, _json$info, numResults, pages, currentPage, semiColonSep;
+
+ return regeneratorRuntime.wrap(function _callee3$(_context3) {
+ while (1) {
+ switch (_context3.prev = _context3.next) {
+ case 0:
+ queryLink = function _queryLink(query) {
+ return ['a', {
+ href: jsVoid,
+ dataset: {
+ value: query
+ },
+ $on: {
+ click: function click(e) {
+ e.preventDefault();
+ var value = this.dataset.value;
+ $$1('#query')[0].$set(value);
+ $$1('#openclipart')[0].$submit();
+ }
+ }
+ }, [query]];
+ };
+
+ _context3.next = 3;
+ return fetch(url);
+
+ case 3:
+ r = _context3.sent;
+ _context3.next = 6;
+ return r.json();
+
+ case 6:
+ json = _context3.sent;
+
+ if (!(!json || json.msg !== 'success')) {
+ _context3.next = 10;
+ break;
+ }
+
+ // Todo: This could use a generic alert library instead
+ alert('There was a problem downloading the results'); // eslint-disable-line no-alert
+
+ return _context3.abrupt("return");
+
+ case 10:
+ payload = json.payload, _json$info = json.info, numResults = _json$info.results, pages = _json$info.pages, currentPage = _json$info.current_page; // $('#page')[0].value = currentPage;
+ // $('#page')[0].max = pages;
+ // Unused properties:
+ // - `svg_filesize` always 0?
+ // - `dimensions: {
+ // png_thumb: {width, height},
+ // png_full_lossy: {width, height}
+ // }` object of relevance?
+ // - No need for `tags` with `tags_array`
+ // - `svg`'s: `png_thumb`, `png_full_lossy`, `png_2400px`
+
+ semiColonSep = '; ' + nbsp;
+ $$1('#results').jml('div', [['span', ['Number of results: ', numResults]], semiColonSep, ['span', ['page ', currentPage, ' out of ', pages]]].concat(_toConsumableArray(payload.map(function (_ref3) {
+ var title = _ref3.title,
+ description = _ref3.description,
+ id = _ref3.id,
+ uploader = _ref3.uploader,
+ created = _ref3.created,
+ svgURL = _ref3.svg.url,
+ detailLink = _ref3.detail_link,
+ tagsArray = _ref3.tags_array,
+ downloadedBy = _ref3.downloaded_by,
+ totalFavorites = _ref3.total_favorites;
+ var imgHW = '100px';
+ var colonSep = ': ' + nbsp;
+ return ['div', [['button', {
+ style: 'margin-right: 8px; border: 2px solid black;',
+ dataset: {
+ id: id,
+ value: svgURL
+ },
+ $on: {
+ click: function click(e) {
+ var _this = this;
+
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
+ var svgurl, post, result, svg;
+ return regeneratorRuntime.wrap(function _callee2$(_context2) {
+ while (1) {
+ switch (_context2.prev = _context2.next) {
+ case 0:
+ e.preventDefault();
+ svgurl = _this.dataset.value; // console.log('this', id, svgurl);
+
+ post = function post(message) {
+ // Todo: Make origin customizable as set by opening window
+ // Todo: If dropping IE9, avoid stringifying
+ window.parent.postMessage(JSON.stringify(_extends({
+ namespace: 'imagelib'
+ }, message)), '*');
+ }; // Send metadata (also indicates file is about to be sent)
+
+
+ post({
+ name: title,
+ id: svgurl
+ });
+ _context2.next = 6;
+ return fetch(svgurl);
+
+ case 6:
+ result = _context2.sent;
+ _context2.next = 9;
+ return result.text();
+
+ case 9:
+ svg = _context2.sent;
+ // console.log('url and svg', svgurl, svg);
+ post({
+ href: svgurl,
+ data: svg
+ });
+
+ case 11:
+ case "end":
+ return _context2.stop();
+ }
+ }
+ }, _callee2);
+ }))();
+ }
+ }
+ }, [// If we wanted interactive versions despite security risk:
+ // ['object', {data: svgURL, type: 'image/svg+xml'}]
+ ['img', {
+ src: svgURL,
+ style: "width: ".concat(imgHW, "; height: ").concat(imgHW, ";")
+ }]]], ['b', [title]], ' ', ['i', [description]], ' ', ['span', ['(ID: ', ['a', {
+ href: jsVoid,
+ dataset: {
+ value: id
+ },
+ $on: {
+ click: function click(e) {
+ e.preventDefault();
+ var value = this.dataset.value;
+ $$1('#byids')[0].$set(value);
+ $$1('#openclipart')[0].$submit();
+ }
+ }
+ }, [id]], ')']], ' ', ['i', [['a', {
+ href: detailLink,
+ target: '_blank'
+ }, ['Details']]]], ['br'], ['span', [['u', ['Uploaded by']], colonSep, queryLink(uploader), semiColonSep]], ['span', [['u', ['Download count']], colonSep, downloadedBy, semiColonSep]], ['span', [['u', ['Times used as favorite']], colonSep, totalFavorites, semiColonSep]], ['span', [['u', ['Created date']], colonSep, created]], ['br'], ['u', ['Tags']], colonSep].concat(_toConsumableArray(tagsArray.map(function (tag) {
+ return ['span', [' ', queryLink(tag)]];
+ })))];
+ })), [['br'], ['br'], currentPage === 1 || pages <= 2 ? '' : ['span', [['a', {
+ href: jsVoid,
+ $on: {
+ click: function click(e) {
+ e.preventDefault();
+ $$1('#page')[0].value = 1;
+ $$1('#openclipart')[0].$submit();
+ }
+ }
+ }, ['First']], ' ']], currentPage === 1 ? '' : ['span', [['a', {
+ href: jsVoid,
+ $on: {
+ click: function click(e) {
+ e.preventDefault();
+ $$1('#page')[0].value = currentPage - 1;
+ $$1('#openclipart')[0].$submit();
+ }
+ }
+ }, ['Prev']], ' ']], currentPage === pages ? '' : ['span', [['a', {
+ href: jsVoid,
+ $on: {
+ click: function click(e) {
+ e.preventDefault();
+ $$1('#page')[0].value = currentPage + 1;
+ $$1('#openclipart')[0].$submit();
+ }
+ }
+ }, ['Next']], ' ']], currentPage === pages || pages <= 2 ? '' : ['span', [['a', {
+ href: jsVoid,
+ $on: {
+ click: function click(e) {
+ e.preventDefault();
+ $$1('#page')[0].value = pages;
+ $$1('#openclipart')[0].$submit();
+ }
+ }
+ }, ['Last']], ' ']]]));
+
+ case 13:
+ case "end":
+ return _context3.stop();
+ }
+ }
+ }, _callee3);
+ }));
+ return _processResults.apply(this, arguments);
+ }
+
+ jml('div', [['style', [".control {\n padding-top: 10px;\n }"]], ['form', {
id: 'openclipart',
$custom: {
- async $submit() {
- const url = new URL(baseAPIURL);
- ['query', 'sort', 'amount', 'page', 'byids'].forEach(prop => {
- const {
- value
- } = $$1('#' + prop)[0];
+ $submit: function $submit() {
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+ var url;
+ return regeneratorRuntime.wrap(function _callee$(_context) {
+ while (1) {
+ switch (_context.prev = _context.next) {
+ case 0:
+ url = new URL(baseAPIURL);
+ ['query', 'sort', 'amount', 'page', 'byids'].forEach(function (prop) {
+ var value = $$1('#' + prop)[0].value;
- if (value) {
- url.searchParams.set(prop, value);
- }
- });
- await processResults(url);
+ if (value) {
+ url.searchParams.set(prop, value);
+ }
+ });
+ _context.next = 4;
+ return processResults(url);
+
+ case 4:
+ case "end":
+ return _context.stop();
+ }
+ }
+ }, _callee);
+ }))();
}
-
},
$on: {
- submit(e) {
+ submit: function submit(e) {
e.preventDefault();
this.$submit();
}
-
}
}, [// Todo: i18nize
['fieldset', [['legend', ['Search terms']], ['div', {
- class: 'control'
+ "class": 'control'
}, [['label', ['Query (Title, description, uploader, or tag): ', ['input', {
id: 'query',
name: 'query',
placeholder: 'cat',
$custom: {
- $set(value) {
+ $set: function $set(value) {
$$1('#byids')[0].value = '';
this.value = value;
}
-
},
$on: {
- change() {
+ change: function change() {
$$1('#byids')[0].value = '';
}
-
}
}]]]]], ['br'], ' OR ', ['br'], ['div', {
- class: 'control'
+ "class": 'control'
}, [['label', ['IDs (single or comma-separated): ', ['input', {
id: 'byids',
name: 'ids',
placeholder: '271380, 265741',
$custom: {
- $set(value) {
+ $set: function $set(value) {
$$1('#query')[0].value = '';
this.value = value;
}
-
},
$on: {
- change() {
+ change: function change() {
$$1('#query')[0].value = '';
}
-
}
}]]]]]]], ['fieldset', [['legend', ['Configuring results']], ['div', {
- class: 'control'
+ "class": 'control'
}, [['label', ['Sort by: ', ['select', {
id: 'sort'
}, [// Todo: i18nize first values
- ['Date', 'date'], ['Downloads', 'downloads'], ['Favorited', 'favorites']].map(([text, value = text]) => {
+ ['Date', 'date'], ['Downloads', 'downloads'], ['Favorited', 'favorites']].map(function (_ref) {
+ var _ref2 = _slicedToArray(_ref, 2),
+ text = _ref2[0],
+ _ref2$ = _ref2[1],
+ value = _ref2$ === void 0 ? text : _ref2$;
+
return ['option', {
- value
+ value: value
}, [text]];
})]]]]], ['div', {
- class: 'control'
+ "class": 'control'
}, [['label', ['Results per page: ', ['input', {
id: 'amount',
name: 'amount',
@@ -2909,7 +3443,7 @@
step: 1,
pattern: '\\d+'
}]]]]], ['div', {
- class: 'control'
+ "class": 'control'
}, [['label', ['Page number: ', ['input', {
// max: 1, // We'll change this based on available results
id: 'page',
@@ -2921,7 +3455,7 @@
step: 1,
pattern: '\\d+'
}]]]]]]], ['div', {
- class: 'control'
+ "class": 'control'
}, [['input', {
type: 'submit'
}]]]]], ['div', {
diff --git a/dist/index-es.js b/dist/index-es.js
index 4177c70a..9b51d570 100644
--- a/dist/index-es.js
+++ b/dist/index-es.js
@@ -1,3 +1,333 @@
+function _typeof(obj) {
+ "@babel/helpers - typeof";
+
+ if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
+ _typeof = function (obj) {
+ return typeof obj;
+ };
+ } else {
+ _typeof = function (obj) {
+ return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+ };
+ }
+
+ return _typeof(obj);
+}
+
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+ try {
+ var info = gen[key](arg);
+ var value = info.value;
+ } catch (error) {
+ reject(error);
+ return;
+ }
+
+ if (info.done) {
+ resolve(value);
+ } else {
+ Promise.resolve(value).then(_next, _throw);
+ }
+}
+
+function _asyncToGenerator(fn) {
+ return function () {
+ var self = this,
+ args = arguments;
+ return new Promise(function (resolve, reject) {
+ var gen = fn.apply(self, args);
+
+ function _next(value) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+ }
+
+ function _throw(err) {
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+ }
+
+ _next(undefined);
+ });
+ };
+}
+
+function _classCallCheck(instance, Constructor) {
+ if (!(instance instanceof Constructor)) {
+ throw new TypeError("Cannot call a class as a function");
+ }
+}
+
+function _defineProperties(target, props) {
+ for (var i = 0; i < props.length; i++) {
+ var descriptor = props[i];
+ descriptor.enumerable = descriptor.enumerable || false;
+ descriptor.configurable = true;
+ if ("value" in descriptor) descriptor.writable = true;
+ Object.defineProperty(target, descriptor.key, descriptor);
+ }
+}
+
+function _createClass(Constructor, protoProps, staticProps) {
+ if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+ if (staticProps) _defineProperties(Constructor, staticProps);
+ return Constructor;
+}
+
+function _extends() {
+ _extends = Object.assign || function (target) {
+ for (var i = 1; i < arguments.length; i++) {
+ var source = arguments[i];
+
+ for (var key in source) {
+ if (Object.prototype.hasOwnProperty.call(source, key)) {
+ target[key] = source[key];
+ }
+ }
+ }
+
+ return target;
+ };
+
+ return _extends.apply(this, arguments);
+}
+
+function _inherits(subClass, superClass) {
+ if (typeof superClass !== "function" && superClass !== null) {
+ throw new TypeError("Super expression must either be null or a function");
+ }
+
+ subClass.prototype = Object.create(superClass && superClass.prototype, {
+ constructor: {
+ value: subClass,
+ writable: true,
+ configurable: true
+ }
+ });
+ if (superClass) _setPrototypeOf(subClass, superClass);
+}
+
+function _getPrototypeOf(o) {
+ _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
+ return o.__proto__ || Object.getPrototypeOf(o);
+ };
+ return _getPrototypeOf(o);
+}
+
+function _setPrototypeOf(o, p) {
+ _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
+ o.__proto__ = p;
+ return o;
+ };
+
+ return _setPrototypeOf(o, p);
+}
+
+function _isNativeReflectConstruct() {
+ if (typeof Reflect === "undefined" || !Reflect.construct) return false;
+ if (Reflect.construct.sham) return false;
+ if (typeof Proxy === "function") return true;
+
+ try {
+ Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
+ return true;
+ } catch (e) {
+ return false;
+ }
+}
+
+function _assertThisInitialized(self) {
+ if (self === void 0) {
+ throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+ }
+
+ return self;
+}
+
+function _possibleConstructorReturn(self, call) {
+ if (call && (typeof call === "object" || typeof call === "function")) {
+ return call;
+ }
+
+ return _assertThisInitialized(self);
+}
+
+function _createSuper(Derived) {
+ var hasNativeReflectConstruct = _isNativeReflectConstruct();
+
+ return function _createSuperInternal() {
+ var Super = _getPrototypeOf(Derived),
+ result;
+
+ if (hasNativeReflectConstruct) {
+ var NewTarget = _getPrototypeOf(this).constructor;
+
+ result = Reflect.construct(Super, arguments, NewTarget);
+ } else {
+ result = Super.apply(this, arguments);
+ }
+
+ return _possibleConstructorReturn(this, result);
+ };
+}
+
+function _superPropBase(object, property) {
+ while (!Object.prototype.hasOwnProperty.call(object, property)) {
+ object = _getPrototypeOf(object);
+ if (object === null) break;
+ }
+
+ return object;
+}
+
+function _get(target, property, receiver) {
+ if (typeof Reflect !== "undefined" && Reflect.get) {
+ _get = Reflect.get;
+ } else {
+ _get = function _get(target, property, receiver) {
+ var base = _superPropBase(target, property);
+
+ if (!base) return;
+ var desc = Object.getOwnPropertyDescriptor(base, property);
+
+ if (desc.get) {
+ return desc.get.call(receiver);
+ }
+
+ return desc.value;
+ };
+ }
+
+ return _get(target, property, receiver || target);
+}
+
+function _slicedToArray(arr, i) {
+ return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+}
+
+function _toConsumableArray(arr) {
+ return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
+}
+
+function _arrayWithoutHoles(arr) {
+ if (Array.isArray(arr)) return _arrayLikeToArray(arr);
+}
+
+function _arrayWithHoles(arr) {
+ if (Array.isArray(arr)) return arr;
+}
+
+function _iterableToArray(iter) {
+ if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter);
+}
+
+function _iterableToArrayLimit(arr, i) {
+ if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
+ var _arr = [];
+ var _n = true;
+ var _d = false;
+ var _e = undefined;
+
+ try {
+ for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
+ _arr.push(_s.value);
+
+ if (i && _arr.length === i) break;
+ }
+ } catch (err) {
+ _d = true;
+ _e = err;
+ } finally {
+ try {
+ if (!_n && _i["return"] != null) _i["return"]();
+ } finally {
+ if (_d) throw _e;
+ }
+ }
+
+ return _arr;
+}
+
+function _unsupportedIterableToArray(o, minLen) {
+ if (!o) return;
+ if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+ var n = Object.prototype.toString.call(o).slice(8, -1);
+ if (n === "Object" && o.constructor) n = o.constructor.name;
+ if (n === "Map" || n === "Set") return Array.from(o);
+ if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
+
+function _arrayLikeToArray(arr, len) {
+ if (len == null || len > arr.length) len = arr.length;
+
+ for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+
+ return arr2;
+}
+
+function _nonIterableSpread() {
+ throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+function _nonIterableRest() {
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+function _createForOfIteratorHelper(o, allowArrayLike) {
+ var it;
+
+ if (typeof Symbol === "undefined" || o[Symbol.iterator] == null) {
+ if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") {
+ if (it) o = it;
+ var i = 0;
+
+ var F = function () {};
+
+ return {
+ s: F,
+ n: function () {
+ if (i >= o.length) return {
+ done: true
+ };
+ return {
+ done: false,
+ value: o[i++]
+ };
+ },
+ e: function (e) {
+ throw e;
+ },
+ f: F
+ };
+ }
+
+ throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+ }
+
+ var normalCompletion = true,
+ didErr = false,
+ err;
+ return {
+ s: function () {
+ it = o[Symbol.iterator]();
+ },
+ n: function () {
+ var step = it.next();
+ normalCompletion = step.done;
+ return step;
+ },
+ e: function (e) {
+ didErr = true;
+ err = e;
+ },
+ f: function () {
+ try {
+ if (!normalCompletion && it.return != null) it.return();
+ } finally {
+ if (didErr) throw err;
+ }
+ }
+ };
+}
+
// http://ross.posterous.com/2008/08/19/iphone-touch-events-in-javascript/
/**
@@ -6,11 +336,9 @@
* @returns {void}
*/
function touchHandler(ev) {
- const {
- changedTouches
- } = ev,
- first = changedTouches[0];
- let type = '';
+ var changedTouches = ev.changedTouches,
+ first = changedTouches[0];
+ var type = '';
switch (ev.type) {
case 'touchstart':
@@ -29,14 +357,12 @@ function touchHandler(ev) {
return;
}
- const {
- screenX,
- screenY,
- clientX,
- clientY
- } = first; // eslint-disable-line no-shadow
+ var screenX = first.screenX,
+ screenY = first.screenY,
+ clientX = first.clientX,
+ clientY = first.clientY; // eslint-disable-line no-shadow
- const simulatedEvent = new MouseEvent(type, {
+ var simulatedEvent = new MouseEvent(type, {
// Event interface
bubbles: true,
cancelable: true,
@@ -45,10 +371,10 @@ function touchHandler(ev) {
detail: 1,
// click count
// MouseEvent interface (customized)
- screenX,
- screenY,
- clientX,
- clientY,
+ screenX: screenX,
+ screenY: screenY,
+ clientX: clientX,
+ clientY: clientY,
// MouseEvent interface (defaults) - these could be removed
ctrlKey: false,
altKey: false,
@@ -82,7 +408,7 @@ document.addEventListener('touchcancel', touchHandler, true);
* @type {PlainObject}
* @memberof module:namespaces
*/
-const NS = {
+var NS = {
HTML: 'http://www.w3.org/1999/xhtml',
MATH: 'http://www.w3.org/1998/Math/MathML',
SE: 'http://svg-edit.googlecode.com',
@@ -97,15 +423,19 @@ const NS = {
* @returns {string} The NS with key values switched and lowercase
*/
-const getReverseNS = function () {
- const reverseNS = {};
- Object.entries(NS).forEach(([name, URI]) => {
+var getReverseNS = function getReverseNS() {
+ var reverseNS = {};
+ Object.entries(NS).forEach(function (_ref) {
+ var _ref2 = _slicedToArray(_ref, 2),
+ name = _ref2[0],
+ URI = _ref2[1];
+
reverseNS[URI] = name.toLowerCase();
});
return reverseNS;
};
-/* eslint-disable import/unambiguous */
+/* eslint-disable import/unambiguous, max-len */
/* globals SVGPathSeg, SVGPathSegMovetoRel, SVGPathSegMovetoAbs,
SVGPathSegMovetoRel, SVGPathSegLinetoRel, SVGPathSegLinetoAbs,
@@ -131,1341 +461,1513 @@ const getReverseNS = function () {
// Linting: We avoid `no-shadow` as ESLint thinks these are still available globals
// Linting: We avoid `class-methods-use-this` as this is a polyfill that must
// follow the conventions
-(() => {
+(function () {
if (!('SVGPathSeg' in window)) {
// Spec: https://www.w3.org/TR/SVG11/single-page.html#paths-InterfaceSVGPathSeg
- class SVGPathSeg {
- constructor(type, typeAsLetter, owningPathSegList) {
+ var _SVGPathSeg = /*#__PURE__*/function () {
+ function _SVGPathSeg(type, typeAsLetter, owningPathSegList) {
+ _classCallCheck(this, _SVGPathSeg);
+
this.pathSegType = type;
this.pathSegTypeAsLetter = typeAsLetter;
this._owningPathSegList = owningPathSegList;
} // Notify owning PathSegList on any changes so they can be synchronized back to the path element.
- _segmentChanged() {
- if (this._owningPathSegList) {
- this._owningPathSegList.segmentChanged(this);
+ _createClass(_SVGPathSeg, [{
+ key: "_segmentChanged",
+ value: function _segmentChanged() {
+ if (this._owningPathSegList) {
+ this._owningPathSegList.segmentChanged(this);
+ }
}
+ }]);
+
+ return _SVGPathSeg;
+ }();
+
+ _SVGPathSeg.prototype.classname = 'SVGPathSeg';
+ _SVGPathSeg.PATHSEG_UNKNOWN = 0;
+ _SVGPathSeg.PATHSEG_CLOSEPATH = 1;
+ _SVGPathSeg.PATHSEG_MOVETO_ABS = 2;
+ _SVGPathSeg.PATHSEG_MOVETO_REL = 3;
+ _SVGPathSeg.PATHSEG_LINETO_ABS = 4;
+ _SVGPathSeg.PATHSEG_LINETO_REL = 5;
+ _SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS = 6;
+ _SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL = 7;
+ _SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS = 8;
+ _SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL = 9;
+ _SVGPathSeg.PATHSEG_ARC_ABS = 10;
+ _SVGPathSeg.PATHSEG_ARC_REL = 11;
+ _SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS = 12;
+ _SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL = 13;
+ _SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS = 14;
+ _SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL = 15;
+ _SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS = 16;
+ _SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL = 17;
+ _SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS = 18;
+ _SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL = 19;
+
+ var _SVGPathSegClosePath = /*#__PURE__*/function (_SVGPathSeg2) {
+ _inherits(_SVGPathSegClosePath, _SVGPathSeg2);
+
+ var _super = _createSuper(_SVGPathSegClosePath);
+
+ function _SVGPathSegClosePath(owningPathSegList) {
+ _classCallCheck(this, _SVGPathSegClosePath);
+
+ return _super.call(this, _SVGPathSeg.PATHSEG_CLOSEPATH, 'z', owningPathSegList);
}
- }
+ _createClass(_SVGPathSegClosePath, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegClosePath]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegClosePath(undefined);
+ }
+ }]);
- SVGPathSeg.prototype.classname = 'SVGPathSeg';
- SVGPathSeg.PATHSEG_UNKNOWN = 0;
- SVGPathSeg.PATHSEG_CLOSEPATH = 1;
- SVGPathSeg.PATHSEG_MOVETO_ABS = 2;
- SVGPathSeg.PATHSEG_MOVETO_REL = 3;
- SVGPathSeg.PATHSEG_LINETO_ABS = 4;
- SVGPathSeg.PATHSEG_LINETO_REL = 5;
- SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS = 6;
- SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL = 7;
- SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS = 8;
- SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL = 9;
- SVGPathSeg.PATHSEG_ARC_ABS = 10;
- SVGPathSeg.PATHSEG_ARC_REL = 11;
- SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS = 12;
- SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL = 13;
- SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS = 14;
- SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL = 15;
- SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS = 16;
- SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL = 17;
- SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS = 18;
- SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL = 19;
+ return _SVGPathSegClosePath;
+ }(_SVGPathSeg);
- class SVGPathSegClosePath extends SVGPathSeg {
- constructor(owningPathSegList) {
- super(SVGPathSeg.PATHSEG_CLOSEPATH, 'z', owningPathSegList);
+ var _SVGPathSegMovetoAbs = /*#__PURE__*/function (_SVGPathSeg3) {
+ _inherits(_SVGPathSegMovetoAbs, _SVGPathSeg3);
+
+ var _super2 = _createSuper(_SVGPathSegMovetoAbs);
+
+ function _SVGPathSegMovetoAbs(owningPathSegList, x, y) {
+ var _this;
+
+ _classCallCheck(this, _SVGPathSegMovetoAbs);
+
+ _this = _super2.call(this, _SVGPathSeg.PATHSEG_MOVETO_ABS, 'M', owningPathSegList);
+ _this._x = x;
+ _this._y = y;
+ return _this;
}
- toString() {
- return '[object SVGPathSegClosePath]';
- }
+ _createClass(_SVGPathSegMovetoAbs, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegMovetoAbs]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegMovetoAbs(undefined, this._x, this._y);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter;
- }
+ return _SVGPathSegMovetoAbs;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegClosePath(undefined);
- }
-
- }
-
- class SVGPathSegMovetoAbs extends SVGPathSeg {
- constructor(owningPathSegList, x, y) {
- super(SVGPathSeg.PATHSEG_MOVETO_ABS, 'M', owningPathSegList);
- this._x = x;
- this._y = y;
- }
-
- toString() {
- return '[object SVGPathSegMovetoAbs]';
- }
-
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y;
- }
-
- clone() {
- return new SVGPathSegMovetoAbs(undefined, this._x, this._y);
- }
-
- }
-
- Object.defineProperties(SVGPathSegMovetoAbs.prototype, {
+ Object.defineProperties(_SVGPathSegMovetoAbs.prototype, {
x: {
- get() {
+ get: function get() {
return this._x;
},
-
- set(x) {
+ set: function set(x) {
this._x = x;
this._segmentChanged();
},
-
enumerable: true
},
y: {
- get() {
+ get: function get() {
return this._y;
},
-
- set(y) {
+ set: function set(y) {
this._y = y;
this._segmentChanged();
},
-
enumerable: true
}
});
- class SVGPathSegMovetoRel extends SVGPathSeg {
- constructor(owningPathSegList, x, y) {
- super(SVGPathSeg.PATHSEG_MOVETO_REL, 'm', owningPathSegList);
- this._x = x;
- this._y = y;
+ var _SVGPathSegMovetoRel = /*#__PURE__*/function (_SVGPathSeg4) {
+ _inherits(_SVGPathSegMovetoRel, _SVGPathSeg4);
+
+ var _super3 = _createSuper(_SVGPathSegMovetoRel);
+
+ function _SVGPathSegMovetoRel(owningPathSegList, x, y) {
+ var _this2;
+
+ _classCallCheck(this, _SVGPathSegMovetoRel);
+
+ _this2 = _super3.call(this, _SVGPathSeg.PATHSEG_MOVETO_REL, 'm', owningPathSegList);
+ _this2._x = x;
+ _this2._y = y;
+ return _this2;
}
- toString() {
- return '[object SVGPathSegMovetoRel]';
- }
+ _createClass(_SVGPathSegMovetoRel, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegMovetoRel]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegMovetoRel(undefined, this._x, this._y);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y;
- }
+ return _SVGPathSegMovetoRel;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegMovetoRel(undefined, this._x, this._y);
- }
-
- }
-
- Object.defineProperties(SVGPathSegMovetoRel.prototype, {
+ Object.defineProperties(_SVGPathSegMovetoRel.prototype, {
x: {
- get() {
+ get: function get() {
return this._x;
},
-
- set(x) {
+ set: function set(x) {
this._x = x;
this._segmentChanged();
},
-
enumerable: true
},
y: {
- get() {
+ get: function get() {
return this._y;
},
-
- set(y) {
+ set: function set(y) {
this._y = y;
this._segmentChanged();
},
-
enumerable: true
}
});
- class SVGPathSegLinetoAbs extends SVGPathSeg {
- constructor(owningPathSegList, x, y) {
- super(SVGPathSeg.PATHSEG_LINETO_ABS, 'L', owningPathSegList);
- this._x = x;
- this._y = y;
+ var _SVGPathSegLinetoAbs = /*#__PURE__*/function (_SVGPathSeg5) {
+ _inherits(_SVGPathSegLinetoAbs, _SVGPathSeg5);
+
+ var _super4 = _createSuper(_SVGPathSegLinetoAbs);
+
+ function _SVGPathSegLinetoAbs(owningPathSegList, x, y) {
+ var _this3;
+
+ _classCallCheck(this, _SVGPathSegLinetoAbs);
+
+ _this3 = _super4.call(this, _SVGPathSeg.PATHSEG_LINETO_ABS, 'L', owningPathSegList);
+ _this3._x = x;
+ _this3._y = y;
+ return _this3;
}
- toString() {
- return '[object SVGPathSegLinetoAbs]';
- }
+ _createClass(_SVGPathSegLinetoAbs, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegLinetoAbs]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegLinetoAbs(undefined, this._x, this._y);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y;
- }
+ return _SVGPathSegLinetoAbs;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegLinetoAbs(undefined, this._x, this._y);
- }
-
- }
-
- Object.defineProperties(SVGPathSegLinetoAbs.prototype, {
+ Object.defineProperties(_SVGPathSegLinetoAbs.prototype, {
x: {
- get() {
+ get: function get() {
return this._x;
},
-
- set(x) {
+ set: function set(x) {
this._x = x;
this._segmentChanged();
},
-
enumerable: true
},
y: {
- get() {
+ get: function get() {
return this._y;
},
-
- set(y) {
+ set: function set(y) {
this._y = y;
this._segmentChanged();
},
-
enumerable: true
}
});
- class SVGPathSegLinetoRel extends SVGPathSeg {
- constructor(owningPathSegList, x, y) {
- super(SVGPathSeg.PATHSEG_LINETO_REL, 'l', owningPathSegList);
- this._x = x;
- this._y = y;
+ var _SVGPathSegLinetoRel = /*#__PURE__*/function (_SVGPathSeg6) {
+ _inherits(_SVGPathSegLinetoRel, _SVGPathSeg6);
+
+ var _super5 = _createSuper(_SVGPathSegLinetoRel);
+
+ function _SVGPathSegLinetoRel(owningPathSegList, x, y) {
+ var _this4;
+
+ _classCallCheck(this, _SVGPathSegLinetoRel);
+
+ _this4 = _super5.call(this, _SVGPathSeg.PATHSEG_LINETO_REL, 'l', owningPathSegList);
+ _this4._x = x;
+ _this4._y = y;
+ return _this4;
}
- toString() {
- return '[object SVGPathSegLinetoRel]';
- }
+ _createClass(_SVGPathSegLinetoRel, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegLinetoRel]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegLinetoRel(undefined, this._x, this._y);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y;
- }
+ return _SVGPathSegLinetoRel;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegLinetoRel(undefined, this._x, this._y);
- }
-
- }
-
- Object.defineProperties(SVGPathSegLinetoRel.prototype, {
+ Object.defineProperties(_SVGPathSegLinetoRel.prototype, {
x: {
- get() {
+ get: function get() {
return this._x;
},
-
- set(x) {
+ set: function set(x) {
this._x = x;
this._segmentChanged();
},
-
enumerable: true
},
y: {
- get() {
+ get: function get() {
return this._y;
},
-
- set(y) {
+ set: function set(y) {
this._y = y;
this._segmentChanged();
},
-
enumerable: true
}
});
- class SVGPathSegCurvetoCubicAbs extends SVGPathSeg {
- constructor(owningPathSegList, x, y, x1, y1, x2, y2) {
- super(SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS, 'C', owningPathSegList);
- this._x = x;
- this._y = y;
- this._x1 = x1;
- this._y1 = y1;
- this._x2 = x2;
- this._y2 = y2;
+ var _SVGPathSegCurvetoCubicAbs = /*#__PURE__*/function (_SVGPathSeg7) {
+ _inherits(_SVGPathSegCurvetoCubicAbs, _SVGPathSeg7);
+
+ var _super6 = _createSuper(_SVGPathSegCurvetoCubicAbs);
+
+ function _SVGPathSegCurvetoCubicAbs(owningPathSegList, x, y, x1, y1, x2, y2) {
+ var _this5;
+
+ _classCallCheck(this, _SVGPathSegCurvetoCubicAbs);
+
+ _this5 = _super6.call(this, _SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS, 'C', owningPathSegList);
+ _this5._x = x;
+ _this5._y = y;
+ _this5._x1 = x1;
+ _this5._y1 = y1;
+ _this5._x2 = x2;
+ _this5._y2 = y2;
+ return _this5;
}
- toString() {
- return '[object SVGPathSegCurvetoCubicAbs]';
- }
+ _createClass(_SVGPathSegCurvetoCubicAbs, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegCurvetoCubicAbs]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._x1 + ' ' + this._y1 + ' ' + this._x2 + ' ' + this._y2 + ' ' + this._x + ' ' + this._y;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegCurvetoCubicAbs(undefined, this._x, this._y, this._x1, this._y1, this._x2, this._y2);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._x1 + ' ' + this._y1 + ' ' + this._x2 + ' ' + this._y2 + ' ' + this._x + ' ' + this._y;
- }
+ return _SVGPathSegCurvetoCubicAbs;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegCurvetoCubicAbs(undefined, this._x, this._y, this._x1, this._y1, this._x2, this._y2);
- }
-
- }
-
- Object.defineProperties(SVGPathSegCurvetoCubicAbs.prototype, {
+ Object.defineProperties(_SVGPathSegCurvetoCubicAbs.prototype, {
x: {
- get() {
+ get: function get() {
return this._x;
},
-
- set(x) {
+ set: function set(x) {
this._x = x;
this._segmentChanged();
},
-
enumerable: true
},
y: {
- get() {
+ get: function get() {
return this._y;
},
-
- set(y) {
+ set: function set(y) {
this._y = y;
this._segmentChanged();
},
-
enumerable: true
},
x1: {
- get() {
+ get: function get() {
return this._x1;
},
-
- set(x1) {
+ set: function set(x1) {
this._x1 = x1;
this._segmentChanged();
},
-
enumerable: true
},
y1: {
- get() {
+ get: function get() {
return this._y1;
},
-
- set(y1) {
+ set: function set(y1) {
this._y1 = y1;
this._segmentChanged();
},
-
enumerable: true
},
x2: {
- get() {
+ get: function get() {
return this._x2;
},
-
- set(x2) {
+ set: function set(x2) {
this._x2 = x2;
this._segmentChanged();
},
-
enumerable: true
},
y2: {
- get() {
+ get: function get() {
return this._y2;
},
-
- set(y2) {
+ set: function set(y2) {
this._y2 = y2;
this._segmentChanged();
},
-
enumerable: true
}
});
- class SVGPathSegCurvetoCubicRel extends SVGPathSeg {
- constructor(owningPathSegList, x, y, x1, y1, x2, y2) {
- super(SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL, 'c', owningPathSegList);
- this._x = x;
- this._y = y;
- this._x1 = x1;
- this._y1 = y1;
- this._x2 = x2;
- this._y2 = y2;
+ var _SVGPathSegCurvetoCubicRel = /*#__PURE__*/function (_SVGPathSeg8) {
+ _inherits(_SVGPathSegCurvetoCubicRel, _SVGPathSeg8);
+
+ var _super7 = _createSuper(_SVGPathSegCurvetoCubicRel);
+
+ function _SVGPathSegCurvetoCubicRel(owningPathSegList, x, y, x1, y1, x2, y2) {
+ var _this6;
+
+ _classCallCheck(this, _SVGPathSegCurvetoCubicRel);
+
+ _this6 = _super7.call(this, _SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL, 'c', owningPathSegList);
+ _this6._x = x;
+ _this6._y = y;
+ _this6._x1 = x1;
+ _this6._y1 = y1;
+ _this6._x2 = x2;
+ _this6._y2 = y2;
+ return _this6;
}
- toString() {
- return '[object SVGPathSegCurvetoCubicRel]';
- }
+ _createClass(_SVGPathSegCurvetoCubicRel, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegCurvetoCubicRel]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._x1 + ' ' + this._y1 + ' ' + this._x2 + ' ' + this._y2 + ' ' + this._x + ' ' + this._y;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegCurvetoCubicRel(undefined, this._x, this._y, this._x1, this._y1, this._x2, this._y2);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._x1 + ' ' + this._y1 + ' ' + this._x2 + ' ' + this._y2 + ' ' + this._x + ' ' + this._y;
- }
+ return _SVGPathSegCurvetoCubicRel;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegCurvetoCubicRel(undefined, this._x, this._y, this._x1, this._y1, this._x2, this._y2);
- }
-
- }
-
- Object.defineProperties(SVGPathSegCurvetoCubicRel.prototype, {
+ Object.defineProperties(_SVGPathSegCurvetoCubicRel.prototype, {
x: {
- get() {
+ get: function get() {
return this._x;
},
-
- set(x) {
+ set: function set(x) {
this._x = x;
this._segmentChanged();
},
-
enumerable: true
},
y: {
- get() {
+ get: function get() {
return this._y;
},
-
- set(y) {
+ set: function set(y) {
this._y = y;
this._segmentChanged();
},
-
enumerable: true
},
x1: {
- get() {
+ get: function get() {
return this._x1;
},
-
- set(x1) {
+ set: function set(x1) {
this._x1 = x1;
this._segmentChanged();
},
-
enumerable: true
},
y1: {
- get() {
+ get: function get() {
return this._y1;
},
-
- set(y1) {
+ set: function set(y1) {
this._y1 = y1;
this._segmentChanged();
},
-
enumerable: true
},
x2: {
- get() {
+ get: function get() {
return this._x2;
},
-
- set(x2) {
+ set: function set(x2) {
this._x2 = x2;
this._segmentChanged();
},
-
enumerable: true
},
y2: {
- get() {
+ get: function get() {
return this._y2;
},
-
- set(y2) {
+ set: function set(y2) {
this._y2 = y2;
this._segmentChanged();
},
-
enumerable: true
}
});
- class SVGPathSegCurvetoQuadraticAbs extends SVGPathSeg {
- constructor(owningPathSegList, x, y, x1, y1) {
- super(SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS, 'Q', owningPathSegList);
- this._x = x;
- this._y = y;
- this._x1 = x1;
- this._y1 = y1;
+ var _SVGPathSegCurvetoQuadraticAbs = /*#__PURE__*/function (_SVGPathSeg9) {
+ _inherits(_SVGPathSegCurvetoQuadraticAbs, _SVGPathSeg9);
+
+ var _super8 = _createSuper(_SVGPathSegCurvetoQuadraticAbs);
+
+ function _SVGPathSegCurvetoQuadraticAbs(owningPathSegList, x, y, x1, y1) {
+ var _this7;
+
+ _classCallCheck(this, _SVGPathSegCurvetoQuadraticAbs);
+
+ _this7 = _super8.call(this, _SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS, 'Q', owningPathSegList);
+ _this7._x = x;
+ _this7._y = y;
+ _this7._x1 = x1;
+ _this7._y1 = y1;
+ return _this7;
}
- toString() {
- return '[object SVGPathSegCurvetoQuadraticAbs]';
- }
+ _createClass(_SVGPathSegCurvetoQuadraticAbs, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegCurvetoQuadraticAbs]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._x1 + ' ' + this._y1 + ' ' + this._x + ' ' + this._y;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegCurvetoQuadraticAbs(undefined, this._x, this._y, this._x1, this._y1);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._x1 + ' ' + this._y1 + ' ' + this._x + ' ' + this._y;
- }
+ return _SVGPathSegCurvetoQuadraticAbs;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegCurvetoQuadraticAbs(undefined, this._x, this._y, this._x1, this._y1);
- }
-
- }
-
- Object.defineProperties(SVGPathSegCurvetoQuadraticAbs.prototype, {
+ Object.defineProperties(_SVGPathSegCurvetoQuadraticAbs.prototype, {
x: {
- get() {
+ get: function get() {
return this._x;
},
-
- set(x) {
+ set: function set(x) {
this._x = x;
this._segmentChanged();
},
-
enumerable: true
},
y: {
- get() {
+ get: function get() {
return this._y;
},
-
- set(y) {
+ set: function set(y) {
this._y = y;
this._segmentChanged();
},
-
enumerable: true
},
x1: {
- get() {
+ get: function get() {
return this._x1;
},
-
- set(x1) {
+ set: function set(x1) {
this._x1 = x1;
this._segmentChanged();
},
-
enumerable: true
},
y1: {
- get() {
+ get: function get() {
return this._y1;
},
-
- set(y1) {
+ set: function set(y1) {
this._y1 = y1;
this._segmentChanged();
},
-
enumerable: true
}
});
- class SVGPathSegCurvetoQuadraticRel extends SVGPathSeg {
- constructor(owningPathSegList, x, y, x1, y1) {
- super(SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL, 'q', owningPathSegList);
- this._x = x;
- this._y = y;
- this._x1 = x1;
- this._y1 = y1;
+ var _SVGPathSegCurvetoQuadraticRel = /*#__PURE__*/function (_SVGPathSeg10) {
+ _inherits(_SVGPathSegCurvetoQuadraticRel, _SVGPathSeg10);
+
+ var _super9 = _createSuper(_SVGPathSegCurvetoQuadraticRel);
+
+ function _SVGPathSegCurvetoQuadraticRel(owningPathSegList, x, y, x1, y1) {
+ var _this8;
+
+ _classCallCheck(this, _SVGPathSegCurvetoQuadraticRel);
+
+ _this8 = _super9.call(this, _SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL, 'q', owningPathSegList);
+ _this8._x = x;
+ _this8._y = y;
+ _this8._x1 = x1;
+ _this8._y1 = y1;
+ return _this8;
}
- toString() {
- return '[object SVGPathSegCurvetoQuadraticRel]';
- }
+ _createClass(_SVGPathSegCurvetoQuadraticRel, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegCurvetoQuadraticRel]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._x1 + ' ' + this._y1 + ' ' + this._x + ' ' + this._y;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegCurvetoQuadraticRel(undefined, this._x, this._y, this._x1, this._y1);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._x1 + ' ' + this._y1 + ' ' + this._x + ' ' + this._y;
- }
+ return _SVGPathSegCurvetoQuadraticRel;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegCurvetoQuadraticRel(undefined, this._x, this._y, this._x1, this._y1);
- }
-
- }
-
- Object.defineProperties(SVGPathSegCurvetoQuadraticRel.prototype, {
+ Object.defineProperties(_SVGPathSegCurvetoQuadraticRel.prototype, {
x: {
- get() {
+ get: function get() {
return this._x;
},
-
- set(x) {
+ set: function set(x) {
this._x = x;
this._segmentChanged();
},
-
enumerable: true
},
y: {
- get() {
+ get: function get() {
return this._y;
},
-
- set(y) {
+ set: function set(y) {
this._y = y;
this._segmentChanged();
},
-
enumerable: true
},
x1: {
- get() {
+ get: function get() {
return this._x1;
},
-
- set(x1) {
+ set: function set(x1) {
this._x1 = x1;
this._segmentChanged();
},
-
enumerable: true
},
y1: {
- get() {
+ get: function get() {
return this._y1;
},
-
- set(y1) {
+ set: function set(y1) {
this._y1 = y1;
this._segmentChanged();
},
-
enumerable: true
}
});
- class SVGPathSegArcAbs extends SVGPathSeg {
- constructor(owningPathSegList, x, y, r1, r2, angle, largeArcFlag, sweepFlag) {
- super(SVGPathSeg.PATHSEG_ARC_ABS, 'A', owningPathSegList);
- this._x = x;
- this._y = y;
- this._r1 = r1;
- this._r2 = r2;
- this._angle = angle;
- this._largeArcFlag = largeArcFlag;
- this._sweepFlag = sweepFlag;
+ var _SVGPathSegArcAbs = /*#__PURE__*/function (_SVGPathSeg11) {
+ _inherits(_SVGPathSegArcAbs, _SVGPathSeg11);
+
+ var _super10 = _createSuper(_SVGPathSegArcAbs);
+
+ function _SVGPathSegArcAbs(owningPathSegList, x, y, r1, r2, angle, largeArcFlag, sweepFlag) {
+ var _this9;
+
+ _classCallCheck(this, _SVGPathSegArcAbs);
+
+ _this9 = _super10.call(this, _SVGPathSeg.PATHSEG_ARC_ABS, 'A', owningPathSegList);
+ _this9._x = x;
+ _this9._y = y;
+ _this9._r1 = r1;
+ _this9._r2 = r2;
+ _this9._angle = angle;
+ _this9._largeArcFlag = largeArcFlag;
+ _this9._sweepFlag = sweepFlag;
+ return _this9;
}
- toString() {
- return '[object SVGPathSegArcAbs]';
- }
+ _createClass(_SVGPathSegArcAbs, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegArcAbs]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._r1 + ' ' + this._r2 + ' ' + this._angle + ' ' + (this._largeArcFlag ? '1' : '0') + ' ' + (this._sweepFlag ? '1' : '0') + ' ' + this._x + ' ' + this._y;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegArcAbs(undefined, this._x, this._y, this._r1, this._r2, this._angle, this._largeArcFlag, this._sweepFlag);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._r1 + ' ' + this._r2 + ' ' + this._angle + ' ' + (this._largeArcFlag ? '1' : '0') + ' ' + (this._sweepFlag ? '1' : '0') + ' ' + this._x + ' ' + this._y;
- }
+ return _SVGPathSegArcAbs;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegArcAbs(undefined, this._x, this._y, this._r1, this._r2, this._angle, this._largeArcFlag, this._sweepFlag);
- }
-
- }
-
- Object.defineProperties(SVGPathSegArcAbs.prototype, {
+ Object.defineProperties(_SVGPathSegArcAbs.prototype, {
x: {
- get() {
+ get: function get() {
return this._x;
},
-
- set(x) {
+ set: function set(x) {
this._x = x;
this._segmentChanged();
},
-
enumerable: true
},
y: {
- get() {
+ get: function get() {
return this._y;
},
-
- set(y) {
+ set: function set(y) {
this._y = y;
this._segmentChanged();
},
-
enumerable: true
},
r1: {
- get() {
+ get: function get() {
return this._r1;
},
-
- set(r1) {
+ set: function set(r1) {
this._r1 = r1;
this._segmentChanged();
},
-
enumerable: true
},
r2: {
- get() {
+ get: function get() {
return this._r2;
},
-
- set(r2) {
+ set: function set(r2) {
this._r2 = r2;
this._segmentChanged();
},
-
enumerable: true
},
angle: {
- get() {
+ get: function get() {
return this._angle;
},
-
- set(angle) {
+ set: function set(angle) {
this._angle = angle;
this._segmentChanged();
},
-
enumerable: true
},
largeArcFlag: {
- get() {
+ get: function get() {
return this._largeArcFlag;
},
-
- set(largeArcFlag) {
+ set: function set(largeArcFlag) {
this._largeArcFlag = largeArcFlag;
this._segmentChanged();
},
-
enumerable: true
},
sweepFlag: {
- get() {
+ get: function get() {
return this._sweepFlag;
},
-
- set(sweepFlag) {
+ set: function set(sweepFlag) {
this._sweepFlag = sweepFlag;
this._segmentChanged();
},
-
enumerable: true
}
});
- class SVGPathSegArcRel extends SVGPathSeg {
- constructor(owningPathSegList, x, y, r1, r2, angle, largeArcFlag, sweepFlag) {
- super(SVGPathSeg.PATHSEG_ARC_REL, 'a', owningPathSegList);
- this._x = x;
- this._y = y;
- this._r1 = r1;
- this._r2 = r2;
- this._angle = angle;
- this._largeArcFlag = largeArcFlag;
- this._sweepFlag = sweepFlag;
+ var _SVGPathSegArcRel = /*#__PURE__*/function (_SVGPathSeg12) {
+ _inherits(_SVGPathSegArcRel, _SVGPathSeg12);
+
+ var _super11 = _createSuper(_SVGPathSegArcRel);
+
+ function _SVGPathSegArcRel(owningPathSegList, x, y, r1, r2, angle, largeArcFlag, sweepFlag) {
+ var _this10;
+
+ _classCallCheck(this, _SVGPathSegArcRel);
+
+ _this10 = _super11.call(this, _SVGPathSeg.PATHSEG_ARC_REL, 'a', owningPathSegList);
+ _this10._x = x;
+ _this10._y = y;
+ _this10._r1 = r1;
+ _this10._r2 = r2;
+ _this10._angle = angle;
+ _this10._largeArcFlag = largeArcFlag;
+ _this10._sweepFlag = sweepFlag;
+ return _this10;
}
- toString() {
- return '[object SVGPathSegArcRel]';
- }
+ _createClass(_SVGPathSegArcRel, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegArcRel]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._r1 + ' ' + this._r2 + ' ' + this._angle + ' ' + (this._largeArcFlag ? '1' : '0') + ' ' + (this._sweepFlag ? '1' : '0') + ' ' + this._x + ' ' + this._y;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegArcRel(undefined, this._x, this._y, this._r1, this._r2, this._angle, this._largeArcFlag, this._sweepFlag);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._r1 + ' ' + this._r2 + ' ' + this._angle + ' ' + (this._largeArcFlag ? '1' : '0') + ' ' + (this._sweepFlag ? '1' : '0') + ' ' + this._x + ' ' + this._y;
- }
+ return _SVGPathSegArcRel;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegArcRel(undefined, this._x, this._y, this._r1, this._r2, this._angle, this._largeArcFlag, this._sweepFlag);
- }
-
- }
-
- Object.defineProperties(SVGPathSegArcRel.prototype, {
+ Object.defineProperties(_SVGPathSegArcRel.prototype, {
x: {
- get() {
+ get: function get() {
return this._x;
},
-
- set(x) {
+ set: function set(x) {
this._x = x;
this._segmentChanged();
},
-
enumerable: true
},
y: {
- get() {
+ get: function get() {
return this._y;
},
-
- set(y) {
+ set: function set(y) {
this._y = y;
this._segmentChanged();
},
-
enumerable: true
},
r1: {
- get() {
+ get: function get() {
return this._r1;
},
-
- set(r1) {
+ set: function set(r1) {
this._r1 = r1;
this._segmentChanged();
},
-
enumerable: true
},
r2: {
- get() {
+ get: function get() {
return this._r2;
},
-
- set(r2) {
+ set: function set(r2) {
this._r2 = r2;
this._segmentChanged();
},
-
enumerable: true
},
angle: {
- get() {
+ get: function get() {
return this._angle;
},
-
- set(angle) {
+ set: function set(angle) {
this._angle = angle;
this._segmentChanged();
},
-
enumerable: true
},
largeArcFlag: {
- get() {
+ get: function get() {
return this._largeArcFlag;
},
-
- set(largeArcFlag) {
+ set: function set(largeArcFlag) {
this._largeArcFlag = largeArcFlag;
this._segmentChanged();
},
-
enumerable: true
},
sweepFlag: {
- get() {
+ get: function get() {
return this._sweepFlag;
},
-
- set(sweepFlag) {
+ set: function set(sweepFlag) {
this._sweepFlag = sweepFlag;
this._segmentChanged();
},
-
enumerable: true
}
});
- class SVGPathSegLinetoHorizontalAbs extends SVGPathSeg {
- constructor(owningPathSegList, x) {
- super(SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS, 'H', owningPathSegList);
- this._x = x;
+ var _SVGPathSegLinetoHorizontalAbs = /*#__PURE__*/function (_SVGPathSeg13) {
+ _inherits(_SVGPathSegLinetoHorizontalAbs, _SVGPathSeg13);
+
+ var _super12 = _createSuper(_SVGPathSegLinetoHorizontalAbs);
+
+ function _SVGPathSegLinetoHorizontalAbs(owningPathSegList, x) {
+ var _this11;
+
+ _classCallCheck(this, _SVGPathSegLinetoHorizontalAbs);
+
+ _this11 = _super12.call(this, _SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS, 'H', owningPathSegList);
+ _this11._x = x;
+ return _this11;
}
- toString() {
- return '[object SVGPathSegLinetoHorizontalAbs]';
- }
+ _createClass(_SVGPathSegLinetoHorizontalAbs, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegLinetoHorizontalAbs]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._x;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegLinetoHorizontalAbs(undefined, this._x);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._x;
- }
+ return _SVGPathSegLinetoHorizontalAbs;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegLinetoHorizontalAbs(undefined, this._x);
- }
-
- }
-
- Object.defineProperty(SVGPathSegLinetoHorizontalAbs.prototype, 'x', {
- get() {
+ Object.defineProperty(_SVGPathSegLinetoHorizontalAbs.prototype, 'x', {
+ get: function get() {
return this._x;
},
-
- set(x) {
+ set: function set(x) {
this._x = x;
this._segmentChanged();
},
-
enumerable: true
});
- class SVGPathSegLinetoHorizontalRel extends SVGPathSeg {
- constructor(owningPathSegList, x) {
- super(SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL, 'h', owningPathSegList);
- this._x = x;
+ var _SVGPathSegLinetoHorizontalRel = /*#__PURE__*/function (_SVGPathSeg14) {
+ _inherits(_SVGPathSegLinetoHorizontalRel, _SVGPathSeg14);
+
+ var _super13 = _createSuper(_SVGPathSegLinetoHorizontalRel);
+
+ function _SVGPathSegLinetoHorizontalRel(owningPathSegList, x) {
+ var _this12;
+
+ _classCallCheck(this, _SVGPathSegLinetoHorizontalRel);
+
+ _this12 = _super13.call(this, _SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL, 'h', owningPathSegList);
+ _this12._x = x;
+ return _this12;
}
- toString() {
- return '[object SVGPathSegLinetoHorizontalRel]';
- }
+ _createClass(_SVGPathSegLinetoHorizontalRel, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegLinetoHorizontalRel]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._x;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegLinetoHorizontalRel(undefined, this._x);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._x;
- }
+ return _SVGPathSegLinetoHorizontalRel;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegLinetoHorizontalRel(undefined, this._x);
- }
-
- }
-
- Object.defineProperty(SVGPathSegLinetoHorizontalRel.prototype, 'x', {
- get() {
+ Object.defineProperty(_SVGPathSegLinetoHorizontalRel.prototype, 'x', {
+ get: function get() {
return this._x;
},
-
- set(x) {
+ set: function set(x) {
this._x = x;
this._segmentChanged();
},
-
enumerable: true
});
- class SVGPathSegLinetoVerticalAbs extends SVGPathSeg {
- constructor(owningPathSegList, y) {
- super(SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS, 'V', owningPathSegList);
- this._y = y;
+ var _SVGPathSegLinetoVerticalAbs = /*#__PURE__*/function (_SVGPathSeg15) {
+ _inherits(_SVGPathSegLinetoVerticalAbs, _SVGPathSeg15);
+
+ var _super14 = _createSuper(_SVGPathSegLinetoVerticalAbs);
+
+ function _SVGPathSegLinetoVerticalAbs(owningPathSegList, y) {
+ var _this13;
+
+ _classCallCheck(this, _SVGPathSegLinetoVerticalAbs);
+
+ _this13 = _super14.call(this, _SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS, 'V', owningPathSegList);
+ _this13._y = y;
+ return _this13;
}
- toString() {
- return '[object SVGPathSegLinetoVerticalAbs]';
- }
+ _createClass(_SVGPathSegLinetoVerticalAbs, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegLinetoVerticalAbs]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._y;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegLinetoVerticalAbs(undefined, this._y);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._y;
- }
+ return _SVGPathSegLinetoVerticalAbs;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegLinetoVerticalAbs(undefined, this._y);
- }
-
- }
-
- Object.defineProperty(SVGPathSegLinetoVerticalAbs.prototype, 'y', {
- get() {
+ Object.defineProperty(_SVGPathSegLinetoVerticalAbs.prototype, 'y', {
+ get: function get() {
return this._y;
},
-
- set(y) {
+ set: function set(y) {
this._y = y;
this._segmentChanged();
},
-
enumerable: true
});
- class SVGPathSegLinetoVerticalRel extends SVGPathSeg {
- constructor(owningPathSegList, y) {
- super(SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL, 'v', owningPathSegList);
- this._y = y;
+ var _SVGPathSegLinetoVerticalRel = /*#__PURE__*/function (_SVGPathSeg16) {
+ _inherits(_SVGPathSegLinetoVerticalRel, _SVGPathSeg16);
+
+ var _super15 = _createSuper(_SVGPathSegLinetoVerticalRel);
+
+ function _SVGPathSegLinetoVerticalRel(owningPathSegList, y) {
+ var _this14;
+
+ _classCallCheck(this, _SVGPathSegLinetoVerticalRel);
+
+ _this14 = _super15.call(this, _SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL, 'v', owningPathSegList);
+ _this14._y = y;
+ return _this14;
}
- toString() {
- return '[object SVGPathSegLinetoVerticalRel]';
- }
+ _createClass(_SVGPathSegLinetoVerticalRel, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegLinetoVerticalRel]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._y;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegLinetoVerticalRel(undefined, this._y);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._y;
- }
+ return _SVGPathSegLinetoVerticalRel;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegLinetoVerticalRel(undefined, this._y);
- }
-
- }
-
- Object.defineProperty(SVGPathSegLinetoVerticalRel.prototype, 'y', {
- get() {
+ Object.defineProperty(_SVGPathSegLinetoVerticalRel.prototype, 'y', {
+ get: function get() {
return this._y;
},
-
- set(y) {
+ set: function set(y) {
this._y = y;
this._segmentChanged();
},
-
enumerable: true
});
- class SVGPathSegCurvetoCubicSmoothAbs extends SVGPathSeg {
- constructor(owningPathSegList, x, y, x2, y2) {
- super(SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS, 'S', owningPathSegList);
- this._x = x;
- this._y = y;
- this._x2 = x2;
- this._y2 = y2;
+ var _SVGPathSegCurvetoCubicSmoothAbs = /*#__PURE__*/function (_SVGPathSeg17) {
+ _inherits(_SVGPathSegCurvetoCubicSmoothAbs, _SVGPathSeg17);
+
+ var _super16 = _createSuper(_SVGPathSegCurvetoCubicSmoothAbs);
+
+ function _SVGPathSegCurvetoCubicSmoothAbs(owningPathSegList, x, y, x2, y2) {
+ var _this15;
+
+ _classCallCheck(this, _SVGPathSegCurvetoCubicSmoothAbs);
+
+ _this15 = _super16.call(this, _SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS, 'S', owningPathSegList);
+ _this15._x = x;
+ _this15._y = y;
+ _this15._x2 = x2;
+ _this15._y2 = y2;
+ return _this15;
}
- toString() {
- return '[object SVGPathSegCurvetoCubicSmoothAbs]';
- }
+ _createClass(_SVGPathSegCurvetoCubicSmoothAbs, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegCurvetoCubicSmoothAbs]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._x2 + ' ' + this._y2 + ' ' + this._x + ' ' + this._y;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegCurvetoCubicSmoothAbs(undefined, this._x, this._y, this._x2, this._y2);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._x2 + ' ' + this._y2 + ' ' + this._x + ' ' + this._y;
- }
+ return _SVGPathSegCurvetoCubicSmoothAbs;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegCurvetoCubicSmoothAbs(undefined, this._x, this._y, this._x2, this._y2);
- }
-
- }
-
- Object.defineProperties(SVGPathSegCurvetoCubicSmoothAbs.prototype, {
+ Object.defineProperties(_SVGPathSegCurvetoCubicSmoothAbs.prototype, {
x: {
- get() {
+ get: function get() {
return this._x;
},
-
- set(x) {
+ set: function set(x) {
this._x = x;
this._segmentChanged();
},
-
enumerable: true
},
y: {
- get() {
+ get: function get() {
return this._y;
},
-
- set(y) {
+ set: function set(y) {
this._y = y;
this._segmentChanged();
},
-
enumerable: true
},
x2: {
- get() {
+ get: function get() {
return this._x2;
},
-
- set(x2) {
+ set: function set(x2) {
this._x2 = x2;
this._segmentChanged();
},
-
enumerable: true
},
y2: {
- get() {
+ get: function get() {
return this._y2;
},
-
- set(y2) {
+ set: function set(y2) {
this._y2 = y2;
this._segmentChanged();
},
-
enumerable: true
}
});
- class SVGPathSegCurvetoCubicSmoothRel extends SVGPathSeg {
- constructor(owningPathSegList, x, y, x2, y2) {
- super(SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL, 's', owningPathSegList);
- this._x = x;
- this._y = y;
- this._x2 = x2;
- this._y2 = y2;
+ var _SVGPathSegCurvetoCubicSmoothRel = /*#__PURE__*/function (_SVGPathSeg18) {
+ _inherits(_SVGPathSegCurvetoCubicSmoothRel, _SVGPathSeg18);
+
+ var _super17 = _createSuper(_SVGPathSegCurvetoCubicSmoothRel);
+
+ function _SVGPathSegCurvetoCubicSmoothRel(owningPathSegList, x, y, x2, y2) {
+ var _this16;
+
+ _classCallCheck(this, _SVGPathSegCurvetoCubicSmoothRel);
+
+ _this16 = _super17.call(this, _SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL, 's', owningPathSegList);
+ _this16._x = x;
+ _this16._y = y;
+ _this16._x2 = x2;
+ _this16._y2 = y2;
+ return _this16;
}
- toString() {
- return '[object SVGPathSegCurvetoCubicSmoothRel]';
- }
+ _createClass(_SVGPathSegCurvetoCubicSmoothRel, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegCurvetoCubicSmoothRel]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._x2 + ' ' + this._y2 + ' ' + this._x + ' ' + this._y;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegCurvetoCubicSmoothRel(undefined, this._x, this._y, this._x2, this._y2);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._x2 + ' ' + this._y2 + ' ' + this._x + ' ' + this._y;
- }
+ return _SVGPathSegCurvetoCubicSmoothRel;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegCurvetoCubicSmoothRel(undefined, this._x, this._y, this._x2, this._y2);
- }
-
- }
-
- Object.defineProperties(SVGPathSegCurvetoCubicSmoothRel.prototype, {
+ Object.defineProperties(_SVGPathSegCurvetoCubicSmoothRel.prototype, {
x: {
- get() {
+ get: function get() {
return this._x;
},
-
- set(x) {
+ set: function set(x) {
this._x = x;
this._segmentChanged();
},
-
enumerable: true
},
y: {
- get() {
+ get: function get() {
return this._y;
},
-
- set(y) {
+ set: function set(y) {
this._y = y;
this._segmentChanged();
},
-
enumerable: true
},
x2: {
- get() {
+ get: function get() {
return this._x2;
},
-
- set(x2) {
+ set: function set(x2) {
this._x2 = x2;
this._segmentChanged();
},
-
enumerable: true
},
y2: {
- get() {
+ get: function get() {
return this._y2;
},
-
- set(y2) {
+ set: function set(y2) {
this._y2 = y2;
this._segmentChanged();
},
-
enumerable: true
}
});
- class SVGPathSegCurvetoQuadraticSmoothAbs extends SVGPathSeg {
- constructor(owningPathSegList, x, y) {
- super(SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS, 'T', owningPathSegList);
- this._x = x;
- this._y = y;
+ var _SVGPathSegCurvetoQuadraticSmoothAbs = /*#__PURE__*/function (_SVGPathSeg19) {
+ _inherits(_SVGPathSegCurvetoQuadraticSmoothAbs, _SVGPathSeg19);
+
+ var _super18 = _createSuper(_SVGPathSegCurvetoQuadraticSmoothAbs);
+
+ function _SVGPathSegCurvetoQuadraticSmoothAbs(owningPathSegList, x, y) {
+ var _this17;
+
+ _classCallCheck(this, _SVGPathSegCurvetoQuadraticSmoothAbs);
+
+ _this17 = _super18.call(this, _SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS, 'T', owningPathSegList);
+ _this17._x = x;
+ _this17._y = y;
+ return _this17;
}
- toString() {
- return '[object SVGPathSegCurvetoQuadraticSmoothAbs]';
- }
+ _createClass(_SVGPathSegCurvetoQuadraticSmoothAbs, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegCurvetoQuadraticSmoothAbs]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegCurvetoQuadraticSmoothAbs(undefined, this._x, this._y);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y;
- }
+ return _SVGPathSegCurvetoQuadraticSmoothAbs;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegCurvetoQuadraticSmoothAbs(undefined, this._x, this._y);
- }
-
- }
-
- Object.defineProperties(SVGPathSegCurvetoQuadraticSmoothAbs.prototype, {
+ Object.defineProperties(_SVGPathSegCurvetoQuadraticSmoothAbs.prototype, {
x: {
- get() {
+ get: function get() {
return this._x;
},
-
- set(x) {
+ set: function set(x) {
this._x = x;
this._segmentChanged();
},
-
enumerable: true
},
y: {
- get() {
+ get: function get() {
return this._y;
},
-
- set(y) {
+ set: function set(y) {
this._y = y;
this._segmentChanged();
},
-
enumerable: true
}
});
- class SVGPathSegCurvetoQuadraticSmoothRel extends SVGPathSeg {
- constructor(owningPathSegList, x, y) {
- super(SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL, 't', owningPathSegList);
- this._x = x;
- this._y = y;
+ var _SVGPathSegCurvetoQuadraticSmoothRel = /*#__PURE__*/function (_SVGPathSeg20) {
+ _inherits(_SVGPathSegCurvetoQuadraticSmoothRel, _SVGPathSeg20);
+
+ var _super19 = _createSuper(_SVGPathSegCurvetoQuadraticSmoothRel);
+
+ function _SVGPathSegCurvetoQuadraticSmoothRel(owningPathSegList, x, y) {
+ var _this18;
+
+ _classCallCheck(this, _SVGPathSegCurvetoQuadraticSmoothRel);
+
+ _this18 = _super19.call(this, _SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL, 't', owningPathSegList);
+ _this18._x = x;
+ _this18._y = y;
+ return _this18;
}
- toString() {
- return '[object SVGPathSegCurvetoQuadraticSmoothRel]';
- }
+ _createClass(_SVGPathSegCurvetoQuadraticSmoothRel, [{
+ key: "toString",
+ value: function toString() {
+ return '[object SVGPathSegCurvetoQuadraticSmoothRel]';
+ }
+ }, {
+ key: "_asPathString",
+ value: function _asPathString() {
+ return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y;
+ }
+ }, {
+ key: "clone",
+ value: function clone() {
+ return new _SVGPathSegCurvetoQuadraticSmoothRel(undefined, this._x, this._y);
+ }
+ }]);
- _asPathString() {
- return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y;
- }
+ return _SVGPathSegCurvetoQuadraticSmoothRel;
+ }(_SVGPathSeg);
- clone() {
- return new SVGPathSegCurvetoQuadraticSmoothRel(undefined, this._x, this._y);
- }
-
- }
-
- Object.defineProperties(SVGPathSegCurvetoQuadraticSmoothRel.prototype, {
+ Object.defineProperties(_SVGPathSegCurvetoQuadraticSmoothRel.prototype, {
x: {
- get() {
+ get: function get() {
return this._x;
},
-
- set(x) {
+ set: function set(x) {
this._x = x;
this._segmentChanged();
},
-
enumerable: true
},
y: {
- get() {
+ get: function get() {
return this._y;
},
-
- set(y) {
+ set: function set(y) {
this._y = y;
this._segmentChanged();
},
-
enumerable: true
}
}); // Add createSVGPathSeg* functions to SVGPathElement.
// Spec: https://www.w3.org/TR/SVG11/single-page.html#paths-InterfaceSVGPathElement.
SVGPathElement.prototype.createSVGPathSegClosePath = function () {
- return new SVGPathSegClosePath(undefined);
+ return new _SVGPathSegClosePath(undefined);
};
SVGPathElement.prototype.createSVGPathSegMovetoAbs = function (x, y) {
- return new SVGPathSegMovetoAbs(undefined, x, y);
+ return new _SVGPathSegMovetoAbs(undefined, x, y);
};
SVGPathElement.prototype.createSVGPathSegMovetoRel = function (x, y) {
- return new SVGPathSegMovetoRel(undefined, x, y);
+ return new _SVGPathSegMovetoRel(undefined, x, y);
};
SVGPathElement.prototype.createSVGPathSegLinetoAbs = function (x, y) {
- return new SVGPathSegLinetoAbs(undefined, x, y);
+ return new _SVGPathSegLinetoAbs(undefined, x, y);
};
SVGPathElement.prototype.createSVGPathSegLinetoRel = function (x, y) {
- return new SVGPathSegLinetoRel(undefined, x, y);
+ return new _SVGPathSegLinetoRel(undefined, x, y);
};
SVGPathElement.prototype.createSVGPathSegCurvetoCubicAbs = function (x, y, x1, y1, x2, y2) {
- return new SVGPathSegCurvetoCubicAbs(undefined, x, y, x1, y1, x2, y2);
+ return new _SVGPathSegCurvetoCubicAbs(undefined, x, y, x1, y1, x2, y2);
};
SVGPathElement.prototype.createSVGPathSegCurvetoCubicRel = function (x, y, x1, y1, x2, y2) {
- return new SVGPathSegCurvetoCubicRel(undefined, x, y, x1, y1, x2, y2);
+ return new _SVGPathSegCurvetoCubicRel(undefined, x, y, x1, y1, x2, y2);
};
SVGPathElement.prototype.createSVGPathSegCurvetoQuadraticAbs = function (x, y, x1, y1) {
- return new SVGPathSegCurvetoQuadraticAbs(undefined, x, y, x1, y1);
+ return new _SVGPathSegCurvetoQuadraticAbs(undefined, x, y, x1, y1);
};
SVGPathElement.prototype.createSVGPathSegCurvetoQuadraticRel = function (x, y, x1, y1) {
- return new SVGPathSegCurvetoQuadraticRel(undefined, x, y, x1, y1);
+ return new _SVGPathSegCurvetoQuadraticRel(undefined, x, y, x1, y1);
};
SVGPathElement.prototype.createSVGPathSegArcAbs = function (x, y, r1, r2, angle, largeArcFlag, sweepFlag) {
- return new SVGPathSegArcAbs(undefined, x, y, r1, r2, angle, largeArcFlag, sweepFlag);
+ return new _SVGPathSegArcAbs(undefined, x, y, r1, r2, angle, largeArcFlag, sweepFlag);
};
SVGPathElement.prototype.createSVGPathSegArcRel = function (x, y, r1, r2, angle, largeArcFlag, sweepFlag) {
- return new SVGPathSegArcRel(undefined, x, y, r1, r2, angle, largeArcFlag, sweepFlag);
+ return new _SVGPathSegArcRel(undefined, x, y, r1, r2, angle, largeArcFlag, sweepFlag);
};
SVGPathElement.prototype.createSVGPathSegLinetoHorizontalAbs = function (x) {
- return new SVGPathSegLinetoHorizontalAbs(undefined, x);
+ return new _SVGPathSegLinetoHorizontalAbs(undefined, x);
};
SVGPathElement.prototype.createSVGPathSegLinetoHorizontalRel = function (x) {
- return new SVGPathSegLinetoHorizontalRel(undefined, x);
+ return new _SVGPathSegLinetoHorizontalRel(undefined, x);
};
SVGPathElement.prototype.createSVGPathSegLinetoVerticalAbs = function (y) {
- return new SVGPathSegLinetoVerticalAbs(undefined, y);
+ return new _SVGPathSegLinetoVerticalAbs(undefined, y);
};
SVGPathElement.prototype.createSVGPathSegLinetoVerticalRel = function (y) {
- return new SVGPathSegLinetoVerticalRel(undefined, y);
+ return new _SVGPathSegLinetoVerticalRel(undefined, y);
};
SVGPathElement.prototype.createSVGPathSegCurvetoCubicSmoothAbs = function (x, y, x2, y2) {
- return new SVGPathSegCurvetoCubicSmoothAbs(undefined, x, y, x2, y2);
+ return new _SVGPathSegCurvetoCubicSmoothAbs(undefined, x, y, x2, y2);
};
SVGPathElement.prototype.createSVGPathSegCurvetoCubicSmoothRel = function (x, y, x2, y2) {
- return new SVGPathSegCurvetoCubicSmoothRel(undefined, x, y, x2, y2);
+ return new _SVGPathSegCurvetoCubicSmoothRel(undefined, x, y, x2, y2);
};
SVGPathElement.prototype.createSVGPathSegCurvetoQuadraticSmoothAbs = function (x, y) {
- return new SVGPathSegCurvetoQuadraticSmoothAbs(undefined, x, y);
+ return new _SVGPathSegCurvetoQuadraticSmoothAbs(undefined, x, y);
};
SVGPathElement.prototype.createSVGPathSegCurvetoQuadraticSmoothRel = function (x, y) {
- return new SVGPathSegCurvetoQuadraticSmoothRel(undefined, x, y);
+ return new _SVGPathSegCurvetoQuadraticSmoothRel(undefined, x, y);
};
if (!('getPathSegAtLength' in SVGPathElement.prototype)) {
@@ -1477,9 +1979,9 @@ const getReverseNS = function () {
throw new Error('Invalid arguments.');
}
- const measurementElement = document.createElementNS('http://www.w3.org/2000/svg', 'path');
+ var measurementElement = document.createElementNS('http://www.w3.org/2000/svg', 'path');
measurementElement.setAttribute('d', this.getAttribute('d'));
- let lastPathSegment = measurementElement.pathSegList.numberOfItems - 1; // If the path is empty, return 0.
+ var lastPathSegment = measurementElement.pathSegList.numberOfItems - 1; // If the path is empty, return 0.
if (lastPathSegment <= 0) {
return 0;
@@ -1499,26 +2001,26 @@ const getReverseNS = function () {
};
}
- window.SVGPathSeg = SVGPathSeg;
- window.SVGPathSegClosePath = SVGPathSegClosePath;
- window.SVGPathSegMovetoAbs = SVGPathSegMovetoAbs;
- window.SVGPathSegMovetoRel = SVGPathSegMovetoRel;
- window.SVGPathSegLinetoAbs = SVGPathSegLinetoAbs;
- window.SVGPathSegLinetoRel = SVGPathSegLinetoRel;
- window.SVGPathSegCurvetoCubicAbs = SVGPathSegCurvetoCubicAbs;
- window.SVGPathSegCurvetoCubicRel = SVGPathSegCurvetoCubicRel;
- window.SVGPathSegCurvetoQuadraticAbs = SVGPathSegCurvetoQuadraticAbs;
- window.SVGPathSegCurvetoQuadraticRel = SVGPathSegCurvetoQuadraticRel;
- window.SVGPathSegArcAbs = SVGPathSegArcAbs;
- window.SVGPathSegArcRel = SVGPathSegArcRel;
- window.SVGPathSegLinetoHorizontalAbs = SVGPathSegLinetoHorizontalAbs;
- window.SVGPathSegLinetoHorizontalRel = SVGPathSegLinetoHorizontalRel;
- window.SVGPathSegLinetoVerticalAbs = SVGPathSegLinetoVerticalAbs;
- window.SVGPathSegLinetoVerticalRel = SVGPathSegLinetoVerticalRel;
- window.SVGPathSegCurvetoCubicSmoothAbs = SVGPathSegCurvetoCubicSmoothAbs;
- window.SVGPathSegCurvetoCubicSmoothRel = SVGPathSegCurvetoCubicSmoothRel;
- window.SVGPathSegCurvetoQuadraticSmoothAbs = SVGPathSegCurvetoQuadraticSmoothAbs;
- window.SVGPathSegCurvetoQuadraticSmoothRel = SVGPathSegCurvetoQuadraticSmoothRel;
+ window.SVGPathSeg = _SVGPathSeg;
+ window.SVGPathSegClosePath = _SVGPathSegClosePath;
+ window.SVGPathSegMovetoAbs = _SVGPathSegMovetoAbs;
+ window.SVGPathSegMovetoRel = _SVGPathSegMovetoRel;
+ window.SVGPathSegLinetoAbs = _SVGPathSegLinetoAbs;
+ window.SVGPathSegLinetoRel = _SVGPathSegLinetoRel;
+ window.SVGPathSegCurvetoCubicAbs = _SVGPathSegCurvetoCubicAbs;
+ window.SVGPathSegCurvetoCubicRel = _SVGPathSegCurvetoCubicRel;
+ window.SVGPathSegCurvetoQuadraticAbs = _SVGPathSegCurvetoQuadraticAbs;
+ window.SVGPathSegCurvetoQuadraticRel = _SVGPathSegCurvetoQuadraticRel;
+ window.SVGPathSegArcAbs = _SVGPathSegArcAbs;
+ window.SVGPathSegArcRel = _SVGPathSegArcRel;
+ window.SVGPathSegLinetoHorizontalAbs = _SVGPathSegLinetoHorizontalAbs;
+ window.SVGPathSegLinetoHorizontalRel = _SVGPathSegLinetoHorizontalRel;
+ window.SVGPathSegLinetoVerticalAbs = _SVGPathSegLinetoVerticalAbs;
+ window.SVGPathSegLinetoVerticalRel = _SVGPathSegLinetoVerticalRel;
+ window.SVGPathSegCurvetoCubicSmoothAbs = _SVGPathSegCurvetoCubicSmoothAbs;
+ window.SVGPathSegCurvetoCubicSmoothRel = _SVGPathSegCurvetoCubicSmoothRel;
+ window.SVGPathSegCurvetoQuadraticSmoothAbs = _SVGPathSegCurvetoQuadraticSmoothAbs;
+ window.SVGPathSegCurvetoQuadraticSmoothRel = _SVGPathSegCurvetoQuadraticSmoothRel;
} // Checking for SVGPathSegList in window checks for the case of an implementation without the
// SVGPathSegList API.
// The second check for appendItem is specific to Firefox 59+ which removed only parts of the
@@ -1528,8 +2030,10 @@ const getReverseNS = function () {
if (!('SVGPathSegList' in window) || !('appendItem' in window.SVGPathSegList.prototype)) {
// Spec: https://www.w3.org/TR/SVG11/single-page.html#paths-InterfaceSVGPathSegList
- class SVGPathSegList {
- constructor(pathElement) {
+ var SVGPathSegList = /*#__PURE__*/function () {
+ function SVGPathSegList(pathElement) {
+ _classCallCheck(this, SVGPathSegList);
+
this._pathElement = pathElement;
this._list = this._parsePath(this._pathElement.getAttribute('d')); // Use a MutationObserver to catch changes to the path's "d" attribute.
@@ -1545,672 +2049,706 @@ const getReverseNS = function () {
// MutationObservers are not synchronous so we can have pending asynchronous mutations.
- _checkPathSynchronizedToList() {
- this._updateListFromPathMutations(this._pathElementMutationObserver.takeRecords());
- }
-
- _updateListFromPathMutations(mutationRecords) {
- if (!this._pathElement) {
- return;
+ _createClass(SVGPathSegList, [{
+ key: "_checkPathSynchronizedToList",
+ value: function _checkPathSynchronizedToList() {
+ this._updateListFromPathMutations(this._pathElementMutationObserver.takeRecords());
}
-
- let hasPathMutations = false;
- mutationRecords.forEach(record => {
- if (record.attributeName === 'd') {
- hasPathMutations = true;
+ }, {
+ key: "_updateListFromPathMutations",
+ value: function _updateListFromPathMutations(mutationRecords) {
+ if (!this._pathElement) {
+ return;
}
- });
- if (hasPathMutations) {
- this._list = this._parsePath(this._pathElement.getAttribute('d'));
+ var hasPathMutations = false;
+ mutationRecords.forEach(function (record) {
+ if (record.attributeName === 'd') {
+ hasPathMutations = true;
+ }
+ });
+
+ if (hasPathMutations) {
+ this._list = this._parsePath(this._pathElement.getAttribute('d'));
+ }
+ } // Serialize the list and update the path's 'd' attribute.
+
+ }, {
+ key: "_writeListToPath",
+ value: function _writeListToPath() {
+ this._pathElementMutationObserver.disconnect();
+
+ this._pathElement.setAttribute('d', SVGPathSegList._pathSegArrayAsString(this._list));
+
+ this._pathElementMutationObserver.observe(this._pathElement, this._mutationObserverConfig);
+ } // When a path segment changes the list needs to be synchronized back to the path element.
+
+ }, {
+ key: "segmentChanged",
+ value: function segmentChanged(pathSeg) {
+ this._writeListToPath();
}
- } // Serialize the list and update the path's 'd' attribute.
+ }, {
+ key: "clear",
+ value: function clear() {
+ this._checkPathSynchronizedToList();
+ this._list.forEach(function (pathSeg) {
+ pathSeg._owningPathSegList = null;
+ });
- _writeListToPath() {
- this._pathElementMutationObserver.disconnect();
+ this._list = [];
- this._pathElement.setAttribute('d', SVGPathSegList._pathSegArrayAsString(this._list));
-
- this._pathElementMutationObserver.observe(this._pathElement, this._mutationObserverConfig);
- } // When a path segment changes the list needs to be synchronized back to the path element.
-
-
- segmentChanged(pathSeg) {
- this._writeListToPath();
- }
-
- clear() {
- this._checkPathSynchronizedToList();
-
- this._list.forEach(pathSeg => {
- pathSeg._owningPathSegList = null;
- });
-
- this._list = [];
-
- this._writeListToPath();
- }
-
- initialize(newItem) {
- this._checkPathSynchronizedToList();
-
- this._list = [newItem];
- newItem._owningPathSegList = this;
-
- this._writeListToPath();
-
- return newItem;
- }
-
- _checkValidIndex(index) {
- if (isNaN(index) || index < 0 || index >= this.numberOfItems) {
- throw new Error('INDEX_SIZE_ERR');
+ this._writeListToPath();
}
- }
+ }, {
+ key: "initialize",
+ value: function initialize(newItem) {
+ this._checkPathSynchronizedToList();
- getItem(index) {
- this._checkPathSynchronizedToList();
+ this._list = [newItem];
+ newItem._owningPathSegList = this;
- this._checkValidIndex(index);
+ this._writeListToPath();
- return this._list[index];
- }
-
- insertItemBefore(newItem, index) {
- this._checkPathSynchronizedToList(); // Spec: If the index is greater than or equal to numberOfItems, then the new item is appended to the end of the list.
-
-
- if (index > this.numberOfItems) {
- index = this.numberOfItems;
+ return newItem;
}
-
- if (newItem._owningPathSegList) {
- // SVG2 spec says to make a copy.
- newItem = newItem.clone();
+ }, {
+ key: "_checkValidIndex",
+ value: function _checkValidIndex(index) {
+ if (isNaN(index) || index < 0 || index >= this.numberOfItems) {
+ throw new Error('INDEX_SIZE_ERR');
+ }
}
+ }, {
+ key: "getItem",
+ value: function getItem(index) {
+ this._checkPathSynchronizedToList();
- this._list.splice(index, 0, newItem);
+ this._checkValidIndex(index);
- newItem._owningPathSegList = this;
-
- this._writeListToPath();
-
- return newItem;
- }
-
- replaceItem(newItem, index) {
- this._checkPathSynchronizedToList();
-
- if (newItem._owningPathSegList) {
- // SVG2 spec says to make a copy.
- newItem = newItem.clone();
+ return this._list[index];
}
+ }, {
+ key: "insertItemBefore",
+ value: function insertItemBefore(newItem, index) {
+ this._checkPathSynchronizedToList(); // Spec: If the index is greater than or equal to numberOfItems, then the new item is appended to the end of the list.
- this._checkValidIndex(index);
- this._list[index] = newItem;
- newItem._owningPathSegList = this;
+ if (index > this.numberOfItems) {
+ index = this.numberOfItems;
+ }
- this._writeListToPath();
+ if (newItem._owningPathSegList) {
+ // SVG2 spec says to make a copy.
+ newItem = newItem.clone();
+ }
- return newItem;
- }
+ this._list.splice(index, 0, newItem);
- removeItem(index) {
- this._checkPathSynchronizedToList();
+ newItem._owningPathSegList = this;
- this._checkValidIndex(index);
+ this._writeListToPath();
- const item = this._list[index];
-
- this._list.splice(index, 1);
-
- this._writeListToPath();
-
- return item;
- }
-
- appendItem(newItem) {
- this._checkPathSynchronizedToList();
-
- if (newItem._owningPathSegList) {
- // SVG2 spec says to make a copy.
- newItem = newItem.clone();
+ return newItem;
}
+ }, {
+ key: "replaceItem",
+ value: function replaceItem(newItem, index) {
+ this._checkPathSynchronizedToList();
- this._list.push(newItem);
+ if (newItem._owningPathSegList) {
+ // SVG2 spec says to make a copy.
+ newItem = newItem.clone();
+ }
- newItem._owningPathSegList = this; // TODO: Optimize this to just append to the existing attribute.
+ this._checkValidIndex(index);
- this._writeListToPath();
+ this._list[index] = newItem;
+ newItem._owningPathSegList = this;
- return newItem;
- } // This closely follows SVGPathParser::parsePath from Source/core/svg/SVGPathParser.cpp.
+ this._writeListToPath();
-
- _parsePath(string) {
- if (!string || !string.length) {
- return [];
+ return newItem;
}
+ }, {
+ key: "removeItem",
+ value: function removeItem(index) {
+ this._checkPathSynchronizedToList();
- const owningPathSegList = this; // eslint-disable-line consistent-this
+ this._checkValidIndex(index);
- class Builder {
- constructor() {
- this.pathSegList = [];
- }
+ var item = this._list[index];
- appendSegment(pathSeg) {
- this.pathSegList.push(pathSeg);
- }
+ this._list.splice(index, 1);
+ this._writeListToPath();
+
+ return item;
}
+ }, {
+ key: "appendItem",
+ value: function appendItem(newItem) {
+ this._checkPathSynchronizedToList();
- class Source {
- constructor(string) {
- this._string = string;
- this._currentIndex = 0;
- this._endIndex = this._string.length;
- this._previousCommand = SVGPathSeg.PATHSEG_UNKNOWN;
-
- this._skipOptionalSpaces();
+ if (newItem._owningPathSegList) {
+ // SVG2 spec says to make a copy.
+ newItem = newItem.clone();
}
- _isCurrentSpace() {
- const character = this._string[this._currentIndex];
- return character <= ' ' && (character === ' ' || character === '\n' || character === '\t' || character === '\r' || character === '\f');
- }
+ this._list.push(newItem);
- _skipOptionalSpaces() {
- while (this._currentIndex < this._endIndex && this._isCurrentSpace()) {
- this._currentIndex++;
- }
+ newItem._owningPathSegList = this; // TODO: Optimize this to just append to the existing attribute.
- return this._currentIndex < this._endIndex;
- }
+ this._writeListToPath();
- _skipOptionalSpacesOrDelimiter() {
- if (this._currentIndex < this._endIndex && !this._isCurrentSpace() && this._string.charAt(this._currentIndex) !== ',') {
- return false;
- }
+ return newItem;
+ } // This closely follows SVGPathParser::parsePath from Source/core/svg/SVGPathParser.cpp.
- if (this._skipOptionalSpaces()) {
- if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) === ',') {
- this._currentIndex++;
-
- this._skipOptionalSpaces();
- }
- }
-
- return this._currentIndex < this._endIndex;
- }
-
- hasMoreData() {
- return this._currentIndex < this._endIndex;
- }
-
- peekSegmentType() {
- const lookahead = this._string[this._currentIndex];
- return this._pathSegTypeFromChar(lookahead);
- }
-
- _pathSegTypeFromChar(lookahead) {
- switch (lookahead) {
- case 'Z':
- case 'z':
- return SVGPathSeg.PATHSEG_CLOSEPATH;
-
- case 'M':
- return SVGPathSeg.PATHSEG_MOVETO_ABS;
-
- case 'm':
- return SVGPathSeg.PATHSEG_MOVETO_REL;
-
- case 'L':
- return SVGPathSeg.PATHSEG_LINETO_ABS;
-
- case 'l':
- return SVGPathSeg.PATHSEG_LINETO_REL;
-
- case 'C':
- return SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS;
-
- case 'c':
- return SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL;
-
- case 'Q':
- return SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS;
-
- case 'q':
- return SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL;
-
- case 'A':
- return SVGPathSeg.PATHSEG_ARC_ABS;
-
- case 'a':
- return SVGPathSeg.PATHSEG_ARC_REL;
-
- case 'H':
- return SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS;
-
- case 'h':
- return SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL;
-
- case 'V':
- return SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS;
-
- case 'v':
- return SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL;
-
- case 'S':
- return SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS;
-
- case 's':
- return SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL;
-
- case 'T':
- return SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS;
-
- case 't':
- return SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL;
-
- default:
- return SVGPathSeg.PATHSEG_UNKNOWN;
- }
- }
-
- _nextCommandHelper(lookahead, previousCommand) {
- // Check for remaining coordinates in the current command.
- if ((lookahead === '+' || lookahead === '-' || lookahead === '.' || lookahead >= '0' && lookahead <= '9') && previousCommand !== SVGPathSeg.PATHSEG_CLOSEPATH) {
- if (previousCommand === SVGPathSeg.PATHSEG_MOVETO_ABS) {
- return SVGPathSeg.PATHSEG_LINETO_ABS;
- }
-
- if (previousCommand === SVGPathSeg.PATHSEG_MOVETO_REL) {
- return SVGPathSeg.PATHSEG_LINETO_REL;
- }
-
- return previousCommand;
- }
-
- return SVGPathSeg.PATHSEG_UNKNOWN;
- }
-
- initialCommandIsMoveTo() {
- // If the path is empty it is still valid, so return true.
- if (!this.hasMoreData()) {
- return true;
- }
-
- const command = this.peekSegmentType(); // Path must start with moveTo.
-
- return command === SVGPathSeg.PATHSEG_MOVETO_ABS || command === SVGPathSeg.PATHSEG_MOVETO_REL;
- } // Parse a number from an SVG path. This very closely follows genericParseNumber(...) from Source/core/svg/SVGParserUtilities.cpp.
- // Spec: https://www.w3.org/TR/SVG11/single-page.html#paths-PathDataBNF
-
-
- _parseNumber() {
- let exponent = 0;
- let integer = 0;
- let frac = 1;
- let decimal = 0;
- let sign = 1;
- let expsign = 1;
- const startIndex = this._currentIndex;
-
- this._skipOptionalSpaces(); // Read the sign.
-
-
- if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) === '+') {
- this._currentIndex++;
- } else if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) === '-') {
- this._currentIndex++;
- sign = -1;
- }
-
- if (this._currentIndex === this._endIndex || (this._string.charAt(this._currentIndex) < '0' || this._string.charAt(this._currentIndex) > '9') && this._string.charAt(this._currentIndex) !== '.') {
- // The first character of a number must be one of [0-9+-.].
- return undefined;
- } // Read the integer part, build right-to-left.
-
-
- const startIntPartIndex = this._currentIndex;
-
- while (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) >= '0' && this._string.charAt(this._currentIndex) <= '9') {
- this._currentIndex++; // Advance to first non-digit.
- }
-
- if (this._currentIndex !== startIntPartIndex) {
- let scanIntPartIndex = this._currentIndex - 1;
- let multiplier = 1;
-
- while (scanIntPartIndex >= startIntPartIndex) {
- integer += multiplier * (this._string.charAt(scanIntPartIndex--) - '0');
- multiplier *= 10;
- }
- } // Read the decimals.
-
-
- if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) === '.') {
- this._currentIndex++; // There must be a least one digit following the .
-
- if (this._currentIndex >= this._endIndex || this._string.charAt(this._currentIndex) < '0' || this._string.charAt(this._currentIndex) > '9') {
- return undefined;
- }
-
- while (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) >= '0' && this._string.charAt(this._currentIndex) <= '9') {
- frac *= 10;
- decimal += (this._string.charAt(this._currentIndex) - '0') / frac;
- this._currentIndex += 1;
- }
- } // Read the exponent part.
-
-
- if (this._currentIndex !== startIndex && this._currentIndex + 1 < this._endIndex && (this._string.charAt(this._currentIndex) === 'e' || this._string.charAt(this._currentIndex) === 'E') && this._string.charAt(this._currentIndex + 1) !== 'x' && this._string.charAt(this._currentIndex + 1) !== 'm') {
- this._currentIndex++; // Read the sign of the exponent.
-
- if (this._string.charAt(this._currentIndex) === '+') {
- this._currentIndex++;
- } else if (this._string.charAt(this._currentIndex) === '-') {
- this._currentIndex++;
- expsign = -1;
- } // There must be an exponent.
-
-
- if (this._currentIndex >= this._endIndex || this._string.charAt(this._currentIndex) < '0' || this._string.charAt(this._currentIndex) > '9') {
- return undefined;
- }
-
- while (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) >= '0' && this._string.charAt(this._currentIndex) <= '9') {
- exponent *= 10;
- exponent += this._string.charAt(this._currentIndex) - '0';
- this._currentIndex++;
- }
- }
-
- let number = integer + decimal;
- number *= sign;
-
- if (exponent) {
- number *= 10 ** (expsign * exponent);
- }
-
- if (startIndex === this._currentIndex) {
- return undefined;
- }
-
- this._skipOptionalSpacesOrDelimiter();
-
- return number;
- }
-
- _parseArcFlag() {
- if (this._currentIndex >= this._endIndex) {
- return undefined;
- }
-
- let flag = false;
-
- const flagChar = this._string.charAt(this._currentIndex++);
-
- if (flagChar === '0') {
- flag = false;
- } else if (flagChar === '1') {
- flag = true;
- } else {
- return undefined;
- }
-
- this._skipOptionalSpacesOrDelimiter();
-
- return flag;
- }
-
- parseSegment() {
- const lookahead = this._string[this._currentIndex];
-
- let command = this._pathSegTypeFromChar(lookahead);
-
- if (command === SVGPathSeg.PATHSEG_UNKNOWN) {
- // Possibly an implicit command. Not allowed if this is the first command.
- if (this._previousCommand === SVGPathSeg.PATHSEG_UNKNOWN) {
- return null;
- }
-
- command = this._nextCommandHelper(lookahead, this._previousCommand);
-
- if (command === SVGPathSeg.PATHSEG_UNKNOWN) {
- return null;
- }
- } else {
- this._currentIndex++;
- }
-
- this._previousCommand = command;
-
- switch (command) {
- case SVGPathSeg.PATHSEG_MOVETO_REL:
- return new SVGPathSegMovetoRel(owningPathSegList, this._parseNumber(), this._parseNumber());
-
- case SVGPathSeg.PATHSEG_MOVETO_ABS:
- return new SVGPathSegMovetoAbs(owningPathSegList, this._parseNumber(), this._parseNumber());
-
- case SVGPathSeg.PATHSEG_LINETO_REL:
- return new SVGPathSegLinetoRel(owningPathSegList, this._parseNumber(), this._parseNumber());
-
- case SVGPathSeg.PATHSEG_LINETO_ABS:
- return new SVGPathSegLinetoAbs(owningPathSegList, this._parseNumber(), this._parseNumber());
-
- case SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL:
- return new SVGPathSegLinetoHorizontalRel(owningPathSegList, this._parseNumber());
-
- case SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS:
- return new SVGPathSegLinetoHorizontalAbs(owningPathSegList, this._parseNumber());
-
- case SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL:
- return new SVGPathSegLinetoVerticalRel(owningPathSegList, this._parseNumber());
-
- case SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS:
- return new SVGPathSegLinetoVerticalAbs(owningPathSegList, this._parseNumber());
-
- case SVGPathSeg.PATHSEG_CLOSEPATH:
- this._skipOptionalSpaces();
-
- return new SVGPathSegClosePath(owningPathSegList);
-
- case SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL:
- {
- const points = {
- x1: this._parseNumber(),
- y1: this._parseNumber(),
- x2: this._parseNumber(),
- y2: this._parseNumber(),
- x: this._parseNumber(),
- y: this._parseNumber()
- };
- return new SVGPathSegCurvetoCubicRel(owningPathSegList, points.x, points.y, points.x1, points.y1, points.x2, points.y2);
- }
-
- case SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS:
- {
- const points = {
- x1: this._parseNumber(),
- y1: this._parseNumber(),
- x2: this._parseNumber(),
- y2: this._parseNumber(),
- x: this._parseNumber(),
- y: this._parseNumber()
- };
- return new SVGPathSegCurvetoCubicAbs(owningPathSegList, points.x, points.y, points.x1, points.y1, points.x2, points.y2);
- }
-
- case SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL:
- {
- const points = {
- x2: this._parseNumber(),
- y2: this._parseNumber(),
- x: this._parseNumber(),
- y: this._parseNumber()
- };
- return new SVGPathSegCurvetoCubicSmoothRel(owningPathSegList, points.x, points.y, points.x2, points.y2);
- }
-
- case SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS:
- {
- const points = {
- x2: this._parseNumber(),
- y2: this._parseNumber(),
- x: this._parseNumber(),
- y: this._parseNumber()
- };
- return new SVGPathSegCurvetoCubicSmoothAbs(owningPathSegList, points.x, points.y, points.x2, points.y2);
- }
-
- case SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL:
- {
- const points = {
- x1: this._parseNumber(),
- y1: this._parseNumber(),
- x: this._parseNumber(),
- y: this._parseNumber()
- };
- return new SVGPathSegCurvetoQuadraticRel(owningPathSegList, points.x, points.y, points.x1, points.y1);
- }
-
- case SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS:
- {
- const points = {
- x1: this._parseNumber(),
- y1: this._parseNumber(),
- x: this._parseNumber(),
- y: this._parseNumber()
- };
- return new SVGPathSegCurvetoQuadraticAbs(owningPathSegList, points.x, points.y, points.x1, points.y1);
- }
-
- case SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL:
- return new SVGPathSegCurvetoQuadraticSmoothRel(owningPathSegList, this._parseNumber(), this._parseNumber());
-
- case SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS:
- return new SVGPathSegCurvetoQuadraticSmoothAbs(owningPathSegList, this._parseNumber(), this._parseNumber());
-
- case SVGPathSeg.PATHSEG_ARC_REL:
- {
- const points = {
- x1: this._parseNumber(),
- y1: this._parseNumber(),
- arcAngle: this._parseNumber(),
- arcLarge: this._parseArcFlag(),
- arcSweep: this._parseArcFlag(),
- x: this._parseNumber(),
- y: this._parseNumber()
- };
- return new SVGPathSegArcRel(owningPathSegList, points.x, points.y, points.x1, points.y1, points.arcAngle, points.arcLarge, points.arcSweep);
- }
-
- case SVGPathSeg.PATHSEG_ARC_ABS:
- {
- const points = {
- x1: this._parseNumber(),
- y1: this._parseNumber(),
- arcAngle: this._parseNumber(),
- arcLarge: this._parseArcFlag(),
- arcSweep: this._parseArcFlag(),
- x: this._parseNumber(),
- y: this._parseNumber()
- };
- return new SVGPathSegArcAbs(owningPathSegList, points.x, points.y, points.x1, points.y1, points.arcAngle, points.arcLarge, points.arcSweep);
- }
-
- default:
- throw new Error('Unknown path seg type.');
- }
- }
-
- }
-
- const builder = new Builder();
- const source = new Source(string);
-
- if (!source.initialCommandIsMoveTo()) {
- return [];
- }
-
- while (source.hasMoreData()) {
- const pathSeg = source.parseSegment();
-
- if (!pathSeg) {
+ }, {
+ key: "_parsePath",
+ value: function _parsePath(string) {
+ if (!string || !string.length) {
return [];
}
- builder.appendSegment(pathSeg);
- }
+ var owningPathSegList = this;
- return builder.pathSegList;
- } // STATIC
+ var Builder = /*#__PURE__*/function () {
+ function Builder() {
+ _classCallCheck(this, Builder);
+
+ this.pathSegList = [];
+ }
+
+ _createClass(Builder, [{
+ key: "appendSegment",
+ value: function appendSegment(pathSeg) {
+ this.pathSegList.push(pathSeg);
+ }
+ }]);
+
+ return Builder;
+ }();
+
+ var Source = /*#__PURE__*/function () {
+ function Source(string) {
+ _classCallCheck(this, Source);
+
+ this._string = string;
+ this._currentIndex = 0;
+ this._endIndex = this._string.length;
+ this._previousCommand = SVGPathSeg.PATHSEG_UNKNOWN;
+
+ this._skipOptionalSpaces();
+ }
+
+ _createClass(Source, [{
+ key: "_isCurrentSpace",
+ value: function _isCurrentSpace() {
+ var character = this._string[this._currentIndex];
+ return character <= ' ' && (character === ' ' || character === '\n' || character === '\t' || character === '\r' || character === '\f');
+ }
+ }, {
+ key: "_skipOptionalSpaces",
+ value: function _skipOptionalSpaces() {
+ while (this._currentIndex < this._endIndex && this._isCurrentSpace()) {
+ this._currentIndex++;
+ }
+
+ return this._currentIndex < this._endIndex;
+ }
+ }, {
+ key: "_skipOptionalSpacesOrDelimiter",
+ value: function _skipOptionalSpacesOrDelimiter() {
+ if (this._currentIndex < this._endIndex && !this._isCurrentSpace() && this._string.charAt(this._currentIndex) !== ',') {
+ return false;
+ }
+
+ if (this._skipOptionalSpaces()) {
+ if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) === ',') {
+ this._currentIndex++;
+
+ this._skipOptionalSpaces();
+ }
+ }
+
+ return this._currentIndex < this._endIndex;
+ }
+ }, {
+ key: "hasMoreData",
+ value: function hasMoreData() {
+ return this._currentIndex < this._endIndex;
+ }
+ }, {
+ key: "peekSegmentType",
+ value: function peekSegmentType() {
+ var lookahead = this._string[this._currentIndex];
+ return this._pathSegTypeFromChar(lookahead);
+ }
+ }, {
+ key: "_pathSegTypeFromChar",
+ value: function _pathSegTypeFromChar(lookahead) {
+ switch (lookahead) {
+ case 'Z':
+ case 'z':
+ return SVGPathSeg.PATHSEG_CLOSEPATH;
+
+ case 'M':
+ return SVGPathSeg.PATHSEG_MOVETO_ABS;
+
+ case 'm':
+ return SVGPathSeg.PATHSEG_MOVETO_REL;
+
+ case 'L':
+ return SVGPathSeg.PATHSEG_LINETO_ABS;
+
+ case 'l':
+ return SVGPathSeg.PATHSEG_LINETO_REL;
+
+ case 'C':
+ return SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS;
+
+ case 'c':
+ return SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL;
+
+ case 'Q':
+ return SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS;
+
+ case 'q':
+ return SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL;
+
+ case 'A':
+ return SVGPathSeg.PATHSEG_ARC_ABS;
+
+ case 'a':
+ return SVGPathSeg.PATHSEG_ARC_REL;
+
+ case 'H':
+ return SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS;
+
+ case 'h':
+ return SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL;
+
+ case 'V':
+ return SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS;
+
+ case 'v':
+ return SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL;
+
+ case 'S':
+ return SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS;
+
+ case 's':
+ return SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL;
+
+ case 'T':
+ return SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS;
+
+ case 't':
+ return SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL;
+
+ default:
+ return SVGPathSeg.PATHSEG_UNKNOWN;
+ }
+ }
+ }, {
+ key: "_nextCommandHelper",
+ value: function _nextCommandHelper(lookahead, previousCommand) {
+ // Check for remaining coordinates in the current command.
+ if ((lookahead === '+' || lookahead === '-' || lookahead === '.' || lookahead >= '0' && lookahead <= '9') && previousCommand !== SVGPathSeg.PATHSEG_CLOSEPATH) {
+ if (previousCommand === SVGPathSeg.PATHSEG_MOVETO_ABS) {
+ return SVGPathSeg.PATHSEG_LINETO_ABS;
+ }
+
+ if (previousCommand === SVGPathSeg.PATHSEG_MOVETO_REL) {
+ return SVGPathSeg.PATHSEG_LINETO_REL;
+ }
+
+ return previousCommand;
+ }
+
+ return SVGPathSeg.PATHSEG_UNKNOWN;
+ }
+ }, {
+ key: "initialCommandIsMoveTo",
+ value: function initialCommandIsMoveTo() {
+ // If the path is empty it is still valid, so return true.
+ if (!this.hasMoreData()) {
+ return true;
+ }
+
+ var command = this.peekSegmentType(); // Path must start with moveTo.
+
+ return command === SVGPathSeg.PATHSEG_MOVETO_ABS || command === SVGPathSeg.PATHSEG_MOVETO_REL;
+ } // Parse a number from an SVG path. This very closely follows genericParseNumber(...) from Source/core/svg/SVGParserUtilities.cpp.
+ // Spec: https://www.w3.org/TR/SVG11/single-page.html#paths-PathDataBNF
+
+ }, {
+ key: "_parseNumber",
+ value: function _parseNumber() {
+ var exponent = 0;
+ var integer = 0;
+ var frac = 1;
+ var decimal = 0;
+ var sign = 1;
+ var expsign = 1;
+ var startIndex = this._currentIndex;
+
+ this._skipOptionalSpaces(); // Read the sign.
- static _pathSegArrayAsString(pathSegArray) {
- let string = '';
- let first = true;
- pathSegArray.forEach(pathSeg => {
- if (first) {
- first = false;
- string += pathSeg._asPathString();
- } else {
- string += ' ' + pathSeg._asPathString();
+ if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) === '+') {
+ this._currentIndex++;
+ } else if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) === '-') {
+ this._currentIndex++;
+ sign = -1;
+ }
+
+ if (this._currentIndex === this._endIndex || (this._string.charAt(this._currentIndex) < '0' || this._string.charAt(this._currentIndex) > '9') && this._string.charAt(this._currentIndex) !== '.') {
+ // The first character of a number must be one of [0-9+-.].
+ return undefined;
+ } // Read the integer part, build right-to-left.
+
+
+ var startIntPartIndex = this._currentIndex;
+
+ while (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) >= '0' && this._string.charAt(this._currentIndex) <= '9') {
+ this._currentIndex++; // Advance to first non-digit.
+ }
+
+ if (this._currentIndex !== startIntPartIndex) {
+ var scanIntPartIndex = this._currentIndex - 1;
+ var multiplier = 1;
+
+ while (scanIntPartIndex >= startIntPartIndex) {
+ integer += multiplier * (this._string.charAt(scanIntPartIndex--) - '0');
+ multiplier *= 10;
+ }
+ } // Read the decimals.
+
+
+ if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) === '.') {
+ this._currentIndex++; // There must be a least one digit following the .
+
+ if (this._currentIndex >= this._endIndex || this._string.charAt(this._currentIndex) < '0' || this._string.charAt(this._currentIndex) > '9') {
+ return undefined;
+ }
+
+ while (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) >= '0' && this._string.charAt(this._currentIndex) <= '9') {
+ frac *= 10;
+ decimal += (this._string.charAt(this._currentIndex) - '0') / frac;
+ this._currentIndex += 1;
+ }
+ } // Read the exponent part.
+
+
+ if (this._currentIndex !== startIndex && this._currentIndex + 1 < this._endIndex && (this._string.charAt(this._currentIndex) === 'e' || this._string.charAt(this._currentIndex) === 'E') && this._string.charAt(this._currentIndex + 1) !== 'x' && this._string.charAt(this._currentIndex + 1) !== 'm') {
+ this._currentIndex++; // Read the sign of the exponent.
+
+ if (this._string.charAt(this._currentIndex) === '+') {
+ this._currentIndex++;
+ } else if (this._string.charAt(this._currentIndex) === '-') {
+ this._currentIndex++;
+ expsign = -1;
+ } // There must be an exponent.
+
+
+ if (this._currentIndex >= this._endIndex || this._string.charAt(this._currentIndex) < '0' || this._string.charAt(this._currentIndex) > '9') {
+ return undefined;
+ }
+
+ while (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) >= '0' && this._string.charAt(this._currentIndex) <= '9') {
+ exponent *= 10;
+ exponent += this._string.charAt(this._currentIndex) - '0';
+ this._currentIndex++;
+ }
+ }
+
+ var number = integer + decimal;
+ number *= sign;
+
+ if (exponent) {
+ number *= Math.pow(10, expsign * exponent);
+ }
+
+ if (startIndex === this._currentIndex) {
+ return undefined;
+ }
+
+ this._skipOptionalSpacesOrDelimiter();
+
+ return number;
+ }
+ }, {
+ key: "_parseArcFlag",
+ value: function _parseArcFlag() {
+ if (this._currentIndex >= this._endIndex) {
+ return undefined;
+ }
+
+ var flag = false;
+
+ var flagChar = this._string.charAt(this._currentIndex++);
+
+ if (flagChar === '0') {
+ flag = false;
+ } else if (flagChar === '1') {
+ flag = true;
+ } else {
+ return undefined;
+ }
+
+ this._skipOptionalSpacesOrDelimiter();
+
+ return flag;
+ }
+ }, {
+ key: "parseSegment",
+ value: function parseSegment() {
+ var lookahead = this._string[this._currentIndex];
+
+ var command = this._pathSegTypeFromChar(lookahead);
+
+ if (command === SVGPathSeg.PATHSEG_UNKNOWN) {
+ // Possibly an implicit command. Not allowed if this is the first command.
+ if (this._previousCommand === SVGPathSeg.PATHSEG_UNKNOWN) {
+ return null;
+ }
+
+ command = this._nextCommandHelper(lookahead, this._previousCommand);
+
+ if (command === SVGPathSeg.PATHSEG_UNKNOWN) {
+ return null;
+ }
+ } else {
+ this._currentIndex++;
+ }
+
+ this._previousCommand = command;
+
+ switch (command) {
+ case SVGPathSeg.PATHSEG_MOVETO_REL:
+ return new SVGPathSegMovetoRel(owningPathSegList, this._parseNumber(), this._parseNumber());
+
+ case SVGPathSeg.PATHSEG_MOVETO_ABS:
+ return new SVGPathSegMovetoAbs(owningPathSegList, this._parseNumber(), this._parseNumber());
+
+ case SVGPathSeg.PATHSEG_LINETO_REL:
+ return new SVGPathSegLinetoRel(owningPathSegList, this._parseNumber(), this._parseNumber());
+
+ case SVGPathSeg.PATHSEG_LINETO_ABS:
+ return new SVGPathSegLinetoAbs(owningPathSegList, this._parseNumber(), this._parseNumber());
+
+ case SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL:
+ return new SVGPathSegLinetoHorizontalRel(owningPathSegList, this._parseNumber());
+
+ case SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS:
+ return new SVGPathSegLinetoHorizontalAbs(owningPathSegList, this._parseNumber());
+
+ case SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL:
+ return new SVGPathSegLinetoVerticalRel(owningPathSegList, this._parseNumber());
+
+ case SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS:
+ return new SVGPathSegLinetoVerticalAbs(owningPathSegList, this._parseNumber());
+
+ case SVGPathSeg.PATHSEG_CLOSEPATH:
+ this._skipOptionalSpaces();
+
+ return new SVGPathSegClosePath(owningPathSegList);
+
+ case SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL:
+ {
+ var points = {
+ x1: this._parseNumber(),
+ y1: this._parseNumber(),
+ x2: this._parseNumber(),
+ y2: this._parseNumber(),
+ x: this._parseNumber(),
+ y: this._parseNumber()
+ };
+ return new SVGPathSegCurvetoCubicRel(owningPathSegList, points.x, points.y, points.x1, points.y1, points.x2, points.y2);
+ }
+
+ case SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS:
+ {
+ var _points = {
+ x1: this._parseNumber(),
+ y1: this._parseNumber(),
+ x2: this._parseNumber(),
+ y2: this._parseNumber(),
+ x: this._parseNumber(),
+ y: this._parseNumber()
+ };
+ return new SVGPathSegCurvetoCubicAbs(owningPathSegList, _points.x, _points.y, _points.x1, _points.y1, _points.x2, _points.y2);
+ }
+
+ case SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL:
+ {
+ var _points2 = {
+ x2: this._parseNumber(),
+ y2: this._parseNumber(),
+ x: this._parseNumber(),
+ y: this._parseNumber()
+ };
+ return new SVGPathSegCurvetoCubicSmoothRel(owningPathSegList, _points2.x, _points2.y, _points2.x2, _points2.y2);
+ }
+
+ case SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS:
+ {
+ var _points3 = {
+ x2: this._parseNumber(),
+ y2: this._parseNumber(),
+ x: this._parseNumber(),
+ y: this._parseNumber()
+ };
+ return new SVGPathSegCurvetoCubicSmoothAbs(owningPathSegList, _points3.x, _points3.y, _points3.x2, _points3.y2);
+ }
+
+ case SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL:
+ {
+ var _points4 = {
+ x1: this._parseNumber(),
+ y1: this._parseNumber(),
+ x: this._parseNumber(),
+ y: this._parseNumber()
+ };
+ return new SVGPathSegCurvetoQuadraticRel(owningPathSegList, _points4.x, _points4.y, _points4.x1, _points4.y1);
+ }
+
+ case SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS:
+ {
+ var _points5 = {
+ x1: this._parseNumber(),
+ y1: this._parseNumber(),
+ x: this._parseNumber(),
+ y: this._parseNumber()
+ };
+ return new SVGPathSegCurvetoQuadraticAbs(owningPathSegList, _points5.x, _points5.y, _points5.x1, _points5.y1);
+ }
+
+ case SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL:
+ return new SVGPathSegCurvetoQuadraticSmoothRel(owningPathSegList, this._parseNumber(), this._parseNumber());
+
+ case SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS:
+ return new SVGPathSegCurvetoQuadraticSmoothAbs(owningPathSegList, this._parseNumber(), this._parseNumber());
+
+ case SVGPathSeg.PATHSEG_ARC_REL:
+ {
+ var _points6 = {
+ x1: this._parseNumber(),
+ y1: this._parseNumber(),
+ arcAngle: this._parseNumber(),
+ arcLarge: this._parseArcFlag(),
+ arcSweep: this._parseArcFlag(),
+ x: this._parseNumber(),
+ y: this._parseNumber()
+ };
+ return new SVGPathSegArcRel(owningPathSegList, _points6.x, _points6.y, _points6.x1, _points6.y1, _points6.arcAngle, _points6.arcLarge, _points6.arcSweep);
+ }
+
+ case SVGPathSeg.PATHSEG_ARC_ABS:
+ {
+ var _points7 = {
+ x1: this._parseNumber(),
+ y1: this._parseNumber(),
+ arcAngle: this._parseNumber(),
+ arcLarge: this._parseArcFlag(),
+ arcSweep: this._parseArcFlag(),
+ x: this._parseNumber(),
+ y: this._parseNumber()
+ };
+ return new SVGPathSegArcAbs(owningPathSegList, _points7.x, _points7.y, _points7.x1, _points7.y1, _points7.arcAngle, _points7.arcLarge, _points7.arcSweep);
+ }
+
+ default:
+ throw new Error('Unknown path seg type.');
+ }
+ }
+ }]);
+
+ return Source;
+ }();
+
+ var builder = new Builder();
+ var source = new Source(string);
+
+ if (!source.initialCommandIsMoveTo()) {
+ return [];
}
- });
- return string;
- }
- }
+ while (source.hasMoreData()) {
+ var pathSeg = source.parseSegment();
+
+ if (!pathSeg) {
+ return [];
+ }
+
+ builder.appendSegment(pathSeg);
+ }
+
+ return builder.pathSegList;
+ } // STATIC
+
+ }], [{
+ key: "_pathSegArrayAsString",
+ value: function _pathSegArrayAsString(pathSegArray) {
+ var string = '';
+ var first = true;
+ pathSegArray.forEach(function (pathSeg) {
+ if (first) {
+ first = false;
+ string += pathSeg._asPathString();
+ } else {
+ string += ' ' + pathSeg._asPathString();
+ }
+ });
+ return string;
+ }
+ }]);
+
+ return SVGPathSegList;
+ }();
SVGPathSegList.prototype.classname = 'SVGPathSegList';
Object.defineProperty(SVGPathSegList.prototype, 'numberOfItems', {
- get() {
+ get: function get() {
this._checkPathSynchronizedToList();
return this._list.length;
},
-
enumerable: true
}); // Add the pathSegList accessors to SVGPathElement.
// Spec: https://www.w3.org/TR/SVG11/single-page.html#paths-InterfaceSVGAnimatedPathData
Object.defineProperties(SVGPathElement.prototype, {
pathSegList: {
- get() {
+ get: function get() {
if (!this._pathSegList) {
this._pathSegList = new SVGPathSegList(this);
}
return this._pathSegList;
},
-
enumerable: true
},
// TODO: The following are not implemented and simply return SVGPathElement.pathSegList.
normalizedPathSegList: {
- get() {
+ get: function get() {
return this.pathSegList;
},
-
enumerable: true
},
animatedPathSegList: {
- get() {
+ get: function get() {
return this.pathSegList;
},
-
enumerable: true
},
animatedNormalizedPathSegList: {
- get() {
+ get: function get() {
return this.pathSegList;
},
-
enumerable: true
}
});
@@ -2218,40 +2756,38 @@ const getReverseNS = function () {
}
})();
-/* globals jQuery */
-const $ = jQuery;
+var $ = jQuery;
-const supportsSVG_ = function () {
+var supportsSVG_ = function () {
return Boolean(document.createElementNS && document.createElementNS(NS.SVG, 'svg').createSVGRect);
}();
-const {
- userAgent
-} = navigator;
-const svg = document.createElementNS(NS.SVG, 'svg'); // Note: Browser sniffing should only be used if no other detection method is possible
+var _navigator = navigator,
+ userAgent = _navigator.userAgent;
+var svg = document.createElementNS(NS.SVG, 'svg'); // Note: Browser sniffing should only be used if no other detection method is possible
-const isOpera_ = Boolean(window.opera);
-const isWebkit_ = userAgent.includes('AppleWebKit');
-const isGecko_ = userAgent.includes('Gecko/');
-const isIE_ = userAgent.includes('MSIE');
-const isChrome_ = userAgent.includes('Chrome/');
-const isWindows_ = userAgent.includes('Windows');
-const isMac_ = userAgent.includes('Macintosh');
-const isTouch_ = ('ontouchstart' in window);
+var isOpera_ = Boolean(window.opera);
+var isWebkit_ = userAgent.includes('AppleWebKit');
+var isGecko_ = userAgent.includes('Gecko/');
+var isIE_ = userAgent.includes('MSIE');
+var isChrome_ = userAgent.includes('Chrome/');
+var isWindows_ = userAgent.includes('Windows');
+var isMac_ = userAgent.includes('Macintosh');
+var isTouch_ = ('ontouchstart' in window);
-const supportsSelectors_ = function () {
+var supportsSelectors_ = function () {
return Boolean(svg.querySelector);
}();
-const supportsXpath_ = function () {
+var supportsXpath_ = function () {
return Boolean(document.evaluate);
}(); // segList functions (for FF1.5 and 2.0)
-const supportsPathReplaceItem_ = function () {
- const path = document.createElementNS(NS.SVG, 'path');
+var supportsPathReplaceItem_ = function () {
+ var path = document.createElementNS(NS.SVG, 'path');
path.setAttribute('d', 'M0,0 10,10');
- const seglist = path.pathSegList;
- const seg = path.createSVGPathSegLinetoAbs(5, 5);
+ var seglist = path.pathSegList;
+ var seg = path.createSVGPathSegLinetoAbs(5, 5);
try {
seglist.replaceItem(seg, 1);
@@ -2261,11 +2797,11 @@ const supportsPathReplaceItem_ = function () {
return false;
}();
-const supportsPathInsertItemBefore_ = function () {
- const path = document.createElementNS(NS.SVG, 'path');
+var supportsPathInsertItemBefore_ = function () {
+ var path = document.createElementNS(NS.SVG, 'path');
path.setAttribute('d', 'M0,0 10,10');
- const seglist = path.pathSegList;
- const seg = path.createSVGPathSegLinetoAbs(5, 5);
+ var seglist = path.pathSegList;
+ var seg = path.createSVGPathSegLinetoAbs(5, 5);
try {
seglist.insertItemBefore(seg, 1);
@@ -2276,19 +2812,19 @@ const supportsPathInsertItemBefore_ = function () {
}(); // text character positioning (for IE9 and now Chrome)
-const supportsGoodTextCharPos_ = function () {
- const svgroot = document.createElementNS(NS.SVG, 'svg');
- const svgcontent = document.createElementNS(NS.SVG, 'svg');
+var supportsGoodTextCharPos_ = function () {
+ var svgroot = document.createElementNS(NS.SVG, 'svg');
+ var svgcontent = document.createElementNS(NS.SVG, 'svg');
document.documentElement.append(svgroot);
svgcontent.setAttribute('x', 5);
svgroot.append(svgcontent);
- const text = document.createElementNS(NS.SVG, 'text');
+ var text = document.createElementNS(NS.SVG, 'text');
text.textContent = 'a';
svgcontent.append(text);
try {
// Chrome now fails here
- const pos = text.getStartPositionOfChar(0).x;
+ var pos = text.getStartPositionOfChar(0).x;
return pos === 0;
} catch (err) {
return false;
@@ -2297,40 +2833,40 @@ const supportsGoodTextCharPos_ = function () {
}
}();
-const supportsPathBBox_ = function () {
- const svgcontent = document.createElementNS(NS.SVG, 'svg');
+var supportsPathBBox_ = function () {
+ var svgcontent = document.createElementNS(NS.SVG, 'svg');
document.documentElement.append(svgcontent);
- const path = document.createElementNS(NS.SVG, 'path');
+ var path = document.createElementNS(NS.SVG, 'path');
path.setAttribute('d', 'M0,0 C0,0 10,10 10,0');
svgcontent.append(path);
- const bbox = path.getBBox();
+ var bbox = path.getBBox();
svgcontent.remove();
return bbox.height > 4 && bbox.height < 5;
}(); // Support for correct bbox sizing on groups with horizontal/vertical lines
-const supportsHVLineContainerBBox_ = function () {
- const svgcontent = document.createElementNS(NS.SVG, 'svg');
+var supportsHVLineContainerBBox_ = function () {
+ var svgcontent = document.createElementNS(NS.SVG, 'svg');
document.documentElement.append(svgcontent);
- const path = document.createElementNS(NS.SVG, 'path');
+ var path = document.createElementNS(NS.SVG, 'path');
path.setAttribute('d', 'M0,0 10,0');
- const path2 = document.createElementNS(NS.SVG, 'path');
+ var path2 = document.createElementNS(NS.SVG, 'path');
path2.setAttribute('d', 'M5,0 15,0');
- const g = document.createElementNS(NS.SVG, 'g');
+ var g = document.createElementNS(NS.SVG, 'g');
g.append(path, path2);
svgcontent.append(g);
- const bbox = g.getBBox();
+ var bbox = g.getBBox();
svgcontent.remove(); // Webkit gives 0, FF gives 10, Opera (correctly) gives 15
return bbox.width === 15;
}();
-const supportsGoodDecimals_ = function () {
+var supportsGoodDecimals_ = function () {
// Correct decimals on clone attributes (Opera < 10.5/win/non-en)
- const rect = document.createElementNS(NS.SVG, 'rect');
+ var rect = document.createElementNS(NS.SVG, 'rect');
rect.setAttribute('x', 0.1);
- const crect = rect.cloneNode(false);
- const retValue = !crect.getAttribute('x').includes(',');
+ var crect = rect.cloneNode(false);
+ var retValue = !crect.getAttribute('x').includes(',');
if (!retValue) {
// Todo: i18nize or remove
@@ -2340,22 +2876,22 @@ const supportsGoodDecimals_ = function () {
return retValue;
}();
-const supportsNonScalingStroke_ = function () {
- const rect = document.createElementNS(NS.SVG, 'rect');
+var supportsNonScalingStroke_ = function () {
+ var rect = document.createElementNS(NS.SVG, 'rect');
rect.setAttribute('style', 'vector-effect:non-scaling-stroke');
return rect.style.vectorEffect === 'non-scaling-stroke';
}();
-let supportsNativeSVGTransformLists_ = function () {
- const rect = document.createElementNS(NS.SVG, 'rect');
- const rxform = rect.transform.baseVal;
- const t1 = svg.createSVGTransform();
+var supportsNativeSVGTransformLists_ = function () {
+ var rect = document.createElementNS(NS.SVG, 'rect');
+ var rxform = rect.transform.baseVal;
+ var t1 = svg.createSVGTransform();
rxform.appendItem(t1);
- const r1 = rxform.getItem(0);
+ var r1 = rxform.getItem(0);
- const isSVGTransform = o => {
+ var isSVGTransform = function isSVGTransform(o) {
// https://developer.mozilla.org/en-US/docs/Web/API/SVGTransform
- return o && typeof o === 'object' && typeof o.setMatrix === 'function' && 'angle' in o;
+ return o && _typeof(o) === 'object' && typeof o.setMatrix === 'function' && 'angle' in o;
};
return isSVGTransform(r1) && isSVGTransform(t1) && r1.type === t1.type && r1.angle === t1.angle && r1.matrix.a === t1.matrix.a && r1.matrix.b === t1.matrix.b && r1.matrix.c === t1.matrix.c && r1.matrix.d === t1.matrix.d && r1.matrix.e === t1.matrix.e && r1.matrix.f === t1.matrix.f;
@@ -2367,97 +2903,129 @@ let supportsNativeSVGTransformLists_ = function () {
*/
-const isOpera = () => isOpera_;
+var isOpera = function isOpera() {
+ return isOpera_;
+};
/**
* @function module:browser.isWebkit
* @returns {boolean}
*/
-const isWebkit = () => isWebkit_;
+var isWebkit = function isWebkit() {
+ return isWebkit_;
+};
/**
* @function module:browser.isGecko
* @returns {boolean}
*/
-const isGecko = () => isGecko_;
+var isGecko = function isGecko() {
+ return isGecko_;
+};
/**
* @function module:browser.isIE
* @returns {boolean}
*/
-const isIE = () => isIE_;
+var isIE = function isIE() {
+ return isIE_;
+};
/**
* @function module:browser.isChrome
* @returns {boolean}
*/
-const isChrome = () => isChrome_;
+var isChrome = function isChrome() {
+ return isChrome_;
+};
/**
* @function module:browser.isMac
* @returns {boolean}
*/
-const isMac = () => isMac_;
+var isMac = function isMac() {
+ return isMac_;
+};
/**
* @function module:browser.isTouch
* @returns {boolean}
*/
-const isTouch = () => isTouch_;
+var isTouch = function isTouch() {
+ return isTouch_;
+};
/**
* @function module:browser.supportsSelectors
* @returns {boolean}
*/
-const supportsSelectors = () => supportsSelectors_;
+var supportsSelectors = function supportsSelectors() {
+ return supportsSelectors_;
+};
/**
* @function module:browser.supportsXpath
* @returns {boolean}
*/
-const supportsXpath = () => supportsXpath_;
+var supportsXpath = function supportsXpath() {
+ return supportsXpath_;
+};
/**
* @function module:browser.supportsPathReplaceItem
* @returns {boolean}
*/
-const supportsPathReplaceItem = () => supportsPathReplaceItem_;
+var supportsPathReplaceItem = function supportsPathReplaceItem() {
+ return supportsPathReplaceItem_;
+};
/**
* @function module:browser.supportsPathInsertItemBefore
* @returns {boolean}
*/
-const supportsPathInsertItemBefore = () => supportsPathInsertItemBefore_;
+var supportsPathInsertItemBefore = function supportsPathInsertItemBefore() {
+ return supportsPathInsertItemBefore_;
+};
/**
* @function module:browser.supportsPathBBox
* @returns {boolean}
*/
-const supportsPathBBox = () => supportsPathBBox_;
+var supportsPathBBox = function supportsPathBBox() {
+ return supportsPathBBox_;
+};
/**
* @function module:browser.supportsHVLineContainerBBox
* @returns {boolean}
*/
-const supportsHVLineContainerBBox = () => supportsHVLineContainerBBox_;
+var supportsHVLineContainerBBox = function supportsHVLineContainerBBox() {
+ return supportsHVLineContainerBBox_;
+};
/**
* @function module:browser.supportsGoodTextCharPos
* @returns {boolean}
*/
-const supportsGoodTextCharPos = () => supportsGoodTextCharPos_;
+var supportsGoodTextCharPos = function supportsGoodTextCharPos() {
+ return supportsGoodTextCharPos_;
+};
/**
* @function module:browser.supportsNonScalingStroke
* @returns {boolean}
*/
-const supportsNonScalingStroke = () => supportsNonScalingStroke_;
+var supportsNonScalingStroke = function supportsNonScalingStroke() {
+ return supportsNonScalingStroke_;
+};
/**
* @function module:browser.supportsNativeTransformLists
* @returns {boolean}
*/
-const supportsNativeTransformLists = () => supportsNativeSVGTransformLists_;
+var supportsNativeTransformLists = function supportsNativeTransformLists() {
+ return supportsNativeSVGTransformLists_;
+};
/**
* A jQuery module to work with SVG attributes.
@@ -2480,8 +3048,8 @@ const supportsNativeTransformLists = () => supportsNativeSVGTransformLists_;
* @returns {external:jQuery}
*/
function jQueryPluginSVG($) {
- const proxied = $.fn.attr,
- svgns = 'http://www.w3.org/2000/svg';
+ var proxied = $.fn.attr,
+ svgns = 'http://www.w3.org/2000/svg';
/**
* @typedef {PlainObject<string, string|Float>} module:jQueryAttr.Attributes
*/
@@ -2494,14 +3062,14 @@ function jQueryPluginSVG($) {
*/
$.fn.attr = function (key, value) {
- const len = this.length;
+ var len = this.length;
if (!len) {
return proxied.call(this, key, value);
}
- for (let i = 0; i < len; ++i) {
- const elem = this[i]; // set/get SVG attribute
+ for (var i = 0; i < len; ++i) {
+ var elem = this[i]; // set/get SVG attribute
if (elem.namespaceURI === svgns) {
// Setting attribute
@@ -2509,12 +3077,12 @@ function jQueryPluginSVG($) {
elem.setAttribute(key, value);
} else if (Array.isArray(key)) {
// Getting attributes from array
- const obj = {};
- let j = key.length;
+ var obj = {};
+ var j = key.length;
while (j--) {
- const aname = key[j];
- let attr = elem.getAttribute(aname); // This returns a number when appropriate
+ var aname = key[j];
+ var attr = elem.getAttribute(aname); // This returns a number when appropriate
if (attr || attr === '0') {
attr = isNaN(attr) ? attr : attr - 0;
@@ -2526,20 +3094,24 @@ function jQueryPluginSVG($) {
return obj;
}
- if (typeof key === 'object') {
+ if (_typeof(key) === 'object') {
// Setting attributes from object
- for (const [name, val] of Object.entries(key)) {
+ for (var _i = 0, _Object$entries = Object.entries(key); _i < _Object$entries.length; _i++) {
+ var _Object$entries$_i = _slicedToArray(_Object$entries[_i], 2),
+ name = _Object$entries$_i[0],
+ val = _Object$entries$_i[1];
+
elem.setAttribute(name, val);
} // Getting attribute
} else {
- let attr = elem.getAttribute(key);
+ var _attr = elem.getAttribute(key);
- if (attr || attr === '0') {
- attr = isNaN(attr) ? attr : attr - 0;
+ if (_attr || _attr === '0') {
+ _attr = isNaN(_attr) ? _attr : _attr - 0;
}
- return attr;
+ return _attr;
}
} else {
return proxied.call(this, key, value);
@@ -2552,15 +3124,7 @@ function jQueryPluginSVG($) {
return $;
}
-/**
- * Partial polyfill of `SVGTransformList`
- * @module SVGTransformList
- *
- * @license MIT
- *
- * @copyright 2010 Alexis Deveria, 2010 Jeff Schiller
- */
-const svgroot = document.createElementNS(NS.SVG, 'svg');
+var svgroot = document.createElementNS(NS.SVG, 'svg');
/**
* Helper function to convert `SVGTransform` to a string.
* @param {SVGTransform} xform
@@ -2568,8 +3132,8 @@ const svgroot = document.createElementNS(NS.SVG, 'svg');
*/
function transformToString(xform) {
- const m = xform.matrix;
- let text = '';
+ var m = xform.matrix;
+ var text = '';
switch (xform.type) {
case 1:
@@ -2595,11 +3159,11 @@ function transformToString(xform) {
case 4:
{
// ROTATE
- let cx = 0;
- let cy = 0; // this prevents divide by zero
+ var cx = 0;
+ var cy = 0; // this prevents divide by zero
if (xform.angle !== 0) {
- const K = 1 - m.a;
+ var K = 1 - m.a;
cy = (K * m.f + m.b * m.e) / (K * K + m.b * m.b);
cx = (m.e - m.b * cy) / K;
}
@@ -2616,7 +3180,7 @@ function transformToString(xform) {
*/
-let listMap_ = {};
+var listMap_ = {};
/**
* @interface module:SVGTransformList.SVGEditTransformList
* @property {Integer} numberOfItems unsigned long
@@ -2692,22 +3256,24 @@ let listMap_ = {};
* @implements {module:SVGTransformList.SVGEditTransformList}
*/
-class SVGTransformList {
+var SVGTransformList = /*#__PURE__*/function () {
// eslint-disable-line no-shadow
/**
* @param {Element} elem
* @returns {SVGTransformList}
*/
- constructor(elem) {
+ function SVGTransformList(elem) {
+ _classCallCheck(this, SVGTransformList);
+
this._elem = elem || null;
this._xforms = []; // TODO: how do we capture the undo-ability in the changed transform list?
this._update = function () {
- let tstr = ''; // /* const concatMatrix = */ svgroot.createSVGMatrix();
+ var tstr = ''; // /* const concatMatrix = */ svgroot.createSVGMatrix();
- for (let i = 0; i < this.numberOfItems; ++i) {
- const xform = this._list.getItem(i);
+ for (var i = 0; i < this.numberOfItems; ++i) {
+ var xform = this._list.getItem(i);
tstr += transformToString(xform) + ' ';
}
@@ -2718,65 +3284,69 @@ class SVGTransformList {
this._list = this;
this._init = function () {
+ var _this = this;
+
// Transform attribute parser
- let str = this._elem.getAttribute('transform');
+ var str = this._elem.getAttribute('transform');
if (!str) {
return;
} // TODO: Add skew support in future
- const re = /\s*((scale|matrix|rotate|translate)\s*\(.*?\))\s*,?\s*/; // const re = /\s*(?<xform>(?:scale|matrix|rotate|translate)\s*\(.*?\))\s*,?\s*/;
+ var re = /\s*((scale|matrix|rotate|translate)\s*\(.*?\))\s*,?\s*/; // const re = /\s*(?<xform>(?:scale|matrix|rotate|translate)\s*\(.*?\))\s*,?\s*/;
- let m = true;
+ var m = true;
while (m) {
m = str.match(re);
str = str.replace(re, '');
if (m && m[1]) {
- const x = m[1];
- const bits = x.split(/\s*\(/);
- const name = bits[0];
- const valBits = bits[1].match(/\s*(.*?)\s*\)/);
- valBits[1] = valBits[1].replace(/(\d)-/g, '$1 -');
- const valArr = valBits[1].split(/[, ]+/);
- const letters = 'abcdef'.split('');
- /*
- if (m && m.groups.xform) {
- const x = m.groups.xform;
- const [name, bits] = x.split(/\s*\(/);
- const valBits = bits.match(/\s*(?<nonWhitespace>.*?)\s*\)/);
- valBits.groups.nonWhitespace = valBits.groups.nonWhitespace.replace(
- /(?<digit>\d)-/g, '$<digit> -'
- );
- const valArr = valBits.groups.nonWhitespace.split(/[, ]+/);
- const letters = [...'abcdef'];
- */
+ (function () {
+ var x = m[1];
+ var bits = x.split(/\s*\(/);
+ var name = bits[0];
+ var valBits = bits[1].match(/\s*(.*?)\s*\)/);
+ valBits[1] = valBits[1].replace(/(\d)-/g, '$1 -');
+ var valArr = valBits[1].split(/[, ]+/);
+ var letters = 'abcdef'.split('');
+ /*
+ if (m && m.groups.xform) {
+ const x = m.groups.xform;
+ const [name, bits] = x.split(/\s*\(/);
+ const valBits = bits.match(/\s*(?<nonWhitespace>.*?)\s*\)/);
+ valBits.groups.nonWhitespace = valBits.groups.nonWhitespace.replace(
+ /(?<digit>\d)-/g, '$<digit> -'
+ );
+ const valArr = valBits.groups.nonWhitespace.split(/[, ]+/);
+ const letters = [...'abcdef'];
+ */
- const mtx = svgroot.createSVGMatrix();
- Object.values(valArr).forEach(function (item, i) {
- valArr[i] = Number.parseFloat(item);
+ var mtx = svgroot.createSVGMatrix();
+ Object.values(valArr).forEach(function (item, i) {
+ valArr[i] = Number.parseFloat(item);
- if (name === 'matrix') {
- mtx[letters[i]] = valArr[i];
+ if (name === 'matrix') {
+ mtx[letters[i]] = valArr[i];
+ }
+ });
+ var xform = svgroot.createSVGTransform();
+ var fname = 'set' + name.charAt(0).toUpperCase() + name.slice(1);
+ var values = name === 'matrix' ? [mtx] : valArr;
+
+ if (name === 'scale' && values.length === 1) {
+ values.push(values[0]);
+ } else if (name === 'translate' && values.length === 1) {
+ values.push(0);
+ } else if (name === 'rotate' && values.length === 1) {
+ values.push(0, 0);
}
- });
- const xform = svgroot.createSVGTransform();
- const fname = 'set' + name.charAt(0).toUpperCase() + name.slice(1);
- const values = name === 'matrix' ? [mtx] : valArr;
- if (name === 'scale' && values.length === 1) {
- values.push(values[0]);
- } else if (name === 'translate' && values.length === 1) {
- values.push(0);
- } else if (name === 'rotate' && values.length === 1) {
- values.push(0, 0);
- }
+ xform[fname].apply(xform, _toConsumableArray(values));
- xform[fname](...values);
-
- this._list.appendItem(xform);
+ _this._list.appendItem(xform);
+ })();
}
}
};
@@ -2785,8 +3355,8 @@ class SVGTransformList {
if (item) {
// Check if this transform is already in a transformlist, and
// remove it if so.
- Object.values(listMap_).some(tl => {
- for (let i = 0, len = tl._xforms.length; i < len; ++i) {
+ Object.values(listMap_).some(function (tl) {
+ for (var i = 0, len = tl._xforms.length; i < len; ++i) {
if (tl._xforms[i] === item) {
tl.removeItem(i);
return true;
@@ -2805,158 +3375,168 @@ class SVGTransformList {
*/
- clear() {
- this.numberOfItems = 0;
- this._xforms = [];
- }
- /**
- * @param {SVGTransform} newItem
- * @returns {void}
- */
-
-
- initialize(newItem) {
- this.numberOfItems = 1;
-
- this._removeFromOtherLists(newItem);
-
- this._xforms = [newItem];
- }
- /**
- * @param {Integer} index unsigned long
- * @throws {Error}
- * @returns {SVGTransform}
- */
-
-
- getItem(index) {
- if (index < this.numberOfItems && index >= 0) {
- return this._xforms[index];
+ _createClass(SVGTransformList, [{
+ key: "clear",
+ value: function clear() {
+ this.numberOfItems = 0;
+ this._xforms = [];
}
+ /**
+ * @param {SVGTransform} newItem
+ * @returns {void}
+ */
- const err = new Error('DOMException with code=INDEX_SIZE_ERR');
- err.code = 1;
- throw err;
- }
- /**
- * @param {SVGTransform} newItem
- * @param {Integer} index unsigned long
- * @returns {SVGTransform}
- */
+ }, {
+ key: "initialize",
+ value: function initialize(newItem) {
+ this.numberOfItems = 1;
+ this._removeFromOtherLists(newItem);
- insertItemBefore(newItem, index) {
- let retValue = null;
+ this._xforms = [newItem];
+ }
+ /**
+ * @param {Integer} index unsigned long
+ * @throws {Error}
+ * @returns {SVGTransform}
+ */
- if (index >= 0) {
- if (index < this.numberOfItems) {
+ }, {
+ key: "getItem",
+ value: function getItem(index) {
+ if (index < this.numberOfItems && index >= 0) {
+ return this._xforms[index];
+ }
+
+ var err = new Error('DOMException with code=INDEX_SIZE_ERR');
+ err.code = 1;
+ throw err;
+ }
+ /**
+ * @param {SVGTransform} newItem
+ * @param {Integer} index unsigned long
+ * @returns {SVGTransform}
+ */
+
+ }, {
+ key: "insertItemBefore",
+ value: function insertItemBefore(newItem, index) {
+ var retValue = null;
+
+ if (index >= 0) {
+ if (index < this.numberOfItems) {
+ this._removeFromOtherLists(newItem);
+
+ var newxforms = new Array(this.numberOfItems + 1); // TODO: use array copying and slicing
+
+ var i;
+
+ for (i = 0; i < index; ++i) {
+ newxforms[i] = this._xforms[i];
+ }
+
+ newxforms[i] = newItem;
+
+ for (var j = i + 1; i < this.numberOfItems; ++j, ++i) {
+ newxforms[j] = this._xforms[i];
+ }
+
+ this.numberOfItems++;
+ this._xforms = newxforms;
+ retValue = newItem;
+
+ this._list._update();
+ } else {
+ retValue = this._list.appendItem(newItem);
+ }
+ }
+
+ return retValue;
+ }
+ /**
+ * @param {SVGTransform} newItem
+ * @param {Integer} index unsigned long
+ * @returns {SVGTransform}
+ */
+
+ }, {
+ key: "replaceItem",
+ value: function replaceItem(newItem, index) {
+ var retValue = null;
+
+ if (index < this.numberOfItems && index >= 0) {
this._removeFromOtherLists(newItem);
- const newxforms = new Array(this.numberOfItems + 1); // TODO: use array copying and slicing
+ this._xforms[index] = newItem;
+ retValue = newItem;
- let i;
+ this._list._update();
+ }
+
+ return retValue;
+ }
+ /**
+ * @param {Integer} index unsigned long
+ * @throws {Error}
+ * @returns {SVGTransform}
+ */
+
+ }, {
+ key: "removeItem",
+ value: function removeItem(index) {
+ if (index < this.numberOfItems && index >= 0) {
+ var retValue = this._xforms[index];
+ var newxforms = new Array(this.numberOfItems - 1);
+ var i;
for (i = 0; i < index; ++i) {
newxforms[i] = this._xforms[i];
}
- newxforms[i] = newItem;
-
- for (let j = i + 1; i < this.numberOfItems; ++j, ++i) {
- newxforms[j] = this._xforms[i];
+ for (var j = i; j < this.numberOfItems - 1; ++j, ++i) {
+ newxforms[j] = this._xforms[i + 1];
}
- this.numberOfItems++;
+ this.numberOfItems--;
this._xforms = newxforms;
- retValue = newItem;
this._list._update();
- } else {
- retValue = this._list.appendItem(newItem);
+
+ return retValue;
}
+
+ var err = new Error('DOMException with code=INDEX_SIZE_ERR');
+ err.code = 1;
+ throw err;
}
+ /**
+ * @param {SVGTransform} newItem
+ * @returns {SVGTransform}
+ */
- return retValue;
- }
- /**
- * @param {SVGTransform} newItem
- * @param {Integer} index unsigned long
- * @returns {SVGTransform}
- */
-
-
- replaceItem(newItem, index) {
- let retValue = null;
-
- if (index < this.numberOfItems && index >= 0) {
+ }, {
+ key: "appendItem",
+ value: function appendItem(newItem) {
this._removeFromOtherLists(newItem);
- this._xforms[index] = newItem;
- retValue = newItem;
+ this._xforms.push(newItem);
- this._list._update();
- }
-
- return retValue;
- }
- /**
- * @param {Integer} index unsigned long
- * @throws {Error}
- * @returns {SVGTransform}
- */
-
-
- removeItem(index) {
- if (index < this.numberOfItems && index >= 0) {
- const retValue = this._xforms[index];
- const newxforms = new Array(this.numberOfItems - 1);
- let i;
-
- for (i = 0; i < index; ++i) {
- newxforms[i] = this._xforms[i];
- }
-
- for (let j = i; j < this.numberOfItems - 1; ++j, ++i) {
- newxforms[j] = this._xforms[i + 1];
- }
-
- this.numberOfItems--;
- this._xforms = newxforms;
+ this.numberOfItems++;
this._list._update();
- return retValue;
+ return newItem;
}
+ }]);
- const err = new Error('DOMException with code=INDEX_SIZE_ERR');
- err.code = 1;
- throw err;
- }
- /**
- * @param {SVGTransform} newItem
- * @returns {SVGTransform}
- */
-
-
- appendItem(newItem) {
- this._removeFromOtherLists(newItem);
-
- this._xforms.push(newItem);
-
- this.numberOfItems++;
-
- this._list._update();
-
- return newItem;
- }
-
-}
+ return SVGTransformList;
+}();
/**
* @function module:SVGTransformList.resetListMap
* @returns {void}
*/
-const resetListMap = function () {
+var resetListMap = function resetListMap() {
listMap_ = {};
};
/**
@@ -2966,7 +3546,7 @@ const resetListMap = function () {
* @returns {void}
*/
-let removeElementFromListMap = function (elem) {
+var removeElementFromListMap = function removeElementFromListMap(elem) {
// eslint-disable-line import/no-mutable-exports
if (elem.id && listMap_[elem.id]) {
delete listMap_[elem.id];
@@ -2980,10 +3560,10 @@ let removeElementFromListMap = function (elem) {
* @returns {SVGAnimatedTransformList|SVGTransformList}
*/
-const getTransformList = function (elem) {
+var getTransformList = function getTransformList(elem) {
if (!supportsNativeTransformLists()) {
- const id = elem.id || 'temp';
- let t = listMap_[id];
+ var id = elem.id || 'temp';
+ var t = listMap_[id];
if (!t || id === 'temp') {
listMap_[id] = new SVGTransformList(elem);
@@ -3018,9 +3598,9 @@ const getTransformList = function (elem) {
*
* @copyright 2010 Alexis Deveria, 2010 Jeff Schiller
*/
-const wAttrs = ['x', 'x1', 'cx', 'rx', 'width'];
-const hAttrs = ['y', 'y1', 'cy', 'ry', 'height'];
-const unitAttrs = ['r', 'radius', ...wAttrs, ...hAttrs]; // unused
+var wAttrs = ['x', 'x1', 'cx', 'rx', 'width'];
+var hAttrs = ['y', 'y1', 'cy', 'ry', 'height'];
+var unitAttrs = ['r', 'radius'].concat(wAttrs, hAttrs); // unused
/*
const unitNumMap = {
@@ -3037,9 +3617,9 @@ const unitNumMap = {
*/
// Container of elements.
-let elementContainer_; // Stores mapping of unit type to user coordinates.
+var elementContainer_; // Stores mapping of unit type to user coordinates.
-let typeMap_ = {};
+var typeMap_ = {};
/**
* @interface module:units.ElementContainer
*/
@@ -3094,23 +3674,23 @@ let typeMap_ = {};
* @returns {void}
*/
-const init = function (elementContainer) {
+var init = function init(elementContainer) {
elementContainer_ = elementContainer; // Get correct em/ex values by creating a temporary SVG.
- const svg = document.createElementNS(NS.SVG, 'svg');
+ var svg = document.createElementNS(NS.SVG, 'svg');
document.body.append(svg);
- const rect = document.createElementNS(NS.SVG, 'rect');
+ var rect = document.createElementNS(NS.SVG, 'rect');
rect.setAttribute('width', '1em');
rect.setAttribute('height', '1ex');
rect.setAttribute('x', '1in');
svg.append(rect);
- const bb = rect.getBBox();
+ var bb = rect.getBBox();
svg.remove();
- const inch = bb.x;
+ var inch = bb.x;
typeMap_ = {
em: bb.width,
ex: bb.height,
- in: inch,
+ "in": inch,
cm: inch / 2.54,
mm: inch / 25.4,
pt: inch / 72,
@@ -3128,7 +3708,7 @@ const init = function (elementContainer) {
* @returns {module:units.TypeMap} The unit object with values for each unit
*/
-const getTypeMap = function () {
+var getTypeMap = function getTypeMap() {
return typeMap_;
};
/**
@@ -3148,8 +3728,8 @@ const getTypeMap = function () {
* with comma-separated floats
*/
-const shortFloat = function (val) {
- const digits = elementContainer_.getRoundDigits();
+var shortFloat = function shortFloat(val) {
+ var digits = elementContainer_.getRoundDigits();
if (!isNaN(val)) {
return Number(Number(val).toFixed(digits));
@@ -3169,7 +3749,7 @@ const shortFloat = function (val) {
* @returns {Float}
*/
-const convertUnit = function (val, unit) {
+var convertUnit = function convertUnit(val, unit) {
unit = unit || elementContainer_.getBaseUnit(); // baseVal.convertToSpecifiedUnits(unitNumMap[unit]);
// const val = baseVal.valueInSpecifiedUnits;
// baseVal.convertToSpecifiedUnits(1);
@@ -3186,7 +3766,7 @@ const convertUnit = function (val, unit) {
* @returns {void}
*/
-const setUnitAttr = function (elem, attr, val) {
+var setUnitAttr = function setUnitAttr(elem, attr, val) {
// if (!isNaN(val)) {
// New value is a number, so check currently used unit
// const oldVal = elem.getAttribute(attr);
@@ -3229,7 +3809,7 @@ const setUnitAttr = function (elem, attr, val) {
* @returns {Float} The converted number
*/
-const convertToNum = function (attr, val) {
+var convertToNum = function convertToNum(attr, val) {
// Return a number if that's what it already is
if (!isNaN(val)) {
return val - 0;
@@ -3237,23 +3817,24 @@ const convertToNum = function (attr, val) {
if (val.substr(-1) === '%') {
// Deal with percentage, depends on attribute
- const num = val.substr(0, val.length - 1) / 100;
- const width = elementContainer_.getWidth();
- const height = elementContainer_.getHeight();
+ var _num = val.substr(0, val.length - 1) / 100;
+
+ var width = elementContainer_.getWidth();
+ var height = elementContainer_.getHeight();
if (wAttrs.includes(attr)) {
- return num * width;
+ return _num * width;
}
if (hAttrs.includes(attr)) {
- return num * height;
+ return _num * height;
}
- return num * Math.sqrt(width * width + height * height) / Math.sqrt(2);
+ return _num * Math.sqrt(width * width + height * height) / Math.sqrt(2);
}
- const unit = val.substr(-2);
- const num = val.substr(0, val.length - 2); // Note that this multiplication turns the string into a number
+ var unit = val.substr(-2);
+ var num = val.substr(0, val.length - 2); // Note that this multiplication turns the string into a number
return num * typeMap_[unit];
};
@@ -3266,7 +3847,7 @@ const convertToNum = function (attr, val) {
* @returns {boolean} Whether the unit is valid
*/
-const isValidUnit = function (attr, val, selectedElement) {
+var isValidUnit = function isValidUnit(attr, val, selectedElement) {
if (unitAttrs.includes(attr)) {
// True if it's just a number
if (!isNaN(val)) {
@@ -3275,8 +3856,8 @@ const isValidUnit = function (attr, val, selectedElement) {
val = val.toLowerCase();
- return Object.keys(typeMap_).some(unit => {
- const re = new RegExp('^-?[\\d\\.]+' + unit + '$');
+ return Object.keys(typeMap_).some(function (unit) {
+ var re = new RegExp('^-?[\\d\\.]+' + unit + '$');
return re.test(val);
});
}
@@ -3284,13 +3865,13 @@ const isValidUnit = function (attr, val, selectedElement) {
if (attr === 'id') {
// if we're trying to change the id, make sure it's not already present in the doc
// and the id value is valid.
- let result = false; // because getElem() can throw an exception in the case of an invalid id
+ var result = false; // because getElem() can throw an exception in the case of an invalid id
// (according to https://www.w3.org/TR/xml-id/ IDs must be a NCName)
// we wrap it in an exception and only return true if the ID was valid and
// not already present
try {
- const elem = elementContainer_.getElement(val);
+ var elem = elementContainer_.getElement(val);
result = isNullish(elem) || elem === selectedElement;
} catch (e) {}
@@ -3308,9 +3889,9 @@ const isValidUnit = function (attr, val, selectedElement) {
* @copyright 2010 Alexis Deveria, 2010 Jeff Schiller
*/
-const NEAR_ZERO = 1e-14; // Throw away SVGSVGElement used for creating matrices/transforms.
+var NEAR_ZERO = 1e-14; // Throw away SVGSVGElement used for creating matrices/transforms.
-const svg$1 = document.createElementNS(NS.SVG, 'svg');
+var svg$1 = document.createElementNS(NS.SVG, 'svg');
/**
* A (hopefully) quicker function to transform a point by a matrix
* (this function avoids any DOM calls and just does the math).
@@ -3321,7 +3902,7 @@ const svg$1 = document.createElementNS(NS.SVG, 'svg');
* @returns {module:math.XYObject} An x, y object representing the transformed point
*/
-const transformPoint = function (x, y, m) {
+var transformPoint = function transformPoint(x, y, m) {
return {
x: m.a * x + m.c * y + m.e,
y: m.b * x + m.d * y + m.f
@@ -3335,7 +3916,7 @@ const transformPoint = function (x, y, m) {
* @returns {boolean} Indicates whether or not the matrix is 1,0,0,1,0,0
*/
-const isIdentity = function (m) {
+var isIdentity = function isIdentity(m) {
return m.a === 1 && m.b === 0 && m.c === 0 && m.d === 1 && m.e === 0 && m.f === 0;
};
/**
@@ -3346,8 +3927,12 @@ const isIdentity = function (m) {
* @returns {SVGMatrix} The matrix object resulting from the calculation
*/
-const matrixMultiply = function (...args) {
- const m = args.reduceRight((prev, m1) => {
+var matrixMultiply = function matrixMultiply() {
+ for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+ args[_key] = arguments[_key];
+ }
+
+ var m = args.reduceRight(function (prev, m1) {
return m1.multiply(prev);
});
@@ -3377,15 +3962,15 @@ const matrixMultiply = function (...args) {
return m;
};
-const hasMatrixTransform = function (tlist) {
+var hasMatrixTransform = function hasMatrixTransform(tlist) {
if (!tlist) {
return false;
}
- let num = tlist.numberOfItems;
+ var num = tlist.numberOfItems;
while (num--) {
- const xform = tlist.getItem(num);
+ var xform = tlist.getItem(num);
if (xform.type === 1 && !isIdentity(xform.matrix)) {
return true;
@@ -3418,20 +4003,20 @@ const hasMatrixTransform = function (tlist) {
* @returns {module:math.TransformedBox}
*/
-const transformBox = function (l, t, w, h, m) {
- const tl = transformPoint(l, t, m),
- tr = transformPoint(l + w, t, m),
- bl = transformPoint(l, t + h, m),
- br = transformPoint(l + w, t + h, m),
- minx = Math.min(tl.x, tr.x, bl.x, br.x),
- maxx = Math.max(tl.x, tr.x, bl.x, br.x),
- miny = Math.min(tl.y, tr.y, bl.y, br.y),
- maxy = Math.max(tl.y, tr.y, bl.y, br.y);
+var transformBox = function transformBox(l, t, w, h, m) {
+ var tl = transformPoint(l, t, m),
+ tr = transformPoint(l + w, t, m),
+ bl = transformPoint(l, t + h, m),
+ br = transformPoint(l + w, t + h, m),
+ minx = Math.min(tl.x, tr.x, bl.x, br.x),
+ maxx = Math.max(tl.x, tr.x, bl.x, br.x),
+ miny = Math.min(tl.y, tr.y, bl.y, br.y),
+ maxy = Math.max(tl.y, tr.y, bl.y, br.y);
return {
- tl,
- tr,
- bl,
- br,
+ tl: tl,
+ tr: tr,
+ bl: bl,
+ br: br,
aabox: {
x: minx,
y: miny,
@@ -3453,7 +4038,7 @@ const transformBox = function (l, t, w, h, m) {
* @returns {SVGTransform} A single matrix transform object
*/
-const transformListToTransform = function (tlist, min, max) {
+var transformListToTransform = function transformListToTransform(tlist, min, max) {
if (isNullish(tlist)) {
// Or should tlist = null have been prevented before this?
return svg$1.createSVGTransformFromMatrix(svg$1.createSVGMatrix());
@@ -3465,16 +4050,16 @@ const transformListToTransform = function (tlist, min, max) {
max = Number.parseInt(max);
if (min > max) {
- const temp = max;
+ var temp = max;
max = min;
min = temp;
}
- let m = svg$1.createSVGMatrix();
+ var m = svg$1.createSVGMatrix();
- for (let i = min; i <= max; ++i) {
+ for (var i = min; i <= max; ++i) {
// if our indices are out of range, just use a harmless identity matrix
- const mtom = i >= 0 && i < tlist.numberOfItems ? tlist.getItem(i).matrix : svg$1.createSVGMatrix();
+ var mtom = i >= 0 && i < tlist.numberOfItems ? tlist.getItem(i).matrix : svg$1.createSVGMatrix();
m = matrixMultiply(m, mtom);
}
@@ -3487,8 +4072,8 @@ const transformListToTransform = function (tlist, min, max) {
* @returns {SVGMatrix} The matrix object associated with the element's transformlist
*/
-const getMatrix = function (elem) {
- const tlist = getTransformList(elem);
+var getMatrix = function getMatrix(elem) {
+ var tlist = getTransformList(elem);
return transformListToTransform(tlist).matrix;
};
/**
@@ -3502,14 +4087,14 @@ const getMatrix = function (elem) {
* @returns {module:math.AngleCoord45}
*/
-const snapToAngle = function (x1, y1, x2, y2) {
- const snap = Math.PI / 4; // 45 degrees
+var snapToAngle = function snapToAngle(x1, y1, x2, y2) {
+ var snap = Math.PI / 4; // 45 degrees
- const dx = x2 - x1;
- const dy = y2 - y1;
- const angle = Math.atan2(dy, dx);
- const dist = Math.sqrt(dx * dx + dy * dy);
- const snapangle = Math.round(angle / snap) * snap;
+ var dx = x2 - x1;
+ var dy = y2 - y1;
+ var angle = Math.atan2(dy, dx);
+ var dist = Math.sqrt(dx * dx + dy * dy);
+ var snapangle = Math.round(angle / snap) * snap;
return {
x: x1 + dist * Math.cos(snapangle),
y: y1 + dist * Math.sin(snapangle),
@@ -3524,23 +4109,21 @@ const snapToAngle = function (x1, y1, x2, y2) {
* @returns {boolean} True if rectangles intersect
*/
-const rectsIntersect = function (r1, r2) {
+var rectsIntersect = function rectsIntersect(r1, r2) {
return r2.x < r1.x + r1.width && r2.x + r2.width > r1.x && r2.y < r1.y + r1.height && r2.y + r2.height > r1.y;
};
-/* eslint-disable node/no-unsupported-features/node-builtins */
+var $$1 = jQueryPluginSVG(jQuery); // String used to encode base64.
-const $$1 = jQueryPluginSVG(jQuery); // String used to encode base64.
+var KEYSTR = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/='; // Much faster than running getBBox() every time
-const KEYSTR = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/='; // Much faster than running getBBox() every time
+var visElems = 'a,circle,ellipse,foreignObject,g,image,line,path,polygon,polyline,rect,svg,text,tspan,use,clipPath';
+var visElemsArr = visElems.split(','); // const hidElems = 'defs,desc,feGaussianBlur,filter,linearGradient,marker,mask,metadata,pattern,radialGradient,stop,switch,symbol,title,textPath';
-const visElems = 'a,circle,ellipse,foreignObject,g,image,line,path,polygon,polyline,rect,svg,text,tspan,use,clipPath';
-const visElemsArr = visElems.split(','); // const hidElems = 'defs,desc,feGaussianBlur,filter,linearGradient,marker,mask,metadata,pattern,radialGradient,stop,switch,symbol,title,textPath';
-
-let editorContext_ = null;
-let domdoc_ = null;
-let domcontainer_ = null;
-let svgroot_ = null;
+var editorContext_ = null;
+var domdoc_ = null;
+var domcontainer_ = null;
+var svgroot_ = null;
/**
* Object with the following keys/values.
* @typedef {PlainObject} module:utilities.SVGElementJSON
@@ -3608,7 +4191,7 @@ let svgroot_ = null;
* @returns {void}
*/
-const init$1 = function (editorContext) {
+var init$1 = function init(editorContext) {
editorContext_ = editorContext;
domdoc_ = editorContext.getDOMDocument();
domcontainer_ = editorContext.getDOMContainer();
@@ -3622,7 +4205,7 @@ const init$1 = function (editorContext) {
* @todo This might be needed in other places `parseFromString` is used even without LGTM flagging
*/
-const dropXMLInternalSubset = str => {
+var dropXMLInternalSubset = function dropXMLInternalSubset(str) {
return str.replace(/(<!DOCTYPE\s+\w*\s*\[).*(\?]>)/, '$1$2'); // return str.replace(/(?<doctypeOpen><!DOCTYPE\s+\w*\s*\[).*(?<doctypeClose>\?\]>)/, '$<doctypeOpen>$<doctypeClose>');
};
/**
@@ -3633,22 +4216,11 @@ const dropXMLInternalSubset = str => {
* @returns {string} The converted string
*/
-const toXml = function (str) {
+var toXml = function toXml(str) {
// ' is ok in XML, but not HTML
// > does not normally need escaping, though it can if within a CDATA expression (and preceded by "]]")
return str.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>').replace(/"/g, '"').replace(/'/g, '''); // Note: `'` is XML only
};
-/**
-* Converts XML entities in a string to single characters.
-* @function module:utilities.fromXml
-* @example `&` becomes `&`
-* @param {string} str - The string to be converted
-* @returns {string} The converted string
-*/
-
-function fromXml(str) {
- return $$1('<p/>').html(str).text();
-} // This code was written by Tyler Akins and has been placed in the
// public domain. It would be nice if you left this header intact.
// Base64 code from Tyler Akins -- http://rumkin.com
// schiller: Removed string concatenation in favour of Array.join() optimization,
@@ -3670,20 +4242,20 @@ function encode64(input) {
return window.btoa(input); // Use native if available
}
- const output = new Array(Math.floor((input.length + 2) / 3) * 4);
- let i = 0,
+ var output = new Array(Math.floor((input.length + 2) / 3) * 4);
+ var i = 0,
p = 0;
do {
- const chr1 = input.charCodeAt(i++);
- const chr2 = input.charCodeAt(i++);
- const chr3 = input.charCodeAt(i++);
+ var chr1 = input.charCodeAt(i++);
+ var chr2 = input.charCodeAt(i++);
+ var chr3 = input.charCodeAt(i++);
/* eslint-disable no-bitwise */
- const enc1 = chr1 >> 2;
- const enc2 = (chr1 & 3) << 4 | chr2 >> 4;
- let enc3 = (chr2 & 15) << 2 | chr3 >> 6;
- let enc4 = chr3 & 63;
+ var enc1 = chr1 >> 2;
+ var enc2 = (chr1 & 3) << 4 | chr2 >> 4;
+ var enc3 = (chr2 & 15) << 2 | chr3 >> 6;
+ var enc4 = chr3 & 63;
/* eslint-enable no-bitwise */
if (Number.isNaN(chr2)) {
@@ -3715,19 +4287,19 @@ function decode64(input) {
input = input.replace(/[^A-Za-z\d+/=]/g, '');
- let output = '';
- let i = 0;
+ var output = '';
+ var i = 0;
do {
- const enc1 = KEYSTR.indexOf(input.charAt(i++));
- const enc2 = KEYSTR.indexOf(input.charAt(i++));
- const enc3 = KEYSTR.indexOf(input.charAt(i++));
- const enc4 = KEYSTR.indexOf(input.charAt(i++));
+ var enc1 = KEYSTR.indexOf(input.charAt(i++));
+ var enc2 = KEYSTR.indexOf(input.charAt(i++));
+ var enc3 = KEYSTR.indexOf(input.charAt(i++));
+ var enc4 = KEYSTR.indexOf(input.charAt(i++));
/* eslint-disable no-bitwise */
- const chr1 = enc1 << 2 | enc2 >> 4;
- const chr2 = (enc2 & 15) << 4 | enc3 >> 2;
- const chr3 = (enc3 & 3) << 6 | enc4;
+ var chr1 = enc1 << 2 | enc2 >> 4;
+ var chr2 = (enc2 & 15) << 4 | enc3 >> 2;
+ var chr3 = (enc3 & 3) << 6 | enc4;
/* eslint-enable no-bitwise */
output += String.fromCharCode(chr1);
@@ -3759,7 +4331,7 @@ function decodeUTF8(argString) {
* @returns {string}
*/
-const encodeUTF8 = function (argString) {
+var encodeUTF8 = function encodeUTF8(argString) {
return unescape(encodeURIComponent(argString));
};
/**
@@ -3769,28 +4341,28 @@ const encodeUTF8 = function (argString) {
* @returns {string} object URL or empty string
*/
-const dataURLToObjectURL = function (dataurl) {
+var dataURLToObjectURL = function dataURLToObjectURL(dataurl) {
if (typeof Uint8Array === 'undefined' || typeof Blob === 'undefined' || typeof URL === 'undefined' || !URL.createObjectURL) {
return '';
}
- const arr = dataurl.split(','),
- mime = arr[0].match(/:(.*?);/)[1],
- bstr = atob(arr[1]);
+ var arr = dataurl.split(','),
+ mime = arr[0].match(/:(.*?);/)[1],
+ bstr = atob(arr[1]);
/*
const [prefix, suffix] = dataurl.split(','),
{groups: {mime}} = prefix.match(/:(?<mime>.*?);/),
bstr = atob(suffix);
*/
- let n = bstr.length;
- const u8arr = new Uint8Array(n);
+ var n = bstr.length;
+ var u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
- const blob = new Blob([u8arr], {
+ var blob = new Blob([u8arr], {
type: mime
});
return URL.createObjectURL(blob);
@@ -3802,7 +4374,7 @@ const dataURLToObjectURL = function (dataurl) {
* @returns {string} object URL or empty string
*/
-const createObjectURL = function (blob) {
+var createObjectURL = function createObjectURL(blob) {
if (!blob || typeof URL === 'undefined' || !URL.createObjectURL) {
return '';
}
@@ -3813,37 +4385,17 @@ const createObjectURL = function (blob) {
* @property {string} blankPageObjectURL
*/
-const blankPageObjectURL = function () {
+var blankPageObjectURL = function () {
if (typeof Blob === 'undefined') {
return '';
}
- const blob = new Blob(['<html><head><title>SVG-edit